tidepool 1.0.0

package/README.md

@@ -0,0 +1,2 @@
+# 🌊 Tidepool
+A TUI library written in TypeScript.

package/dist/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TideScreen = exports.Text = exports.Box = void 0;
+const box_1 = require("./objects/box");
+Object.defineProperty(exports, "Box", { enumerable: true, get: function () { return box_1.Box; } });
+const text_1 = require("./objects/text");
+Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return text_1.Text; } });
+const screen_1 = require("./screen");
+Object.defineProperty(exports, "TideScreen", { enumerable: true, get: function () { return screen_1.TideScreen; } });

package/dist/interfaces.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/objects/box.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Box = void 0;
+const util_1 = require("../util");
+class Box {
+    constructor(x, y, width, height, color = 'reset', title = '', zIndex = 0) {
+        this.x = x;
+        this.y = y;
+        this.width = width;
+        this.height = height;
+        this.color = color;
+        this.title = title;
+        this.contents = [];
+        this.zIndex = zIndex;
+    }
+    addContent(content) {
+        this.contents.push(content);
+    }
+    clear(screen) {
+        for (let i = this.y; i < this.y + this.height; i++) {
+            for (let j = this.x; j < this.x + this.width; j++) {
+                screen[i][j] = ' ';
+            }
+        }
+    }
+    draw(screen) {
+        this.clear(screen);
+        const colorCode = (0, util_1.getColorCode)(this.color);
+        const titleColorCode = (0, util_1.getColorCode)('magenta');
+        for (let i = this.x + 1; i < this.x + this.width - 1; i++) {
+            screen[this.y][i] = `${colorCode}─\x1b[0m`;
+        }
+        for (let i = this.x + 1; i < this.x + this.width - 1; i++) {
+            screen[this.y + this.height - 1][i] = `${colorCode}─\x1b[0m`;
+        }
+        for (let i = this.y + 1; i < this.y + this.height - 1; i++) {
+            screen[i][this.x] = `${colorCode}│\x1b[0m`;
+            screen[i][this.x + this.width - 1] = `${colorCode}│\x1b[0m`;
+        }
+        screen[this.y][this.x] = `${colorCode}┌\x1b[0m`;
+        screen[this.y][this.x + this.width - 1] = `${colorCode}┐\x1b[0m`;
+        screen[this.y + this.height - 1][this.x] = `${colorCode}└\x1b[0m`;
+        screen[this.y + this.height - 1][this.x + this.width - 1] = `${colorCode}┘\x1b[0m`;
+        if (this.title) {
+            const titlePosition = Math.max(this.x + 2, Math.min(this.x + this.width - 2 - this.title.length, this.x + 2));
+            for (let i = 0; i < this.title.length; i++) {
+                if (titlePosition + i < screen[0].length && this.y < screen.length) {
+                    screen[this.y][titlePosition + i] = `${titleColorCode}${this.title[i]}\x1b[0m`;
+                }
+            }
+        }
+        for (let content of this.contents) {
+            content.draw(screen, this.x + 1, this.y + 1, this.width - 2);
+        }
+    }
+    move(dx, dy) {
+        this.x += dx;
+        this.y += dy;
+    }
+}
+exports.Box = Box;

package/dist/objects/text.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Text = void 0;
+const util_1 = require("../util");
+class Text {
+    constructor(x, y, text, color = 'reset', zIndex = 0) {
+        this.relativeX = x;
+        this.relativeY = y;
+        this.text = text;
+        this.color = color;
+        this.zIndex = zIndex;
+    }
+    draw(screen, boxX, boxY, boxWidth) {
+        const colorCode = (0, util_1.getColorCode)(this.color);
+        const lines = (0, util_1.wrapText)(this.text, boxWidth);
+        for (let i = 0; i < lines.length; i++) {
+            const line = lines[i];
+            for (let j = 0; j < line.length; j++) {
+                const screenX = boxX + this.relativeX + j;
+                const screenY = boxY + this.relativeY + i;
+                if (screenX < screen[0].length && screenY < screen.length) {
+                    screen[screenY][screenX] = `${colorCode}${line[j]}\x1b[0m`;
+                }
+            }
+        }
+    }
+}
+exports.Text = Text;

