@vandenberghinc/volt 1.1.2

package/backend/src/file_watcher.ts

@@ -0,0 +1,359 @@
+/*
+ * Author: Daan van den Bergh
+ * Copyright: © 2022 - 2024 Daan van den Bergh.
+ */
+
+// ---------------------------------------------------------
+// Libraries.
+
+import * as fs from "fs";
+import * as path from "path";
+import { spawn, type ChildProcess } from "child_process";
+import { vlib } from "@vinc";
+import { BrowserPreview } from "./plugins/browser.js";
+import { logger, LogSource } from "./logger.js";
+
+// ---------------------------------------------------------
+// Static endpoints file watcher watcher only used for checking static files with reloads.
+
+class StaticFileWatcher {
+    private server: any;
+    private mtimes: Map<string, number>;
+    private endpoints: Map<string, any>;
+    // @ts-ignore
+    private log_source: LogSource;
+    private interval: NodeJS.Timeout | undefined;
+
+    constructor(server: any) {
+        this.server = server;
+        this.mtimes = new Map();
+        this.endpoints = new Map();
+        this.log_source = new LogSource("StaticFileWatcher");
+    }
+
+    async start(): Promise<void> {
+        // Set interval.
+        this.interval = setInterval(async () => {
+            // Changed endpoints.
+            const changed_endpoints: string[] = [];
+            let changed_aspect_ratio = false;
+
+            // Check file paths.
+            for (const endpoint of this.endpoints.values()) {
+                if (endpoint._path && !endpoint.view?.is_js_ts_view) {
+                    const path = new vlib.Path(endpoint._path);
+                    if (path.mtime !== this.mtimes.get(endpoint._path)) {
+                        if (this.mtimes.get(endpoint._path) != null) {
+                            logger.log(1, this.log_source, `Refreshing endpoint ${endpoint.method}:${endpoint.endpoint}.`)
+
+                            // Image.
+                            if (endpoint.is_image_endpoint) {
+                                endpoint._clear_cache();
+                                const aspect_ratio = await endpoint.get_aspect_ratio()
+                                if (aspect_ratio && this.server.statics_aspect_ratios.get(endpoint.endpoint) !== aspect_ratio) {
+                                    changed_aspect_ratio = true;
+                                    this.server.statics_aspect_ratios.set(endpoint.endpoint, aspect_ratio);
+                                }
+                            }
+
+                            // Static file.
+                            else if (endpoint.view == null) {
+                                endpoint._load_data_by_path(this.server);
+                                changed_endpoints.push(endpoint.endpoint);
+                            }
+
+                            // Refresh browser.
+                            if (this.server.browser_preview) {
+                                await this.server.browser_preview.refresh(endpoint.endpoint);
+                            }
+                        }
+                        this.mtimes.set(endpoint._path, path.mtime);
+                    }
+                }
+            }
+
+            // Iterate all endpoints using view to check if any included scripts have changed.
+            for (const endpoint of this.endpoints.values()) {
+                if (endpoint.view && !endpoint.view?.is_js_ts_view) {
+                    let changed = changed_aspect_ratio;
+                    if (!changed && changed_endpoints.length > 0) {
+                        changed = endpoint.view._embedded_sources.some(url => {
+                            return changed_endpoints.includes(url);
+                        });
+                    }
+                    if (changed) {
+                        logger.log(1, this.log_source, `Refreshing endpoint ${endpoint.method}:${endpoint.endpoint}.`)
+                        endpoint._refresh(this.server)
+                        if (this.server.browser_preview) {
+                            await this.server.browser_preview.refresh(endpoint.endpoint);
+                        }
+                    }
+                }
+            }
+        }, 500)
+    }
+
+    add(endpoint: any): void {
+        if (endpoint._path) {
+            this.mtimes.set(endpoint._path, new vlib.Path(endpoint._path).mtime)   
+        }
+        this.endpoints.set(endpoint.endpoint, endpoint);
+    }
+
+    has(endpoint: string): boolean {
+        return this.endpoints.has(endpoint);
+    }
+
+    stop(): void {
+        if (this.interval) {
+            clearInterval(this.interval)
+        }
+    }
+}
+
+// ---------------------------------------------------------
+// File watcher watching entire files and restarting when needed.
+
+/*  @docs:
+ *  @nav: Backend
+    @chapter: Server
+    @title: FileWatcher
+    @description: 
+        Used to watch all included files and restart the server when any changes have been made.
+
+    @parameter:
+        @name: source
+        @description: The path to the source directory to watch.
+        @type: string
+    @parameter:
+        @name: config
+        @description: The path to the server's configuration file.
+        @type: string
+    @parameter:
+        @name: interval
+        @description: The interval in milliseconds between file change checks.
+        @type: number
+    @parameter:
+        @name: start_file
+        @description: The optional start js file to start the server.
+        @type: string
+ */
+class FileWatcher {
+    private source: string;
+    private config?: string;
+    private interval: number;
+    private excluded: string[];
+    private additional_paths: string[];
+    private start_file?: string;
+    // @ts-ignore
+    private log_source: LogSource;
+    private args: string[];
+    private mtimes: Record<string, number>;
+    public promise: Promise<any>;
+    private proc!: ChildProcess;
+    private has_changed: boolean = false;
+    private _com_file?: any;
+
+    constructor({
+        source,
+        config = undefined,
+        interval = 750,
+        excluded = [],
+        additional_paths = [],
+        start_file = undefined,
+    }: {
+        source: vlib.Path | string,
+        config?: string,
+        interval?: number,
+        excluded?: string[],
+        additional_paths?: string[],
+        start_file?: string,
+    }) {
+        // Arguments.
+        // this.source = source == null ? source : new vlib.Path(source).abs().str();
+        this.config = config;
+        this.interval = interval;
+        this.excluded = excluded ?? [];
+        this.excluded = this.excluded.filter(Boolean).map(path => new vlib.Path(path).abs().str())
+        this.start_file = start_file;
+
+        // Check source.
+        if (source) {
+            source = new vlib.Path(source).abs().str();
+        }
+        if ((source as any) instanceof vlib.Path) {
+            source = (source as any).str();
+        }
+        this.source = source as string;
+        if (this.source == null) {
+            throw Error("Define argument: source.");
+        }
+        this.log_source = new LogSource("FileWatcher");
+
+        // Check if the excluded paths exist for user mistakes, these happen often.
+        this.excluded.forEach(path => {
+            if (!new vlib.Path(path).exists()) {
+                logger.warn(0, this.log_source, `Excluded file watcher path ${path} does not exist.`);
+            }
+        })
+
+        // Attributes.
+        this.additional_paths = additional_paths.map(path => new vlib.Path(path).abs().str());
+        this.args = [];
+        this.mtimes = {};
+        this.promise = new Promise(() => {});
+    }
+
+    // Add path.
+    add_path(path: string | vlib.Path): void {
+        try {
+            const add = new vlib.Path(path).abs().str();
+            logger.log(2, this.log_source, "Add file watcher exclude", add)
+            this.additional_paths.push(add)
+        } catch (e) {
+            logger.warn(0, this.log_source, `Additional file watcher path ${path.toString()} does not exist.`);
+        }
+    }
+
+    // Add exclude.
+    add_exclude(path: string | vlib.Path): void {
+        try {
+            const add = new vlib.Path(path).abs().str();
+            logger.log(2, this.log_source, "Add file watcher exclude", add)
+            this.excluded.push(add)
+        } catch (e) {
+            logger.warn(0, this.log_source, `Excluded file watcher path ${path.toString()} does not exist.`);
+        }
+    }
+
+    // Start.
+    async start(): Promise<void> {
+        process.on('SIGTERM', () => {
+            this.proc.kill("SIGTERM");
+            process.exit(0)
+        });
+        process.on('SIGINT', () => {
+            this.proc.kill("SIGINT");
+            process.exit(0)
+        });
+        
+        // Spawn process.
+        this.scan_files();
+        this.has_changed = false;
+        this.spawn_process();
+        this.args.push("--file-watcher-restart")
+
+        // Start scan loop.
+        await this.scan();
+    }
+
+    // Scan.
+    async scan(): Promise<void> {
+        this.scan_files()
+        let interval = this.interval;
+        if (this.has_changed) {
+            interval += 250;
+            await new Promise((resolve) => {
+                setTimeout(async () => {
+                    this.scan_files()
+                    this.has_changed = false;
+                    await this.restart_process();
+                    resolve(null);
+                }, 250)
+            })
+        }
+        setTimeout(() => this.scan(), interval);
+    }
+
+    // Scan files.
+    scan_files(): void {
+        const scan_files = (dir: string) => {
+            fs.readdirSync(dir).forEach((name) => scan_file(path.join(dir, name)));    
+        }
+        const scan_file = (path: string) => {
+            if (this.excluded.includes(path)) {
+                return null;
+            }
+            let stat;
+            try {
+                stat = fs.statSync(path);
+            } catch (e) {
+                delete this.mtimes[path]; // a file was deleted.
+                return;    
+            }
+            if (this.mtimes[path] != stat.mtimeMs) {
+                if (this.mtimes[path] != null) {
+                    logger.log(1, this.log_source, `Source file ${path} changed.`);
+                }
+                this.has_changed = true;
+            }
+            this.mtimes[path] = stat.mtimeMs;
+            if (stat.isDirectory()) {
+                scan_files(path)
+            }
+        }
+        scan_files(this.source);
+        this.additional_paths.forEach((path) => scan_file(path));
+    }
+
+    // Spawn process.
+    spawn_process(): void {
+        if (this._com_file === undefined) {
+            // @ts-ignore
+            this._com_file = new vlib.Path(`/tmp/${String.random(12)}`);
+        }
+        if (this.config == null && this.start_file == null) {
+            throw new Error("When 'Server.file_watcher.start_file' is undefined, the server must be started using `$ volt --start` in order to use the file watcher.");
+        }
+        this.proc = spawn(
+            this.start_file ? "node" : "volt",
+            this.start_file
+                ? [this.start_file, ...this.args, ...process.argv]
+                : ["--start", "--config", this.config || "", ...this.args, ...process.argv],
+            {
+                cwd: this.source,
+                stdio: "inherit",
+                env: {
+                    ...process.env,
+                    "VOLT_FILE_WATCHER": "1",
+                    "VOLT_STARTED_FILE": this._com_file.str(),
+                },
+            }
+        );
+        this.proc.on("exit", (code) => {
+            if (code === 0) {
+                this.scan_files(); // scan again so any subsequent file changes will be updated as well.
+                this.has_changed = false;
+                this.spawn_process();
+            } else {
+                process.exit(code || 1);
+            }
+        })
+        this.proc.on("error", (e) => {
+            console.error(e)
+            process.exit(1);
+        })
+    }
+
+    // Spawn process.
+    async restart_process(): Promise<void> {
+        logger.log(0, this.log_source, `Restarting server due to file changes.`);
+        this._com_file.save_sync("0");
+        this.has_changed = false;
+        this.proc.kill("SIGINT");
+        await new Promise<void>((resolve) => {
+            const loop = () => {
+                if (this._com_file.load_sync() === "1") {
+                    return resolve();
+                }
+                setTimeout(loop, 150)
+            }
+            loop();
+        })
+    }
+}
+
+// ---------------------------------------------------------
+// Exports.
+
+export { StaticFileWatcher, FileWatcher };

