@wailsio/runtime 3.0.0-alpha.20 → 3.0.0-alpha.22

package/src/wml.js

@@ -1,171 +1,250 @@
-
-import {Emit, WailsEvent} from "./events";
-import {Question} from "./dialogs";
-import {Get} from "./window";
-import {OpenURL} from "./browser";
-
-/**
- * Sends an event with the given name and optional data.
- *
- * @param {string} eventName - The name of the event to send.
- * @param {any} [data=null] - Optional data to send along with the event.
- *
- * @return {void}
- */
-function sendEvent(eventName, data=null) {
-    let event = new WailsEvent(eventName, data);
-    Emit(event);
-}
-
-/**
- * Adds event listeners to elements with `wml-event` attribute.
- *
- * @return {void}
- */
-function addWMLEventListeners() {
-    const elements = document.querySelectorAll('[wml-event]');
-    elements.forEach(function (element) {
-        const eventType = element.getAttribute('wml-event');
-        const confirm = element.getAttribute('wml-confirm');
-        const trigger = element.getAttribute('wml-trigger') || "click";
-
-        let callback = function () {
-            if (confirm) {
-                Question({Title: "Confirm", Message:confirm, Detached: false, Buttons:[{Label:"Yes"},{Label:"No", IsDefault:true}]}).then(function (result) {
-                    if (result !== "No") {
-                        sendEvent(eventType);
-                    }
-                });
-                return;
-            }
-            sendEvent(eventType);
-        };
-
-        // Remove existing listeners
-        element.removeEventListener(trigger, callback);
-
-        // Add new listener
-        element.addEventListener(trigger, callback);
-    });
-}
-
-
-/**
- * Calls a method on a specified window.
- * @param {string} windowName - The name of the window to call the method on.
- * @param {string} method - The name of the method to call.
- */
-function callWindowMethod(windowName, method) {
-    let targetWindow = Get(windowName);
-    let methodMap = WindowMethods(targetWindow);
-    if (!methodMap.has(method)) {
-        console.log("Window method " + method + " not found");
-    }
-    try {
-        methodMap.get(method)();
-    } catch (e) {
-        console.error("Error calling window method '" + method + "': " + e);
-    }
-}
-
-/**
- * Adds window listeners for elements with the 'wml-window' attribute.
- * Removes any existing listeners before adding new ones.
- *
- * @return {void}
- */
-function addWMLWindowListeners() {
-    const elements = document.querySelectorAll('[wml-window]');
-    elements.forEach(function (element) {
-        const windowMethod = element.getAttribute('wml-window');
-        const confirm = element.getAttribute('wml-confirm');
-        const trigger = element.getAttribute('wml-trigger') || 'click';
-        const targetWindow = element.getAttribute('wml-target-window') || '';
-
-        let callback = function () {
-            if (confirm) {
-                Question({Title: "Confirm", Message:confirm, Buttons:[{Label:"Yes"},{Label:"No", IsDefault:true}]}).then(function (result) {
-                    if (result !== "No") {
-                        callWindowMethod(targetWindow, windowMethod);
-                    }
-                });
-                return;
-            }
-            callWindowMethod(targetWindow, windowMethod);
-        };
-
-        // Remove existing listeners
-        element.removeEventListener(trigger, callback);
-
-        // Add new listener
-        element.addEventListener(trigger, callback);
-    });
-}
-
-/**
- * Adds a listener to elements with the 'wml-openurl' attribute.
- * When the specified trigger event is fired on any of these elements,
- * the listener will open the URL specified by the 'wml-openurl' attribute.
- * If a 'wml-confirm' attribute is provided, a confirmation dialog will be displayed,
- * and the URL will only be opened if the user confirms.
- *
- * @return {void}
- */
-function addWMLOpenBrowserListener() {
-    const elements = document.querySelectorAll('[wml-openurl]');
-    elements.forEach(function (element) {
-        const url = element.getAttribute('wml-openurl');
-        const confirm = element.getAttribute('wml-confirm');
-        const trigger = element.getAttribute('wml-trigger') || "click";
-
-        let callback = function () {
-            if (confirm) {
-                Question({Title: "Confirm", Message:confirm, Buttons:[{Label:"Yes"},{Label:"No", IsDefault:true}]}).then(function (result) {
-                    if (result !== "No") {
-                        void OpenURL(url);
-                    }
-                });
-                return;
-            }
-            void OpenURL(url);
-        };
-
-        // Remove existing listeners
-        element.removeEventListener(trigger, callback);
-
-        // Add new listener
-        element.addEventListener(trigger, callback);
-    });
-}
-
-/**
- * Reloads the WML page by adding necessary event listeners and browser listeners.
- *
- * @return {void}
- */
-export function Reload() {
-    addWMLEventListeners();
-    addWMLWindowListeners();
-    addWMLOpenBrowserListener();
-}
-
-/**
- * Returns a map of all methods in the current window.
- * @returns {Map} - A map of window methods.
- */
-function WindowMethods(targetWindow) {
-    // Create a new map to store methods
-    let result = new Map();
-
-    // Iterate over all properties of the window object
-    for (let method in targetWindow) {
-        // Check if the property is indeed a method (function)
-        if(typeof targetWindow[method] === 'function') {
-            // Add the method to the map
-            result.set(method, targetWindow[method]);
-        }
-
-    }
-    // Return the map of window methods
-    return result;
-}
+/*
+ _     __     _ __
+| |  / /___ _(_) /____
+| | /| / / __ `/ / / ___/
+| |/ |/ / /_/ / / (__  )
+|__/|__/\__,_/_/_/____/
+The electron alternative for Go
+(c) Lea Anthony 2019-present
+*/
+
+import {OpenURL} from "./browser";
+import {Question} from "./dialogs";
+import {Emit, WailsEvent} from "./events";
+import {canAbortListeners, whenReady} from "./utils";
+import Window from "./window";
+
+/**
+ * Sends an event with the given name and optional data.
+ *
+ * @param {string} eventName - The name of the event to send.
+ * @param {any} [data=null] - Optional data to send along with the event.
+ *
+ * @return {void}
+ */
+function sendEvent(eventName, data=null) {
+    Emit(new WailsEvent(eventName, data));
+}
+
+/**
+ * Calls a method on a specified window.
+ * @param {string} windowName - The name of the window to call the method on.
+ * @param {string} methodName - The name of the method to call.
+ */
+function callWindowMethod(windowName, methodName) {
+    const targetWindow = Window.Get(windowName);
+    const method = targetWindow[methodName];
+
+    if (typeof method !== "function") {
+        console.error(`Window method '${methodName}' not found`);
+        return;
+    }
+
+    try {
+        method.call(targetWindow);
+    } catch (e) {
+        console.error(`Error calling window method '${methodName}': `, e);
+    }
+}
+
+/**
+ * Responds to a triggering event by running appropriate WML actions for the current target
+ *
+ * @param {Event} ev
+ * @return {void}
+ */
+function onWMLTriggered(ev) {
+    const element = ev.currentTarget;
+
+    function runEffect(choice = "Yes") {
+        if (choice !== "Yes")
+            return;
+
+        const eventType = element.getAttribute('wml-event');
+        const targetWindow = element.getAttribute('wml-target-window') || "";
+        const windowMethod = element.getAttribute('wml-window');
+        const url = element.getAttribute('wml-openurl');
+
+        if (eventType !== null)
+            sendEvent(eventType);
+        if (windowMethod !== null)
+            callWindowMethod(targetWindow, windowMethod);
+        if (url !== null)
+            void OpenURL(url);
+    }
+
+    const confirm = element.getAttribute('wml-confirm');
+
+    if (confirm) {
+        Question({
+            Title: "Confirm",
+            Message: confirm,
+            Detached: false,
+            Buttons: [
+                { Label: "Yes" },
+                { Label: "No", IsDefault: true }
+            ]
+        }).then(runEffect);
+    } else {
+        runEffect();
+    }
+}
+
+/**
+ * @type {symbol}
+ */
+const controller = Symbol();
+
+/**
+ * AbortControllerRegistry does not actually remember active event listeners: instead
+ * it ties them to an AbortSignal and uses an AbortController to remove them all at once.
+ */
+class AbortControllerRegistry {
+    constructor() {
+        /**
+         * Stores the AbortController that can be used to remove all currently active listeners.
+         *
+         * @private
+         * @name {@link controller}
+         * @member {AbortController}
+         */
+        this[controller] = new AbortController();
+    }
+
+    /**
+     * Returns an options object for addEventListener that ties the listener
+     * to the AbortSignal from the current AbortController.
+     *
+     * @param {HTMLElement} element An HTML element
+     * @param {string[]} triggers The list of active WML trigger events for the specified elements
+     * @returns {AddEventListenerOptions}
+     */
+    set(element, triggers) {
+        return { signal: this[controller].signal };
+    }
+
+    /**
+     * Removes all registered event listeners.
+     *
+     * @returns {void}
+     */
+    reset() {
+        this[controller].abort();
+        this[controller] = new AbortController();
+    }
+}
+
+/**
+ * @type {symbol}
+ */
+const triggerMap = Symbol();
+
+/**
+ * @type {symbol}
+ */
+const elementCount = Symbol();
+
+/**
+ * WeakMapRegistry maps active trigger events to each DOM element through a WeakMap.
+ * This ensures that the mapping remains private to this module, while still allowing garbage
+ * collection of the involved elements.
+ */
+class WeakMapRegistry {
+    constructor() {
+        /**
+         * Stores the current element-to-trigger mapping.
+         *
+         * @private
+         * @name {@link triggerMap}
+         * @member {WeakMap<HTMLElement, string[]>}
+         */
+        this[triggerMap] = new WeakMap();
+
+        /**
+         * Counts the number of elements with active WML triggers.
+         *
+         * @private
+         * @name {@link elementCount}
+         * @member {number}
+         */
+        this[elementCount] = 0;
+    }
+
+    /**
+     * Sets the active triggers for the specified element.
+     *
+     * @param {HTMLElement} element An HTML element
+     * @param {string[]} triggers The list of active WML trigger events for the specified element
+     * @returns {AddEventListenerOptions}
+     */
+    set(element, triggers) {
+        this[elementCount] += !this[triggerMap].has(element);
+        this[triggerMap].set(element, triggers);
+        return {};
+    }
+
+    /**
+     * Removes all registered event listeners.
+     *
+     * @returns {void}
+     */
+    reset() {
+        if (this[elementCount] <= 0)
+            return;
+
+        for (const element of document.body.querySelectorAll('*')) {
+            if (this[elementCount] <= 0)
+                break;
+
+            const triggers = this[triggerMap].get(element);
+            this[elementCount] -= (typeof triggers !== "undefined");
+
+            for (const trigger of triggers || [])
+                element.removeEventListener(trigger, onWMLTriggered);
+        }
+
+        this[triggerMap] = new WeakMap();
+        this[elementCount] = 0;
+    }
+}
+
+const triggerRegistry = canAbortListeners() ? new AbortControllerRegistry() : new WeakMapRegistry();
+
+/**
+ * Adds event listeners to the specified element.
+ *
+ * @param {HTMLElement} element
+ * @return {void}
+ */
+function addWMLListeners(element) {
+    const triggerRegExp = /\S+/g;
+    const triggerAttr = (element.getAttribute('wml-trigger') || "click");
+    const triggers = [];
+
+    let match;
+    while ((match = triggerRegExp.exec(triggerAttr)) !== null)
+        triggers.push(match[0]);
+
+    const options = triggerRegistry.set(element, triggers);
+    for (const trigger of triggers)
+        element.addEventListener(trigger, onWMLTriggered, options);
+}
+
+/**
+ * Schedules an automatic reload of WML to be performed as soon as the document is fully loaded.
+ *
+ * @return {void}
+ */
+export function Enable() {
+    whenReady(Reload);
+}
+
+/**
+ * Reloads the WML page by adding necessary event listeners and browser listeners.
+ *
+ * @return {void}
+ */
+export function Reload() {
+    triggerRegistry.reset();
+    document.body.querySelectorAll('[wml-event], [wml-window], [wml-openurl]').forEach(addWMLListeners);
+}