package/dist/screen.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TideScreen = void 0;
+class TideScreen {
+    constructor(width, height) {
+        this.fps = null;
+        this.updateFunction = null;
+        this.width = width;
+        this.height = height;
+        this.screen = Array.from({ length: height }, () => Array(width).fill(' '));
+        this.buffer = Array.from({ length: height }, () => Array(width).fill(' '));
+        this.components = [];
+    }
+    clearScreen() {
+        this.screen = Array.from({ length: this.height }, () => Array(this.width).fill(' '));
+    }
+    clearBuffer() {
+        this.buffer = Array.from({ length: this.height }, () => Array(this.width).fill(' '));
+    }
+    addComponent(component) {
+        this.components.push(component);
+    }
+    renderBuffer() {
+        this.clearBuffer();
+        this.components.sort((a, b) => b.zIndex - a.zIndex);
+        this.components.forEach(component => component.draw(this.buffer));
+    }
+    render() {
+        console.clear();
+        const output = this.buffer.map(row => row.join('')).join('\n');
+        console.log(output);
+    }
+    setUpdateFunction(fn) {
+        this.updateFunction = fn;
+    }
+    setFPS(fps) {
+        this.fps = fps;
+    }
+    renderCycle() {
+        if (this.fps === null) {
+            throw new Error("FPS must be set before starting the render cycle.");
+        }
+        const interval = 1000 / this.fps;
+        const loop = () => {
+            if (this.updateFunction) {
+                this.updateFunction();
+            }
+            this.renderBuffer(); // Prepare the buffer with updated content
+            this.render(); // Output the buffer to the screen
+            setTimeout(loop, interval);
+        };
+        loop();
+    }
+}
+exports.TideScreen = TideScreen;

package/dist/util.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getColorCode = getColorCode;
+exports.wrapText = wrapText;
+function getColorCode(color) {
+    const colors = {
+        reset: '\x1b[0m',
+        black: '\x1b[30m',
+        red: '\x1b[31m',
+        green: '\x1b[32m',
+        yellow: '\x1b[33m',
+        blue: '\x1b[34m',
+        magenta: '\x1b[35m',
+        cyan: '\x1b[36m',
+        white: '\x1b[37m',
+    };
+    return colors[color.toLowerCase()] || colors['reset'];
+}
+function wrapText(text, maxWidth) {
+    const lines = [];
+    let currentLine = '';
+    for (const word of text.split(' ')) {
+        if ((currentLine + word).length > maxWidth) {
+            lines.push(currentLine.trim());
+            currentLine = word + ' ';
+        }
+        else {
+            currentLine += word + ' ';
+        }
+    }
+    lines.push(currentLine.trim());
+    return lines;
+}

package/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "tidepool",
+  "version": "1.0.0",
+  "author": "stuncs69",
+  "main": "dist/index.js",
+  "devDependencies": {
+    "@types/node": "^22.2.0",
+    "typescript": "^5.5.4"
+  },
+  "description": "A CLI rendering engine in TypeScript.",
+  "license": "ISC",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  }
+}

package/src/index.ts

@@ -0,0 +1,5 @@
+import { Box } from "./objects/box";
+import { Text } from "./objects/text";
+import { TideScreen } from "./screen";
+
+export { Box, Text, TideScreen };

package/src/interfaces.ts

@@ -0,0 +1,4 @@
+export interface TideObject {
+    zIndex: number;
+    draw: Function;
+}

package/src/objects/box.ts

@@ -0,0 +1,78 @@
+import { TideObject } from "../interfaces";
+import { getColorCode } from "../util";
+
+export class Box implements TideObject {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    color: string;
+    title: string;
+    contents: TideObject[];
+    zIndex: number;
+
+    constructor(x: number, y: number, width: number, height: number, color = 'reset', title = '', zIndex = 0) {
+      this.x = x;
+      this.y = y;
+      this.width = width;
+      this.height = height;
+      this.color = color;
+      this.title = title;
+      this.contents = [];
+      this.zIndex = zIndex;
+    }
+  
+    addContent(content: TideObject) {
+      this.contents.push(content);
+    }
+  
+    clear(screen: string[][]) {
+      for (let i = this.y; i < this.y + this.height; i++) {
+        for (let j = this.x; j < this.x + this.width; j++) {
+          screen[i][j] = ' ';
+        }
+      }
+    }
+  
+    draw(screen: string[][]) {
+      this.clear(screen);
+  
+      const colorCode = getColorCode(this.color);
+      const titleColorCode = getColorCode('magenta');
+  
+      for (let i = this.x + 1; i < this.x + this.width - 1; i++) {
+        screen[this.y][i] = `${colorCode}─\x1b[0m`;
+      }
+      for (let i = this.x + 1; i < this.x + this.width - 1; i++) {
+        screen[this.y + this.height - 1][i] = `${colorCode}─\x1b[0m`;
+      }
+      for (let i = this.y + 1; i < this.y + this.height - 1; i++) {
+        screen[i][this.x] = `${colorCode}│\x1b[0m`;
+        screen[i][this.x + this.width - 1] = `${colorCode}│\x1b[0m`;
+      }
+  
+      screen[this.y][this.x] = `${colorCode}┌\x1b[0m`;
+      screen[this.y][this.x + this.width - 1] = `${colorCode}┐\x1b[0m`;
+      screen[this.y + this.height - 1][this.x] = `${colorCode}└\x1b[0m`;
+      screen[this.y + this.height - 1][this.x + this.width - 1] = `${colorCode}┘\x1b[0m`;
+  
+      if (this.title) {
+        const titlePosition = Math.max(this.x + 2, Math.min(this.x + this.width - 2 - this.title.length, this.x + 2));
+        for (let i = 0; i < this.title.length; i++) {
+          if (titlePosition + i < screen[0].length && this.y < screen.length) {
+            screen[this.y][titlePosition + i] = `${titleColorCode}${this.title[i]}\x1b[0m`;
+          }
+        }
+      }
+  
+      for (let content of this.contents) {
+        content.draw(screen, this.x + 1, this.y + 1, this.width - 2);
+      }
+    }
+  
+    move(dx: number, dy: number) {
+      this.x += dx;
+      this.y += dy;
+    }
+  }
+  

