diff --git a/css/main.css b/css/main.css
index 9de7471..da522b1 100644
--- a/css/main.css
+++ b/css/main.css
@@ -2,6 +2,7 @@ body {
background-color: black;
font-family: 'Lucida Console';
font-size: large;
+ /* white-space: pre; */
}
#cursor {
diff --git a/index.html b/index.html
index a5c6558..e105110 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,9 @@
+
+
+
+
@@ -7,4 +11,4 @@
-
\ No newline at end of file
diff --git a/js/main.js b/js/main.js
index 651c6cc..5d570c1 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,21 +1,22 @@
const pretext = "root@baipyr.us:~# ";
let startPosition = 0;
let cursorPosition = 0;
+let cursorYOffset = 0;
document.addEventListener("keypress", e=>{
if ((e.key == "Enter") || (e.code == "KeyV" && e.ctrlKey))
return;
let textbox = document.getElementById("input");
const index = cursorPosition - startPosition;
- if (e.key == ' ' && (textbox.innerHTML[index-1] == ' ' || cursorPosition == startPosition))
+ if (e.key == ' ' && (textbox.innerText[index-1] == ' ' || cursorPosition == startPosition))
return;
- if (index <= textbox.innerHTML.length-1) {
- const text = textbox.innerHTML;
+ if (index <= textbox.innerText.length-1) {
+ const text = textbox.innerText;
const a = text.substring(0, index);
const b = text.substring(index, text.length);
- textbox.innerHTML=a+e.key+b;
+ textbox.innerText = a + e.key + b;
} else
- textbox.innerHTML += e.key;
+ textbox.innerText += e.key;
cursorPosition++;
updateCursor();
});
@@ -23,18 +24,18 @@ document.addEventListener("keypress", e=>{
document.addEventListener("keydown", e=>{
let textbox = document.getElementById("input");
const index = cursorPosition - startPosition;
- const text = textbox.innerHTML;
+ const text = textbox.innerText;
switch (e.key) {
case "Backspace":
// Ein Zeichen nach links löschen
if (index == 0)
return;
- if (index <= textbox.innerHTML.length-1) {
+ if (index <= textbox.innerText.length-1) {
const a = text.substring(0, index-1);
const b = text.substring(index, text.length);
- textbox.innerHTML=a+b;
+ textbox.innerText=a+b;
} else
- textbox.innerHTML = text.substring(0,text.length-1);
+ textbox.innerText = text.substring(0,text.length-1);
cursorPosition--;
updateCursor();
break;
@@ -47,18 +48,18 @@ document.addEventListener("keydown", e=>{
break;
case "ArrowRight":
// Ein Zeichen nach reckts
- if (index < textbox.innerHTML.length) {
+ if (index < textbox.innerText.length) {
cursorPosition++;
updateCursor();
}
break;
case "Delete":
// Ein Zeichen nach rechts löschen
- if (index == 0 || index >= textbox.innerHTML.length)
+ if (index == 0 || index >= textbox.innerText.length)
return;
const a = text.substring(0, index);
const b = text.substring(index+1, text.length);
- textbox.innerHTML=a+b;
+ textbox.innerText=a+b;
break;
case "Enter":
// Befehl absenden / Zeilenumbruch
@@ -68,10 +69,11 @@ document.addEventListener("keydown", e=>{
// Run command and return output???
const commandOutput = "";
- parent.innerHTML += '' + text + '
' + commandOutput + pretext;
- textbox.innerHTML = "";
+ parent.innerHTML += '' + text + '
' + commandOutput + pretext;
+ textbox.innerText = "";
parent.appendChild(textbox);
cursorPosition = startPosition;
+ cursorYOffset++;
updateCursor();
break;
case "ArrowUp":
@@ -88,7 +90,7 @@ document.addEventListener("keydown", e=>{
function updateCursor() {
let cursor = document.getElementById("cursor");
- const transform = `translate(${cursorPosition}ch)`;
+ const transform = `translate(${cursorPosition}ch,${cursorYOffset}em)`;
cursor.style.transform = transform;
}