package/backend/src/frontend.ts

@@ -0,0 +1,35 @@
+import { vlib } from "@vinc";
+
+// Get the directory name of the current module
+import { fileURLToPath } from 'url';
+import { dirname, join } from 'path';
+// @ts-ignore
+declare var __dirname; var __dirname = typeof __dirname !== 'undefined' ? __dirname : dirname(fileURLToPath(new URL('./package.json', import.meta.url)));
+
+// Paths.
+export const web_exports = {
+	css: __dirname + "/../../../frontend/vhighlight.css",
+	js: __dirname + "/../esm/vhighlight.web.min.js",
+}
+
+export const Frontend = {
+
+	// Load frontend globals.
+	async load_globals(): Promise<string[]> {
+		const data: { [key: string]: string[] } = await (new vlib.Path(`${__dirname}/../../../frontend/exports.json`).load());
+		return Object.values(data).flat();
+	},
+	load_globals_sync(): string[] {
+		const data: { [key: string]: string[] } = new vlib.Path(`${__dirname}/../../../frontend/exports.json`).load_sync();
+		return Object.values(data).flat();
+	},
+
+	// Path to css files.
+	css: {
+		adyen: __dirname + "../../../../frontend/src/css/adyen.css",
+		volt: __dirname + "../../../../frontend/src/css/volt.css",
+	}
+
+
+}
+export default Frontend;

