more accurate cursor position and help command
This commit is contained in:
parent
b65b6c5cfd
commit
05bbb8ba2b
@ -1,6 +1,6 @@
|
|||||||
body {
|
body {
|
||||||
background-color: black;
|
background-color: black;
|
||||||
font-family: 'Lucida Console', serif;
|
font-family: Consolas, serif;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -5,6 +5,7 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<link rel="icon" type="image/x-icon" href="images/favicon.png">
|
<link rel="icon" type="image/x-icon" href="images/favicon.png">
|
||||||
<link rel="stylesheet" type="text/css" href="css/main.css">
|
<link rel="stylesheet" type="text/css" href="css/main.css">
|
||||||
|
<script type="text/javascript" src="js/commands.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="cursor"> </div>
|
<div id="cursor"> </div>
|
||||||
|
3
js/commands.js
Normal file
3
js/commands.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
function cmd_help() {
|
||||||
|
return "Help haha";
|
||||||
|
}
|
40
js/main.js
40
js/main.js
@ -70,19 +70,27 @@ document.addEventListener("keydown", e => {
|
|||||||
break;
|
break;
|
||||||
case "Enter":
|
case "Enter":
|
||||||
// Befehl absenden / Zeilenumbruch
|
// Befehl absenden / Zeilenumbruch
|
||||||
const textIn = document.getElementById("input");
|
|
||||||
tbDiv.removeChild(textIn);
|
tbDiv.removeChild(textIn);
|
||||||
tbDiv.removeChild(textCur);
|
tbDiv.removeChild(textCur);
|
||||||
|
|
||||||
// Run command and return output???
|
// 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 !== "") {
|
if (commandOutput !== "") {
|
||||||
commandOutput = `${aTag(commandOutput)}<br>`;
|
tbDiv.append(aTag(commandOutput))
|
||||||
|
tbDiv.innerHTML += `<br>`;
|
||||||
cursorYOffset++;
|
cursorYOffset++;
|
||||||
}
|
}
|
||||||
tbDiv.innerHTML += `${aTag(text)}<br>${commandOutput}${pretext}`;
|
tbDiv.innerHTML += pretext;
|
||||||
textCur.textContent = "";
|
textCur.textContent = "";
|
||||||
tbDiv.appendChild(textCur);
|
tbDiv.appendChild(textCur);
|
||||||
tbDiv.appendChild(textIn);
|
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() {
|
function updateCursor() {
|
||||||
let cursor = document.getElementById("cursor");
|
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(()=>{
|
setInterval(()=>{
|
||||||
|
Loading…
Reference in New Issue
Block a user