@schneideress/dashboardframework 0.0.6 → 0.0.7

package/fesm5/schneideress-dashboardframework.js

@@ -3,6 +3,7 @@ import { Injectable, Injector, ɵɵdefineInjectable, ɵɵinject, INJECTOR, Compo
 import { of, Subject } from 'rxjs';
 import { BaseService } from '@schneideress/ess-util';
 import { filter, map } from 'rxjs/operators';
+import { NgxUiLoaderService, NgxUiLoaderModule } from 'ngx-ui-loader';
 import { BrowserModule } from '@angular/platform-browser';
 import { HttpClientModule } from '@angular/common/http';
 import { CommonModule } from '@angular/common';
@@ -472,9 +473,10 @@ var GridsterConfigDefaultSettings = {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 var RADashboardArea = /** @class */ (function () {
-    function RADashboardArea(dashboardService, ngZone) {
+    function RADashboardArea(dashboardService, ngZone, ngxService) {
         this.dashboardService = dashboardService;
         this.ngZone = ngZone;
+        this.ngxService = ngxService;
         this.widgetList = Array();
         this.gridheight = 300;
         this.widgetHeight = 20;
@@ -487,18 +489,27 @@ var RADashboardArea = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        /**
-         * To override default configuration values to the gridster control
-         * @type {?}
-         */
+        this.initiateGridsterConfig();
+    };
+    /**To set GridsterConfig */
+    /**
+     * To set GridsterConfig
+     * @return {?}
+     */
+    RADashboardArea.prototype.initiateGridsterConfig = /**
+     * To set GridsterConfig
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
         var areaContext = this;
+        /**To override default configuration values to the gridster control */
         this.options = GridsterConfigDefaultSettings;
         this.options.itemChangeCallback = (/**
          * @param {?} item
          * @return {?}
          */
         function (item) {
-            console.log('in change call back');
             areaContext.setAreaHeight();
             areaContext.updateWidgets();
         });
@@ -528,6 +539,7 @@ var RADashboardArea = /** @class */ (function () {
             }));
         }
         if (this.raDashboardEventBus && this.userDashboardId && this.areaKey) {
+            this.initiateGridsterConfig();
             this.loadWidgets(this.userDashboardId, this.areaKey);
         }
     };
@@ -547,7 +559,6 @@ var RADashboardArea = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        console.log('in update widgets');
         this.dashboardService.updateWidgets(this.mapGridsterListToObject(this.widgetList), this.appConfig).subscribe((/**
          * @param {?} widgets
          * @return {?}
@@ -572,6 +583,8 @@ var RADashboardArea = /** @class */ (function () {
     function (userDashboarId, areaKey) {
         var _this = this;
         /** @type {?} */
+        var areaContext = this;
+        /** @type {?} */
         var widgetInfo = (/** @type {?} */ ({
             dashboardId: userDashboarId.toString(),
             dashboardAreaKey: areaKey
@@ -581,9 +594,14 @@ var RADashboardArea = /** @class */ (function () {
          * @return {?}
          */
         function (widgets) {
-            if (widgets) {
-                _this.widgetList = _this.mapObjectListToGridsterItemList(widgets);
-                _this.setAreaHeight();
+            if (widgets && widgets.length > 0) {
+                areaContext.widgetList = _this.mapObjectListToGridsterItemList(widgets);
+                setTimeout((/**
+                 * @return {?}
+                 */
+                function () {
+                    areaContext.setAreaHeight();
+                }), 2000);
             }
         }));
     };
@@ -612,11 +630,17 @@ var RADashboardArea = /** @class */ (function () {
                 areaScrollHeight = currentHeight;
             }
         }));
-        areaHeight = areaScrollHeight * this.options.api.getCurrentRowHeight() + 2;
-        if (areaHeight < 300) {
-            areaHeight = 300;
+        if (this.options.api) {
+            areaHeight = areaScrollHeight * this.options.api.getCurrentRowHeight() + 2;
+            if (areaHeight < 300) {
+                areaHeight = 300;
+            }
+            this.gridheight = areaHeight;
+        }
+        else {
+            console.log('api not defined');
+            console.log(this.options);
         }
-        this.gridheight = areaHeight;
     };
     /** To remove a widget instance from dashboard and to save info in database */
     /**
@@ -668,11 +692,14 @@ var RADashboardArea = /** @class */ (function () {
         data.position_y = 0;
         /** @type {?} */
         var gridsterItem = this.mapObjectsToGridsterItem(data);
-        gridsterItem = this.options.api.getFirstPossiblePosition(gridsterItem);
+        if (this.options.api) {
+            gridsterItem = this.options.api.getFirstPossiblePosition(gridsterItem);
+        }
         data.position_x = gridsterItem.x;
         data.position_y = gridsterItem.y;
         data.dashboardAreaKey = this.areaKey;
         data.dashboardId = this.userDashboardId;
+        this.ngxService.start();
         this.dashboardService.addWidget(data, this.appConfig).subscribe((/**
          * @param {?} widget
          * @return {?}
@@ -681,6 +708,7 @@ var RADashboardArea = /** @class */ (function () {
             gridsterItem = _this.mapObjectsToGridsterItem(widget);
             _this.widgetList.push(gridsterItem);
             _this.setAreaHeight();
+            _this.ngxService.stop();
         }));
     };
     /**To map IwidgetInfo object to gridsterItem */
@@ -768,14 +796,15 @@ var RADashboardArea = /** @class */ (function () {
     RADashboardArea.decorators = [
         { type: Component, args: [{
                     selector: 'ra-dashboard-area',
-                    template: "<div #gridWrapper class=\"wrap gridster\" [style.height.px]=\"gridheight\">\r\n<!-- <div #gridWrapper class=\"wrap gridster\"> -->\r\n  <gridster [options]=\"options\" style=\"height:100%;\">\r\n    <gridster-item [item]=\"item\" *ngFor=\"let item of widgetList\">\r\n      <ra-widget-container [app-config]=\"appConfig\" [event-bus]=\"raDashboardEventBus\" (widgetDeleted)=\"deleteWidget($event)\" [data]=\"item\"\r\n        [global-filter]=\"globalFilter\" [widget-instance-id]=\"item.widgetInstanceId\"></ra-widget-container>\r\n    </gridster-item>\r\n  </gridster>\r\n</div>\r\n",
+                    template: "<div #gridWrapper class=\"wrap gridster\" [style.height.px]=\"gridheight\">\r\n<!-- <div #gridWrapper class=\"wrap gridster\"> -->\r\n  <gridster [options]=\"options\" style=\"height:100%;\">\r\n    <gridster-item [item]=\"item\" *ngFor=\"let item of widgetList\">\r\n      <ra-widget-container [app-config]=\"appConfig\" [event-bus]=\"raDashboardEventBus\" (widgetDeleted)=\"deleteWidget($event)\" [data]=\"item\"\r\n        [global-filter]=\"globalFilter\" [widget-instance-id]=\"item.widgetInstanceId\"></ra-widget-container>\r\n    </gridster-item>\r\n  </gridster>\r\n</div>\r\n\r\n",
                     styles: ["gridster{width:inherit;resize:height;display:flex;min-height:300px}gridster-item{border:1px solid #ccc;background:#fff!important}.dvheader{width:100%;height:35px;background:#000;color:#fff;padding:7px 3px 5px 6px;text-transform:uppercase}"]
                 }] }
     ];
     /** @nocollapse */
     RADashboardArea.ctorParameters = function () { return [
         { type: RaDashboardService },
-        { type: NgZone }
+        { type: NgZone },
+        { type: NgxUiLoaderService }
     ]; };
     RADashboardArea.propDecorators = {
         userDashboardId: [{ type: Input, args: ['user-dashboard-id',] }],
@@ -794,8 +823,9 @@ var RADashboardArea = /** @class */ (function () {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 var RAWidgetContainer = /** @class */ (function () {
-    function RAWidgetContainer(dashboardService) {
+    function RAWidgetContainer(dashboardService, ngxService) {
         this.dashboardService = dashboardService;
+        this.ngxService = ngxService;
         this.isIEOrEdge = /msie\s|trident\/|edge\//i.test(window.navigator.userAgent);
         this.widgetDeleted = new EventEmitter();
     }
@@ -869,11 +899,13 @@ var RAWidgetContainer = /** @class */ (function () {
      */
     function () {
         var _this = this;
+        this.ngxService.start();
         this.dashboardService.deleteWidget(this.data.widgetInfo, this.appConfig).subscribe((/**
          * @param {?} status
          * @return {?}
          */
         function (status) {
+            _this.ngxService.stop();
             {
                 _this.widgetDeleted.emit(_this.data.widgetInfo.widgetInstanceId);
             }
@@ -930,8 +962,6 @@ var RAWidgetContainer = /** @class */ (function () {
      * @return {?}
      */
     function (config) {
-        console.log('in config change config');
-        console.log(config);
         this.data.widgetInfo.widgetConfigInfo.config = config;
         this.refreshWidget(this.data.widgetInfo);
         this.updateWidget(this.data.widgetInfo);
@@ -1012,7 +1042,8 @@ var RAWidgetContainer = /** @class */ (function () {
     ];
     /** @nocollapse */
     RAWidgetContainer.ctorParameters = function () { return [
-        { type: RaDashboardService }
+        { type: RaDashboardService },
+        { type: NgxUiLoaderService }
     ]; };
     RAWidgetContainer.propDecorators = {
         ctlWidget: [{ type: ViewChild, args: ['ctlWidget', { static: false },] }],
@@ -5540,7 +5571,8 @@ var DashboardFrameworkModule = /** @class */ (function () {
                     imports: [
                         BrowserModule,
                         GridsterModule,
-                        HttpClientModule
+                        HttpClientModule,
+                        NgxUiLoaderModule
                     ],
                     exports: [
                         RADashboardArea