ChaosMaker/gornodox.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Kamil Olszewski
2026-02-13 07:34:42 +01:00
parent 8830b130ad
commit 7fbf3593fb
4 changed files with 154 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
src/lib/stores/bash/commands/ls.ts
View File

@@ -105,7 +105,6 @@ function result_ls(this: Bash, data: any, args: CommandArgs): HTMLElement {
for (const node of nodes) {
const elem: HTMLElement = document.createElement('div');
const children: TreeNode[] = node.children.map((child) => this.getFs().getNodeByINode(child));
const rows: string[] = [];
const timeArg = valuedArgs.find((flag) => flag.startsWith('time'));
const shouldNamesShift: boolean = children.some((child) => child.name.match(/\s/) !== null);
let timestamp: SortNodeBy.ATIME | SortNodeBy.CTIME | SortNodeBy.MTIME = SortNodeBy.MTIME;
@@ -132,6 +131,7 @@ function result_ls(this: Bash, data: any, args: CommandArgs): HTMLElement {
}
if (f_l || f_g || f_o) {
const rows: string[] = [];
for (const node of nodes) {
const maxSizeWidth = Math.max(
@@ -217,28 +217,63 @@ function result_ls(this: Bash, data: any, args: CommandArgs): HTMLElement {
w.appendChild(elem);
}
return w;
}
const maxWidth: number = (this.getTerminalWidth() / this.getTerminalFontSize()) * 0.8;
const nameLengths: number[] = nodes.map(node => node.name.length);
const maxWidth: number = Math.ceil((this.getTerminalWidth() / this.getTerminalFontSize()) * 0.8);
const nameLengths: number[] = children.map(node => node.name.length);
let columns: string[][] = [];
let colWidths: number[];
let lowBound: number = 1;
let highBound: number = Math.floor(maxWidth / 3);
let c: number = (lowBound + highBound) / 2;
nodeBinarySearch(nodes.length, nameLengths, lowBound, highBound, maxWidth);
for(let i = 0; i < c -1; i++) {
const colSize: number = i < (nodes.length % c) ? nodes.length : nodes.length -1;
while(lowBound + 1 < highBound) {
let c: number = Math.ceil((lowBound + highBound) / 2);
for(let j = 0; j < colSize -1; j++){
if(j >= nodes.length -1) break;
columns = [];
colWidths = [];
columns[i].push(nodes[j].name);
for(let i = 0; i < c; i++) {
columns[i] = [];
for(let j = 0; j < Math.ceil((children.length / c)); j++){
const fileIndex: number = i * Math.floor((children.length / c)) + j;
columns[i].push(children[fileIndex].name);
}
colWidths.push(Math.max(...columns[i].map((string) => string.length)));
}
//w.appendChild();
let calcWidth: number =
Math.ceil(colWidths.reduce((result, value) => result + value) + ((c-1) * 2));
if(calcWidth <= maxWidth) {
lowBound = c;
}
else highBound = c;
}
const wrapper: HTMLElement = document.createElement('div');
wrapper.style.display = 'flex';
wrapper.style.columnGap = `${this.getTerminalFontSize() * 2}px`;
for(let i = 0; i < columns.length -1; i++) {
const col: HTMLElement = document.createElement('div');
for(let j = 0; j < columns[i].length -1; j++) {
const name: HTMLElement = document.createElement('p');
name.innerText = columns[i][j];
col.appendChild(name);
}
wrapper.appendChild(col);
}
if (nodes.length > 1) {
const nodePath: HTMLElement = document.createElement('p');
nodePath.innerText = node.name === '/' ? '/:' : `${this.getFs().getPathByInode(node.inode).slice(1)}:`;
w.appendChild(nodePath);
}
w.appendChild(wrapper);
}
return w;
}
@@ -248,20 +283,29 @@ function nodeBinarySearch(
nameLengths: number[],
low: number,
high: number,
max: number) {
max: number): number {
let c: number = (low + high) / 2;
let cols: number = Math.floor((low + high) / 2);
console.log("new bounds", low, high);
if(low + 1 < high) {
const calcWidth: number =
nameLengths.reduce((result, value) => result + value) + (c-1) * 2
Math.ceil(nameLengths.reduce((result, value) => result + value) + ((cols-1) * 2));
console.log(calcWidth, "calcWidth");
console.log(cols);
if (calcWidth <= max) {
low = c;
} else high = c;
low = cols;
} else high = cols;
nodeBinarySearch(n, nameLengths, low, high, max);
}
console.log("out values", low, cols);
return low
}
function isValidNodeSortMethod(value: string): value is SortNodeBy {

2
src/lib/stores/terminal/terminal.ts
View File

@@ -107,7 +107,6 @@ export class Terminal {
const width = this.callbacks.getWidth?.();
if(!width) { throw new Error('somehow width is undefined still after all the checks'); }
console.log(width);
return width;
}
@@ -115,7 +114,6 @@ export class Terminal {
const size = this.callbacks.getFontSize?.();
if(!size) { throw new Error('somehow font size is undefined still after all the checks'); }
console.log(size);
return size;
}

27
src/modules/Terminal.svelte
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>

2
src/routes/+page.svelte
View File

@@ -6,7 +6,7 @@
</script>
<Settings></Settings>
<div class="h-dvh w-full p-24">
<div class="h-dvh w-full p-24 flex justify-center">
<TerminalModule />
</div>