x4js 1.4.18 → 1.4.20

package/lib/tools.js

@@ -28,7 +28,8 @@
 * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 **/
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.generatePassword = exports.classNames = exports.mix = exports.crc32 = exports.Clipboard = exports.isHtmlString = exports.html = exports.HtmlString = exports.clamp = exports.getMousePos = exports.NetworkError = exports.markdownToHtml = exports.asap = exports.deferCall = exports.waitFontLoading = exports.isNumber = exports.pad = exports.isLiteralObject = exports.isFunction = exports.isArray = exports.isString = exports.downloadData = exports.calcAge = exports.formatIntlDate = exports.parseIntlDate = exports.date_calc_weeknum = exports.date_clone = exports.date_hash = exports.date_sql_utc = exports.date_to_sql = exports.date_diff = exports.date_format = exports._date_set_locale = exports.removeHtmlTags = exports.escapeHtml = exports.sprintf = exports.Rect = exports.Size = exports.Point = exports.pascalCase = exports.parseIntlFloat = exports.roundTo = exports.isTouchDevice = void 0;
+exports.generatePassword = exports.classNames = exports.mix = exports.crc32 = exports.Clipboard = exports.isHtmlString = exports.html = exports.HtmlString = exports.clamp = exports.getMousePos = exports.NetworkError = exports.markdownToHtml = exports.asap = exports.deferCall = exports.waitFontLoading = exports.isNumber = exports.pad = exports.isLiteralObject = exports.isFunction = exports.isArray = exports.isString = exports.downloadData = exports.calcAge = exports.formatIntlDate = exports.parseIntlDate = exports.date_calc_weeknum = exports.date_clone = exports.date_hash = exports.date_sql_utc = exports.date_to_sql = exports.date_diff = exports.date_format = exports._date_set_locale = exports.removeHtmlTags = exports.escapeHtml = exports.sprintf = exports.Rect = exports.Size = exports.Point = exports.camelCase = exports.pascalCase = exports.parseIntlFloat = exports.roundTo = exports.isTouchDevice = void 0;
+const x4dom_1 = require("./x4dom");
 const i18n_1 = require("./i18n"); // you MUST create a file named translation.js
 // :: ENVIRONMENT ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
 /**
@@ -90,6 +91,14 @@ function pascalCase(string) {
     return result.replace(/ /g, '-');
 }
 exports.pascalCase = pascalCase;
+function camelCase(text) {
+    let result = text.toLowerCase();
+    result = result.replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => {
+        return chr.toUpperCase();
+    });
+    return result;
+}
+exports.camelCase = camelCase;
 class Point {
     x;
     y;
@@ -652,11 +661,11 @@ function downloadData(data, mimetype, filename) {
     //}
     let blob = new Blob([data], { type: mimetype });
     let url = window.URL.createObjectURL(blob);
-    let a = document.createElement("a");
+    let a = x4dom_1.x4document.createElement("a");
     a.style['display'] = "none";
     a.href = url;
     a.download = filename;
-    document.body.appendChild(a);
+    x4dom_1.x4document.body.appendChild(a);
     a.click();
     window.URL.revokeObjectURL(url);
 }
@@ -733,20 +742,20 @@ function waitFontLoading(name) {
     // we can remove the div.
     // pitfall: if the font is already loaded, ne never end.
     // @review that
-    let ct = document.createElement('div');
+    let ct = x4dom_1.x4document.createElement('div');
     ct.style.position = 'absolute';
     ct.style.fontFamily = name;
     ct.style.fontSize = '44px';
     ct.style.opacity = '0.001';
     ct.innerText = 'X';
-    document.body.appendChild(ct);
+    x4dom_1.x4document.body.appendChild(ct);
     return new Promise((resolve) => {
         let irc = ct.getBoundingClientRect();
         let tm = setInterval(() => {
             let nrc = ct.getBoundingClientRect();
             if (nrc.height != irc.height) {
                 clearInterval(tm);
-                document.body.removeChild(ct);
+                x4dom_1.x4document.body.removeChild(ct);
                 resolve();
             }
         }, 0);

package/lib/tooltips.js

@@ -29,6 +29,7 @@
 **/
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.initTooltips = exports.Tooltip = void 0;
+const x4dom_1 = require("./x4dom");
 const component_1 = require("./component");
 const label_1 = require("./label");
 const icon_1 = require("./icon");
@@ -66,7 +67,7 @@ class Tooltip extends component_1.Component {
             valign = 'b';
         }
         // @TODO: this is a minimal overflow problem solution
