@easydata/crud 1.4.0-rc01 → 1.4.1-rc02

package/dist/bundles/easydata.crud.js

@@ -2738,6 +2738,7 @@ var easy_data_table_EasyDataTable = /** @class */ (function () {
         this.cachedRows = [];
         this.total = 0;
         this.needTotal = !this._elasticChunks;
+        this.fireUpdated();
     };
     EasyDataTable.prototype.createRow = function (dataOrRow) {
         var _this = this;
@@ -4511,7 +4512,7 @@ var easy_grid_EasyGrid = /** @class */ (function () {
                 pageSizeItems: [20, 30, 50, 100, 200]
             },
             columnWidths: {
-                autoResize: AutoResizeColumns.Once,
+                autoResize: AutoResizeColumns.Always,
                 stringColumns: {
                     min: 100,
                     max: 500,
@@ -4539,7 +4540,7 @@ var easy_grid_EasyGrid = /** @class */ (function () {
                     default: 60
                 }
             },
-            addColumns: false,
+            showPlusButton: false,
             viewportRowsCount: null,
             showActiveRow: true
         };
@@ -4638,8 +4639,8 @@ var easy_grid_EasyGrid = /** @class */ (function () {
         if (options.onRowDbClick) {
             this.addEventListener('rowDbClick', options.onRowDbClick);
         }
-        if (options.onAddColumnClick) {
-            this.addEventListener('addColumnClick', options.onAddColumnClick);
+        if (options.onPlusButtonClick) {
+            this.addEventListener('plusButtonClick', options.onPlusButtonClick);
         }
         if (options.onColumnChanged) {
             this.addEventListener('columnChanged', options.onColumnChanged);
@@ -4725,7 +4726,7 @@ var easy_grid_EasyGrid = /** @class */ (function () {
     };
     EasyGrid.prototype.render = function () {
         var _this = this;
-        if (!this.hasData() && !this.options.addColumns)
+        if (!this.hasData() && !this.options.showPlusButton)
             return;
         this.containerInitialHeight = this.slot.clientHeight;
         this.rootDiv = document.createElement('div');
@@ -4742,6 +4743,7 @@ var easy_grid_EasyGrid = /** @class */ (function () {
         gridContainer.classList.add(this.cssPrefix + "-container");
         gridContainer.appendChild(this.rootDiv);
         this.slot.appendChild(gridContainer);
+        var needAutoResize = this.options.columnWidths.autoResize !== AutoResizeColumns.Never;
         if (this.rowsOnPagePromise) {
             this.rowsOnPagePromise
                 .then(function () { return _this.updateHeight(); })
@@ -4755,17 +4757,12 @@ var easy_grid_EasyGrid = /** @class */ (function () {
                 _this.updateHeight()
                     .then(function () {
                     _this.firstRender = false;
+                    if (needAutoResize) {
+                        _this.resizeColumns();
+                    }
                 });
             }, 100);
         }
-        var needAutoResize = this.options.columnWidths.autoResize !== AutoResizeColumns.Never;
-        if (needAutoResize) {
-            this.bodyCellContainerDiv.style.visibility = 'hidden';
-            setTimeout(function () {
-                _this.resizeColumns();
-                _this.bodyCellContainerDiv.style.visibility = null;
-            }, 20);
-        }
     };
     EasyGrid.prototype.updateHeight = function () {
         var _this = this;
@@ -4774,14 +4771,14 @@ var easy_grid_EasyGrid = /** @class */ (function () {
                 var firstRow = _this.bodyCellContainerDiv.firstElementChild;
                 var rowHeight = firstRow ? firstRow.offsetHeight : DEFAULT_ROW_HEIGHT;
                 var rowCount = _this.options.viewportRowsCount; // || DEFAULT_ROW_COUNT;
-                var bodyHeight_1 = rowHeight * rowCount;
-                domel(_this.bodyDiv)
-                    .setStyle('height', bodyHeight_1 + "px");
+                var viewportHeight_1 = rowHeight * rowCount;
+                domel(_this.bodyViewportDiv)
+                    .setStyle('height', viewportHeight_1 + "px");
                 setTimeout(function () {
                     var sbHeight = _this.bodyViewportDiv.offsetHeight - _this.bodyViewportDiv.clientHeight;
-                    bodyHeight_1 = bodyHeight_1 + sbHeight;
-                    domel(_this.bodyDiv)
-                        .setStyle('height', bodyHeight_1 + "px");
+                    viewportHeight_1 = viewportHeight_1 + sbHeight;
+                    domel(_this.bodyViewportDiv)
+                        .setStyle('height', viewportHeight_1 + "px");
                     resolve();
                 }, 100);
                 return;
@@ -4828,7 +4825,7 @@ var easy_grid_EasyGrid = /** @class */ (function () {
             _this.headerRowDiv.appendChild(hd);
             if (column.isRowNum) {
                 domel(hd)
-                    .addChildElement(_this.renderAddColumnButton());
+                    .addChildElement(_this.renderHeaderButtons());
             }
         });
         var containerWidth = this.getContainerWidth();
@@ -4925,9 +4922,15 @@ var easy_grid_EasyGrid = /** @class */ (function () {
                         _this.updateTotalsState(groups_1, row, true);
                     }
                 }
-                var containerWidth = _this.getContainerWidth();
-                domel(_this.bodyCellContainerDiv)
-                    .setStyle('width', containerWidth + "px");
+                var needAutoResize = _this.options.columnWidths.autoResize !== AutoResizeColumns.Never;
+                if (needAutoResize) {
+                    _this.resizeColumns();
+                }
+                else {
+                    var containerWidth = _this.getContainerWidth();
+                    domel(_this.bodyCellContainerDiv)
+                        .setStyle('width', containerWidth + "px");
+                }
                 return rowsToRender;
             })
                 .catch(function (error) { console.error(error); return 0; });
@@ -5167,23 +5170,26 @@ var easy_grid_EasyGrid = /** @class */ (function () {
         var pageInfoDiv = domel('div')
             .addClass(this.cssPrefix + "-page-info")
             .toDOM();
-        var fistPageRecordNum = count
-            ? (this.pagination.page - 1) * this.pagination.pageSize + 1
-            : 0;
-        var lastPageRecordNum = count
-            ? fistPageRecordNum + count - 1
-            : 0;
-        var totalStr = this.dataTable.getTotal().toString();
-        if (this.dataTable.elasticChunks) {
-            var count_1 = this.dataTable.getCachedCount();
-            var total = this.dataTable.getTotal();
-            if (count_1 !== total)
-                totalStr = '?';
-        }
-        pageInfoDiv.innerHTML = i18n_i18n.getText('GridPageInfo')
-            .replace('{FirstPageRecordNum}', "<span>" + fistPageRecordNum.toString() + "</span>")
-            .replace('{LastPageRecordNum}', "<span>" + lastPageRecordNum.toString() + "</span>")
-            .replace('{Total}', "<span>" + totalStr + "</span>");
+        var rowCount = this.dataTable.getTotal();
+        if (rowCount > 0) {
+            var fistPageRecordNum = count
+                ? (this.pagination.page - 1) * this.pagination.pageSize + 1
+                : 0;
+            var lastPageRecordNum = count
+                ? fistPageRecordNum + count - 1
+                : 0;
+            var totalStr = this.dataTable.getTotal().toString();
+            if (this.dataTable.elasticChunks) {
+                var count_1 = this.dataTable.getCachedCount();
+                var total = this.dataTable.getTotal();
+                if (count_1 !== total)
+                    totalStr = '?';
+            }
+            pageInfoDiv.innerHTML = i18n_i18n.getText('GridPageInfo')
+                .replace('{FirstPageRecordNum}', "<span>" + fistPageRecordNum.toString() + "</span>")
+                .replace('{LastPageRecordNum}', "<span>" + lastPageRecordNum.toString() + "</span>")
+                .replace('{Total}', "<span>" + totalStr + "</span>");
+        }
         return pageInfoDiv;
     };
     EasyGrid.prototype.showProgress = function () {
@@ -5278,7 +5284,8 @@ var easy_grid_EasyGrid = /** @class */ (function () {
         var _this = this;
         var paginateDiv = document.createElement('div');
         paginateDiv.className = this.cssPrefix + "-pagination-wrapper";
-        if (this.options.paging && this.options.paging.enabled) {
+        var rowCount = this.dataTable.getTotal();
+        if (this.options.paging && this.options.paging.enabled && rowCount > 0) {
             var prefix_1 = this.paginationOptions.useBootstrap ? '' : this.cssPrefix + "-";
             var buttonClickHandler_1 = function (ev) {
                 var element = ev.target;
@@ -5404,18 +5411,18 @@ var easy_grid_EasyGrid = /** @class */ (function () {
     EasyGrid.prototype.removeEventListener = function (eventType, handlerId) {
         this.eventEmitter.unsubscribe(eventType, handlerId);
     };
-    EasyGrid.prototype.renderAddColumnButton = function () {
+    EasyGrid.prototype.renderHeaderButtons = function () {
         var _this = this;
-        if (this.options.addColumns) {
+        if (this.options.showPlusButton) {
             return domel('div')
-                .addClass(this.cssPrefix + "-addrow")
-                .title(this.options.addColumnsTitle || 'Add column')
+                .addClass(this.cssPrefix + "-header-btn-plus")
+                .title(this.options.plusButtonTitle || 'Add')
                 .addChild('a', function (builder) { return builder
                 .attr('href', 'javascript:void(0)')
                 .on('click', function (e) {
                 e.preventDefault();
                 _this.fireEvent({
-                    type: 'addColumnClick',
+                    type: 'plusButtonClick',
                     sourceEvent: e
                 });
             }); })
@@ -5522,6 +5529,8 @@ var easy_grid_EasyGrid = /** @class */ (function () {
         var containerWidth = this.bodyCellContainerDiv.style.width;
         this.bodyCellContainerDiv.style.visibility = 'hidden';
         this.bodyCellContainerDiv.style.width = '1px';
+        //this.headerRowDiv.style.visibility = 'hidden';
+        this.headerRowDiv.style.width = '1px';
         var sumWidth = 0;
         var columns = this.columns.getItems();
         var headerCells = this.headerCellContainerDiv.querySelectorAll("." + this.cssPrefix + "-header-cell");
@@ -5542,44 +5551,53 @@ var easy_grid_EasyGrid = /** @class */ (function () {
                     value.parentElement.style.width = calculatedWidth + "px";
                 });
                 headerCells[headerIdx].style.width = calculatedWidth + "px";
-                headerIdx++;
             }
-            else if (cellValues.length > 0) {
-                cellValues.forEach(function (value) {
-                    value.parentElement.style.width = null;
-                    var width = value.parentElement.offsetWidth;
-                    if (width > maxWidth) {
-                        maxWidth = width;
-                    }
-                });
-                maxWidth += 3;
-                var maxOption = column.isRowNum
-                    ? this_1.options.columnWidths.rowNumColumn.max || 500
-                    : this_1.options.columnWidths[column.dataColumn.type].max || 2000;
-                var minOption = column.isRowNum
-                    ? this_1.options.columnWidths.rowNumColumn.min || 0
-                    : this_1.options.columnWidths[column.dataColumn.type].min || 20;
-                if (maxWidth > maxOption) {
-                    maxWidth = maxOption;
-                }
-                if (maxWidth < minOption) {
-                    maxWidth = minOption;
+            else {
+                if (cellValues.length == 0) {
+                    headerCells[headerIdx].style.width = null;
+                    headerCells[headerIdx].style.whiteSpace = 'nowrap';
                 }
-                if (utils_utils.isNumericType(column.type)) {
-                    //increase the calculated width in 1.3 times for numeric columns
-                    maxWidth = Math.round(maxWidth * 1.3);
+                maxWidth = headerCells[headerIdx].offsetWidth;
+                if (cellValues.length > 0) {
+                    cellValues.forEach(function (value) {
+                        value.parentElement.style.width = null;
+                        var width = value.parentElement.offsetWidth;
+                        if (width > maxWidth) {
+                            maxWidth = width;
+                        }
+                    });
+                    maxWidth += 3;
+                    var maxOption = column.isRowNum
+                        ? this_1.options.columnWidths.rowNumColumn.max || 500
+                        : this_1.options.columnWidths[column.dataColumn.type].max || 2000;
+                    var minOption = column.isRowNum
+                        ? this_1.options.columnWidths.rowNumColumn.min || 0
+                        : this_1.options.columnWidths[column.dataColumn.type].min || 20;
+                    if (maxWidth > maxOption) {
+                        maxWidth = maxOption;
+                    }
+                    if (maxWidth < minOption) {
+                        maxWidth = minOption;
+                    }
+                    if (utils_utils.isNumericType(column.type)) {
+                        //increase the calculated width in 1.3 times for numeric columns
+                        maxWidth = Math.round(maxWidth * 1.3);
+                    }
+                    sumWidth += maxWidth;
+                    column.width = maxWidth;
+                    cellValues.forEach(function (value) {
+                        value.parentElement.style.width = maxWidth + "px";
+                    });
+                    headerCells[headerIdx].style.width = maxWidth + "px";
+                    if (column.dataColumn) {
+                        column.dataColumn.calculatedWidth = maxWidth;
+                    }
                 }
-                sumWidth += maxWidth;
-                column.width = maxWidth;
-                cellValues.forEach(function (value) {
-                    value.parentElement.style.width = maxWidth + "px";
-                });
-                headerCells[headerIdx].style.width = maxWidth + "px";
-                headerIdx++;
-                if (column.dataColumn) {
-                    column.dataColumn.calculatedWidth = maxWidth;
+                else {
+                    sumWidth += maxWidth;
                 }
             }
+            headerIdx++;
         };
         var this_1 = this;
         for (var idx = 0; idx < this.columns.count; idx++) {
@@ -5594,6 +5612,7 @@ var easy_grid_EasyGrid = /** @class */ (function () {
             this.headerCellContainerDiv.style.width = containerWidth;
         }
         this.bodyCellContainerDiv.style.visibility = null;
+        this.headerRowDiv.removeAttribute('style');
     };
     return EasyGrid;
 }());
@@ -7258,7 +7277,9 @@ var entity_form_builder_EntityEditFormBuilder = /** @class */ (function () {
         var lookupEntity = this.context.getMetaData().getRootEntity()
             .subEntities.filter(function (ent) { return ent.id == attr.lookupEntity; })[0];
         var dataAttr = this.context.getMetaData().getAttributeById(attr.dataAttr);
-        readOnly = readOnly && dataAttr.isEditable;
+        if (!dataAttr)
+            return;
+        readOnly = readOnly || !dataAttr.isEditable;
         value = this.params.values
             ? this.params.values.getValue(dataAttr.id)
             : undefined;
@@ -7649,15 +7670,10 @@ var entity_form_builder_EntityEditFormBuilder = /** @class */ (function () {
         this.form['setHtmlInt'](formHtml);
         for (var _i = 0, _a = this.context.getActiveEntity().attributes; _i < _a.length; _i++) {
             var attr = _a[_i];
-            if (!attr.isPrimaryKey) {
-                if (this.params.isEditForm) {
-                    if (!attr.showOnEdit)
-                        continue;
-                }
-                else {
-                    if (!attr.showOnCreate)
-                        continue;
-                }
+            if (!this.params.isEditForm && !attr.showOnCreate)
+                continue;
+            if (!attr.isPrimaryKey && this.params.isEditForm && !attr.showOnEdit) {
+                continue;
             }
             this.addFormField(fb.toDOM(), attr);
         }
@@ -7760,7 +7776,7 @@ var data_context_DataContext = /** @class */ (function () {
     DataContext.prototype.getActiveEntity = function () {
         return this.activeEntity;
     };
-    DataContext.prototype.setActiveEntity = function (entityId) {
+    DataContext.prototype.setActiveSource = function (entityId) {
         this.activeEntity = this.model.getRootEntity().subEntities
             .filter(function (e) { return e.id == entityId; })[0];
     };
@@ -7998,10 +8014,12 @@ var entity_data_view_EntityDataView = /** @class */ (function () {
             showBackToEntities: true
         };
         this.defaultValidators = [new required_validator_RequiredValidator(), new type_validator_TypeValidator()];
-        options = options || {};
         this.options = utils_utils.assignDeep(this.options, options || {});
         this.dlg = new DefaultDialogService();
         var ent = this.context.getActiveEntity();
+        if (!ent) {
+            throw "Can't find active entity for " + window.location.pathname;
+        }
         this.slot.innerHTML += "<h1>" + (ent.captionPlural || ent.caption) + "</h1>";
         if (this.options.showBackToEntities) {
             domel(this.slot)
@@ -8038,10 +8056,10 @@ var entity_data_view_EntityDataView = /** @class */ (function () {
                     allowPageSizeChange: true,
                     pageSizeItems: [15, 30, 50, 100, 200]
                 },
-                addColumns: _this.context.getActiveEntity().isEditable,
-                addColumnsTitle: i18n_i18n.getText('AddBtnTitle'),
+                showPlusButton: _this.context.getActiveEntity().isEditable,
+                plusButtonTitle: i18n_i18n.getText('AddRecordBtnTitle'),
                 showActiveRow: false,
-                onAddColumnClick: _this.addClickHandler.bind(_this),
+                onPlusButtonClick: _this.addClickHandler.bind(_this),
                 onGetCellRenderer: _this.manageCellRenderer.bind(_this),
                 onRowDbClick: _this.rowDbClickHandler.bind(_this),
                 onSyncGridColumn: _this.syncGridColumnHandler.bind(_this)
@@ -8254,51 +8272,62 @@ var root_data_view_RootDataView = /** @class */ (function () {
 var easy_data_view_dispatcher_EasyDataViewDispatcher = /** @class */ (function () {
     function EasyDataViewDispatcher(options) {
         var _this = this;
-        this.options = { basePath: 'easydata' };
+        this.options = {
+            container: '#EasyDataContainer',
+            basePath: 'easydata'
+        };
         this.onSetLocation = function () {
             _this.setActiveView();
         };
-        options = options || {};
-        this.options = utils_utils.assign(this.options, options);
-        this.options.basePath = (!this.options.rootEntity)
-            ? this.pretiffyPath(this.options.basePath)
-            : this.pretiffyPath(window.location.pathname);
-        if (this.options.rootEntity)
+        this.options = utils_utils.assign(this.options, options || {});
+        if (this.options.rootEntity) {
             this.options.showBackToEntities = false;
-        this.setContainer(options.container);
+            this.basePath = '/';
+        }
+        else {
+            this.basePath = this.normalizeBasePath(this.options.basePath);
+        }
+        this.setContainer(this.options.container);
         var progressBarSlot = document.createElement('div');
         var bar = new ProgressBar(progressBarSlot);
         var parent = this.container.parentElement;
         parent.insertBefore(progressBarSlot, parent.firstElementChild);
         this.context = new data_context_DataContext({
-            endpoint: options.endpoint,
-            dataTable: options.dataTable,
+            endpoint: this.options.endpoint,
+            dataTable: this.options.dataTable,
             onProcessStart: function () { return bar.show(); },
             onProcessEnd: function () { return bar.hide(); }
         });
-        this.basePath = this.getBasePath();
     }
-    EasyDataViewDispatcher.prototype.pretiffyPath = function (path) {
+    EasyDataViewDispatcher.prototype.normalizeBasePath = function (basePath) {
+        basePath = this.trimSlashes(basePath);
+        var fullPath = decodeURIComponent(window.location.pathname);
+        var idx = fullPath.toLocaleLowerCase().indexOf(basePath);
+        return idx >= 0 ? fullPath.substring(0, idx + basePath.length) : '/';
+    };
+    EasyDataViewDispatcher.prototype.trimSlashes = function (path) {
         return path.replace(/^\/|\/$/g, '');
     };
     EasyDataViewDispatcher.prototype.setContainer = function (container) {
         if (!container) {
-            this.container = document.getElementById('EasyDataContainer');
-            return;
+            throw 'Container is undefined';
         }
         if (typeof container === 'string') {
             if (container.length) {
-                if (container[0] === '#') {
-                    this.container = document.getElementById(container.substring(1));
-                }
-                else if (container[0] === '.') {
+                if (container[0] === '.') {
                     var result = document.getElementsByClassName(container.substring(1));
                     if (result.length)
                         this.container = result[0];
                 }
                 else {
-                    throw Error('Unrecognized container parameter ' +
-                        '(Must be an element ID, a class name or HTMLElement object itself): ' + container);
+                    if (container[0] === '#') {
+                        container = container.substring(1);
+                    }
+                    this.container = document.getElementById(container);
+                }
+                if (!this.container) {
+                    throw Error('Unrecognized `container` parameter: ' + container + '\n'
+                        + 'It must be an element ID, a class name (starting with .) or an HTMLElement object itself.');
                 }
             }
         }
@@ -8306,20 +8335,12 @@ var easy_data_view_dispatcher_EasyDataViewDispatcher = /** @class */ (function (
             this.container = container;
         }
     };
-    EasyDataViewDispatcher.prototype.getActiveEntityId = function () {
+    EasyDataViewDispatcher.prototype.getActiveSourceId = function () {
         if (this.options.rootEntity)
             return this.options.rootEntity;
-        var decodedUrl = decodeURIComponent(window.location.href);
-        var splitIndex = decodedUrl.lastIndexOf('/');
-        var typeName = decodedUrl.substring(splitIndex + 1);
-        return typeName && typeName.toLocaleLowerCase() !== this.options.basePath
-            ? typeName
-            : null;
-    };
-    EasyDataViewDispatcher.prototype.getBasePath = function () {
-        var decodedUrl = decodeURIComponent(window.location.href);
-        var optBasePathIndex = decodedUrl.toLocaleLowerCase().indexOf(this.options.basePath);
-        return decodedUrl.substring(0, optBasePathIndex + this.options.basePath.length);
+        var path = decodeURIComponent(window.location.pathname);
+        var idIndex = this.basePath.length + 1;
+        return idIndex < path.length ? path.substring(idIndex) : null;
     };
     EasyDataViewDispatcher.prototype.run = function () {
         var _this = this;
@@ -8332,9 +8353,9 @@ var easy_data_view_dispatcher_EasyDataViewDispatcher = /** @class */ (function (
     };
     EasyDataViewDispatcher.prototype.setActiveView = function () {
         this.clear();
-        var activeEntityId = this.getActiveEntityId();
-        if (activeEntityId) {
-            this.context.setActiveEntity(activeEntityId);
+        var sourceId = this.getActiveSourceId();
+        if (sourceId) {
+            this.context.setActiveSource(sourceId);
             window['EDView'] = new entity_data_view_EntityDataView(this.container, this.context, this.basePath, this.options);
         }
         else {
@@ -8367,6 +8388,7 @@ function addEasyDataCRUDTexts() {
         CalendarBtnTitle: 'Open calendar',
         TimerBtnTitle: 'Open timer',
         AddBtnTitle: 'Add',
+        AddRecordBtnTitle: 'Add record',
         EditBtn: 'Edit',
         DeleteBtn: 'Delete',
         SelectLink: '[ select ]',