@vandenberghinc/volt 1.1.2

package/backend/src/plugins/browser.ts

@@ -0,0 +1,188 @@
+import { vlib } from "@vinc";
+import { chromium, firefox, Browser, BrowserContext, Page } from 'playwright';
+import logger from '../logger.js';
+
+const log_source = logger.LogSource("BrowserPreview");
+
+export class BrowserPreview {
+    private browser_type: string;
+    private browser: Browser | null;
+    private context: BrowserContext | null;
+    private page: Page | null;
+
+    /**
+     * Initializes the browser_controller with the specified browser type.
+     * @param {string} browser - The browser to launch ('chrome' or 'firefox').
+     */
+    constructor(browser: string = 'chrome') {
+        this.browser_type = browser.toLowerCase();
+        this.browser = null;
+        this.context = null;
+        this.page = null;
+    }
+
+    /**
+     * Starts the browser and opens a new page.
+     */
+    async start(): Promise<void> {
+        try {
+            if (this.browser_type === 'chrome') {
+                // Launch Chromium with Chrome channel for Chrome-specific features
+                this.browser = await chromium.launch({
+                    headless: false, // Set to true if you don't need to see the browser
+                    channel: 'chrome', // Ensure Chrome is installed on your system
+                    args: [
+                        '--ignore-certificate-errors',
+                        '--allow-insecure-localhost',
+                    ],
+                });
+            } else if (this.browser_type === 'firefox') {
+                this.browser = await firefox.launch({
+                    headless: false, // Set to true if you don't need to see the browser
+                });
+            } else {
+                throw new Error(`Unsupported browser type: ${this.browser_type}`);
+            }
+
+            this.context = await this.browser.newContext({
+                ignoreHTTPSErrors: true,
+                viewport: null,
+            });
+            this.page = await this.context.newPage();
+            logger.log(0, log_source, `${this.browser_type} browser launched successfully.`);
+        } catch (error: any) {
+            logger.error(log_source, `Error launching browser: ${error.message}`);
+        }
+    }
+
+    /**
+     * Stops the browser and cleans up resources.
+     */
+    async stop(): Promise<void> {
+        try {
+            if (this.browser) {
+                await this.browser.close();
+                logger.log(0, log_source, `${this.browser_type} browser closed successfully.`);
+            }
+        } catch (error: any) {
+            logger.error(log_source, `Error closing browser: ${error.message}`);
+        }
+    }
+
+    /**
+     * Refreshes the active tab if its URL matches the specified endpoint.
+     * @param {string | RegExp} endpoint - The server endpoint URL to check against the active tab.
+     */
+    async refresh(endpoint: string | RegExp): Promise<void> {
+        if (!this.page) {
+            logger.warn(0, log_source, `No page is open. Please call start() first.`);
+            return;
+        }
+
+        let current_endpoint: string = this.page.url().replace(/http[s]*:\/\//g, "");
+        const index = current_endpoint.indexOf("/");
+        if (index !== -1) {
+            current_endpoint = current_endpoint.substr(index);
+        }
+
+        // Normalize URLs for comparison
+        current_endpoint = this._normalize_url(current_endpoint);
+        if (typeof endpoint === "string") {
+            endpoint = this._normalize_url(endpoint);
+        }
+
+        if (
+            (typeof endpoint === "string" && current_endpoint === endpoint) ||
+            (endpoint instanceof RegExp && endpoint.test(current_endpoint))
+        ) {
+
+            // Capture the current scroll position
+            const scrollPosition = await this.page.evaluate(() => {
+                // @ts-ignore
+                const scrollableElement = document.scrollingElement;
+                if (scrollableElement) {
+                    return {
+                        x: scrollableElement.scrollLeft,
+                        y: scrollableElement.scrollTop
+                    };
+                } else {
+                    // Fallback to window scroll if scrollingElement not found
+                    return {
+                        // @ts-ignore
+                        x: window.scrollX,
+                        // @ts-ignore
+                        y: window.scrollY
+                    };
+                }
+            });
+
+            // Reload the page
+            await this.page.reload();
+            logger.log(2, log_source, `Page reloaded because it matches the endpoint: ${endpoint}`);
+
+            // Restore the scroll position after reload
+            await this.page.evaluate(({ x, y }) => {
+                // @ts-ignore
+                const scrollableElement = document.scrollingElement;
+                if (scrollableElement) {
+                    scrollableElement.scrollTo(x, y);
+                } else {
+                    // @ts-ignore
+                    window.scrollTo(x, y);
+                }
+            }, { x: scrollPosition.x, y: scrollPosition.y });
+            logger.log(2, log_source, `Scroll position restored to x: ${scrollPosition.x}, y: ${scrollPosition.y}`);
+
+        } else {
+            logger.log(2, log_source, `Active tab URL (${current_endpoint}) does not match the endpoint (${endpoint}). No action taken.`);
+        }
+    }
+
+    /**
+     * Opens the specified endpoint in the browser.
+     * @param {string} endpoint - The URL to navigate to.
+     */
+    async navigate(endpoint: string): Promise<void> {
+        try {
+            if (!this.page) {
+                logger.warn(0, log_source, `No page is open. Please call start() first.`);
+                return;
+            }
+            await this.page.goto(endpoint);
+            logger.log(1, log_source, `Navigated to ${endpoint}`);
+        } catch (error: any) {
+            logger.error(log_source, `Error navigating to ${endpoint}: ${error.message}`);
+        }
+    }
+
+    /**
+     * Normalizes URLs by removing trailing slashes and converting to lowercase.
+     * @param {string} url - The URL to normalize.
+     * @returns {string} - The normalized URL.
+     */
+    _normalize_url(url: string): string {
+        if (/http[s]*:\/\//.test(url)) {
+            url = url.replace(/http[s]*:\/\//g, "");
+            const index = url.indexOf("/");
+            if (index !== -1) {
+                url = url.substr(index);
+            }
+        }
+        let index;
+        if ((index = url.indexOf("#")) !== -1) {
+            url = url.substr(0, index);
+        }
+        while (url.includes("//")) {
+            url = url.replaceAll("//", "/");
+        }
+        while (url[0] === "/") {
+            url = url.slice(1);
+        }
+        while (url[url.length - 1] === "/") {
+            url = url.slice(0, -1);
+        }
+        return url.toLowerCase();
+    }
+}
+
+export default BrowserPreview;

package/backend/src/plugins/communication.ts

@@ -0,0 +1,204 @@
+import net from 'net';
+
+// Add buffer property to extend Socket type
+declare module 'net' {
+    interface Socket {
+        buffer: string;
+    }
+}
+
+/**
+ * Very basic internal communication socket between processes.
+ */
+
+// Base class.
+class Base {
+    port: number;
+    host: string;
+    _on_message: ((message: any, socket: net.Socket) => void) | null;
+
+    constructor(port: number, host: string = '127.0.0.1') {
+        this.port = port;
+        this.host = host;
+        this._on_message = null;
+    }
+
+    // Set on message.
+    on_message(callback: (message: any, socket: net.Socket) => void): this {
+        this._on_message = callback;
+        return this;
+    }
+
+    /**
+     * Processes the buffer to extract complete messages.
+     * Handles multiple consecutive messages.
+     * @param {net.Socket} socket - The client socket.
+     */
+    _process_buffer(socket: net.Socket): void {
+        while (socket.buffer.length >= 4) { // At least 4 characters for length prefix
+            // Read the first 4 characters to get the message length
+            const length_str = socket.buffer.slice(0, 4);
+            const message_length = parseInt(length_str, 10);
+
+            if (isNaN(message_length)) {
+                console.error('Invalid message length:', length_str);
+                socket.destroy();
+                break;
+            }
+
+            if (socket.buffer.length >= 4 + message_length) {
+                const message_str = socket.buffer.slice(4, 4 + message_length);
+                socket.buffer = socket.buffer.slice(4 + message_length);
+
+                try {
+                    const message = JSON.parse(message_str);
+                    if (this._on_message) this._on_message(message, socket);
+                } catch (err) {
+                    console.error('Invalid JSON received:', message_str);
+                }
+            } else {
+                // Wait for more data
+                break;
+            }
+        }
+    }
+}
+
+// Server class.
+export class Server extends Base {
+    server: net.Server;
+    clients: Set<net.Socket>;
+
+    /**
+     * Initializes the JSON Server.
+     * @param {number} port - Port number to listen on.
+     * @param {string} host - Host address to bind to.
+     */
+    constructor(port: number, host: string = '127.0.0.1') {
+        super(port, host);
+
+        this.server = net.createServer();
+        this.clients = new Set();
+
+        this.server.on('connection', (socket: net.Socket) => {
+            console.log('Client connected:', socket.remoteAddress, socket.remotePort);
+            this.clients.add(socket);
+            socket.setEncoding('utf8');
+
+            // Initialize buffer for each client
+            socket.buffer = '';
+
+            socket.on('data', (data: string) => {
+                socket.buffer += data;
+                this._process_buffer(socket);
+            });
+
+            socket.on('close', () => {
+                console.log('Client disconnected:', socket.remoteAddress, socket.remotePort);
+                this.clients.delete(socket);
+            });
+
+            socket.on('error', (err: Error) => {
+                console.error('Socket error:', err);
+                socket.destroy();
+                this.clients.delete(socket);
+            });
+        });
+
+        this.server.on('error', (err: Error) => {
+            console.error('Server error:', err);
+        });
+
+        this.server.listen(port, host, () => {
+            console.log(`JSON Server listening on ${host}:${port}`);
+        });
+    }
+
+    /**
+     * Sends a JSON message to a specific socket.
+     * @param {net.Socket} socket - The socket to send the message to.
+     * @param {Object} obj - The JSON object to send.
+     */
+    message(socket: net.Socket, obj: Record<string, any>): void {
+        const json = JSON.stringify(obj);
+        const length = json.length.toString().padStart(4, '0'); // 4-digit length prefix
+        socket.write(length + json);
+    }
+
+    /**
+     * Broadcasts a JSON message to all connected clients.
+     * @param {Object} obj - The JSON object to broadcast.
+     */
+    broadcast(obj: Record<string, any>): void {
+        for (let socket of this.clients) {
+            this.message(socket, obj);
+        }
+    }
+
+    /**
+     * Closes the server and all client connections.
+     */
+    close(): void {
+        for (let socket of this.clients) {
+            socket.destroy();
+        }
+        this.server.close(() => {
+            console.log('JSON Server closed.');
+        });
+    }
+}
+
+// Client class.
+export class Client extends Base {
+    socket: net.Socket;
+
+    /**
+     * Initializes the JSON Client.
+     * @param {number} port - Port number to connect to.
+     * @param {string} host - Host address to connect to.
+     */
+    constructor(port: number, host: string = '127.0.0.1') {
+        super(port, host);
+
+        this.socket = net.createConnection(port, host, () => {
+            console.log(`Connected to JSON Server at ${host}:${port}`);
+        });
+        (this.socket as any).buffer = '';
+
+        this.socket.setEncoding('utf8');
+
+        this.socket.on('data', (data: string) => {
+            (this.socket as any).buffer += data;
+            this._process_buffer(this.socket);
+        });
+
+        this.socket.on('close', () => {
+            console.log('Disconnected from JSON Server');
+        });
+
+        this.socket.on('error', (err: Error) => {
+            console.error('Socket error:', err);
+            this.socket.destroy();
+        });
+    }
+
+    /**
+     * Sends a JSON message to the server.
+     * @param {Object} obj - The JSON object to send.
+     */
+    message(obj: Record<string, any>): void {
+        const json = JSON.stringify(obj);
+        const length = json.length.toString().padStart(4, '0'); // 4-digit length prefix
+        this.socket.write(length + json);
+    }
+
+    /**
+     * Closes the client connection.
+     */
+    close(): void {
+        this.socket.end();
+    }
+}
+
+// Exports.
+export default { Server, Client };

package/backend/src/plugins/css.ts

@@ -0,0 +1,84 @@
+/*
+ * Author: Daan van den Bergh
+ * Copyright: © 2022 - 2024 Daan van den Bergh.
+ */
+
+// ---------------------------------------------------------
+// Imports.
+
+import CleanCSS from 'clean-css';
+import { vlib } from "@vinc";
+
+// ---------------------------------------------------------
+// CSS utils.
+
+// Implementation
+export class CSS {
+    
+    /*  @docs:
+        @nav: Backend
+        @title: Minify
+        @description: 
+            Minify CSS code.
+        @usage:
+            import * as volt from "@vandenberghinc/volt";
+            const css = volt.CSS.minify("...");
+        @param:
+            @name: data
+            @descr: The css data.
+            @type: string
+     */
+    static minify(data: string): string {
+        return new CleanCSS().minify(data).styles;
+    }
+
+    /*  @docs:
+        @nav: Backend
+        @title: Bundle
+        @description: 
+            Bundle CSS code or files.
+        @usage:
+            import * as volt from "@vandenberghinc/volt";
+            const bundle = volt.CSS.bundle({
+                paths: [...],
+                minify: true,
+            });
+        @param:
+            @name: data
+            @descr: The css data.
+            @type: string
+     */
+    static async bundle({
+        data = "",
+        paths = undefined,
+        minify = false,
+        output = undefined,
+    }: {
+        data: string;
+        paths?: string[];
+        minify?: boolean;
+        output?: string;
+    }): Promise<string> {
+
+        // Load via paths.
+        if (paths !== undefined) {
+            for (const path of paths) {
+                (data as string) += await new vlib.Path(path).load();
+            }
+        }
+
+        // Minify.
+        if (minify) {
+            data = CSS.minify(data!);
+        }
+
+        // Save.
+        if (output) {
+            await new vlib.Path(output).save(data);
+        }
+
+        // Return.
+        return data as string;
+    }
+}
+export default CSS;