Baipyrus/TerminalHomepage
1
0
Fork 0
Code Issues 4 Pull Requests Projects Releases Wiki Activity

more accurate cursor position and help command

Browse Source
This commit is contained in:
Baipyrus 2023-01-12 14:37:33 +01:00
parent b65b6c5cfd
commit 05bbb8ba2b
4 changed files with 39 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css/main.css
View File

@ -1,6 +1,6 @@
body {
background-color: black;
font-family: 'Lucida Console', serif;
font-family: Consolas, serif;
font-size: large;
}

1
index.html
View File

@ -5,6 +5,7 @@
<meta charset="UTF-8">
<link rel="icon" type="image/x-icon" href="images/favicon.png">
<link rel="stylesheet" type="text/css" href="css/main.css">
<script type="text/javascript" src="js/commands.js"></script>
</head>
<body>
<div id="cursor">&nbsp;</div>

3
js/commands.js Normal file
View File

@ -0,0 +1,3 @@
function cmd_help() {
return "Help haha";
}

40
js/main.js
View File

@ -70,19 +70,27 @@ document.addEventListener("keydown", e => {
break;
case "Enter":
// Befehl absenden / Zeilenumbruch
const textIn = document.getElementById("input");
tbDiv.removeChild(textIn);
tbDiv.removeChild(textCur);
// Run command and return output???
let commandOutput = "";
let commandOutput = runCommand(text);
const aTag = str => `<a style="color: lightgrey;">${str}</a>`;
const aTag = str => {
const link = document.createElement("a");
link.style.color = "lightgrey";
link.textContent = str;
return link;
};
tbDiv.appendChild(aTag(text));
tbDiv.innerHTML += `<br>`;
if (commandOutput !== "") {
commandOutput = `${aTag(commandOutput)}<br>`;
tbDiv.append(aTag(commandOutput))
tbDiv.innerHTML += `<br>`;
cursorYOffset++;
}
tbDiv.innerHTML += `${aTag(text)}<br>${commandOutput}${pretext}`;
tbDiv.innerHTML += pretext;
textCur.textContent = "";
tbDiv.appendChild(textCur);
tbDiv.appendChild(textIn);
@ -102,9 +110,29 @@ document.addEventListener("keydown", e => {
}
});
function runCommand(input) {
let output = "";
for (const func in window) {
const splits = func.split("cmd_");
if (splits.length === 2) {
const name = splits[1];
if (input.toLowerCase() === name.toLowerCase()) {
output = window[func]();
break;
} else if (input.startsWith(name + " ")) {
output = window[func](input.split(" ").filter((e,i)=>i!==0));
break;
}
}
}
return output;
}
function updateCursor() {
let cursor = document.getElementById("cursor");
cursor.style.transform = `translate(${cursorPosition-1}ch, ${cursorYOffset}em)`;
cursor.style.transform = `translate(${cursorPosition-1}ch, ${2.222*cursorYOffset}ch)`;
}
setInterval(()=>{