neo.mjs 6.10.4 → 6.10.5

package/src/controller/Base.mjs

@@ -21,6 +21,12 @@ class Base extends CoreBase {
          * @protected
          */
         ntype: 'controller',
+        /**
+         * If the URL does not contain a hash value when creating this controller instance,
+         * neo will set this hash value for us.
+         * @member {String|null} defaultHash=null
+         */
+        defaultHash: null,
         /**
          * @member {String|null} defaultRoute=null
          */
@@ -90,9 +96,14 @@ class Base extends CoreBase {
      *
      */
     onConstructed() {
-        let currentHash = HashHistory.first();
+        let currentHash = HashHistory.first(),
+            defaultHash = this.defaultHash;
 
-        currentHash && this.onHashChange(currentHash, null)
+        if (currentHash) {
+            this.onHashChange(currentHash, null)
+        } else if (defaultHash) {
+            Neo.Main.setRoute({value: defaultHash})
+        }
     }
 
     /**
@@ -185,7 +196,7 @@ class Base extends CoreBase {
      * @returns {Number}
      */
     #sortRoutes(route1, route2) {
-        return route1.match(amountSlashesRegex).length - route2.match(amountSlashesRegex).length
+        return (route1.match(amountSlashesRegex) || []).length - (route2.match(amountSlashesRegex)|| []).length
     }
 }
 

package/src/controller/Component.mjs

