feat: working-ish shell and terminal

src/terminal/Terminal.ts

@@ -19,9 +19,9 @@ export class Terminal {
         this.terminal = sqs('#terminal')
         this.cursor = sqs('#cursor')
 
-        this.SetCursorStyle('bar')
-
         this.ResetCellSize()
+
+        this.SetCursorStyle('bar')
         this.NewPage()
     }
 
@@ -43,6 +43,12 @@ export class Terminal {
         paragraph.className = 'line'
 
         this.terminal.appendChild(paragraph)
+        paragraph.scrollIntoView({behavior: 'smooth'})
+    }
+
+    UpdateLines() {
+        const lines = new Array(...this.terminal.children)
+        lines.forEach((line, i) => line.id = `line-${i}`)
     }
 
     /**
@@ -53,13 +59,10 @@ export class Terminal {
     }
 
     Write(text: string) {
-        let adjustment = 0
 
         text.split('').forEach((char) => {
-            this.MoveCursor(adjustment, 0)
-            adjustment = 1
-
             this.SetCell(char)
+            this.MoveCursor(1, 0)
         })
     }
 
@@ -92,13 +95,23 @@ export class Terminal {
         sqs(selector).innerText = char[0]
     }
 
-    AppendCells(content: string) {
-        const paragraph = sqs(`#line-${this.cursorPosition.row}`)
+    UpdateCells() {
+        const cells = new Array(...sqs(`#line-${this.cursorPosition.row}`).children)
+        cells.forEach((cell, i) => cell.className = `cell-${i}`)
+    }
 
-        content.split('').forEach((char) => {
-            paragraph.textContent += char.replace(' ', '\u00A0')
-            this.MoveCursor(1, 0)
-        })
+    InsertCell(char: string) {
+        const cell = document.createElement('span')
+        cell.className = `cell-${this.cursorPosition.col}`
+        cell.style.width = `${this.cellWidth}px`
+        cell.style.height = `${this.cellHeight}px`
+        cell.style.lineHeight = `${this.cellHeight}px`
+
+        cell.innerText = char[0]
+
+        sqs(`#line-${this.cursorPosition.row} .cell-${this.cursorPosition.col}`).insertAdjacentElement('beforebegin', cell)
+
+        this.UpdateCells()
     }
 
     RemoveCell() {
@@ -106,6 +119,8 @@ export class Terminal {
             sqs(`#line-${this.cursorPosition.row} .cell-${this.cursorPosition.col - 1}`).remove()
         } catch (_) {
 
+        } finally {
+            this.UpdateCells()
         }
     }