package/backend/src/globals.d.ts

@@ -0,0 +1,8 @@
+declare global {
+    var __dirname: string;
+    var __filename: string;
+    interface ImportMeta {
+        url: string;
+    }
+}
+export {};

package/backend/src/image_endpoint.ts

@@ -0,0 +1,258 @@
+/*
+ * Author: Daan van den Bergh
+ * Copyright: © 2022 - 2024 Daan van den Bergh.
+ */
+
+// ---------------------------------------------------------
+// Libraries.
+
+import sharp from 'sharp';
+import { promises as fs } from "fs"
+
+// ---------------------------------------------------------
+// Imports.
+
+import { vlib } from "@vinc";
+import { Endpoint } from "./endpoint.js";
+import { logger, LogSource } from "./logger.js";
+import { RateLimitGroup } from "./rate_limit.js";
+
+const log_source = new LogSource("ImageEndpoint")
+
+// ---------------------------------------------------------
+// ImageEndpoint.
+// Supports resizing and editing formats.
+
+/*  @docs:
+    @nav: Backend
+    @chapter: Endpoints
+    @title: Image Endpoint
+    @description:
+        All static images are served through the `ImageEndpoint`.
+
+        The image endpoint accepts three optional query parameters when retrieving the image to transform the image.
+         - `type` string: The input type.
+         - `width` number: The height of the image as a number `100` or percentage `50%` / `0.5x`. The aspect ratio will be maintained when `height` is undefined.
+         - `height` number: The width of the image as a number `100` or percentage `50%` / `0.5x`. The aspect ratio will be maintained when `width` is undefined.
+         - `aspect_ratio` boolean: Maintain the aspect ratio when only one resizing dimension has been defined.
+ */
+class ImageEndpoint extends Endpoint implements Endpoint {
+
+    // Cache the original and transformed image data in memory.
+    static cache_in_memory = false;
+
+    // Supported image extensions.
+    static supported_images: string[] = [
+        ".jpg",
+        ".jpeg",
+        ".png",
+        ".webp",
+        ".gif",
+        ".tif",
+        ".tiff",
+        ".svg",
+        ".heif",
+        ".avif"
+    ];
+
+    private i_path: vlib.Path;
+    private i_type: string;
+    private i_data?: Buffer;
+    private i_cache: Map<string, Buffer>;
+    public is_image_endpoint: boolean;
+
+    constructor({
+        endpoint,
+        path,
+        content_type,
+        cache = true,
+        _is_static = true,
+        rate_limit = undefined,
+    }: {
+        endpoint: string,
+        path: vlib.Path,
+        content_type: string,
+        cache?: boolean | number,
+        _is_static?: boolean,
+        rate_limit?: string | RateLimitGroup,
+    }) {
+        // Initialize base.
+        super({
+            method: "GET",
+            endpoint,
+            content_type,
+            compress: false,
+            cache,
+            params: {
+                "type": {type: "string", default: null},
+                "width": {type: ["number", "string"], default: null},
+                "height": {type: ["number", "string"], default: null},
+                "aspect_ratio": {type: "string", default: null},
+            },
+            rate_limit,
+            _path: path.str(),
+            _is_static,
+        })
+
+        // Attributes.
+        this.i_path = path.abs();
+        this.i_type = this.i_path.extension().substr(1)
+        this.i_cache = new Map();
+        if (ImageEndpoint.cache_in_memory) {
+            this.i_data = this.i_path.load_sync({type: "buffer"});
+        }
+
+        // Attribute for Endpoint.
+        this.is_image_endpoint = true;
+
+        // Assign callback.
+        this.callback = async (stream: any, params: {
+            type: string | null,
+            width: number | string | null,
+            height: number | string | null,
+            aspect_ratio: string | null,
+        }) => {
+            // const buff = await fs.readFile(this.i_path.str())
+            const buff = await this.i_path.load({type: "buffer"});
+            // const buff = await sharp(this.i_path.str())
+            //     // .png()
+            //     .toBuffer();
+            // stream.set_header("Content-Length", datax.length.toString());
+            return stream.send({
+                status: 200, 
+                data: buff,
+                headers: {
+                    "Content-Length": buff.length.toString(),
+                }
+
+            });
+            
+            // No params.
+            if (
+                (params.type == null || this.i_type === params.type) &&
+                params.width == null &&
+                params.height == null
+            ) {
+                return stream.send({
+                    status: 200, 
+                    data: ImageEndpoint.cache_in_memory ? this.i_data : this.i_path.load_sync({type: "buffer"}),
+                });
+            }
+
+            // Remove type from params when same as original type.
+            if (this.i_type === params.type) {
+                params.type = null;
+            }
+
+            // Check cache.
+            let cache_id: string;
+            if (ImageEndpoint.cache_in_memory) {
+                cache_id = `${params.width == null ? "" : params.width}.${params.height == null ? "" : params.height}.${params.type == null ? "" : params.type}`;
+                if (this.i_cache.has(cache_id)) {
+                    return stream.send({
+                        status: 200, 
+                        data: this.i_cache.get(cache_id),
+                    });
+                }
+            }
+
+            // Transform image.
+            const data = await this.transform(params.type, params.width, params.height, params.aspect_ratio);
+            if (ImageEndpoint.cache_in_memory && cache_id!) {
+                this.i_cache.set(cache_id, data)
+            }
+            return stream.send({
+                status: 200, 
+                data,
+            });
+        }
+    }
+
+    // Transform image.
+    async transform(
+        type: string | null = null, 
+        width: number | string | null = null, 
+        height: number | string | null = null, 
+        aspect_ratio: string | boolean | null = true
+    ): Promise<Buffer> {
+        const img = sharp(this.i_path.str())
+        let metadata: sharp.Metadata | undefined;
+        
+        if (width != null || height != null) {
+            let parsed_width: number | undefined;
+            let parsed_height: number | undefined;
+
+            if (typeof width === "string") {
+                let last_char = width.charAt(width.length - 1);
+                if (last_char === "%" || last_char === "x") {
+                    if (metadata === undefined) {
+                        metadata = await img.metadata();
+                    }
+                    if (last_char === "x") {
+                        parsed_width = parseInt(String(metadata.width! * parseFloat(width)));
+                    } else {
+                        parsed_width = parseInt(String(metadata.width! * (parseFloat(width) / 100)));
+                    }
+                } else {
+                    parsed_width = parseInt(width);
+                }
+            } else if (typeof width === "number") {
+                parsed_width = parseInt(String(width));
+            }
+
+            if (typeof height === "string") {
+                let last_char = height.charAt(height.length - 1);
+                if (last_char === "%" || last_char === "x") {
+                    if (metadata === undefined) {
+                        metadata = await img.metadata();
+                    }
+                    if (last_char === "x") {
+                        parsed_height = parseInt(String(metadata.height! * parseFloat(height)));
+                    } else {
+                        parsed_height = parseInt(String(metadata.height! * (parseFloat(height) / 100)));
+                    }
+                } else {
+                    parsed_height = parseInt(height);
+                }
+            } else if (typeof height === "number") {
+                parsed_height = parseInt(String(height));
+            }
+
+            const opts: sharp.ResizeOptions = {
+                width: parsed_width,
+                height: parsed_height
+            };
+            if (aspect_ratio === "false" || aspect_ratio === false) {
+                opts.fit = 'fill';
+            }
+            img.resize(opts)
+        }
+        if (type != null) {
+            img.toFormat(type as keyof sharp.FormatEnum)
+        }
+        return img.toBuffer();
+    }
+
+    // Get aspect ratio.
+    async get_aspect_ratio(): Promise<string | null> {
+        try {
+            const metadata = await sharp(this._path as string).metadata();
+            return `${metadata.width} / ${metadata.height}`;
+        } catch (err: any) {
+            logger.error(log_source, `Unable to determine the aspect ratio of image ${this._path}: `, err);
+            return null;
+        }
+    }
+
+    // Clear cache.
+    _clear_cache(): void {
+        if (ImageEndpoint.cache_in_memory) {
+            this.i_cache.clear()
+        }
+    }
+}
+
+// ---------------------------------------------------------
+// Exports.
+
+export { ImageEndpoint };

package/backend/src/logger.ts

@@ -0,0 +1,18 @@
+/*
+ * Author: Daan van den Bergh
+ * Copyright: © 2022 - 2024 Daan van den Bergh.
+ */
+
+// ---------------------------------------------------------
+// Logger.
+
+import { vlib } from "@vinc";
+
+export const logger = new vlib.Logger({
+    log_level: 0,
+    threading: true,
+});
+export const LogSource = vlib.LogSource;
+export type LogSource = vlib.LogSource;
+
+export default logger;