package/src/objects/text.ts

@@ -0,0 +1,34 @@
+import { TideObject } from "../interfaces";
+import { getColorCode, wrapText } from "../util";
+
+export class Text implements TideObject {
+    relativeX: number;
+    relativeY: number;
+    text: string;
+    color: string;
+    zIndex: number;
+    
+    constructor(x: number, y: number, text: string, color = 'reset', zIndex = 0) {
+      this.relativeX = x;
+      this.relativeY = y;
+      this.text = text;
+      this.color = color;
+      this.zIndex = zIndex;
+    }
+  
+    draw(screen: string[][], boxX: number, boxY: number, boxWidth: number) {
+      const colorCode = getColorCode(this.color);
+      const lines = wrapText(this.text, boxWidth);
+      
+      for (let i = 0; i < lines.length; i++) {
+        const line = lines[i];
+        for (let j = 0; j < line.length; j++) {
+          const screenX = boxX + this.relativeX + j;
+          const screenY = boxY + this.relativeY + i;
+          if (screenX < screen[0].length && screenY < screen.length) {
+            screen[screenY][screenX] = `${colorCode}${line[j]}\x1b[0m`;
+          }
+        }
+      }
+    }
+  }

package/src/screen.ts

@@ -0,0 +1,70 @@
+import { TideObject } from "./interfaces";
+
+export class TideScreen {
+    width: number;
+    height: number;
+    screen: string[][];
+    buffer: string[][];
+    components: TideObject[];
+    fps: number | null = null;
+    updateFunction: (() => void) | null = null;
+
+    constructor(width: number, height: number) {
+        this.width = width;
+        this.height = height;
+        this.screen = Array.from({ length: height }, () => Array(width).fill(' '));
+        this.buffer = Array.from({ length: height }, () => Array(width).fill(' '));
+        this.components = [];
+    }
+
+    clearScreen() {
+        this.screen = Array.from({ length: this.height }, () => Array(this.width).fill(' '));
+    }
+
+    clearBuffer() {
+        this.buffer = Array.from({ length: this.height }, () => Array(this.width).fill(' '));
+    }
+
+    addComponent(component: TideObject) {
+        this.components.push(component);
+    }
+
+    renderBuffer() {
+        this.clearBuffer();
+        this.components.sort((a, b) => b.zIndex - a.zIndex);
+        this.components.forEach(component => component.draw(this.buffer));
+    }
+
+    render() {
+        console.clear();
+        const output = this.buffer.map(row => row.join('')).join('\n');
+        console.log(output);
+    }
+
+    setUpdateFunction(fn: () => void) {
+        this.updateFunction = fn;
+    }
+
+    setFPS(fps: number) {
+        this.fps = fps;
+    }
+
+    renderCycle() {
+        if (this.fps === null) {
+            throw new Error("FPS must be set before starting the render cycle.");
+        }
+
+        const interval = 1000 / this.fps;
+
+        const loop = () => {
+            if (this.updateFunction) {
+                this.updateFunction();
+            }
+            this.renderBuffer(); // Prepare the buffer with updated content
+            this.render(); // Output the buffer to the screen
+            setTimeout(loop, interval);
+        };
+
+        loop();
+    }
+}

package/src/util.ts

@@ -0,0 +1,32 @@
+export function getColorCode(color: string) {
+    const colors: { [key: string]: string } = {
+      reset: '\x1b[0m',
+      black: '\x1b[30m',
+      red: '\x1b[31m',
+      green: '\x1b[32m',
+      yellow: '\x1b[33m',
+      blue: '\x1b[34m',
+      magenta: '\x1b[35m',
+      cyan: '\x1b[36m',
+      white: '\x1b[37m',
+    };
+    
+    return colors[color.toLowerCase()] || colors['reset'];
+}
+
+export function wrapText(text: string, maxWidth: number) {
+    const lines = [];
+    let currentLine = '';
+  
+    for (const word of text.split(' ')) {
+      if ((currentLine + word).length > maxWidth) {
+        lines.push(currentLine.trim());
+        currentLine = word + ' ';
+      } else {
+        currentLine += word + ' ';
+      }
+    }
+    lines.push(currentLine.trim());
+  
+    return lines;
+}