neo.mjs 8.14.2 → 8.14.3

package/apps/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='8.14.2'
+         * @member {String} version='8.14.3'
          */
-        version: '8.14.2'
+        version: '8.14.3'
     }
 
     /**

package/apps/portal/view/home/FooterContainer.mjs

@@ -107,7 +107,7 @@ class FooterContainer extends Container {
             }, {
                 module: Component,
                 cls   : ['neo-version'],
-                html  : 'v8.14.2'
+                html  : 'v8.14.3'
             }]
         }],
         /**

package/examples/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='8.14.2'
+         * @member {String} version='8.14.3'
          */
-        version: '8.14.2'
+        version: '8.14.3'
     }
 
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "neo.mjs",
-    "version": "8.14.2",
+    "version": "8.14.3",
     "description": "The webworkers driven UI framework",
     "type": "module",
     "repository": {

package/src/DefaultConfig.mjs

@@ -262,12 +262,12 @@ const DefaultConfig = {
     useVdomWorker: true,
     /**
      * buildScripts/injectPackageVersion.mjs will update this value
-     * @default '8.14.2'
+     * @default '8.14.3'
      * @memberOf! module:Neo
      * @name config.version
      * @type String
      */
-    version: '8.14.2'
+    version: '8.14.3'
 };
 
 Object.assign(DefaultConfig, {

package/src/container/Base.mjs

@@ -272,11 +272,11 @@ class Container extends Component {
 
                 item.reference = ref;
                 result.push(item);
-                hasWeight ||= ('weight' in item);
+                hasWeight ||= ('weight' in item)
             }
 
             if (hasWeight) {
-                result.sort(byWeight);
+                result.sort(byWeight)
             }
 
             value = result
@@ -413,7 +413,9 @@ class Container extends Component {
 
         // We need to add items into the vdom
         me.updateDepth = -1;
-        me.update()
+        me.update();
+
+        me.fire('itemsCreated', {id: me.id, items})
     }
 
     /**

package/src/draggable/toolbar/DragZone.mjs

@@ -36,8 +36,13 @@ class DragZone extends BaseDragZone {
             {'drag:start': me.onDragStart, ...opts}
         ]);
 
-        owner.on('insert', me.onItemInsert, me);
+        owner.on({
+            insert      : me.onItemInsert,
+            itemsCreated: me.onItemsCreated,
+            scope       : me
+        });
 
+        // The toolbar items can already be created
         me.adjustToolbarItemCls(true)
     }
 
@@ -98,16 +103,25 @@ class DragZone extends BaseDragZone {
     }
 
     /**
-     * @param {Object} data
-     * @param {Number} data.index
+     * @param {Object}             data
+     * @param {Number}             data.index
      * @param {Neo.component.Base} data.item
      */
     onItemInsert(data) {
-        let {item} = data,
-            cls    = item.cls || [];
+        let {item}     = data,
+            wrapperCls = item.wrapperCls || [];
+
+        NeoArray.add(wrapperCls, 'neo-draggable');
+        item.wrapperCls = wrapperCls
+    }
 
-        NeoArray.add(cls, 'neo-draggable');
-        item.cls = cls
+    /**
+     * @param {Object}               data
+     * @param {String}               data.id
+     * @param {Neo.component.Base[]} data.items
+     */
+    onItemsCreated(data) {console.log('onItemsCreated');
+        this.adjustToolbarItemCls(true)
     }
 }
 

package/src/draggable/toolbar/SortZone.mjs

@@ -61,6 +61,14 @@ class SortZone extends DragZone {
          * @protected
          */
         reversedLayoutDirection: false,
+        /**
+         * @member {Number} scrollLeft=0
+         */
+        scrollLeft: 0,
+        /**
+         * @member {Number} scrollTop=0
+         */
+        scrollTop: 0,
         /**
          * Internal flag: onDragStart() will set the value to horizontal or vertical, depending on the current layout.
          * @member {String} sortDirection='horizontal'
@@ -142,35 +150,38 @@ class SortZone extends DragZone {
      * @param {Object} data
      */
     onDragMove(data) {
-        if (this.itemRects) { // the method can trigger before we got the client rects from the main thread
-            let me          = this,
-                moveFactor  = 0.55, // we can not use 0.5, since items would jump back & forth
-                index       = me.currentIndex,
-                {itemRects} = me,
-                maxItems    = itemRects.length - 1,
-                reversed    = me.reversedLayoutDirection,
-                delta, itemWidth;
-
-            if (me.sortDirection === 'horizontal') {
-                delta     = data.clientX - me.offsetX - itemRects[index].left;
-                itemWidth = 'width'
-            } else {
-                delta     = data.clientY - me.offsetY - itemRects[index].top;
-                itemWidth = 'height'
-            }
+        // the method can trigger before we got the client rects from the main thread
+        if (!this.itemRects) {
+            return
+        }
 
-            if (index > 0 && (!reversed && delta < 0 || reversed && delta > 0)) {
-                if (Math.abs(delta) > itemRects[index - 1][itemWidth] * moveFactor) {
-                    me.currentIndex--;
-                    me.switchItems(index, me.currentIndex)
-                }
+        let me          = this,
+            moveFactor  = 0.55, // we can not use 0.5, since items would jump back & forth
+            index       = me.currentIndex,
+            {itemRects} = me,
+            maxItems    = itemRects.length - 1,
+            reversed    = me.reversedLayoutDirection,
+            delta, itemWidth;
+
+        if (me.sortDirection === 'horizontal') {
+            delta     = data.clientX + me.scrollLeft - me.offsetX - itemRects[index].left;
+            itemWidth = 'width'
+        } else {
+            delta     = data.clientY + me.scrollTop  - me.offsetY - itemRects[index].top;
+            itemWidth = 'height'
+        }
+
+        if (index > 0 && (!reversed && delta < 0 || reversed && delta > 0)) {
+            if (Math.abs(delta) > itemRects[index - 1][itemWidth] * moveFactor) {
+                me.currentIndex--;
+                me.switchItems(index, me.currentIndex)
             }
+        }
 
-            else if (index < maxItems && (!reversed && delta > 0 || reversed && delta < 0)) {
-                if (Math.abs(delta) > itemRects[index + 1][itemWidth] * moveFactor) {
-                    me.currentIndex++;
-                    me.switchItems(index, me.currentIndex)
-                }
+        else if (index < maxItems && (!reversed && delta > 0 || reversed && delta < 0)) {
+            if (Math.abs(delta) > itemRects[index + 1][itemWidth] * moveFactor) {
+                me.currentIndex++;
+                me.switchItems(index, me.currentIndex)
             }
         }
     }

package/src/grid/Container.mjs

@@ -506,8 +506,11 @@ class GridContainer extends BaseContainer {
     /**
      * @param {Object} data
      */
-    onScroll(data) {
-        this.view.scrollPosition = {x: data.scrollLeft, y: this.view.scrollPosition.y}
+    onScroll({scrollLeft}) {
+        let me = this;
+
+        me.headerToolbar.scrollLeft = scrollLeft;
+        me.view.scrollPosition = {x: scrollLeft, y: me.view.scrollPosition.y}
     }
 
     /**

package/src/grid/header/Toolbar.mjs

@@ -34,6 +34,10 @@ class Toolbar extends BaseToolbar {
          * @member {String} role='row'
          */
         role: 'row',
+        /**
+         * @member {Number} scrollLeft_=0
+         */
+        scrollLeft_: 0,
         /**
          * @member {Boolean} showHeaderFilters_=false
          */
@@ -62,13 +66,14 @@ class Toolbar extends BaseToolbar {
 
         if (value && !me.sortZone) {
             import('../../draggable/grid/header/toolbar/SortZone.mjs').then(module => {
-                let {appName, id, windowId} = me;
+                let {appName, id, scrollLeft, windowId} = me;
 
                 me.sortZone = Neo.create({
                     module             : module.default,
                     appName,
                     boundaryContainerId: id,
                     owner              : me,
+                    scrollLeft,
                     windowId,
                     ...me.sortZoneConfig
                 })
@@ -108,6 +113,18 @@ class Toolbar extends BaseToolbar {
         }
     }
 
+    /**
+     * Triggered after the scrollLeft config got changed
+     * @param {Number} value
+     * @param {Number} oldValue
+     * @protected
+     */
+    afterSetScrollLeft(value, oldValue) {
+        if (oldValue !== undefined && this.sortZone) {
+            this.sortZone.scrollLeft = value
+        }
+    }
+
     /**
      * Triggered after the sortable config got changed
      * @param {Boolean} value

package/src/main/DomAccess.mjs

@@ -932,19 +932,19 @@ class DomAccess extends Base {
 
     /**
      * @param {Object} data
-     * @param {String} data.direction left, top
+     * @param {String} data.direction='top' left, top
      * @param {String} data.id
      * @param {Number} data.value
      * @returns {Object} obj.id => the passed id
      */
-    scrollTo(data) {
-        let node = this.getElement(data.id);
+    scrollTo({direction='top', id, value}) {
+        let node = this.getElement(id);
 
         if (node) {
-            node[`scroll${Neo.capitalize(data.direction)}`] = data.value
+            node[`scroll${Neo.capitalize(direction)}`] = value
         }
 
-        return {id: data.id}
+        return {id}
     }
 
     /**