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

bug fixes and clear command

Browse Source
This commit is contained in:
Baipyrus 2023-01-13 07:27:13 +01:00
parent 1d88bfa1d3
commit c66d7c7386
3 changed files with 32 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
css/main.css
View File

@ -16,6 +16,10 @@ body {
opacity: 0; opacity: 0;
} }
#input:hover {
cursor: default;
}
#textbox { #textbox {
color: lime; color: lime;
} }

5
js/commands.js
View File

@ -1,3 +1,8 @@
function cmd_help() { function cmd_help() {
return "You need help? Sucks to be you! Hahahahaha"; return "You need help? Sucks to be you! Hahahahaha";
}
function cmd_clear() {
window.location.reload();
return "";
} }

38
js/main.js
View File

@ -6,16 +6,23 @@ let cursorYOffset = 7;
const tbDiv = document.getElementById("textbox"); const tbDiv = document.getElementById("textbox");
const length = pretext.length+1; const length = pretext.length+1;
startPosition = length; startPosition = length;
cursorPosition = length; cursorPosition = 0;
const textIn = document.getElementById("input"); const textIn = document.getElementById("input");
const textCur = document.getElementById("current"); const textCur = document.getElementById("current");
const cursor = document.getElementById("cursor"); const cursor = document.getElementById("cursor");
cursor.style.transform = `translate(${length-1}ch,${2.222*7-0.4}ch)`; cursor.style.transform = `translate(${length-1}ch,${2.222*7-0.4}ch)`;
textIn.oninput = () => { textIn.oninput = () => {
textCur.textContent += textIn.value; const text = textCur.textContent;
if (cursorPosition === text.length)
textCur.textContent += textIn.value;
else {
const left = text.substring(0, cursorPosition);
const right = text.substring(cursorPosition, text.length);
textCur.textContent = left + textIn.value + right;
}
cursorPosition += textIn.value.length;
textIn.value = ""; textIn.value = "";
cursorPosition++;
updateCursor(); updateCursor();
}; };
textIn.focus(); textIn.focus();
@ -29,16 +36,15 @@ document.addEventListener("selectionchange", e => {
}); });
document.addEventListener("keydown", e => { document.addEventListener("keydown", e => {
const index = cursorPosition - startPosition;
const text = textCur.textContent; const text = textCur.textContent;
switch (e.key) { switch (e.key) {
case "Backspace": case "Backspace":
// Ein Zeichen nach links löschen // Ein Zeichen nach links löschen
if (index === 0) if (cursorPosition === 0)
return; return;
if (index <= textCur.textContent.length-1) { if (cursorPosition <= textCur.textContent.length-1) {
const a = text.substring(0, index-1); const a = text.substring(0, cursorPosition-1);
const b = text.substring(index, text.length); const b = text.substring(cursorPosition, text.length);
textCur.textContent=a+b; textCur.textContent=a+b;
} else } else
textCur.textContent = text.substring(0,text.length-1); textCur.textContent = text.substring(0,text.length-1);
@ -47,24 +53,26 @@ document.addEventListener("keydown", e => {
break; break;
case "ArrowLeft": case "ArrowLeft":
// Ein Zeichen nach links // Ein Zeichen nach links
if (cursorPosition > startPosition) { if (cursorPosition > 0) {
cursorPosition--; cursorPosition--;
updateCursor(); updateCursor();
} }
break; break;
case "ArrowRight": case "ArrowRight":
// Ein Zeichen nach reckts // Ein Zeichen nach reckts
if (index < textCur.textContent.length) { if (cursorPosition < textCur.textContent.length) {
cursorPosition++; cursorPosition++;
updateCursor(); updateCursor();
} }
break; break;
case "Delete": case "Delete":
// Ein Zeichen nach rechts löschen // Ein Zeichen nach rechts löschen
if (index === 0 || index >= textCur.textContent.length) if (cursorPosition >= textCur.textContent.length)
return; return;
const a = text.substring(0, index); if (cursorPosition === 0 && textCur.textContent.length === 0)
const b = text.substring(index+1, text.length); return;
const a = text.substring(0, cursorPosition);
const b = text.substring(cursorPosition+1, text.length);
textCur.textContent=a+b; textCur.textContent=a+b;
break; break;
case "Enter": case "Enter":
@ -86,7 +94,7 @@ document.addEventListener("keydown", e => {
textCur.textContent = ""; textCur.textContent = "";
tbDiv.appendChild(textCur); tbDiv.appendChild(textCur);
tbDiv.appendChild(textIn); tbDiv.appendChild(textIn);
cursorPosition = startPosition; cursorPosition = 0;
cursorYOffset++; cursorYOffset++;
updateCursor(); updateCursor();
break; break;
@ -131,7 +139,7 @@ function runCommand(input) {
function updateCursor() { function updateCursor() {
let cursor = document.getElementById("cursor"); let cursor = document.getElementById("cursor");
cursor.style.transform = `translate(${cursorPosition-1}ch, ${2.222*cursorYOffset-0.4}ch)`; cursor.style.transform = `translate(${startPosition+cursorPosition-1}ch, ${2.222*cursorYOffset-0.4}ch)`;
} }
setInterval(()=>{ setInterval(()=>{