@@ -189,7 +189,7 @@ class Component extends Base {
                                 handlerScope = me.getHandlerScope(eventHandler, component);
 
                                 if (!handlerScope) {
-                                    Logger.logError('Unknown event handler for', eventHandler, component)
+                                    console.error('Unknown event handler for', eventHandler, component)
                                 } else if (handlerScope !== true) {
                                     listener.fn = handlerScope[eventHandler].bind(handlerScope)
                                 }

package/src/core/Base.mjs

@@ -189,12 +189,14 @@ class Base {
             delayable     = me.delayable ? Neo.merge({}, me.delayable, ctorDelayable) : ctorDelayable;
 
         Object.entries(delayable).forEach(([key, value]) => {
-            let map = {
-                debounce() {me[key] = new debounce(me[key], me, value.timer)},
-                throttle() {me[key] = new throttle(me[key], me, value.timer)}
-            };
+            if (value) {
+                let map = {
+                    debounce() {me[key] = new debounce(me[key], me, value.timer)},
+                    throttle() {me[key] = new throttle(me[key], me, value.timer)}
+                };
 
-            map[value.type]?.()
+                map[value.type]?.()
+            }
         })
     }
 

package/src/data/RecordFactory.mjs

@@ -68,6 +68,9 @@ class RecordFactory extends Base {
                             properties;
 
                         Object.defineProperties(me, {
+                            [Symbol.for('isRecord')]: {
+                                value: true
+                            },
                             _isModified: {
                                 value   : false,
                                 writable: true
@@ -87,9 +90,6 @@ class RecordFactory extends Base {
                                 parsedValue = instance.parseRecordValue(me, field, value, config);
 
                                 properties = {
-                                    [Symbol.for('isRecord')]: {
-                                        value: true
-                                    },
                                     [symbol]: {
                                         value   : parsedValue,
                                         writable: true

package/src/form/Container.mjs

@@ -136,6 +136,56 @@ class Container extends BaseContainer {
         return fields
     }
 
+
+    /**
+     * This function will return one of the following states:
+     * - clean      => all fields are clean (untouched)
+     * - invalid    => at least one field is invalid
+     * - valid      => all required fields are valid
+     * - inProgress => at least one field is valid, at least one field is clean
+     * @returns {Promise<String>}
+     */
+    async getFormState() {
+        let fields           = await this.getFields(),
+            i                = 0,
+            hasCleanFields   = false,
+            hasInvalidFields = false,
+            hasUncleanFields = false,
+            hasValidFields   = false,
+            len              = fields.length,
+            field, isClean, isValid;
+
+        for (; i < len; i++) {
+            field   = fields[i];
+            isClean = field.clean;
+            isValid = field.isValid();
+
+            if (!isClean && !isValid) {
+                return 'invalid'
+            } else if (isValid) {
+                hasValidFields = true
+            } else if (!isValid) {
+                hasInvalidFields = true
+            }
+
+            if (isClean) {
+                hasCleanFields = true
+            } else {
+                hasUncleanFields = true
+            }
+        }
+
+        if (!hasInvalidFields) {
+            return 'valid'
+        }
+
+        if (hasCleanFields && !hasUncleanFields) {
+            return 'clean'
+        }
+
+        return 'inProgress'
+    }
+
     /**
      * @returns {Promise<Object>}
      */

package/src/form/field/Text.mjs

@@ -703,7 +703,7 @@ class Text extends Base {
 
         me.silentVdomUpdate = true;
 
-        me.validate(false);
+        oldValue !== undefined && me.validate(me.clean);
         me.changeInputElKey('required', value ? value : null);
         me.labelText = me.labelText; // apply the optional text if needed
 
@@ -1279,7 +1279,7 @@ class Text extends Base {
             cls;
 
         if (!me.readOnly) {
-            me.validate(); // silent
+            me.validate(false);
 
             cls = me.cls; // has to get set after validate()
 

package/src/form/field/TextArea.mjs

@@ -37,6 +37,11 @@ class TextArea extends Text {
          * @member {String[]} baseCls=['neo-textarea','neo-textfield']
          */
         baseCls: ['neo-textarea', 'neo-textfield'],
+        /**
+         * True shows a clear trigger in case the field has a non-empty value.
+         * @member {Boolean} clearable=false
+         */
+        clearable: false,
         /**
          * The visible width of the text control, in average character widths.
          * If it is specified, it must be a positive integer.

package/src/main/addon/WindowPosition.mjs

@@ -13,9 +13,9 @@ class WindowPosition extends Base {
          */
         className: 'Neo.main.addon.WindowPosition',
         /**
-         * @member {Boolean} adjustWindowPositions=true
+         * @member {Boolean} adjustWindowPositions=false
          */
-        adjustWindowPositions: true,
+        adjustWindowPositions: false,
         /**
          * @member {String|null} intervalId=null
          */
@@ -25,9 +25,9 @@ class WindowPosition extends Base {
          */
         intervalTime: 20,
         /**
-         * @member {Boolean} observeResize_=true
+         * @member {Boolean} observeResize_=false
          */
-        observeResize_: true,
+        observeResize_: false,
         /**
          * Remote method access for other workers
          * @member {Object} remote
@@ -61,6 +61,12 @@ class WindowPosition extends Base {
         windows: {}
     }
 
+    /**
+     * @member {Function|null} resizeListener=null
+     * @protected
+     */
+    resizeListener = null
+
     /**
      * @param {Object} config
      */
@@ -85,9 +91,11 @@ class WindowPosition extends Base {
     afterSetObserveResize(value, oldValue) {
         let me = this;
 
-        if (value) {
-            window[value ? 'addEventListener' : 'removeEventListener']('resize', me.onResize.bind(me))
+        if (!me.resizeListener) {
+            me.resizeListener =  me.onResize.bind(me)
         }
+
+        window[value ? 'addEventListener' : 'removeEventListener']('resize', me.resizeListener)
     }
 
     /**
@@ -196,7 +204,7 @@ class WindowPosition extends Base {
     /**
      * @param {Object} event
      */
-    onResize(event) {
+    onResize(event) { console.log('onResize');
         let me  = this,
             win = window,
             height, width;
@@ -213,14 +221,16 @@ class WindowPosition extends Base {
                     break
             }
 
-            Neo.Main.windowResizeTo({
-                height    : height,
-                width     : width,
-                windowName: key
-            })
-        });
+            if (me.adjustWindowPositions) {
+                Neo.Main.windowResizeTo({
+                    height,
+                    width,
+                    windowName: key
+                });
 
-        me.adjustWindowPositions && me.adjustPositions()
+                me.adjustPositions()
+            }
+        })
     }
 
     /**

package/src/tab/Strip.mjs

@@ -44,44 +44,28 @@ class Strip extends Component {
      * @protected
      */
     afterSetUseActiveTabIndicator(value, oldValue) {
-        if (oldValue !== undefined) {
-            let me = this;
-
-            me.vdom.cn[0].removeDom = !value;
-
-            if (me.mounted && value) {
-                me.getActiveTabRectThenMove();
-            } else {
-                me.update();
-            }
-        }
+        this.vdom.cn[0].removeDom = !value;
+        this.update()
     }
 
     /**
+     * Gets the DomRect of the active tab, then moves the indicator
      * @param {Object|null} opts
      * @param {Number} opts.oldValue
      * @param {Number} opts.value
-     * Gets the DomRect of the active tab, then moves the indicator
      */
     getActiveTabRectThenMove(opts) {
         let me           = this,
-            ids          = [],
+            ids          = [me.id],
             tabContainer = me.getTabContainer();
 
-        if (me.vnode) {
-            if (opts) {
-                ids.push(tabContainer.getTabAtIndex(opts.value), tabContainer.getTabAtIndex(opts.oldValue));
-            } else {
-                ids.push(tabContainer.getTabAtIndex(tabContainer.activeIndex));
-            }
-
-            ids = ids.map(e => e?.id).filter(Boolean);
+        // We do not need a movement, in case there is no oldValue
+        if (me.useActiveTabIndicator && me.vnode && Neo.isNumber(opts?.oldValue)) {
+            ids.push(tabContainer.getTabAtIndex(opts.value).id, tabContainer.getTabAtIndex(opts.oldValue).id);
 
-            if (me.useActiveTabIndicator) {
-                me.getDomRect(ids).then(data => {
-                    me.moveActiveIndicator(data);
-                });
-            }
+            me.getDomRect(ids).then(data => {
+                me.moveActiveIndicator(data)
+            })
         }
     }
 
@@ -89,7 +73,7 @@ class Strip extends Component {
      *
      */
     getTabContainer() {
-        return Neo.getComponent(this.tabContainerId);
+        return Neo.getComponent(this.tabContainerId)
     }
 
     /**
@@ -105,8 +89,9 @@ class Strip extends Component {
      * @param {Number} rects[0].y
      */
     moveActiveIndicator(rects) {
-        let me   = this,
-            rect = rects[1] || rects[0],
+        let me           = this,
+            tabStripRect = rects.shift(),
+            rect         = rects[1] || rects[0],
             activeTabIndicator, tabContainer;
 
         if (me.useActiveTabIndicator) {
@@ -118,20 +103,20 @@ class Strip extends Component {
                 case 'top':
                     activeTabIndicator.style = {
                         height: null,
-                        left  : `${rect.left}px`,
+                        left  : `${rect.left - tabStripRect.left}px`,
                         top   : null,
                         width : `${rect.width}px`
                     };
-                    break;
+                    break
                 case 'left':
                 case 'right':
                     activeTabIndicator.style = {
                         height: `${rect.height}px`,
                         left  : null,
-                        top   : `${rect.top}px`,
+                        top   : `${rect.top - tabStripRect.top}px`,
                         width : null
                     };
-                    break;
+                    break
             }
 
             // in case there is a dynamic change (oldValue), call this method again
@@ -140,7 +125,7 @@ class Strip extends Component {
                 me.update();
 
                 setTimeout(() => {
-                    me.moveActiveIndicator([rects[0]]);
+                    me.moveActiveIndicator([tabStripRect, rects[0]])
                 }, 50)
             } else {
                 activeTabIndicator.style.opacity = 1;
@@ -148,8 +133,8 @@ class Strip extends Component {
 
                 setTimeout(() => {
                     activeTabIndicator.style.opacity = 0;
-                    me.update();
-                }, 300);
+                    me.update()
+                }, 300)
             }
         }
     }

package/src/tab/header/Button.mjs

@@ -71,26 +71,24 @@ class Button extends BaseButton {
      * @protected
      */
     afterSetUseActiveTabIndicator(value, oldValue) {
-        this.updateUseActiveTabIndicator();
+        this.updateUseActiveTabIndicator()
     }
 
     /**
      * @param {Object} data
      */
     showRipple(data) {
-        !this.pressed && super.showRipple(data);
+        !this.pressed && super.showRipple(data)
     }
 
     /**
      * @param {Boolean} silent=false
      */
     updateUseActiveTabIndicator(silent=false) {
-        let me   = this,
-            vdom = me.vdom;
-
-        vdom.cn[4].removeDom = !me.useActiveTabIndicator;
+        let me = this;
 
-        me[silent ? '_vdom' : 'vdom'] = vdom;
+        me.vdom.cn[4].removeDom = !me.useActiveTabIndicator;
+        !silent && me.update()
     }
 }
 

package/src/worker/Base.mjs

@@ -112,10 +112,8 @@ class Base extends CoreBase {
     onConnect(data) {
         // short delay to ensure app VCs are in place
         setTimeout(() => {
-            this.fire('connect', {
-                appName: data.appName
-            });
-        }, 10);
+            this.fire('connect', {appName: data.appName})
+        }, 10)
     }
 
     /**
@@ -129,9 +127,10 @@ class Base extends CoreBase {
         me.isConnected = true;
 
         me.ports.push({
-            appName: null,
+            appName : null,
             id,
-            port   : e.ports[0]
+            port    : e.ports[0],
+            windowId: null
         });
 
         me.ports[me.ports.length - 1].port.onmessage = me.onMessage.bind(me);
@@ -141,7 +140,7 @@ class Base extends CoreBase {
 
         me.sendMessage('main', {action: 'workerConstructed', port: id});
 
-        me.afterConnect();
+        me.afterConnect()
     }
 
     /**
@@ -154,7 +153,7 @@ class Base extends CoreBase {
 
         if (!me.isSharedWorker) {
             me.sendMessage('main', {action: 'workerConstructed'});
-            me.afterConnect();
+            me.afterConnect()
         }
     }
 
@@ -163,9 +162,7 @@ class Base extends CoreBase {
      * @param {Object} data
      */
     onDisconnect(data) {
-        this.fire('disconnect', {
-            appName: data.appName
-        });
+        this.fire('disconnect', {appName: data.appName})
     }
 
     /**
@@ -186,12 +183,12 @@ class Base extends CoreBase {
             me['on' + Neo.capitalize(action)](data);
         } else if (promise = action === 'reply' && me.promises[replyId]) {
             if (data.reject) {
-                promise.reject(data.data);
+                promise.reject(data.data)
             } else {
-                promise.resolve(data.data);
+                promise.resolve(data.data)
             }
 
-            delete me.promises[replyId];
+            delete me.promises[replyId]
         }
     }
 
@@ -199,9 +196,7 @@ class Base extends CoreBase {
      * @param {Object} msg
      */
     onPing(msg) {
-        this.resolve(msg, {
-            originMsg: msg
-        });
+        this.resolve(msg, {originMsg: msg})
     }
 
     /**
@@ -217,8 +212,8 @@ class Base extends CoreBase {
         for (port of me.ports) {
             if (!port.appName) {
                 port.appName = appName;
-                me.onConnect({ appName });
-                break;
+                me.onConnect({appName});
+                break
             }
         }
     }
@@ -228,7 +223,19 @@ class Base extends CoreBase {
      */
     onRegisterNeoConfig(msg) {
         Neo.config = Neo.config || {};
-        Object.assign(Neo.config, msg.data);
+
+        let me         = this,
+            {windowId} = msg.data,
+            port;
+
+        for (port of me.ports) {
+            if (!port.windowId) {
+                port.windowId = windowId;
+                break
+            }
+        }
+
+        Object.assign(Neo.config, msg.data)
     }
 
     /**
@@ -246,12 +253,12 @@ class Base extends CoreBase {
             let message = me.sendMessage(dest, opts, transfer),
                 msgId   = message.id;
 
-            me.promises[msgId] = { reject, resolve };
-        });
+            me.promises[msgId] = { reject, resolve }
+        })
     }
 
     /**
-     * @param {String} dest app, data, main or vdom (excluding the current worker)
+     * @param {String} dest app, canvas, data, main or vdom (excluding the current worker)
      * @param {Object} opts configs for Neo.worker.Message
      * @param {Array} [transfer] An optional array of Transferable objects to transfer ownership of.
      * If the ownership of an object is transferred, it becomes unusable (neutered) in the context it was sent from
@@ -268,24 +275,29 @@ class Base extends CoreBase {
         if (me.channelPorts[dest]) {
             port = me.channelPorts[dest];
         } else if (!me.isSharedWorker) {
-            port = globalThis;
+            port = globalThis
         } else {
             if (opts.port) {
-                port = me.getPort({id: opts.port}).port;
-            } else if (opts.appName) {
+                port = me.getPort({id: opts.port}).port
+            } else if (opts.windowId) {
+                portObject = me.getPort({windowId: opts.windowId});
+                port       = portObject.port;
+
+                opts.port = portObject.id
+            }  else if (opts.appName) {
                 portObject = me.getPort({appName: opts.appName});
                 port       = portObject.port;
 
-                opts.port = portObject.id;
+                opts.port = portObject.id
             } else {
-                port = me.ports[0].port;
+                port = me.ports[0].port
             }
         }
 
         message = new Message(opts);
 
         port.postMessage(message, transfer);
-        return message;
+        return message
     }
 }
 

package/src/worker/Manager.mjs

@@ -6,7 +6,8 @@ import Observable         from '../core/Observable.mjs';
 import RemoteMethodAccess from './mixin/RemoteMethodAccess.mjs';
 
 const NeoConfig = Neo.config,
-      devMode   = NeoConfig.environment === 'development';
+      devMode   = NeoConfig.environment === 'development',
+      windowId  = new Date().getTime();
 
 /**
  * The worker manager lives inside the main thread and creates the App, Data & VDom worker.
@@ -207,8 +208,8 @@ class Manager extends Base {
 
             me.sendMessage(key, {
                 action: 'registerNeoConfig',
-                data  : config
-            });
+                data  : {...config, windowId}
+            })
         }
     }
 

package/src/worker/mixin/RemoteMethodAccess.mjs

@@ -18,6 +18,15 @@ class RemoteMethodAccess extends Base {
         mixin: true
     }
 
+    /**
+     * @param {Object} source
+     * @param {Object} target
+     */
+    assignPort(source, target) {
+        const {appName, port, windowId} = source;
+        Object.assign(target, {appName, port, windowId})
+    }
+
     /**
      * @param {Object} remote
      * @param method
@@ -36,10 +45,7 @@ class RemoteMethodAccess extends Base {
                 remoteMethod   : method
             };
 
-            if (me.isSharedWorker) {
-                opts.appName = data?.appName;
-                opts.port    = data?.port;
-            }
+            me.isSharedWorker && me.assignPort(data, opts);
 
             return me.promiseMessage(origin, opts, buffer);
         }
@@ -109,19 +115,17 @@ class RemoteMethodAccess extends Base {
      * @param {Object} data
      */
     reject(msg, data) {
-        let opts = {
+        let me = this,
+
+        opts = {
             action : 'reply',
             data,
             reject : true,
             replyId: msg.id
         };
 
-        if (this.isSharedWorker) {
-            opts.appName = msg.appName;
-            opts.port    = msg.port;
-        }
-
-        this.sendMessage(msg.origin, opts);
+        me.isSharedWorker && me.assignPort(msg, opts);
+        me.sendMessage(msg.origin, opts);
     }
 
     /**
@@ -130,18 +134,16 @@ class RemoteMethodAccess extends Base {
      * @param {Object} data
      */
     resolve(msg, data) {
-        let opts = {
+        let me = this,
+
+        opts = {
             action : 'reply',
             data,
             replyId: msg.id
         };
 
-        if (this.isSharedWorker) {
-            opts.appName = msg.appName;
-            opts.port    = msg.port;
-        }
-
-        this.sendMessage(msg.origin, opts);
+        me.isSharedWorker && me.assignPort(msg, opts);
+        me.sendMessage(msg.origin, opts);
     }
 }
 

package/apps/learnneo/app.mjs

@@ -1,6 +0,0 @@
-import Viewport from './view/Viewport.mjs';
-
-export const onStart = () => Neo.app({
-    mainView: Viewport,
-    name    : 'LearnNeo'
-})