package/tsconfig.json

@@ -1,20 +1,20 @@
-{
-  "include": ["./src/**/*"],
-  "compilerOptions": {
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
-    "allowJs": true,
-    "declaration": true,
-    "declarationMap": true,
-    "emitDeclarationOnly": true,
-    "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "node",
-    "outDir": "dist",
-    "strict": true,
-    "target": "es6",
-  }
+{
+  "include": ["./src/**/*"],
+  "compilerOptions": {
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "declaration": true,
+    "declarationMap": true,
+    "emitDeclarationOnly": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "outDir": "dist",
+    "strict": true,
+    "target": "es6",
+  }
 }

package/types/event_types.d.ts

@@ -155,6 +155,11 @@ export declare const EventTypes: {
 	},
 	Linux: {
 		SystemThemeChanged: string,
+		WindowLoadChanged: string,
+		WindowDeleteEvent: string,
+		WindowFocusIn: string,
+		WindowFocusOut: string,
+		ApplicationStartup: string,
 	},
 	Common: {
 		ApplicationStarted: string,

package/types/events.d.ts

@@ -202,6 +202,11 @@ export const Types: {
     };
     Linux: {
         SystemThemeChanged: string;
+        WindowLoadChanged: string;
+        WindowDeleteEvent: string;
+        WindowFocusIn: string;
+        WindowFocusOut: string;
+        ApplicationStartup: string;
     };
     Common: {
         ApplicationStarted: string;

package/types/index.d.ts

@@ -7,6 +7,6 @@ import * as Events from "./events";
 import * as Flags from "./flags";
 import * as Screens from "./screens";
 import * as System from "./system";
-import * as Window from "./window";
-import * as WML from './wml';
+import Window from "./window";
+import * as WML from "./wml";
 export { Application, Browser, Call, Clipboard, Dialogs, Events, Flags, Screens, System, Window, WML };

package/types/runtime.d.ts

@@ -25,5 +25,6 @@ export namespace objectNames {
     let Screens: number;
     let System: number;
     let Browser: number;
+    let CancelCall: number;
 }
 export let clientId: string;

package/types/screens.d.ts

@@ -52,10 +52,6 @@ export type Rect = {
      */
     Height: number;
 };
-/**
- * The rotation of the screen. Can be one of 'Zero', 'Ninety', 'OneEighty', 'TwoSeventy'.
- */
-export type Rotation = ('Zero' | 'Ninety' | 'OneEighty' | 'TwoSeventy');
 export type Screen = {
     /**
      * - Unique identifier for the screen.
@@ -92,5 +88,5 @@ export type Screen = {
     /**
      * - The rotation of the screen.
      */
-    Rotation: Rotation;
+    Rotation: number;
 };

package/types/system.d.ts

@@ -14,9 +14,19 @@ export function IsDarkMode(): Promise<boolean>;
  */
 export function Capabilities(): Promise<any>;
 /**
- * @typedef {object} EnvironmentInfo
- * @property {string} OS - The operating system in use.
+ * @typedef {Object} OSInfo
+ * @property {string} Branding - The branding of the OS.
+ * @property {string} ID - The ID of the OS.
+ * @property {string} Name - The name of the OS.
+ * @property {string} Version - The version of the OS.
+ */
+/**
+ * @typedef {Object} EnvironmentInfo
  * @property {string} Arch - The architecture of the system.
+ * @property {boolean} Debug - True if the application is running in debug mode, otherwise false.
+ * @property {string} OS - The operating system in use.
+ * @property {OSInfo} OSInfo - Details of the operating system.
+ * @property {Object} PlatformInfo - Additional platform information.
  */
 /**
  * @function
@@ -60,13 +70,43 @@ export function IsARM(): boolean;
  */
 export function IsARM64(): boolean;
 export function IsDebug(): boolean;
+export type OSInfo = {
+    /**
+     * - The branding of the OS.
+     */
+    Branding: string;
+    /**
+     * - The ID of the OS.
+     */
+    ID: string;
+    /**
+     * - The name of the OS.
+     */
+    Name: string;
+    /**
+     * - The version of the OS.
+     */
+    Version: string;
+};
 export type EnvironmentInfo = {
+    /**
+     * - The architecture of the system.
+     */
+    Arch: string;
+    /**
+     * - True if the application is running in debug mode, otherwise false.
+     */
+    Debug: boolean;
     /**
      * - The operating system in use.
      */
     OS: string;
     /**
-     * - The architecture of the system.
+     * - Details of the operating system.
      */
-    Arch: string;
+    OSInfo: OSInfo;
+    /**
+     * - Additional platform information.
+     */
+    PlatformInfo: any;
 };

package/types/utils.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Logs a message to the console with custom formatting.
+ * @param {string} message - The message to be logged.
+ * @return {void}
+ */
+export function debugLog(message: string): void;
+/**
+ * Checks whether the browser supports removing listeners by triggering an AbortSignal
+ * (see https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#signal)
+ *
+ * @return {boolean}
+ */
+export function canAbortListeners(): boolean;
+export function whenReady(callback: any): void;