-        let rc = document.body.getBoundingClientRect(), rm = this.getBoundingRect();
+        let rc = x4dom_1.x4document.body.getBoundingClientRect(), rm = this.getBoundingRect();
         if (halign == 'r') {
             x -= rm.width;
         }
@@ -135,7 +136,7 @@ function initTooltips(cb) {
             tipTmo = setTimeout(() => {
                 if (tooltip === undefined) {
                     tooltip = new Tooltip({});
-                    document.body.appendChild(tooltip._build());
+                    x4dom_1.x4document.body.appendChild(tooltip._build());
                 }
                 tooltip.text = tip;
                 tooltip.displayAt(tipTarget.x + 17, tipTarget.y + 17, 'top left');
@@ -150,8 +151,8 @@ function initTooltips(cb) {
             tooltip.hide();
         }
     }
-    document.body.addEventListener('mouseover', handle_mouse);
-    document.body.addEventListener('mouseout', handle_mouse);
-    document.body.addEventListener('mousemove', handle_mpos);
+    x4dom_1.x4document.body.addEventListener('mouseover', handle_mouse);
+    x4dom_1.x4document.body.addEventListener('mouseout', handle_mouse);
+    x4dom_1.x4document.body.addEventListener('mousemove', handle_mpos);
 }
 exports.initTooltips = initTooltips;

package/lib/treeview.d.ts

@@ -30,7 +30,7 @@ import { Component, Container, ContainerEventMap, ContainerProps, EvDblClick, Ev
 import { HtmlString } from './tools';
 import { IconID } from './icon';
 import { VLayout } from './layout';
-import { EvClick, BasicEvent, EvDrag, EvSelectionChange, EvContextMenu } from './x4_events';
+import { EvClick, BasicEvent, EvDrag, EvSelectionChange, EvContextMenu } from './x4events';
 export interface EvExpand extends BasicEvent {
     node: TreeNode;
 }

package/lib/treeview.js

@@ -33,9 +33,9 @@ const component_1 = require("./component");
 const icon_1 = require("./icon");
 const label_1 = require("./label");
 const layout_1 = require("./layout");
-const x4_events_1 = require("./x4_events");
+const x4events_1 = require("./x4events");
 function EvExpand(node) {
-    return (0, x4_events_1.BasicEvent)({ node });
+    return (0, x4events_1.BasicEvent)({ node });
 }
 /**
  *
@@ -127,7 +127,7 @@ class TreeView extends layout_1.VLayout {
             for (let i = 0; i < ev.dataTransfer.items.length; i++) {
                 ev.dataTransfer.items[0].getAsString((value) => {
                     let data = JSON.parse(value);
-                    this.emit('drag', (0, x4_events_1.EvDrag)(node, data, parent));
+                    this.emit('drag', (0, x4events_1.EvDrag)(node, data, parent));
                 });
             }
         }
@@ -346,14 +346,14 @@ class TreeView extends layout_1.VLayout {
                     this.selection = nd.id;
                     if (!onsub) {
                         if (ev.type == 'click') {
-                            this.emit('click', (0, x4_events_1.EvClick)(nd));
+                            this.emit('click', (0, x4events_1.EvClick)(nd));
                         }
                         else {
                             this.emit('dblclick', (0, component_1.EvDblClick)(nd));
                         }
                     }
                 }
-                this.emit('selectionchange', (0, x4_events_1.EvSelectionChange)(nd));
+                this.emit('selectionchange', (0, x4events_1.EvSelectionChange)(nd));
                 return;
             }
             dom = dom.parentElement;
@@ -361,7 +361,7 @@ class TreeView extends layout_1.VLayout {
         if (ev.type == 'click') {
             this.m_selection = null;
             this.update();
-            this.emit('selectionchange', (0, x4_events_1.EvSelectionChange)(null));
+            this.emit('selectionchange', (0, x4events_1.EvSelectionChange)(null));
         }
     }
     _handleCtxMenu(ev) {
@@ -380,14 +380,14 @@ class TreeView extends layout_1.VLayout {
                 }
                 this.m_selection = { id: nd.id, el: null };
                 this.update();
-                this.emit('contextMenu', (0, x4_events_1.EvContextMenu)(ev, nd));
+                this.emit('contextMenu', (0, x4events_1.EvContextMenu)(ev, nd));
                 return;
             }
             dom = dom.parentElement;
         }
         this.m_selection = null;
         this.update();
-        this.emit('contextMenu', (0, x4_events_1.EvContextMenu)(ev, null));
+        this.emit('contextMenu', (0, x4events_1.EvContextMenu)(ev, null));
     }
     /**
      * constructs a tree node from an array of strings

package/lib/x4dom.d.ts

@@ -0,0 +1,21 @@
+/**
+ *
+ */
+interface IX4Document {
+    createElement<K extends keyof HTMLElementTagNameMap>(tagName: K, options?: ElementCreationOptions): HTMLElementTagNameMap[K];
+    createElementNS(namespace: string | null, qualifiedName: string, options?: string | ElementCreationOptions): Element;
+    createTextNode(data: string): Text;
+    addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;
+    querySelector<E extends Element = Element>(selectors: string): E | null;
+    get body(): HTMLElement;
+    get activeElement(): Element;
+    get location(): Location;
+    get styleSheets(): StyleSheetList;
+    get head(): HTMLHeadElement;
+    get documentElement(): HTMLElement;
+    set title(title: string);
+}
+export declare let x4document: IX4Document;
+export {};

package/lib/x4dom.js

@@ -0,0 +1,7 @@
+"use strict";
+/**
+ *
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.x4document = void 0;
+exports.x4document = document;

package/lib/x4events.d.ts

@@ -0,0 +1,266 @@
+/**
+*  ___   ___ __
+*  \  \_/  /  / _
+*   \     /  /_| |_
+*   /  _  \____   _|
+*  /__/ \__\   |_|
+*
+* @file observable.ts
+* @author Etienne Cochard
+*
+* Copyright (c) 2019-2022 R-libre ingenierie
+*
+* Permission is hereby granted, free of charge, to any person obtaining a copy
+* of this software and associated documentation files (the "Software"), to deal
+* in the Software without restriction, including without limitation the rights
+* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+* of the Software, and to permit persons to whom the Software is furnished to do so,
+* subject to the following conditions:
+* The above copyright notice and this permission notice shall be included in all copies
+* or substantial portions of the Software.
+*
+* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
+* INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
+* PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+* OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+* SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+**/
+export declare type EventCallback<T extends BasicEvent = BasicEvent> = (event: T) => any;
+export interface EventDisposer {
+    dispose(): void;
+}
+/**
+ * Basic event
+ * name like that to avoid conflict with Browsers Event class.
+ */
+export interface BasicEvent {
+    readonly type?: string;
+    readonly source?: unknown;
+    readonly context?: any;
+    propagationStopped?: boolean;
+    defaultPrevented?: boolean;
+    stopPropagation?(): void;
+    preventDefault?(): void;
+}
+/**
+ * BasicEvent Builder
+ * this function is responsable of BasicEvent creation
+ * ie. is equivalent of new BasicEvent( xxx );
+ * @param params
+ * @returns BasicEvent
+ */
+export declare function BasicEvent<T extends BasicEvent = BasicEvent>(params: any): T;
+/**
+ * Click Event
+ * click event do not have any additional parameters
+ */
+export interface EvClick extends BasicEvent {
+}
+export declare function EvClick(context?: any): EvClick;
+/**
+ * Change Event
+ * value is the the element value
+ */
+export interface EvChange extends BasicEvent {
+    readonly value: any;
+}
+export declare function EvChange(value: unknown, context?: any): EvChange;
+/**
+ * Selection Event
+ * value is the new selection or null
+ */
+export interface EvSelectionChange extends BasicEvent {
+    readonly selection: unknown;
+}
+export declare function EvSelectionChange(selection: unknown, context?: any): EvSelectionChange;
+/**
+ * ContextMenu Event
+ */
+export interface EvContextMenu extends BasicEvent {
+    uievent: UIEvent;
+}
+export declare function EvContextMenu(uievent: UIEvent, context?: any): EvContextMenu;
+/**
+ * Timer Event
+ * @see startTimer, stopTimer
+ */
+export interface EvTimer extends BasicEvent {
+    timer: string;
+    time: number;
+}
+export declare function EvTimer(timer: string, time?: number, context?: any): EvTimer;
+/**
+ * Simple message
+ */
+export interface EvMessage extends BasicEvent {
+    readonly msg: string;
+    readonly params?: any;
+}
+export declare function EvMessage(msg: string, params?: unknown, source?: unknown): EvMessage;
+/**
+ * Drag/Drop event
+ */
+export interface EvDrag extends BasicEvent {
+    element: unknown;
+    data: any;
+}
+export declare function EvDrag(element: unknown, data: any, ctx: any): EvDrag;
+/**
+ * Errors
+ */
+export interface EvError extends BasicEvent {
+    code: number;
+    message: string;
+}
+export declare function EvError(code: number, message: string): EvError;
+/**
+ * this Base interface is used to describe available events & their types
+ *
+ * you can implement your own event mapping:
+ * @example
+ * ```ts
+ * interface MyEventMap extends EventMap {
+ * 	  click: EvClick,
+ *    'custom-message': Event,
+ * 	  [key: string]: Event,
+ * }
+ * ```
+ */
+export interface EventMap {
+}
+/**
+ * basic event types, in general the type is builded from the eventMap
+ * this is very usefull for editor completion
+ * @example
+ * ```ts
+ * type MyEventType = MapEvents<MyEventMap>;
+ * ```
+ */
+export interface EventTypes {
+}
+/**
+ * convert an EventMap to a EventType
+ */
+export declare type MapEvents<Type> = {
+    [Property in keyof Type]?: (ev: Type[Property]) => any;
+};
+/**
+ * Event emitter class
+ * this class allow you to emit and handle events
+ *
+ * @example:
+ * ```ts
+ *
+ * interface EvDoIt extends BasicEvent {
+ *   param: unknown;
+ * }
+ *
+ * function EvDoIt( e: EvDoIt ) : EvDoIt {
+ *   return BasicEvent<EvDoIt>( e );
+ * }
+ *
+ * interface TestEventMap extends EventMap {
+ *	doit: EvDoIt;
+ * }
+ *
+ * let ee = new EventSource<TestEventMap>(null);
+ * ee.listen({
+ *	doit: (e) => {
+ *		console.log(e);
+ *		e.preventDefault();
+ *	},
+ * });
+ *
+ * ee.defaults({
+ *	doit: (e) => {
+ *		console.log('default handler for ', e.type, e.selection);
+ *	},
+ * })
+ *
+ * ee.on('doit', (e) => {
+ *	debugger;
+ * })
+ *
+ * const ev = EvDoIt({ param: 10 });
+ * ee.emit('change', ev);
+ * if (ev.defaultPrevented) {
+ *	console.log('prevented');
+ * }
+ * ```
+ */
+export declare class EventSource<Q extends EventMap, T extends EventTypes = MapEvents<Q>> {
+    private m_source;
+    private m_eventRegistry;
+    private m_defaultHandlers;
+    constructor(source?: unknown);
+    /**
+     * emit an event
+     * you can stop propagation of event or prevent default
+     * @param eventName - name of event to emit
+     * @param event - event data
+     */
+    emit<K extends keyof Q>(type: K, event?: Q[K]): void;
+    _emit(eventName: string, e: BasicEvent): void;
+    /**
+     * signal en event
+     * signaled event are notification : no way to prevent default not stop propagation
+     * @param eventName name of event to signal
+     * @param event event data
+     */
+    signal<K extends keyof Q>(type: K, event: Q[K], delay?: number): void;
+    _signal(eventName: string, e: BasicEvent, delay?: number): void;
+    /**
+     * handle an event one time
+     * @param eventName - event name to handle
+     * @param callback - callback to call when event is signaled
+     * @returns Promise if callback is null
+     *
+     * take care with that because if the event is never fired and you await it,
+     * the system may overflow
+     */
+    once<K extends keyof Q>(type: K, callback: (ev: Q[K]) => any): void;
+    _once(eventName: string, callback: EventCallback): Promise<unknown>;
+    /**
+     * set the event default handler
+     * @param eventName - name of the event
+     * @param callback - callback to call when the event is not handled (and preventDeault has not been called)
+     */
+    setDefaultHandler(eventName: string, callback: EventCallback): void;
+    /**
+     * remove the previous default handler installed for an event
+     * @param eventName - event name
+     * @param callback - callback handler to remove (must be the same as in setDefaultHandler)
+     */
+    removeDefaultHandler(eventName: string, callback: EventCallback): void;
+    /**
+     * define a set of listeners in one call
+     * @param events
+     */
+    listen(events: T): void;
+    /**
+     * define a set of default handlers in one call
+     * @param events
+     */
+    defaults(events: T): void;
+    /**
+     * listen for an event
+     * @param eventName - event name to listen on
+     * @param callback - callback to call
+     * @param capturing - if true, capture event before other registred event handlers
+     */
+    on<K extends keyof Q>(type: K, callback: (ev: Q[K]) => any): EventDisposer;
+    _on(eventName: string, callback: EventCallback, capturing?: boolean): EventDisposer;
+    /**
+     * stop listening to an event
+     * @param eventName - event name
+     * @param callback - callback to remove (must be the same as in on )
+     */
+    off<K extends keyof Q>(type: K, callback: (ev: Q[K]) => any): void;
+    _off(eventName: string, callback: EventCallback): void;
+    /**
+     * remove all listeners for an event
+     * @param eventName - event name
+     */
+    removeAllListeners(eventName: string | null): void;
+}