diff --git a/index.html b/index.html index ea0751b..35b9c70 100644 --- a/index.html +++ b/index.html @@ -4,52 +4,7 @@ Linux Terminal Simulation - +
@@ -59,62 +14,8 @@
- - + + + diff --git a/main.js b/main.js new file mode 100644 index 0000000..a05ef30 --- /dev/null +++ b/main.js @@ -0,0 +1,53 @@ + // Retrieve the name from localStorage. If not found, set a default value. + let name = localStorage.getItem('username') || "user"; + terminal.loadAddon(fitAddon); + terminal.open(document.getElementsByClassName('terminal')); + fitAddon.fit(); + + terminal.prompt = () => { + terminal.write('\r\n'); + terminal.write(`\x1b[32m${name}\x1b[0m$ `); + }; + + function changeName(newName) { + // Update the name variable + name = newName; + // Store the updated name in localStorage + localStorage.setItem('username', newName); + } + + function handleInput(event) { + if (event.key === "Enter") { + const commandInput = document.getElementById("commandInput"); + const command = commandInput.value; + const outputDiv = document.querySelector('.output'); + + // Simulate command execution + const output = executeCommand(command); + + // Display command and output in the terminal + outputDiv.innerHTML += `
$ ${command}
`; + outputDiv.innerHTML += `
${output}
`; + + // Clear the input field + commandInput.value = ""; + } + } + + function executeCommand(command) { + // Simulate command execution (add more commands through GitHub Pull Requests.) + if (command.toLowerCase() === "hello") { + return `Hello, ${name}!`; + } else if (command.toLowerCase().startsWith("changename ")) { + const newName = command.substring("changename ".length); + changeName(newName); + return `Name changed to ${name}`; + } else if (command.toLowerCase() === "clearcache") { + localStorage.clear(); + window.location.reload(true); + } + else { + return `Command not found: ${command}`; + } + } + \ No newline at end of file diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..a2b8877 --- /dev/null +++ b/styles.css @@ -0,0 +1,52 @@ +body { + background-color: #000000; + color: #ffffff; + font-family: 'Courier New', monospace; + margin: 0; + padding: 0; + display: flex; + justify-content: left; + + height: 100vh; +} + +.terminal { + width: 80%; + max-width: 600px; + background-color: #000; + padding: 20px; + + +} + +.prompt { + color: #ffffff; + display: inline-block; +} + +.output { + color: #ffffff; +} + +.input { + color: #ffffff; + display: inline-block; + font-family: 'Courier New', monospace; +} + +input { + background-color: transparent; + border: none; + outline: none; + color: #ffffff; + width: 90%; + font-family: 'Courier New', monospace; +} + +footer { + position: fixed; +left: 0; +bottom: 0; +width: 100%; +text-align: center; +} \ No newline at end of file