@devscholar/node-with-gjs 0.0.0 → 0.0.1

package/README.md

@@ -31,87 +31,7 @@ pacman -S gtk4 webkitgtk-6.0 gjs
 
 # Usage
 
-## Runtime Support
-
-| Runtime | `gi://` URL Syntax | Loader Hooks |
-|---------|-------------------|--------------|
-| Node.js | ✅ Supported | ✅ `--experimental-loader` |
-| Bun | ❌ Not supported | ❌ No hooks mechanism |
-| Deno | ❌ Not supported | ❌ No hooks mechanism |
-
-## Node.js
-
-Node.js supports the `gi://` URL syntax, which is consistent with GJS:
-
-```typescript
-import Gtk from 'gi://Gtk?version=4.0';
-import WebKit from 'gi://WebKit?version=6.0';
-
-const app = new Gtk.Application({ application_id: 'org.example.app' });
-// ...
-```
-
-## Bun / Deno
-
-Bun and Deno do not support Node.js loader hooks, so you need to use the `loadGi` function instead:
-
-```typescript
-import { loadGi } from './gi-loader.ts';
-
-const Gtk = loadGi('Gtk', '4.0');
-const WebKit = loadGi('WebKit', '6.0');
-
-const app = new Gtk.Application({ application_id: 'org.example.app' });
-// ...
-```
-
-**Note:** The `loadGi` function also works with Node.js, useful for older Node.js versions or when not using experimental loader flags.
-
-# Examples
-
-## Console Apps
-
-### Console Input App
-
-```bash
-node start.js examples/console/console-input/console-input.ts
-```
-
-### Await Delay App
-
-```bash
-node start.js examples/console/await-delay/await-delay.ts
-```
-
-## GUI Apps
-
-### GTK4 Counter App
-
-```bash
-node start.js examples/gtk/counter/counter.ts
-```
-
-### GTK4 Drag Box App
-
-A drag box example that demonstrates high frequency IPC.
-
-```bash
-node start.js examples/gtk/drag-box/drag-box.ts
-```
-
-### GTK4 WebKit Counter App
-
-```bash
-node start.js examples/gtk-webkit/counter/counter.ts
-```
-
-### Adwaita Counter App (libadwaita)
-
-A counter example based on [libadwaita](https://gnome.pages.gitlab.gnome.org/libadwaita/), demonstrating how to use Adwaita-specific components like `Adw.ApplicationWindow` and `Adw.Clamp`.
-
-```bash
-node start.js examples/adwaita/counter/counter.ts
-```
+For more examples and details, see the [node-with-gjs-examples README](https://github.com/devscholar/node-with-gjs-examples).
 
 # License
 

package/package.json

@@ -1,9 +1,15 @@
 {
   "name": "@devscholar/node-with-gjs",
-  "version": "0.0.0",
+  "version": "0.0.1",
   "description": "Node.js IPC Bridge for GJS",
-  "main": "start.js",
+  "main": "./src/index.ts",
   "type": "module",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "bin": {
+
+  },
   "scripts": {
 
   },
@@ -11,4 +17,4 @@
     "@types/node": "^20.0.0",
     "typescript": "^5.0.0"
   }
-}
+}

package/scripts/host.js

