neo.mjs 8.12.0 → 8.14.0

package/src/grid/View.mjs

@@ -57,11 +57,6 @@ class GridView extends Component {
          * @member {String} colspanField='colspan'
          */
         colspanField: 'colspan',
-        /**
-         * @member {String|null} containerId=null
-         * @protected
-         */
-        containerId: null,
         /**
          * Internal flag. Gets calculated after mounting grid.View rows
          * @member {Number} containerWidth_=0
@@ -139,13 +134,6 @@ class GridView extends Component {
      */
     scrollTimeoutId = null
 
-    /**
-     * @member {Neo.grid.Container|null} gridContainer
-     */
-    get gridContainer() {
-        return Neo.getComponent(this.containerId)
-    }
-
     /**
      * @member {String[]} selectedRows
      */
@@ -381,13 +369,14 @@ class GridView extends Component {
      * @param {Object} data
      * @param {String} [data.cellId]
      * @param {Object} data.column
+     * @param {Number} data.columnIndex
      * @param {Neo.grid.Container} data.gridContainer
-     * @param {Number} data.index
      * @param {Object} data.record
+     * @param {Number} data.rowIndex
      * @returns {Object}
      */
     applyRendererOutput(data) {
-        let {cellId, column, gridContainer, index, record} = data,
+        let {cellId, column, columnIndex, gridContainer, record, rowIndex} = data,
             me          = this,
             cellCls     = ['neo-grid-cell'],
             colspan     = record[me.colspanField],
@@ -401,10 +390,11 @@ class GridView extends Component {
 
         rendererOutput = column.renderer.call(column.rendererScope || gridContainer, {
             column,
+            columnIndex,
             dataField,
             gridContainer,
-            index,
             record,
+            rowIndex,
             value: fieldValue
         });
 
@@ -447,7 +437,7 @@ class GridView extends Component {
         }
 
         cellConfig = {
-            'aria-colindex': index + 1, // 1 based
+            'aria-colindex': columnIndex + 1, // 1 based
             id             : cellId,
             cls            : cellCls,
             role           : 'gridcell',
@@ -494,11 +484,12 @@ class GridView extends Component {
             rowIndex = this.store.indexOf(record)
         }
 
-        let me       = this,
-            {bufferColumnRange, gridContainer, selectedRows, visibleColumns} = me,
-            columns  = gridContainer.items[0].items,
-            id       = me.getRowId(record, rowIndex),
-            trCls    = me.getTrClass(record, rowIndex),
+        let me            = this,
+            {bufferColumnRange, selectedRows, visibleColumns} = me,
+            gridContainer = me.parent,
+            columns       = gridContainer.headerToolbar.items,
+            id            = me.getRowId(record, rowIndex),
+            trCls         = me.getTrClass(record, rowIndex),
             config, column, endIndex, gridRow, i, startIndex;
 
         if (rowIndex % 2 !== 0) {
@@ -511,10 +502,7 @@ class GridView extends Component {
 
         if (selectedRows?.includes(id)) {
             trCls.push('neo-selected');
-
-            gridContainer.fire('select', {
-                record
-            })
+            gridContainer.fire('select', {record})
         }
 
         gridRow = {
@@ -535,7 +523,7 @@ class GridView extends Component {
 
         for (i=startIndex; i <= endIndex; i++) {
             column = columns[i];
-            config = me.applyRendererOutput({column, gridContainer, index: rowIndex, record});
+            config = me.applyRendererOutput({column, columnIndex: i, gridContainer, record, rowIndex});
 
             if (column.dock) {
                 config.cls = ['neo-locked', ...config.cls || []]
@@ -603,7 +591,7 @@ class GridView extends Component {
             dataField = me.getCellDataField(id),
             record    = me.getRecord(id);
 
-        me.gridContainer.fire(eventName, {data, dataField, record, view: me})
+        me.parent.fire(eventName, {data, dataField, record, view: me})
     }
 
     /**
@@ -615,7 +603,7 @@ class GridView extends Component {
             id     = data.currentTarget,
             record = me.getRecord(id);
 
-        me.gridContainer.fire(eventName, {data, record, view: me})
+        me.parent.fire(eventName, {data, record, view: me})
     }
 
     /**
@@ -642,10 +630,9 @@ class GridView extends Component {
      * @returns {Object|Number|null}
      */
     getColumn(field, returnIndex=false) {
-        let {gridContainer} = this,
-            columns         = gridContainer.headerToolbar.items,
-            i               = 0,
-            len             = columns.length,
+        let columns = this.parent.headerToolbar.items,
+            i       = 0,
+            len     = columns.length,
             column;
 
         for (; i < len; i++) {
@@ -659,6 +646,35 @@ class GridView extends Component {
         return null
     }
 
+    /**
+     * Get all painted column cells (visible + buffer range)
+     * @param {String} dataField
+     * @returns {Object[]}
+     */
+    getColumnCells(dataField) {
+        let me       = this,
+            cells    = [],
+            vdomRoot = me.getVdomRoot(),
+            firstRow = vdomRoot.cn[0],
+            i        = 0,
+            len      = firstRow.cn.length,
+            columnIndex;
+
+        // Columns might get moved via drag&drop, so let's check for the current match
+        for (; i < len; i++) {
+            if (dataField === me.getDataField(firstRow.cn[i].id)) {
+                columnIndex = i;
+                break;
+            }
+        }
+
+        vdomRoot.cn.forEach(row => {
+            cells.push(row.cn[columnIndex])
+        });
+
+        return cells
+    }
+
     /**
      * @param {String} cellId
      * @returns {String}
@@ -817,17 +833,16 @@ class GridView extends Component {
      * @param {Object} opts.record
      */
     onStoreRecordChange({fields, record}) {
-        let me               = this,
-            fieldNames       = fields.map(field => field.name),
-            needsUpdate      = false,
-            {gridContainer}  = me,
-            {selectionModel} = gridContainer.view,
-            {vdom}           = me,
-            cellId, cellNode, cellStyle, cellVdom, column, index;
+        let me                     = this,
+            fieldNames             = fields.map(field => field.name),
+            needsUpdate            = false,
+            gridContainer          = me.parent,
+            rowIndex               = me.store.indexOf(record),
+            {selectionModel, vdom} = me,
+            cellId, cellNode, cellStyle, cellVdom, column, columnIndex;
 
         if (fieldNames.includes(me.colspanField)) {
-            index = me.store.indexOf(record);
-            me.vdom.cn[index] = me.createRow({record, rowIndex: index});
+            me.vdom.cn[rowIndex] = me.createRow({record, rowIndex});
             me.update()
         } else {
             fields.forEach(field => {
@@ -843,8 +858,8 @@ class GridView extends Component {
                     if (cellNode?.vdom) {
                         cellStyle   = cellNode.vdom.style;
                         column      = me.getColumn(field.name);
-                        index       = cellNode.index;
-                        cellVdom    = me.applyRendererOutput({cellId, column, gridContainer, index, record});
+                        columnIndex = cellNode.index;
+                        cellVdom    = me.applyRendererOutput({cellId, column, columnIndex, gridContainer, record, rowIndex});
                         needsUpdate = true;
 
                         // The cell-positioning logic happens outside applyRendererOutput()
@@ -854,7 +869,7 @@ class GridView extends Component {
                             width: cellStyle.width
                         });
 
-                        cellNode.parentNode.cn[index] = cellVdom
+                        cellNode.parentNode.cn[columnIndex] = cellVdom
                     }
                 }
             })

package/src/grid/header/Button.mjs

@@ -228,13 +228,14 @@ class Button extends BaseButton {
     }
 
     /**
-     * @param {Object} data
-     * @param {Neo.button.Base} data.column
-     * @param {String} data.dataField
+     * @param {Object}             data
+     * @param {Neo.button.Base}    data.column
+     * @param {Number}             data.columnIndex
+     * @param {String}             data.dataField
      * @param {Neo.grid.Container} data.gridContainer
-     * @param {Number} data.index
-     * @param {Object} data.record
-     * @param {Number|String} data.value
+     * @param {Object}             data.record
+     * @param {Number}             data.rowIndex
+     * @param {Number|String}      data.value
      * @returns {*}
      */
     cellRenderer(data) {

package/src/grid/header/Toolbar.mjs

@@ -1,5 +1,4 @@
 import BaseToolbar from '../../toolbar/Base.mjs';
-import NeoArray    from '../../util/Array.mjs';
 
 /**
  * @class Neo.grid.header.Toolbar
@@ -25,10 +24,6 @@ class Toolbar extends BaseToolbar {
          * @member {Boolean} draggable_=true
          */
         draggable_: true,
-        /**
-         * @member {Neo.grid.Container|null} gridContainer=null
-         */
-        gridContainer: null,
         /**
          * @member {Object} itemDefaults={ntype: 'grid-header-button'}
          */
@@ -188,9 +183,10 @@ class Toolbar extends BaseToolbar {
      */
     async passSizeToView(silent=false) {
         let me              = this,
-            rects           = await me.getDomRect(me.items.map(item => item.id)),
+            {items}         = me,
+            rects           = await me.getDomRect(items.map(item => item.id)),
             lastItem        = rects[rects.length - 1],
-            columnPositions = rects.map(item => ({width: item.width, x: item.x - rects[0].x})),
+            columnPositions = rects.map((item, index) => ({dataField: items[index].dataField, width: item.width, x: item.x - rects[0].x})),
             i               = 1,
             len             = columnPositions.length,
             layoutFinished  = true;
@@ -208,7 +204,7 @@ class Toolbar extends BaseToolbar {
             await me.timeout(100);
             await me.passSizeToView(silent)
         } else {
-            me.gridContainer.view[silent ? 'setSilent' : 'set']({
+            me.parent.view[silent ? 'setSilent' : 'set']({
                 availableWidth: lastItem.x + lastItem.width - rects[0].x,
                 columnPositions
             })

package/src/main/DomAccess.mjs

@@ -576,7 +576,7 @@ class DomAccess extends Base {
      * Include a script into the document.head
      * You can add more attributes if needed. See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script
      * @param {String} src
-     * @param {Object} opts=defer:true}
+     * @param {Object} opts={defer:true}
      * @param {Boolean} [opts.async]
      * @param {Boolean} [opts.defer]
      * @returns {Promise<unknown>}

package/src/main/addon/AmCharts.mjs

@@ -28,15 +28,15 @@ class AmCharts extends Base {
          */
         dataMap: {},
         /**
-         * @member {String} downloadPath='https//www.amcharts.com/lib/4/'
+         * @member {String} downloadPath='https//cdn.amcharts.com/lib/4/'
          * @protected
          */
-        downloadPath: 'https://www.amcharts.com/lib/4/',
+        downloadPath: 'https://cdn.amcharts.com/lib/4/',
         /**
-         * @member {String} fallbackPath='https://neomjs.github.io/pages/resources_pub/amCharts/'
+         * @member {String} fallbackPath='https://raw.githubusercontent.com/neomjs/pages/main/resources_pub/amCharts'
          * @protected
          */
-        fallbackPath: 'https://neomjs.github.io/pages/resources_pub/amCharts/',
+        fallbackPath: 'https://raw.githubusercontent.com/neomjs/pages/main/resources_pub/amCharts/',
         /**
          * Remote method access for other workers
          * @member {Object} remote
@@ -51,7 +51,13 @@ class AmCharts extends Base {
                 'setProperty',
                 'updateData'
             ]
-        }
+        },
+        /**
+         * Enforce using the fallbackPath
+         * @member {Boolean} useFallbackPath=false
+         * @protected
+         */
+        useFallbackPath: false
     }
 
     /**
@@ -187,8 +193,19 @@ class AmCharts extends Base {
      * @param {Boolean} useFallback=false
      */
     loadFiles(useFallback=false) {
-        let me       = this,
-            basePath = useFallback ? me.fallbackPath : me.downloadPath;
+        let me              = this,
+            useFallbackPath = me.useFallbackPath || useFallback,
+            basePath;
+
+        if (useFallbackPath && Neo.config.isGitHubPages) {
+            basePath = '../../../../resources_pub/amCharts/';
+
+            if (Neo.config.environment !== 'development') {
+                basePath = `../../${basePath}`
+            }
+        } else {
+            basePath = useFallbackPath ? me.fallbackPath : me.downloadPath
+        }
 
         me.isLoading = true;
 
@@ -203,8 +220,10 @@ class AmCharts extends Base {
                 me.isReady   = true
             })
         }).catch(e => {
-            console.log('Download from amcharts.com failed, switching to fallback', e);
-            me.loadFiles(true)
+            if (!useFallback && !me.useFallbackPath) {
+                console.log('Download from amcharts.com failed, switching to fallback', e);
+                me.loadFiles(true)
+            }
         })
     }
 

package/src/main/mixin/DeltaUpdates.mjs

@@ -115,18 +115,24 @@ class DeltaUpdates extends Base {
      * @param {String} delta.index
      * @param {String} delta.parentId
      */
-    du_moveNode(delta) {
-        let {index}    = delta,
-            node       = this.getElement(delta.id),
-            parentNode = this.getElement(delta.parentId);
+    du_moveNode({id, index, parentId}) {
+        let node       = this.getElement(id),
+            parentNode = this.getElement(parentId),
+            currentNode;
 
         if (node && parentNode) {
             if (index >= parentNode.children.length) {
                 parentNode.appendChild(node)
             } else {
-                //index++; // todo?: increase the index in case same parent, oldIndex < newIndex, direct swap
-                if (node && parentNode.children[index].id !== delta.id) {
-                    parentNode.insertBefore(node, parentNode.children[index])
+                currentNode = parentNode.children[index];
+
+                if (node && currentNode.id !== id) {
+                    // Check for a direct swap OP
+                    if (node === currentNode.nextElementSibling) {
+                        node.replaceWith(currentNode)
+                    }
+
+                    parentNode.insertBefore(node, currentNode)
                 }
             }
         }

package/src/selection/grid/RowModel.mjs

@@ -1,5 +1,4 @@
 import BaseModel from './BaseModel.mjs';
-import VDomUtil  from '../../util/VDom.mjs';
 
 /**
  * @class Neo.selection.grid.RowModel
@@ -30,7 +29,7 @@ class RowModel extends BaseModel {
     addDomListener() {
         let me = this;
 
-        me.view.gridContainer.on('rowClick', me.onRowClick, me)
+        me.view.parent.on('rowClick', me.onRowClick, me)
     }
 
     /**
@@ -39,11 +38,19 @@ class RowModel extends BaseModel {
     destroy(...args) {
         let me = this;
 
-        me.view.gridContainer.un('rowClick', me.onRowClick, me);
+        me.view.parent.un('rowClick', me.onRowClick, me);
 
         super.destroy(...args)
     }
 
+    /**
+     * @param {Record} record
+     * @returns {Boolean}
+     */
+    hasAnnotations(record) {
+        return !!Object.getOwnPropertyDescriptor(record.__proto__, this.view.selectedRecordField)
+    }
+
     /**
      * @param {Object} data
      */
@@ -65,28 +72,31 @@ class RowModel extends BaseModel {
         let me           = this,
             {view}       = me,
             {store}      = view,
+            countRecords = store.getCount(),
             currentIndex = 0,
-            newIndex, newRecord, rowId;
+            newIndex, record, rowId;
 
         if (me.hasSelection()) {
             currentIndex = store.indexOf(view.getRecordByRowId(me.items[0]))
         }
 
-        newIndex = (currentIndex + step) % store.getCount();
+        newIndex = (currentIndex + step) % countRecords;
 
         while (newIndex < 0) {
-            newIndex += store.getCount()
+            newIndex += countRecords
         }
 
-        newRecord = store.getAt(newIndex);
-        rowId     = view.getRowId(newRecord);
+        record = store.getAt(newIndex);
 
-        if (rowId) {
-            me.select(rowId);
+        if (me.hasAnnotations(record)) {
+            me.updateAnnotations(record)
+        } else {
+            rowId = view.getRowId(record);
 
-            view.fire('select', {
-                record: store.getAt(newIndex)
-            })
+            if (rowId) {
+                me.select(rowId);
+                view.fire('select', {record})
+            }
         }
     }
 
@@ -100,16 +110,19 @@ class RowModel extends BaseModel {
             isSelected, record;
 
         if (id) {
-            me.toggleSelection(id);
+            record = view.getRecord(id);
+
+            if (me.hasAnnotations(record)) {
+                me.updateAnnotations(record)
+            } else {
+                me.toggleSelection(id);
 
-            isSelected = me.isSelected(id);
-            record     = view.getRecord(id);
+                isSelected = me.isSelected(id);
 
-            !isSelected && view.onDeselect?.(record);
+                !isSelected && view.onDeselect?.(record);
 
-            view.fire(isSelected ? 'select' : 'deselect', {
-                record
-            })
+                view.fire(isSelected ? 'select' : 'deselect', {record})
+            }
         }
     }
 
@@ -140,6 +153,32 @@ class RowModel extends BaseModel {
 
         super.unregister()
     }
+
+    /**
+     * @param {Record} record
+     */
+    updateAnnotations(record) {
+        let me               = this,
+            {view}           = me,
+            rowId            = view.getRowId(record),
+            isSelected       = me.isSelected(rowId),
+            annotationsField = view.selectedRecordField;
+
+        if (me.singleSelect) {
+            if (isSelected) {
+                record[annotationsField] = false
+            } else {
+                me.items.forEach(rowId => {
+                    // We can use setSilent(), since the last change will trigger a view update
+                    view.getRecordByRowId(rowId).setSilent({[annotationsField]: false})
+                });
+
+                record[annotationsField] = true
+            }
+        } else {
+            record[annotationsField] = !record[annotationsField]
+        }
+    }
 }
 
 export default Neo.setupClass(RowModel);

package/src/selection/table/RowModel.mjs

@@ -23,6 +23,14 @@ class RowModel extends BaseModel {
         cls: 'neo-selection-rowmodel'
     }
 
+    /**
+     * @param {Record} record
+     * @returns {Boolean}
+     */
+    hasAnnotations(record) {
+        return !!Object.getOwnPropertyDescriptor(record.__proto__, this.view.selectedRecordField)
+    }
+
     /**
      *
      */
@@ -64,28 +72,31 @@ class RowModel extends BaseModel {
         let me           = this,
             {view}       = me,
             {store}      = view,
+            countRecords = store.getCount(),
             currentIndex = 0,
-            newIndex, newRecord, rowId;
+            newIndex, record, rowId;
 
         if (me.hasSelection()) {
             currentIndex = store.indexOf(view.getRecordByRowId(me.items[0]))
         }
 
-        newIndex = (currentIndex + step) % store.getCount();
+        newIndex = (currentIndex + step) % countRecords;
 
         while (newIndex < 0) {
-            newIndex += store.getCount()
+            newIndex += countRecords
         }
 
-        newRecord = store.getAt(newIndex);
-        rowId     = view.getRowId(newRecord);
+        record = store.getAt(newIndex);
 
-        if (rowId) {
-            me.select(rowId);
+        if (me.hasAnnotations(record)) {
+            me.updateAnnotations(record)
+        } else {
+            rowId = view.getRowId(record);
 
-            view.fire('select', {
-                record: store.getAt(newIndex)
-            })
+            if (rowId) {
+                me.select(rowId);
+                view.fire('select', {record})
+            }
         }
     }
 
@@ -99,16 +110,19 @@ class RowModel extends BaseModel {
             isSelected, record;
 
         if (id) {
-            me.toggleSelection(id);
+            record = view.getRecord(id);
+
+            if (me.hasAnnotations(record)) {
+                me.updateAnnotations(record)
+            } else {
+                me.toggleSelection(id);
 
-            isSelected = me.isSelected(id);
-            record     = view.getRecord(id);
+                isSelected = me.isSelected(id);
 
-            !isSelected && view.onDeselect?.(record);
+                !isSelected && view.onDeselect?.(record);
 
-            view.fire(isSelected ? 'select' : 'deselect', {
-                record
-            })
+                view.fire(isSelected ? 'select' : 'deselect', {record})
+            }
         }
     }
 
@@ -139,6 +153,32 @@ class RowModel extends BaseModel {
 
         super.unregister()
     }
+
+    /**
+     * @param {Record} record
+     */
+    updateAnnotations(record) {
+        let me               = this,
+            {view}           = me,
+            rowId            = view.getRowId(record),
+            isSelected       = me.isSelected(rowId),
+            annotationsField = view.selectedRecordField;
+
+        if (me.singleSelect) {
+            if (isSelected) {
+                record[annotationsField] = false
+            } else {
+                me.items.forEach(rowId => {
+                    // We can use setSilent(), since the last change will trigger a view update
+                    view.getRecordByRowId(rowId).setSilent({[annotationsField]: false})
+                });
+
+                record[annotationsField] = true
+            }
+        } else {
+            record[annotationsField] = !record[annotationsField]
+        }
+    }
 }
 
 export default Neo.setupClass(RowModel);