This commit is contained in:
+151
-3
@@ -167,6 +167,8 @@ function createServerRack() {
|
||||
|
||||
const commandHistory = [];
|
||||
let historyIndex = -1;
|
||||
let isRoot = false;
|
||||
let isLoginScreen = false;
|
||||
|
||||
terminal.addEventListener('keydown', (e) => {
|
||||
if (e.key === 'ArrowUp') {
|
||||
@@ -210,7 +212,7 @@ function createServerRack() {
|
||||
const oldCursor = lastLine?.querySelector('.terminal-cursor');
|
||||
if (oldCursor) oldCursor.remove();
|
||||
|
||||
const cmdText = lastLine.textContent.replace(/^\$\s*/, '').trim();
|
||||
const cmdText = lastLine.textContent.replace(/^[\$#]\s*/, '').trim();
|
||||
|
||||
if (cmdText) {
|
||||
commandHistory.unshift(cmdText);
|
||||
@@ -252,6 +254,147 @@ function createServerRack() {
|
||||
content.innerHTML = '';
|
||||
}
|
||||
|
||||
if (cmdText === 'exit') {
|
||||
if (!isRoot) {
|
||||
isLoginScreen = true;
|
||||
document.body.innerHTML = '';
|
||||
document.body.style.background = '#000';
|
||||
document.body.style.color = '#fff';
|
||||
document.body.style.fontFamily = 'monospace';
|
||||
document.body.style.padding = '20px';
|
||||
document.body.style.minHeight = '100vh';
|
||||
document.body.style.margin = '0';
|
||||
document.body.style.lineHeight = '1.6';
|
||||
|
||||
const loginContainer = document.createElement('div');
|
||||
loginContainer.style.marginBottom = '10px';
|
||||
loginContainer.textContent = 'homelab tty1';
|
||||
document.body.appendChild(loginContainer);
|
||||
|
||||
const loginInput = document.createElement('input');
|
||||
loginInput.type = 'text';
|
||||
loginInput.style.background = 'transparent';
|
||||
loginInput.style.border = 'none';
|
||||
loginInput.style.outline = 'none';
|
||||
loginInput.style.color = '#fff';
|
||||
loginInput.style.fontFamily = 'monospace';
|
||||
loginInput.style.fontSize = '14px';
|
||||
loginInput.style.width = '300px';
|
||||
loginInput.style.caretColor = '#fff';
|
||||
loginInput.autofocus = true;
|
||||
|
||||
const loginLine = document.createElement('div');
|
||||
loginLine.style.marginBottom = '20px';
|
||||
loginLine.appendChild(document.createTextNode('homelab login: '));
|
||||
loginLine.appendChild(loginInput);
|
||||
|
||||
document.body.appendChild(loginLine);
|
||||
|
||||
loginInput.focus();
|
||||
|
||||
const handleLogin = (e) => {
|
||||
if (e.key === 'Enter') {
|
||||
const deniedLine = document.createElement('div');
|
||||
deniedLine.textContent = 'Access denied';
|
||||
deniedLine.style.marginTop = '10px';
|
||||
document.body.appendChild(deniedLine);
|
||||
|
||||
const newLoginLine = document.createElement('div');
|
||||
newLoginLine.style.marginTop = '10px';
|
||||
const newInput = document.createElement('input');
|
||||
newInput.type = 'text';
|
||||
newInput.style.background = 'transparent';
|
||||
newInput.style.border = 'none';
|
||||
newInput.style.outline = 'none';
|
||||
newInput.style.color = '#fff';
|
||||
newInput.style.fontFamily = 'monospace';
|
||||
newInput.style.fontSize = '14px';
|
||||
newInput.style.width = '300px';
|
||||
newInput.style.caretColor = '#fff';
|
||||
newInput.autofocus = true;
|
||||
newLoginLine.appendChild(document.createTextNode('homelab login: '));
|
||||
newLoginLine.appendChild(newInput);
|
||||
|
||||
document.body.appendChild(newLoginLine);
|
||||
|
||||
loginInput.remove();
|
||||
newInput.focus();
|
||||
|
||||
newInput.addEventListener('keydown', handleLogin);
|
||||
}
|
||||
};
|
||||
|
||||
loginInput.addEventListener('keydown', handleLogin);
|
||||
|
||||
return;
|
||||
} else {
|
||||
isRoot = false;
|
||||
}
|
||||
|
||||
const newLine = document.createElement('div');
|
||||
newLine.innerHTML = '<span class="terminal-prompt">$</span> ';
|
||||
content.appendChild(newLine);
|
||||
const newCursor = document.createElement('span');
|
||||
newCursor.className = 'terminal-cursor';
|
||||
newLine.appendChild(newCursor);
|
||||
content.scrollTop = content.scrollHeight;
|
||||
return;
|
||||
}
|
||||
|
||||
if (cmdText === 'rm -rf /') {
|
||||
if (!isRoot) {
|
||||
const outLine = document.createElement('div');
|
||||
outLine.style.whiteSpace = 'pre-wrap';
|
||||
outLine.style.color = '#ef4444';
|
||||
outLine.textContent = 'nice try';
|
||||
content.appendChild(outLine);
|
||||
} else {
|
||||
const outLine = document.createElement('div');
|
||||
outLine.style.whiteSpace = 'pre-wrap';
|
||||
outLine.style.color = '#ef4444';
|
||||
outLine.textContent = 'System destruction initiated...';
|
||||
content.appendChild(outLine);
|
||||
setTimeout(() => {
|
||||
document.body.innerHTML = '';
|
||||
document.title = '';
|
||||
}, 500);
|
||||
}
|
||||
|
||||
const newLine = document.createElement('div');
|
||||
if (isRoot) {
|
||||
newLine.innerHTML = '<span class="terminal-prompt">#</span> ';
|
||||
newLine.style.color = '#ef4444';
|
||||
} else {
|
||||
newLine.innerHTML = '<span class="terminal-prompt">$</span> ';
|
||||
}
|
||||
content.appendChild(newLine);
|
||||
const newCursor = document.createElement('span');
|
||||
newCursor.className = 'terminal-cursor' + (isRoot ? ' red' : '');
|
||||
newLine.appendChild(newCursor);
|
||||
content.scrollTop = content.scrollHeight;
|
||||
return;
|
||||
}
|
||||
|
||||
if (cmdText === 'sudo su -' || cmdText === 'sudo -i') {
|
||||
const outLine = document.createElement('div');
|
||||
outLine.style.whiteSpace = 'pre-wrap';
|
||||
outLine.style.color = '#ef4444';
|
||||
outLine.textContent = 'I hope you know what you\'re doing';
|
||||
content.appendChild(outLine);
|
||||
|
||||
isRoot = true;
|
||||
|
||||
const newLine = document.createElement('div');
|
||||
newLine.innerHTML = '<span class="terminal-prompt">#</span> ';
|
||||
newLine.style.color = '#ef4444';
|
||||
content.appendChild(newLine);
|
||||
const newCursor = document.createElement('span');
|
||||
newCursor.className = 'terminal-cursor red';
|
||||
newLine.appendChild(newCursor);
|
||||
content.scrollTop = content.scrollHeight;
|
||||
return;
|
||||
}
|
||||
|
||||
const commands = {
|
||||
'pwd': '/home/reese/portfolio',
|
||||
'whoami': 'reese',
|
||||
@@ -302,10 +445,15 @@ function createServerRack() {
|
||||
}
|
||||
|
||||
const newLine = document.createElement('div');
|
||||
newLine.innerHTML = '<span class="terminal-prompt">$</span> ';
|
||||
if (isRoot) {
|
||||
newLine.innerHTML = '<span class="terminal-prompt">#</span> ';
|
||||
newLine.style.color = '#ef4444';
|
||||
} else {
|
||||
newLine.innerHTML = '<span class="terminal-prompt">$</span> ';
|
||||
}
|
||||
content.appendChild(newLine);
|
||||
const newCursor = document.createElement('span');
|
||||
newCursor.className = 'terminal-cursor';
|
||||
newCursor.className = 'terminal-cursor' + (isRoot ? ' red' : '');
|
||||
newLine.appendChild(newCursor);
|
||||
content.scrollTop = content.scrollHeight;
|
||||
} else if (e.key === 'Backspace') {
|
||||
|
||||
@@ -248,6 +248,10 @@ body {
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
.terminal-cursor.red {
|
||||
background: #ef4444;
|
||||
}
|
||||
|
||||
@keyframes cursorBlink {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0; }
|
||||
|
||||
Reference in New Issue
Block a user