@@ -83,7 +83,9 @@ function ResolveArg(arg) {
 
 function executeCommand(cmd) {
     if (cmd.action === 'LoadNamespace') {
-        imports.gi.versions[cmd.namespace] = cmd.version;
+        if (cmd.version) {
+            imports.gi.versions[cmd.namespace] = cmd.version;
+        }
         const ns = imports.gi[cmd.namespace];
         return ConvertToProtocol(ns);
     }

package/src/index.ts

@@ -173,8 +173,46 @@ export function init() {
     initialize();
 }
 
-export function loadGiNamespace(namespace: string, version: string) {
+// Internal function - not exposed to users
+function loadGiNamespace(namespace: string, version: string | undefined) {
     initialize();
     const res = ipc!.send({ action: 'LoadNamespace', namespace, version });
     return createProxy(res);
 }
+
+// Namespace cache to avoid creating multiple proxies for the same namespace
+const namespaceCache = new Map<string, any>();
+
+// GI namespace versions
+const giVersions: Record<string, string> = {};
+
+// Create the gi proxy with lazy loading and caching
+const giProxy = new Proxy({} as any, {
+    get(_, namespace: string) {
+        if (namespace === 'versions') {
+            return new Proxy(giVersions, {
+                set(target, prop, value) {
+                    target[prop as string] = value;
+                    // Clear cache for this namespace when version changes
+                    const cacheKey = `${prop as string}@default`;
+                    namespaceCache.delete(cacheKey);
+                    return true;
+                }
+            });
+        }
+        
+        const version = giVersions[namespace];
+        const cacheKey = `${namespace}@${version || 'default'}`;
+        
+        if (!namespaceCache.has(cacheKey)) {
+            namespaceCache.set(cacheKey, loadGiNamespace(namespace, version));
+        }
+        
+        return namespaceCache.get(cacheKey);
+    }
+});
+
+// The main exports object - compatible with GJS imports
+export const imports = {
+    gi: giProxy
+};

package/examples/adwaita/counter/counter.ts

@@ -1,66 +0,0 @@
-// Run: node start.js examples/adwaita/counter/counter.ts
-import { loadGi } from '../../../gi-loader.ts';
-
-const Gtk = loadGi('Gtk', '4.0');
-const Adw = loadGi('Adw', '1');
-
-let clickCount = 0;
-
-console.log("--- Adwaita Counter ---");
-
-const app = new Adw.Application({ application_id: 'org.adwaita.counter' });
-
-app.connect('activate', () => {
-    const window = new Adw.ApplicationWindow({
-        application: app,
-        title: 'Adwaita Counter App',
-        default_width: 400,
-        default_height: 300
-    });
-
-    const toolbarView = new Adw.ToolbarView();
-
-    const headerBar = new Adw.HeaderBar({
-        title_widget: new Gtk.Label({ label: 'Adwaita Counter App' })
-    });
-    toolbarView.add_top_bar(headerBar);
-
-    const box = new Gtk.Box({
-        orientation: Gtk.Orientation.VERTICAL,
-        spacing: 10,
-        halign: Gtk.Align.CENTER,
-        valign: Gtk.Align.CENTER
-    });
-    box.set_margin_start(20);
-    box.set_margin_end(20);
-    box.set_margin_top(20);
-    box.set_margin_bottom(20);
-
-    const label = new Gtk.Label({
-        label: 'Clicks: 0',
-        css_classes: ['title-1']
-    });
-
-    const button = new Gtk.Button({
-        label: 'Click to Add',
-        css_classes: ['suggested-action']
-    });
-
-    button.connect('clicked', () => {
-        clickCount++;
-        const message = `Clicked ${clickCount} times`;
-        label.set_label(message);
-        console.log(message);
-    });
-
-    box.append(label);
-    box.append(button);
-
-    toolbarView.set_content(box);
-    window.set_content(toolbarView);
-    window.present();
-
-    console.log("Click the button to increase the counter...");
-});
-
-app.run([]);

package/examples/console/await-delay/await-delay.ts

@@ -1,11 +0,0 @@
-// Run: node start.js examples/console/await-delay/await-delay.ts
-import { loadGi } from '../../../gi-loader.ts';
-
-loadGi('GLib', '2.0');
-
-print('0s');
-await new Promise(resolve => setTimeout(resolve, 1000));
-print("1s");
-await new Promise(resolve => setTimeout(resolve, 1000));
-print("2s");
-await new Promise(resolve => setTimeout(resolve, 1000));

package/examples/console/console-input/console-input.ts

@@ -1,27 +0,0 @@
-// Run: node start.js examples/console/console-input/console-input.ts
-import { loadGi } from '../../../gi-loader.ts';
-
-const Gio = loadGi('Gio', '2.0');
-
-let GioUnix;
-try {
-    GioUnix = loadGi('GioUnix', '2.0');
-} catch {
-    GioUnix = Gio;
-}
-
-print("=== Greeting Program ===");
-print("Please enter your name: ");
-
-const stdin = new GioUnix.InputStream({ fd: 0, close_fd: false });
-const dataInput = new Gio.DataInputStream({ base_stream: stdin });
-
-const [name] = dataInput.read_line_utf8(null);
-
-if (name && name.trim() !== "") {
-    print(`Hello, ${name}! Welcome to this program!`);
-} else {
-    print("Hello, friend! Welcome to this program!");
-}
-
-print("Program ended.");

package/examples/gtk/counter/counter.ts

@@ -1,62 +0,0 @@
-// Run: node start.js examples/gtk/counter/counter.ts
-import { loadGi } from '../../../gi-loader.ts';
-
-const Gtk = loadGi('Gtk', '4.0');
-
-let clickCount = 0;
-
-console.log("--- GTK4 Counter ---");
-
-const app = new Gtk.Application({ application_id: 'org.gtk.counter' });
-
-app.connect('activate', () => {
-    const window = new Gtk.ApplicationWindow({
-        application: app,
-        title: 'GTK Counter App',
-        default_width: 400,
-        default_height: 300
-    });
-
-    window.connect('close-request', () => {
-        app.quit();
-        return false;
-    });
-
-    const box = new Gtk.Box({
-        orientation: Gtk.Orientation.VERTICAL,
-        spacing: 10,
-        halign: Gtk.Align.CENTER,
-        valign: Gtk.Align.CENTER
-    });
-    box.set_margin_start(20);
-    box.set_margin_end(20);
-    box.set_margin_top(20);
-    box.set_margin_bottom(20);
-
-    const label = new Gtk.Label({
-        label: 'Clicks: 0',
-        css_classes: ['title-1']
-    });
-
-    const button = new Gtk.Button({
-        label: 'Click to Add',
-        css_classes: ['suggested-action']
-    });
-
-    button.connect('clicked', () => {
-        clickCount++;
-        const message = `Clicked ${clickCount} times`;
-        label.set_label(message);
-        console.log(message);
-    });
-
-    box.append(label);
-    box.append(button);
-
-    window.set_child(box);
-    window.present();
-
-    console.log("Click the button to increase the counter...");
-});
-
-app.run([]);

package/examples/gtk/drag-box/drag-box.ts

@@ -1,77 +0,0 @@
-// Run: node start.js examples/gtk/drag-box/drag-box.ts
-import { loadGi } from '../../../gi-loader.ts';
-
-const Gtk = loadGi('Gtk', '4.0');
-
-console.log("--- GTK4 Flicker-free Draggable Square (Cairo) ---");
-
-const app = new Gtk.Application({ application_id: 'org.gtk.dragbox' });
-
-app.connect('activate', () => {
-    const window = new Gtk.ApplicationWindow({
-        application: app,
-        title: 'Drag Example (High Frequency IPC) ',
-        default_width: 600,
-        default_height: 400
-    });
-
-    const fixed = new Gtk.Fixed();
-    fixed.set_hexpand(true);
-    fixed.set_vexpand(true);
-
-    const squareSize = 80;
-    const drawingArea = new Gtk.DrawingArea();
-    drawingArea.set_size_request(squareSize, squareSize);
-
-    const drawFunction = (area: any, cr: any, width: number, height: number) => {
-        cr.setSourceRGB(1.0, 0.2, 0.2);
-        cr.rectangle(0, 0, width, height);
-        cr.fill();
-    };
-
-    drawingArea.set_draw_func(drawFunction);
-
-    let currentX = 260;
-    let currentY = 160;
-    fixed.put(drawingArea, currentX, currentY);
-
-    const drag = new Gtk.GestureDrag();
-    
-    let isDragging = false;
-    let dragStartX = 0;
-    let dragStartY = 0;
-
-    drag.connect('drag-begin', (gesture: any, startX: number, startY: number) => {
-        if (startX >= currentX && startX <= currentX + squareSize &&
-            startY >= currentY && startY <= currentY + squareSize) {
-            isDragging = true;
-            dragStartX = currentX;
-            dragStartY = currentY;
-            console.log(`✅ Drag started at: (${startX}, ${startY})`);
-        }
-    });
-
-    drag.connect('drag-update', (gesture: any, offsetX: number, offsetY: number) => {
-        if (!isDragging) return;
-        const newX = dragStartX + offsetX;
-        const newY = dragStartY + offsetY;
-        fixed.move(drawingArea, newX, newY);
-    });
-
-    drag.connect('drag-end', (gesture: any, offsetX: number, offsetY: number) => {
-        if (!isDragging) return;
-        isDragging = false;
-        currentX = dragStartX + offsetX;
-        currentY = dragStartY + offsetY;
-        console.log(`🛑 Drag ended at position: (${currentX}, ${currentY})`);
-    });
-
-    fixed.add_controller(drag);
-
-    window.set_child(fixed);
-    window.present();
-
-    console.log("Window loaded. Try dragging the red square smoothly!");
-});
-
-app.run([]);

package/examples/gtk-webkit/counter/counter.html

@@ -1,47 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <title>Counter</title>
-    <meta charset="UTF-8">
-    <style>
-        body { font-family: Arial, sans-serif; padding: 20px; text-align: center; }
-        h1 { color: #333; }
-        #display { font-size: 24px; margin: 20px 0; }
-        button { padding: 10px 20px; font-size: 16px; cursor: pointer; }
-    </style>
-    <script>
-        (function() {
-            const originalConsole = window.console;
-            window.console = {
-                log: function(...args) {
-                    window.webkit.messageHandlers.console.postMessage(args.join(' '));
-                },
-                error: function(...args) {
-                    window.webkit.messageHandlers.console.postMessage('[ERROR] ' + args.join(' '));
-                },
-                warn: function(...args) {
-                    window.webkit.messageHandlers.console.postMessage('[WARN] ' + args.join(' '));
-                }
-            };
-        })();
-    </script>
-</head>
-<body>
-    <h1>Counter App (WebKit)</h1>
-    <p id="display">Clicks: 0</p>
-    <button id="btn">Click to Add</button>
-
-    <script>
-        let clickCount = 0;
-        const display = document.getElementById('display');
-        const button = document.getElementById('btn');
-
-        button.addEventListener('click', function() {
-            clickCount++;
-            const message = 'Button clicked ' + clickCount + ' times';
-            display.textContent = message;
-            console.log(message);
-        });
-    </script>
-</body>
-</html>

package/examples/gtk-webkit/counter/counter.ts

@@ -1,101 +0,0 @@
-// Run: node start.js examples/gtk-webkit/counter/counter.ts
-import { loadGi } from '../../../gi-loader.ts';
-import * as path from 'node:path';
-import { fileURLToPath } from 'node:url';
-
-const Gtk = loadGi('Gtk', '4.0');
-const WebKit = loadGi('WebKit', '6.0');
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-console.log('--- GTK4 WebKit Counter ---');
-
-const app = new Gtk.Application({ application_id: 'org.gtk.webkitcounter' });
-
-app.connect('activate', () => {
-    const window = new Gtk.ApplicationWindow({
-        application: app,
-        title: 'WebKit Counter App',
-        default_width: 500,
-        default_height: 400
-    });
-
-    const box = new Gtk.Box({
-        orientation: Gtk.Orientation.VERTICAL,
-        spacing: 0
-    });
-
-    const toolbar = new Gtk.Box({
-        orientation: Gtk.Orientation.HORIZONTAL,
-        spacing: 5
-    });
-    toolbar.set_margin_start(5);
-    toolbar.set_margin_end(5);
-    toolbar.set_margin_top(5);
-    toolbar.set_margin_bottom(5);
-
-    const htmlPath = path.join(__dirname, 'counter.html');
-    const htmlUri = 'file://' + htmlPath;
-
-    const backButton = new Gtk.Button({ label: '← Back' });
-    const forwardButton = new Gtk.Button({ label: 'Forward →' });
-    const urlEntry = new Gtk.Entry({
-        placeholder_text: 'Enter URL or use default',
-        text: htmlUri,
-        hexpand: true
-    });
-
-    toolbar.append(backButton);
-    toolbar.append(forwardButton);
-    toolbar.append(urlEntry);
-
-    const contentManager = new WebKit.UserContentManager();
-    
-    contentManager.connect('script-message-received', (manager, value) => {
-        const message = value.to_string();
-        if (message) print(`[WebView] ${message}`);
-    });
-    contentManager.register_script_message_handler('console', null);
-
-    const webView = new WebKit.WebView({
-        vexpand: true,
-        hexpand: true,
-        user_content_manager: contentManager
-    });
-
-    webView.load_uri(htmlUri);
-
-    webView.connect('load-changed', (webview, loadEvent) => {
-        if (loadEvent === WebKit.LoadEvent.FINISHED) {
-            console.log('Page Loaded Successfully');
-            urlEntry.set_text(webview.get_uri() || '');
-        }
-    });
-
-    backButton.connect('clicked', () => {
-        if (webView.can_go_back()) webView.go_back();
-    });
-
-    forwardButton.connect('clicked', () => {
-        if (webView.can_go_forward()) webView.go_forward();
-    });
-
-    urlEntry.connect('activate', () => {
-        let uri = urlEntry.get_text();
-        if (!uri.startsWith('http://') && !uri.startsWith('https://') && !uri.startsWith('file://')) {
-            uri = 'https://' + uri;
-        }
-        webView.load_uri(uri);
-    });
-
-    box.append(toolbar);
-    box.append(webView);
-
-    window.set_child(box);
-    window.present();
-
-    console.log("Click the button in the web view to increase the counter...");
-});
-
-app.run([]);

package/gi-loader.ts

@@ -1,13 +0,0 @@
-// gi-loader.ts
-// Universal GI namespace loader for Node.js, Bun, and Deno
-// Usage:
-//   import { loadGi } from './gi-loader.ts';
-//   const Gtk = loadGi('Gtk', '4.0');
-
-import { init, loadGiNamespace } from './src/index.ts';
-
-init();
-
-export function loadGi(namespace: string, version: string = '') {
-    return loadGiNamespace(namespace, version);
-}

package/hook.js

@@ -1,42 +0,0 @@
-// hook.js
-export async function resolve(specifier, context, nextResolve) {
-    if (specifier.startsWith('gi://')) {
-        return {
-            url: specifier,
-            shortCircuit: true,
-            format: 'module'
-        };
-    }
-    return nextResolve(specifier, context);
-}
-
-export async function load(url, context, nextLoad) {
-    if (url.startsWith('gi://')) {
-        // Safely parse 'gi://Gtk?version=4.0'
-        const bareUrl = url.replace('gi://', '');
-        const [namespacePart, queryPart] = bareUrl.split('?');
-        
-        const namespace = namespacePart;
-        let version = '';
-        
-        if (queryPart) {
-            const params = new URLSearchParams(queryPart);
-            version = params.get('version') || '';
-        }
-
-        const coreUrl = new URL('./src/index.ts', import.meta.url).href;
-        
-        const source = `
-            import { init, loadGiNamespace } from '${coreUrl}';
-            init();
-            export default loadGiNamespace('${namespace}', '${version}');
-        `;
-        
-        return {
-            format: 'module',
-            shortCircuit: true,
-            source: source
-        };
-    }
-    return nextLoad(url, context);
-}

package/start.js

@@ -1,105 +0,0 @@
-// start.js
-import { spawn } from 'child_process';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const args = process.argv.slice(2);
-
-if (args.length === 0) {
-    console.error('Usage: node start.js <script.ts> [--runtime=node|bun|deno]');
-    console.error('       bun start.js <script.ts> [--runtime=node|bun|deno]');
-    console.error('       deno run start.js <script.ts> [--runtime=node|bun|deno]');
-    process.exit(1);
-}
-
-let runtime = null;
-let targetScript = null;
-
-for (let i = 0; i < args.length; i++) {
-    if (args[i] === '--runtime' && args[i + 1]) {
-        runtime = args[i + 1].toLowerCase();
-        i++;
-    } else if (!args[i].startsWith('--')) {
-        targetScript = args[i];
-    }
-}
-
-if (!targetScript) {
-    console.error('Error: No script specified');
-    process.exit(1);
-}
-
-targetScript = path.resolve(targetScript);
-const hookUrl = new URL('./hook.js', import.meta.url).href;
-
-if (!runtime) {
-    runtime = detectRuntime();
-}
-
-const validRuntimes = ['node', 'bun', 'deno'];
-if (!validRuntimes.includes(runtime)) {
-    console.error(`Error: Invalid runtime "${runtime}". Must be one of: ${validRuntimes.join(', ')}`);
-    process.exit(1);
-}
-
-console.log(`Starting ${runtime.charAt(0).toUpperCase() + runtime.slice(1)}-GJS execution context...`);
-
-let proc;
-
-switch (runtime) {
-    case 'bun':
-        proc = spawnBun(targetScript);
-        break;
-    case 'deno':
-        proc = spawnDeno(targetScript);
-        break;
-    case 'node':
-    default:
-        proc = spawnNode(targetScript, hookUrl);
-        break;
-}
-
-proc.on('exit', (code) => {
-    process.exit(code || 0);
-});
-
-function detectRuntime() {
-    if (typeof Bun !== 'undefined') return 'bun';
-    if (typeof Deno !== 'undefined') return 'deno';
-    return 'node';
-}
-
-function spawnNode(targetScript, hookUrl) {
-    return spawn(process.execPath, [
-        '--no-warnings', 
-        '--experimental-loader', hookUrl,
-        '--experimental-transform-types', 
-        targetScript
-    ], {
-        stdio: 'inherit',
-        env: process.env
-    });
-}
-
-function spawnBun(targetScript) {
-    return spawn('bun', [
-        'run',
-        targetScript
-    ], {
-        stdio: 'inherit',
-        env: process.env
-    });
-}
-
-function spawnDeno(targetScript) {
-    return spawn('deno', [
-        'run',
-        '--allow-all',
-        targetScript
-    ], {
-        stdio: 'inherit',
-        env: process.env
-    });
-}