ls command now prints output in short format aswell (no flags support yet)

This commit is contained in:
2026-02-13 07:34:42 +01:00
parent 8830b130ad
commit 7fbf3593fb
4 changed files with 154 additions and 103 deletions

View File

@@ -22,7 +22,6 @@
}
//gets an int from padding property value (which is a string) by cutting last 2 letters "px" and parsing to int
const padding: number = parseInt(window.getComputedStyle(e, null).getPropertyValue('padding').slice(0, -2));
console.log(padding);
return e.clientWidth - (padding * 2);
}
@@ -31,12 +30,15 @@
if(!e) {
throw new Error('cant get font size of the terminal element. its null');
}
const size: number = parseInt(window.getComputedStyle(e, null).getPropertyValue('font-size').slice(0, -2));
return size;
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d')!;
ctx.font = `${window.getComputedStyle(e, null).getPropertyValue('font-size')} 'JetBrains Mono', monospace;`;
return ctx.measureText('M').width;
}
function handleInput(e: KeyboardEvent) {
switch (e.key) {
function handleInput(event: KeyboardEvent) {
switch (event.key) {
case 'Enter': {
terminal.executeCommand(inputValue);
updateTerminal();
@@ -55,6 +57,13 @@
//TODO: Make a traverse history function with up/down args
}
}
const elem = document.getElementById('cout');
if(!elem){
throw new Error('cant scroll to bottom, element is null');
}
elem.scrollTop = elem.scrollHeight;
}
//Callback initializer
@@ -95,8 +104,8 @@
});
</script>
<label for="input" onkeydowncapture={(e) => handleInput(e)}>
<div id="terminal" class="terminal-window shadow-() size-full rounded-md shadow-bg">
<label for="input" onkeydowncapture={(e) => handleInput(e)} class="w-11/12">
<div id="terminal" class="terminal-window shadow-() h-full w-full rounded-md shadow-bg">
<div
class="terminal-bar flex h-9 w-full flex-row items-center rounded-t-md bg-bg-dark text-center font-terminal text-sm font-bold text-primary-dark light:bg-bg-dark-light light:text-primary-light"
>
@@ -105,7 +114,7 @@
<button class="size-2.5 cursor-pointer rounded-full p-0" title=""></button>
<button class="size-2.5 cursor-pointer rounded-full p-0" title=""></button>
</div>
<div class=" flex">
<div class=" flex mr-2 grow">
<h5>{username}</h5>
<!-- prettier-ignore -->
<h5 class=" mr-2">@terminal: </h5>
@@ -113,7 +122,7 @@
</div>
</div>
<div
class="inner-content scroll-hidden h-[860px] origin-top overflow-y-auto rounded-b-md bg-bg-light-dark p-4 text-text-dark shadow-subtle light:bg-bg-lighter-light light:text-text-light"
class="inner-content scroll-hidden h-7/8 origin-top overflow-y-auto rounded-b-md bg-bg-light-dark p-4 text-text-dark shadow-subtle light:bg-bg-lighter-light light:text-text-light"
id="cout"
>
<div id="outputWrapper"></div>