@schneideress/dashboardframework 0.0.247 → 0.0.249
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/schneideress-dashboardframework.umd.js +98 -105
- package/bundles/schneideress-dashboardframework.umd.js.map +1 -1
- package/bundles/schneideress-dashboardframework.umd.min.js +1 -1
- package/bundles/schneideress-dashboardframework.umd.min.js.map +1 -1
- package/esm2015/gridster/lib/gridster.component.js +65 -101
- package/esm2015/lib/ra-dashboard-area/ra.dashboard.area.js +9 -2
- package/esm2015/lib/ra-widget-container/ra.widget.container.component.js +27 -11
- package/esm2015/lib/ra.base.dashboard.template.js +5 -1
- package/esm2015/lib/ra.dashboard.service.js +1 -1
- package/esm2015/lib/ra.event.enum.js +3 -1
- package/esm5/gridster/lib/gridster.component.js +65 -101
- package/esm5/lib/ra-dashboard-area/ra.dashboard.area.js +9 -2
- package/esm5/lib/ra-widget-container/ra.widget.container.component.js +27 -11
- package/esm5/lib/ra.base.dashboard.template.js +5 -1
- package/esm5/lib/ra.dashboard.service.js +1 -1
- package/esm5/lib/ra.event.enum.js +3 -1
- package/fesm2015/schneideress-dashboardframework.js +98 -105
- package/fesm2015/schneideress-dashboardframework.js.map +1 -1
- package/fesm5/schneideress-dashboardframework.js +98 -105
- package/fesm5/schneideress-dashboardframework.js.map +1 -1
- package/gridster/lib/gridster.component.d.ts +9 -9
- package/lib/ra-dashboard-area/ra.dashboard.area.d.ts +4 -1
- package/lib/ra-widget-container/ra.widget.container.component.d.ts +3 -1
- package/lib/ra.base.dashboard.template.d.ts +2 -1
- package/lib/ra.event.enum.d.ts +3 -1
- package/package.json +1 -1
- package/schneideress-dashboardframework.metadata.json +1 -1
|
@@ -395,6 +395,8 @@
|
|
|
395
395
|
RAEvent["UpdateAppledFiterForInapplicableFilter"] = "UpdateAppledFiterForInapplicableFilter";
|
|
396
396
|
/**show inapplicable filter message in global filter flyout */
|
|
397
397
|
RAEvent["ShowInapplicableFilterMessage"] = "ShowInapplicableFilterMessage";
|
|
398
|
+
/** Bulk Action Clicked */
|
|
399
|
+
RAEvent["BulkActionClick"] = "BulkActionClick";
|
|
398
400
|
})(exports.RAEvent || (exports.RAEvent = {}));
|
|
399
401
|
|
|
400
402
|
(function (RAEventKey) {
|
|
@@ -651,6 +653,9 @@
|
|
|
651
653
|
}
|
|
652
654
|
else {
|
|
653
655
|
setTimeout(function () {
|
|
656
|
+
_this.raDashboardEventBus.subscribe(exports.RAEvent.BulkActionClick).subscribe(function (data) {
|
|
657
|
+
_this.bulkActionData = JSON.parse(JSON.stringify(data)); // To create a new reference;
|
|
658
|
+
});
|
|
654
659
|
_this.gridcellHeight = _this.options.api.getCurrentRowHeight();
|
|
655
660
|
_this.domResized = !_this.domResized;
|
|
656
661
|
_this.setAreaHeight();
|
|
@@ -1064,6 +1069,10 @@
|
|
|
1064
1069
|
core.Input('app-config'),
|
|
1065
1070
|
__metadata("design:type", Object)
|
|
1066
1071
|
], RADashboardArea.prototype, "appConfig", void 0);
|
|
1072
|
+
__decorate([
|
|
1073
|
+
core.Input('dashboard-info'),
|
|
1074
|
+
__metadata("design:type", Object)
|
|
1075
|
+
], RADashboardArea.prototype, "dashboardInfo", void 0);
|
|
1067
1076
|
__decorate([
|
|
1068
1077
|
core.Output(),
|
|
1069
1078
|
__metadata("design:type", Object)
|
|
@@ -1075,7 +1084,7 @@
|
|
|
1075
1084
|
RADashboardArea = __decorate([
|
|
1076
1085
|
core.Component({
|
|
1077
1086
|
selector: 'ra-dashboard-area',
|
|
1078
|
-
template: "<div #gridWrapper class=\"wrap gridster gridster-mobile\" [ngStyle]=\"{'height': userWidgets.length > 0 ? (gridheight + 'px') : 'unset'}\">\r\n <!-- <div #gridWrapper class=\"wrap gridster\"> -->\r\n <gridster [options]=\"options\" style=\"height:100%;\" *ngIf=\"userWidgets.length > 0\">\r\n <gridster-item [item]=\"item\" *ngFor=\"let item of widgetList\">\r\n <ra-widget-container [app-config]=\"appConfig\" [event-bus]=\"raDashboardEventBus\"\r\n (widgetDeleted)=\"deleteWidget($event)\" [data]=\"item\" [global-filter]=\"globalFilter\"\r\n [grid-cell-height]=\"gridcellHeight\" *ngIf=\"gridcellHeight && gridcellHeight > 0\" [widget-width]=\"item.cols\"\r\n [widget-height]=\"item.rows\" [widget-instance-id]=\"item.widgetInstanceId\" [dom-resized]=\"domResized\"\r\n (updateAppliedFilters)=\"updateAppliedFilters($event)\">\r\n </ra-widget-container>\r\n </gridster-item>\r\n </gridster>\r\n\r\n <div class=\"empty-padding kiosk-hide\" *ngIf=\"showEmptyDashboard\">\r\n <div class=\"empty-wrapper\">\r\n <div></div>\r\n <div class=\"m-1 empty-prefix\">\r\n <i class=\"fal fa-edit edit-icon\"></i>\r\n <span class=\"empty-title\">{{'dashboard.emptydashboard'|translate}}</span>\r\n </div>\r\n <div class=\"empty-content light\">\r\n <div>\r\n <div class=\"col-sm-12 empty-msg\">\r\n {{'dashboard.emptydashboardmessage'|translate}} <br />\r\n {{'dashboard.emptydashboardmessage2'|translate}}\r\n </div>\r\n <button *ngIf=\"isWidgetMgmnt\" class=\"btn btnLib btn-sm m-1 dashboard-button light\" (click)=\"addNewWidget()\">\r\n <i class=\"fal fa-plus m-1\"></i>{{'dashboard.addawidgets'|translate}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <notifier-container></notifier-container>\r\n</div>",
|
|
1087
|
+
template: "<div #gridWrapper class=\"wrap gridster gridster-mobile\" [ngStyle]=\"{'height': userWidgets.length > 0 ? (gridheight + 'px') : 'unset'}\">\r\n <!-- <div #gridWrapper class=\"wrap gridster\"> -->\r\n <gridster [options]=\"options\" style=\"height:100%;\" *ngIf=\"userWidgets.length > 0\">\r\n <gridster-item [item]=\"item\" *ngFor=\"let item of widgetList\">\r\n <ra-widget-container [dashboard-info]=\"dashboardInfo\" [app-config]=\"appConfig\" [event-bus]=\"raDashboardEventBus\"\r\n (widgetDeleted)=\"deleteWidget($event)\" [data]=\"item\" [global-filter]=\"globalFilter\"\r\n [grid-cell-height]=\"gridcellHeight\" *ngIf=\"gridcellHeight && gridcellHeight > 0\" [widget-width]=\"item.cols\"\r\n [widget-height]=\"item.rows\" [widget-instance-id]=\"item.widgetInstanceId\" [dom-resized]=\"domResized\"\r\n (updateAppliedFilters)=\"updateAppliedFilters($event)\">\r\n </ra-widget-container>\r\n </gridster-item>\r\n </gridster>\r\n\r\n <div class=\"empty-padding kiosk-hide\" *ngIf=\"showEmptyDashboard\">\r\n <div class=\"empty-wrapper\">\r\n <div></div>\r\n <div class=\"m-1 empty-prefix\">\r\n <i class=\"fal fa-edit edit-icon\"></i>\r\n <span class=\"empty-title\">{{'dashboard.emptydashboard'|translate}}</span>\r\n </div>\r\n <div class=\"empty-content light\">\r\n <div>\r\n <div class=\"col-sm-12 empty-msg\">\r\n {{'dashboard.emptydashboardmessage'|translate}} <br />\r\n {{'dashboard.emptydashboardmessage2'|translate}}\r\n </div>\r\n <button *ngIf=\"isWidgetMgmnt\" class=\"btn btnLib btn-sm m-1 dashboard-button light\" (click)=\"addNewWidget()\">\r\n <i class=\"fal fa-plus m-1\"></i>{{'dashboard.addawidgets'|translate}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <notifier-container></notifier-container>\r\n</div>",
|
|
1079
1088
|
styles: ["gridster{width:inherit;resize:height;display:flex;background-color:#ededed;overflow-y:hidden!important}.dvheader{width:100%;height:35px;background:#000;color:#fff;padding:7px 3px 5px 6px;text-transform:uppercase}gridster-item{box-sizing:border-box;z-index:1;position:absolute;overflow:hidden;transition:.3s;display:none;background:#fff;-webkit-user-select:text;-moz-user-select:text;user-select:text;box-shadow:0 1px 10px rgba(0,0,0,.05)}gridster-item:hover{box-shadow:0 1px 10px rgba(0,0,0,.15)}@media screen and (max-width:685px){.gridster-mobile{height:auto!important;margin-bottom:50px!important}}@media screen and (max-width:350px){.gridster-mobile{min-height:330px!important;margin-bottom:0!important}}.empty-padding{padding:40px 20px 20px;background-color:#ededed;display:flex;justify-content:center;align-content:center}.empty-wrapper{display:flex;background-color:#fff;border-radius:8px;min-height:125px;width:72%}.empty-prefix{color:#32ad3c;font-size:18px;display:flex;align-items:center;padding:10px 30px;min-width:-webkit-max-content;min-width:max-content;min-width:-moz-max-content}.empty-content{color:#333;border-left:1px solid #a9afb1;width:100%;display:flex;align-items:center;padding:15px 30px 10px 40px}.empty-msg{padding:0 0 5px;font-size:16px}.dashboard-button{padding:5px 10px 5px 5px!important}.btnLib{background-color:#ededed;color:#333!important}.btn-group-sm>.btn,.btn-sm{padding:5px 20px 5px 5px}.edit-icon{color:#32ad3c;font-size:24px;margin-right:15px}.empty-title{margin-top:10px}@media screen and (max-width:600px){.empty-padding{padding:10px;background-color:#ededed;width:100%;display:block}.empty-wrapper{display:flex;background-color:#fff;border-radius:8px;min-height:125px;width:100%}.empty-prefix{color:#32ad3c;font-size:16px;display:flex;height:40px;padding:6px 10px 8px}.empty-content{color:#333;display:flex;padding:5px 10px 10px;margin-top:44px;margin-left:-185px;border-left:none}.empty-msg{padding:12px 10px 10px 5px;font-size:14px;border-top:1px solid #a9afb1}.edit-icon{color:#32ad3c;font-size:20px;margin-right:6px}.empty-title{margin-top:6px}}"]
|
|
1080
1089
|
}),
|
|
1081
1090
|
__metadata("design:paramtypes", [RaDashboardService,
|
|
@@ -1226,20 +1235,27 @@
|
|
|
1226
1235
|
});
|
|
1227
1236
|
});
|
|
1228
1237
|
}
|
|
1229
|
-
if (this.widgetElement
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1238
|
+
if (this.widgetElement) {
|
|
1239
|
+
if (changes.bulkActionData && changes.bulkActionData.currentValue != changes.bulkActionData.previousValue) {
|
|
1240
|
+
if (typeof this.widgetElement.bulkActionClicked === "function") {
|
|
1241
|
+
this.widgetElement.bulkActionClicked(this.bulkActionData);
|
|
1242
|
+
}
|
|
1243
|
+
}
|
|
1244
|
+
if (changes.globalFilter && changes.globalFilter.currentValue != changes.globalFilter.previousValue) {
|
|
1245
|
+
var filterObj = this.getParsedConfig(this.globalFilter);
|
|
1246
|
+
if (filterObj.WidgetInstanceId) {
|
|
1247
|
+
if (this.data.widgetInfo.widgetInstanceId != filterObj.WidgetInstanceId)
|
|
1248
|
+
this.refreshWidget(this.data.widgetInfo);
|
|
1249
|
+
}
|
|
1250
|
+
else {
|
|
1233
1251
|
this.refreshWidget(this.data.widgetInfo);
|
|
1252
|
+
}
|
|
1234
1253
|
}
|
|
1235
|
-
|
|
1236
|
-
|
|
1254
|
+
if (changes.width && changes.width.currentValue != changes.width.previousValue ||
|
|
1255
|
+
(changes.height && changes.height.currentValue != changes.height.previousValue)) {
|
|
1256
|
+
this.invokeWidgetResizedEvent();
|
|
1237
1257
|
}
|
|
1238
1258
|
}
|
|
1239
|
-
if (changes.width && changes.width.currentValue != changes.width.previousValue ||
|
|
1240
|
-
(changes.height && changes.height.currentValue != changes.height.previousValue)) {
|
|
1241
|
-
this.invokeWidgetResizedEvent();
|
|
1242
|
-
}
|
|
1243
1259
|
};
|
|
1244
1260
|
RAWidgetContainer.prototype.invokeWidgetResizedEvent = function () {
|
|
1245
1261
|
if (this.widgetElement) {
|
|
@@ -1502,6 +1518,7 @@
|
|
|
1502
1518
|
widgetConfigFilter.configChanges = this.getConfigChanges(false);
|
|
1503
1519
|
widgetConfigFilter.widgetInfo.widgetName = widgetInfo.widgetName;
|
|
1504
1520
|
widgetConfigFilter.globalFilter = this.globalFilter;
|
|
1521
|
+
widgetConfigFilter.dashboardInfo = me.dashboardInfo;
|
|
1505
1522
|
this.widgetElement.loadContent(widgetConfigFilter);
|
|
1506
1523
|
return [4 /*yield*/, this.setLock(widgetConfigFilter.config)];
|
|
1507
1524
|
case 1:
|
|
@@ -1945,6 +1962,10 @@
|
|
|
1945
1962
|
core.Input('global-filter'),
|
|
1946
1963
|
__metadata("design:type", Object)
|
|
1947
1964
|
], RAWidgetContainer.prototype, "globalFilter", void 0);
|
|
1965
|
+
__decorate([
|
|
1966
|
+
core.Input('dashboard-info'),
|
|
1967
|
+
__metadata("design:type", Object)
|
|
1968
|
+
], RAWidgetContainer.prototype, "dashboardInfo", void 0);
|
|
1948
1969
|
__decorate([
|
|
1949
1970
|
core.Input('data'),
|
|
1950
1971
|
__metadata("design:type", Object)
|
|
@@ -1969,6 +1990,10 @@
|
|
|
1969
1990
|
core.Input('grid-cell-height'),
|
|
1970
1991
|
__metadata("design:type", Number)
|
|
1971
1992
|
], RAWidgetContainer.prototype, "gridCellHeight", void 0);
|
|
1993
|
+
__decorate([
|
|
1994
|
+
core.Input('bulk-action-data'),
|
|
1995
|
+
__metadata("design:type", Object)
|
|
1996
|
+
], RAWidgetContainer.prototype, "bulkActionData", void 0);
|
|
1972
1997
|
__decorate([
|
|
1973
1998
|
core.Output(),
|
|
1974
1999
|
__metadata("design:type", Object)
|
|
@@ -2866,10 +2891,10 @@
|
|
|
2866
2891
|
}
|
|
2867
2892
|
GridsterComponent_1 = GridsterComponent;
|
|
2868
2893
|
GridsterComponent.checkCollisionTwoItems = function (item, item2) {
|
|
2869
|
-
return
|
|
2870
|
-
item.x + item.cols > item2.x
|
|
2871
|
-
item.y < item2.y + item2.rows
|
|
2872
|
-
item.y + item.rows > item2.y
|
|
2894
|
+
return item.x < item2.x + item2.cols
|
|
2895
|
+
&& item.x + item.cols > item2.x
|
|
2896
|
+
&& item.y < item2.y + item2.rows
|
|
2897
|
+
&& item.y + item.rows > item2.y;
|
|
2873
2898
|
};
|
|
2874
2899
|
GridsterComponent.prototype.ngOnInit = function () {
|
|
2875
2900
|
if (this.options.initCallback) {
|
|
@@ -2877,7 +2902,6 @@
|
|
|
2877
2902
|
}
|
|
2878
2903
|
};
|
|
2879
2904
|
GridsterComponent.prototype.ngOnChanges = function (changes) {
|
|
2880
|
-
console.log(this.$options);
|
|
2881
2905
|
if (changes.options) {
|
|
2882
2906
|
this.setOptions();
|
|
2883
2907
|
this.options.api = {
|
|
@@ -2886,7 +2910,7 @@
|
|
|
2886
2910
|
getNextPossiblePosition: this.getNextPossiblePosition.bind(this),
|
|
2887
2911
|
getFirstPossiblePosition: this.getFirstPossiblePosition.bind(this),
|
|
2888
2912
|
getLastPossiblePosition: this.getLastPossiblePosition.bind(this),
|
|
2889
|
-
getCurrentRowHeight: this.getCurrentRowHeight.bind(this)
|
|
2913
|
+
getCurrentRowHeight: this.getCurrentRowHeight.bind(this)
|
|
2890
2914
|
};
|
|
2891
2915
|
this.columns = this.$options.minCols;
|
|
2892
2916
|
this.rows = this.$options.minRows;
|
|
@@ -2900,7 +2924,7 @@
|
|
|
2900
2924
|
GridsterComponent.prototype.resize = function () {
|
|
2901
2925
|
var height;
|
|
2902
2926
|
var width;
|
|
2903
|
-
if (this.$options.gridType ===
|
|
2927
|
+
if (this.$options.gridType === 'fit' && !this.mobile) {
|
|
2904
2928
|
width = this.el.offsetWidth;
|
|
2905
2929
|
height = this.el.offsetHeight;
|
|
2906
2930
|
}
|
|
@@ -2908,15 +2932,14 @@
|
|
|
2908
2932
|
width = this.el.clientWidth;
|
|
2909
2933
|
height = this.el.clientHeight;
|
|
2910
2934
|
}
|
|
2911
|
-
if ((width !== this.curWidth || height !== this.curHeight) &&
|
|
2912
|
-
this.checkIfToResize()) {
|
|
2935
|
+
if ((width !== this.curWidth || height !== this.curHeight) && this.checkIfToResize()) {
|
|
2913
2936
|
this.onResize();
|
|
2914
2937
|
}
|
|
2915
2938
|
};
|
|
2916
2939
|
GridsterComponent.prototype.setOptions = function () {
|
|
2917
2940
|
this.$options = GridsterUtils.merge(this.$options, this.options, this.$options);
|
|
2918
2941
|
if (!this.$options.disableWindowResize && !this.windowResize) {
|
|
2919
|
-
this.windowResize = this.renderer.listen(
|
|
2942
|
+
this.windowResize = this.renderer.listen('window', 'resize', this.onResize.bind(this));
|
|
2920
2943
|
}
|
|
2921
2944
|
else if (this.$options.disableWindowResize && this.windowResize) {
|
|
2922
2945
|
this.windowResize();
|
|
@@ -2942,9 +2965,9 @@
|
|
|
2942
2965
|
}
|
|
2943
2966
|
//if (this.options.api) {
|
|
2944
2967
|
/* this.options.api getting undefined for new dashboard load- temp fix
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2968
|
+
* on new dashboard area load, old dashboard area gets destroyed, but that leads to
|
|
2969
|
+
* ondestroy of current this.options.api instance - needs to investigate further
|
|
2970
|
+
*/
|
|
2948
2971
|
if (false) {
|
|
2949
2972
|
this.options.api.resize = undefined;
|
|
2950
2973
|
this.options.api.optionsChanged = undefined;
|
|
@@ -2967,12 +2990,10 @@
|
|
|
2967
2990
|
var clientHeight = this.el.clientHeight;
|
|
2968
2991
|
var offsetHeight = this.el.offsetHeight;
|
|
2969
2992
|
var scrollHeight = this.el.scrollHeight;
|
|
2970
|
-
var verticalScrollPresent = clientWidth < offsetWidth &&
|
|
2971
|
-
scrollHeight
|
|
2972
|
-
|
|
2973
|
-
|
|
2974
|
-
scrollWidth > offsetWidth &&
|
|
2975
|
-
scrollWidth - offsetWidth < offsetHeight - clientHeight;
|
|
2993
|
+
var verticalScrollPresent = clientWidth < offsetWidth && scrollHeight > offsetHeight
|
|
2994
|
+
&& scrollHeight - offsetHeight < offsetWidth - clientWidth;
|
|
2995
|
+
var horizontalScrollPresent = clientHeight < offsetHeight
|
|
2996
|
+
&& scrollWidth > offsetWidth && scrollWidth - offsetWidth < offsetHeight - clientHeight;
|
|
2976
2997
|
if (verticalScrollPresent) {
|
|
2977
2998
|
return false;
|
|
2978
2999
|
}
|
|
@@ -2982,8 +3003,7 @@
|
|
|
2982
3003
|
var el = this.el;
|
|
2983
3004
|
var width = el.clientWidth;
|
|
2984
3005
|
var height = el.clientHeight;
|
|
2985
|
-
if (this.$options.setGridSize ||
|
|
2986
|
-
(this.$options.gridType === "fit" && !this.mobile)) {
|
|
3006
|
+
if (this.$options.setGridSize || this.$options.gridType === 'fit' && !this.mobile) {
|
|
2987
3007
|
width = el.offsetWidth;
|
|
2988
3008
|
height = el.offsetHeight;
|
|
2989
3009
|
}
|
|
@@ -2998,11 +3018,11 @@
|
|
|
2998
3018
|
this.setGridSize();
|
|
2999
3019
|
if (!this.mobile && this.$options.mobileBreakpoint > this.curWidth) {
|
|
3000
3020
|
this.mobile = !this.mobile;
|
|
3001
|
-
this.renderer.addClass(this.el,
|
|
3021
|
+
this.renderer.addClass(this.el, 'mobile');
|
|
3002
3022
|
}
|
|
3003
3023
|
else if (this.mobile && this.$options.mobileBreakpoint < this.curWidth) {
|
|
3004
3024
|
this.mobile = !this.mobile;
|
|
3005
|
-
this.renderer.removeClass(this.el,
|
|
3025
|
+
this.renderer.removeClass(this.el, 'mobile');
|
|
3006
3026
|
}
|
|
3007
3027
|
var rows = this.$options.minRows, columns = this.$options.minCols;
|
|
3008
3028
|
var widgetsIndex = this.grid.length - 1, widget;
|
|
@@ -3030,57 +3050,57 @@
|
|
|
3030
3050
|
var marginWidth = -this.$options.margin;
|
|
3031
3051
|
if (this.$options.outerMarginLeft !== null) {
|
|
3032
3052
|
marginWidth += this.$options.outerMarginLeft;
|
|
3033
|
-
this.renderer.setStyle(this.el,
|
|
3053
|
+
this.renderer.setStyle(this.el, 'padding-left', this.$options.outerMarginLeft + 'px');
|
|
3034
3054
|
}
|
|
3035
3055
|
else {
|
|
3036
3056
|
marginWidth += this.$options.margin;
|
|
3037
|
-
this.renderer.setStyle(this.el,
|
|
3057
|
+
this.renderer.setStyle(this.el, 'padding-left', this.$options.margin + 'px');
|
|
3038
3058
|
}
|
|
3039
3059
|
if (this.$options.outerMarginRight !== null) {
|
|
3040
3060
|
marginWidth += this.$options.outerMarginRight;
|
|
3041
|
-
this.renderer.setStyle(this.el,
|
|
3061
|
+
this.renderer.setStyle(this.el, 'padding-right', this.$options.outerMarginRight + 'px');
|
|
3042
3062
|
}
|
|
3043
3063
|
else {
|
|
3044
3064
|
marginWidth += this.$options.margin;
|
|
3045
|
-
this.renderer.setStyle(this.el,
|
|
3065
|
+
this.renderer.setStyle(this.el, 'padding-right', this.$options.margin + 'px');
|
|
3046
3066
|
}
|
|
3047
3067
|
this.curColWidth = (this.curWidth - marginWidth) / this.columns;
|
|
3048
3068
|
var marginHeight = -this.$options.margin;
|
|
3049
3069
|
if (this.$options.outerMarginTop !== null) {
|
|
3050
3070
|
marginHeight += this.$options.outerMarginTop;
|
|
3051
|
-
this.renderer.setStyle(this.el,
|
|
3071
|
+
this.renderer.setStyle(this.el, 'padding-top', this.$options.outerMarginTop + 'px');
|
|
3052
3072
|
}
|
|
3053
3073
|
else {
|
|
3054
3074
|
marginHeight += this.$options.margin;
|
|
3055
|
-
this.renderer.setStyle(this.el,
|
|
3075
|
+
this.renderer.setStyle(this.el, 'padding-top', this.$options.margin + 'px');
|
|
3056
3076
|
}
|
|
3057
3077
|
if (this.$options.outerMarginBottom !== null) {
|
|
3058
3078
|
marginHeight += this.$options.outerMarginBottom;
|
|
3059
|
-
this.renderer.setStyle(this.el,
|
|
3079
|
+
this.renderer.setStyle(this.el, 'padding-bottom', this.$options.outerMarginBottom + 'px');
|
|
3060
3080
|
}
|
|
3061
3081
|
else {
|
|
3062
3082
|
marginHeight += this.$options.margin;
|
|
3063
|
-
this.renderer.setStyle(this.el,
|
|
3083
|
+
this.renderer.setStyle(this.el, 'padding-bottom', this.$options.margin + 'px');
|
|
3064
3084
|
}
|
|
3065
3085
|
this.curRowHeight = (this.curHeight - marginHeight) / this.rows;
|
|
3066
3086
|
}
|
|
3067
3087
|
else {
|
|
3068
3088
|
this.curColWidth = (this.curWidth + this.$options.margin) / this.columns;
|
|
3069
3089
|
this.curRowHeight = (this.curHeight + this.$options.margin) / this.rows;
|
|
3070
|
-
this.renderer.setStyle(this.el,
|
|
3071
|
-
this.renderer.setStyle(this.el,
|
|
3072
|
-
this.renderer.setStyle(this.el,
|
|
3073
|
-
this.renderer.setStyle(this.el,
|
|
3090
|
+
this.renderer.setStyle(this.el, 'padding-left', 0 + 'px');
|
|
3091
|
+
this.renderer.setStyle(this.el, 'padding-right', 0 + 'px');
|
|
3092
|
+
this.renderer.setStyle(this.el, 'padding-top', 0 + 'px');
|
|
3093
|
+
this.renderer.setStyle(this.el, 'padding-bottom', 0 + 'px');
|
|
3074
3094
|
}
|
|
3075
3095
|
this.gridRenderer.updateGridster();
|
|
3076
3096
|
this.updateGrid();
|
|
3077
3097
|
if (this.$options.setGridSize) {
|
|
3078
|
-
this.renderer.setStyle(this.el,
|
|
3079
|
-
this.renderer.setStyle(this.el,
|
|
3098
|
+
this.renderer.setStyle(this.el, 'width', (this.columns * this.curColWidth + this.$options.margin) + 'px');
|
|
3099
|
+
this.renderer.setStyle(this.el, 'height', (this.rows * this.curRowHeight + this.$options.margin) + 'px');
|
|
3080
3100
|
}
|
|
3081
3101
|
else {
|
|
3082
|
-
this.renderer.setStyle(this.el,
|
|
3083
|
-
this.renderer.setStyle(this.el,
|
|
3102
|
+
this.renderer.setStyle(this.el, 'width', '');
|
|
3103
|
+
this.renderer.setStyle(this.el, 'height', '');
|
|
3084
3104
|
}
|
|
3085
3105
|
var widgetsIndex = this.grid.length - 1, widget;
|
|
3086
3106
|
for (; widgetsIndex >= 0; widgetsIndex--) {
|
|
@@ -3092,23 +3112,18 @@
|
|
|
3092
3112
|
setTimeout(this.resize.bind(this), 100);
|
|
3093
3113
|
};
|
|
3094
3114
|
GridsterComponent.prototype.updateGrid = function () {
|
|
3095
|
-
if (this.$options.displayGrid ===
|
|
3096
|
-
this.renderer.addClass(this.el,
|
|
3115
|
+
if (this.$options.displayGrid === 'always' && !this.mobile) {
|
|
3116
|
+
this.renderer.addClass(this.el, 'display-grid');
|
|
3097
3117
|
}
|
|
3098
|
-
else if (this.$options.displayGrid ===
|
|
3099
|
-
this.
|
|
3100
|
-
this.renderer.addClass(this.el, "display-grid");
|
|
3118
|
+
else if (this.$options.displayGrid === 'onDrag&Resize' && this.dragInProgress) {
|
|
3119
|
+
this.renderer.addClass(this.el, 'display-grid');
|
|
3101
3120
|
}
|
|
3102
|
-
else if (this.$options.displayGrid ===
|
|
3103
|
-
|
|
3104
|
-
this.mobile) {
|
|
3105
|
-
this.renderer.removeClass(this.el, "display-grid");
|
|
3121
|
+
else if (this.$options.displayGrid === 'none' || !this.dragInProgress || this.mobile) {
|
|
3122
|
+
this.renderer.removeClass(this.el, 'display-grid');
|
|
3106
3123
|
}
|
|
3107
3124
|
this.setGridDimensions();
|
|
3108
|
-
this.gridColumns.length =
|
|
3109
|
-
|
|
3110
|
-
this.gridRows.length =
|
|
3111
|
-
Math.max(this.rows, Math.floor(this.curHeight / this.curRowHeight)) || 0;
|
|
3125
|
+
this.gridColumns.length = Math.max(this.columns, Math.floor(this.curWidth / this.curColWidth)) || 0;
|
|
3126
|
+
this.gridRows.length = Math.max(this.rows, Math.floor(this.curHeight / this.curRowHeight)) || 0;
|
|
3112
3127
|
this.cdRef.markForCheck();
|
|
3113
3128
|
};
|
|
3114
3129
|
GridsterComponent.prototype.addItem = function (itemComponent) {
|
|
@@ -3128,8 +3143,8 @@
|
|
|
3128
3143
|
else if (this.checkCollision(itemComponent.$item)) {
|
|
3129
3144
|
if (!this.$options.disableWarnings) {
|
|
3130
3145
|
itemComponent.notPlaced = true;
|
|
3131
|
-
console.warn(
|
|
3132
|
-
JSON.stringify(itemComponent.item, [
|
|
3146
|
+
console.warn('Can\'t be placed in the bounds of the dashboard, trying to auto position!/n' +
|
|
3147
|
+
JSON.stringify(itemComponent.item, ['cols', 'rows', 'x', 'y']));
|
|
3133
3148
|
}
|
|
3134
3149
|
if (!this.$options.disableAutoPositionOnConflict) {
|
|
3135
3150
|
this.autoPositionItem(itemComponent);
|
|
@@ -3168,43 +3183,24 @@
|
|
|
3168
3183
|
var noNegativePosition = item.y > -1 && item.x > -1;
|
|
3169
3184
|
var maxGridCols = item.cols + item.x <= this.$options.maxCols;
|
|
3170
3185
|
var maxGridRows = item.rows + item.y <= this.$options.maxRows;
|
|
3171
|
-
var maxItemCols = item.maxItemCols === undefined
|
|
3172
|
-
|
|
3173
|
-
|
|
3174
|
-
var
|
|
3175
|
-
? this.$options.minItemCols
|
|
3176
|
-
: item.minItemCols;
|
|
3177
|
-
var maxItemRows = item.maxItemRows === undefined
|
|
3178
|
-
? this.$options.maxItemRows
|
|
3179
|
-
: item.maxItemRows;
|
|
3180
|
-
var minItemRows = item.minItemRows === undefined
|
|
3181
|
-
? this.$options.minItemRows
|
|
3182
|
-
: item.minItemRows;
|
|
3186
|
+
var maxItemCols = item.maxItemCols === undefined ? this.$options.maxItemCols : item.maxItemCols;
|
|
3187
|
+
var minItemCols = item.minItemCols === undefined ? this.$options.minItemCols : item.minItemCols;
|
|
3188
|
+
var maxItemRows = item.maxItemRows === undefined ? this.$options.maxItemRows : item.maxItemRows;
|
|
3189
|
+
var minItemRows = item.minItemRows === undefined ? this.$options.minItemRows : item.minItemRows;
|
|
3183
3190
|
var inColsLimits = item.cols <= maxItemCols && item.cols >= minItemCols;
|
|
3184
3191
|
var inRowsLimits = item.rows <= maxItemRows && item.rows >= minItemRows;
|
|
3185
|
-
var minAreaLimit = item.minItemArea === undefined
|
|
3186
|
-
|
|
3187
|
-
: item.minItemArea;
|
|
3188
|
-
var maxAreaLimit = item.maxItemArea === undefined
|
|
3189
|
-
? this.$options.maxItemArea
|
|
3190
|
-
: item.maxItemArea;
|
|
3192
|
+
var minAreaLimit = item.minItemArea === undefined ? this.$options.minItemArea : item.minItemArea;
|
|
3193
|
+
var maxAreaLimit = item.maxItemArea === undefined ? this.$options.maxItemArea : item.maxItemArea;
|
|
3191
3194
|
var area = item.cols * item.rows;
|
|
3192
3195
|
var inMinArea = minAreaLimit <= area;
|
|
3193
3196
|
var inMaxArea = maxAreaLimit >= area;
|
|
3194
|
-
return !(noNegativePosition &&
|
|
3195
|
-
maxGridCols &&
|
|
3196
|
-
maxGridRows &&
|
|
3197
|
-
inColsLimits &&
|
|
3198
|
-
inRowsLimits &&
|
|
3199
|
-
inMinArea &&
|
|
3200
|
-
inMaxArea);
|
|
3197
|
+
return !(noNegativePosition && maxGridCols && maxGridRows && inColsLimits && inRowsLimits && inMinArea && inMaxArea);
|
|
3201
3198
|
};
|
|
3202
3199
|
GridsterComponent.prototype.findItemWithItem = function (item) {
|
|
3203
3200
|
var widgetsIndex = this.grid.length - 1, widget;
|
|
3204
3201
|
for (; widgetsIndex > -1; widgetsIndex--) {
|
|
3205
3202
|
widget = this.grid[widgetsIndex];
|
|
3206
|
-
if (widget.$item !== item &&
|
|
3207
|
-
GridsterComponent_1.checkCollisionTwoItems(widget.$item, item)) {
|
|
3203
|
+
if (widget.$item !== item && GridsterComponent_1.checkCollisionTwoItems(widget.$item, item)) {
|
|
3208
3204
|
return widget;
|
|
3209
3205
|
}
|
|
3210
3206
|
}
|
|
@@ -3215,8 +3211,7 @@
|
|
|
3215
3211
|
var widgetsIndex = this.grid.length - 1, widget;
|
|
3216
3212
|
for (; widgetsIndex > -1; widgetsIndex--) {
|
|
3217
3213
|
widget = this.grid[widgetsIndex];
|
|
3218
|
-
if (widget.$item !== item &&
|
|
3219
|
-
GridsterComponent_1.checkCollisionTwoItems(widget.$item, item)) {
|
|
3214
|
+
if (widget.$item !== item && GridsterComponent_1.checkCollisionTwoItems(widget.$item, item)) {
|
|
3220
3215
|
a.push(widget);
|
|
3221
3216
|
}
|
|
3222
3217
|
}
|
|
@@ -3232,8 +3227,8 @@
|
|
|
3232
3227
|
else {
|
|
3233
3228
|
itemComponent.notPlaced = true;
|
|
3234
3229
|
if (!this.$options.disableWarnings) {
|
|
3235
|
-
console.warn(
|
|
3236
|
-
JSON.stringify(itemComponent.item, [
|
|
3230
|
+
console.warn('Can\'t be placed in the bounds of the dashboard!/n' +
|
|
3231
|
+
JSON.stringify(itemComponent.item, ['cols', 'rows', 'x', 'y']));
|
|
3237
3232
|
}
|
|
3238
3233
|
}
|
|
3239
3234
|
};
|
|
@@ -3280,10 +3275,7 @@
|
|
|
3280
3275
|
GridsterComponent.prototype.getLastPossiblePosition = function (item) {
|
|
3281
3276
|
var farthestItem = { y: 0, x: 0 };
|
|
3282
3277
|
farthestItem = this.grid.reduce(function (prev, curr) {
|
|
3283
|
-
var currCoords = {
|
|
3284
|
-
y: curr.$item.y + curr.$item.rows - 1,
|
|
3285
|
-
x: curr.$item.x + curr.$item.cols - 1,
|
|
3286
|
-
};
|
|
3278
|
+
var currCoords = { y: curr.$item.y + curr.$item.rows - 1, x: curr.$item.x + curr.$item.cols - 1 };
|
|
3287
3279
|
if (GridsterUtils.compareItems(prev, currCoords) === 1) {
|
|
3288
3280
|
return currCoords;
|
|
3289
3281
|
}
|
|
@@ -3332,15 +3324,12 @@
|
|
|
3332
3324
|
], GridsterComponent.prototype, "options", void 0);
|
|
3333
3325
|
GridsterComponent = GridsterComponent_1 = __decorate([
|
|
3334
3326
|
core.Component({
|
|
3335
|
-
selector:
|
|
3327
|
+
selector: 'gridster',
|
|
3336
3328
|
template: "<div class=\"gridster-column\" *ngFor=\"let column of gridColumns; let i = index;\"\r\n [ngStyle]=\"gridRenderer.getGridColumnStyle(i)\"></div>\r\n<div class=\"gridster-row\" *ngFor=\"let row of gridRows; let i = index;\"\r\n [ngStyle]=\"gridRenderer.getGridRowStyle(i)\"></div>\r\n<ng-content></ng-content>\r\n<gridster-preview class=\"gridster-preview\"></gridster-preview>\r\n",
|
|
3337
3329
|
encapsulation: core.ViewEncapsulation.None,
|
|
3338
3330
|
styles: ["gridster{clear:both;position:relative;box-sizing:border-box;background:#fff;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:block;overflow:auto}gridster.fit{overflow-x:hidden;overflow-y:hidden}gridster.scrollVertical{overflow-x:hidden;overflow-y:auto}gridster.scrollHorizontal{overflow-x:auto;overflow-y:hidden}gridster.fixed{overflow:auto}gridster.mobile{overflow-x:hidden;overflow-y:auto;flex-flow:column}gridster.mobile gridster-item{position:relative;width:100%!important;min-height:300px!important}gridster .gridster-column,gridster .gridster-row{position:absolute;display:none;transition:.3s;box-sizing:border-box}gridster.display-grid .gridster-column,gridster.display-grid .gridster-row{display:block}gridster .gridster-column{border-left:1px solid #ccc;border-right:1px solid #ccc}gridster .gridster-row{border-top:1px solid #ccc;border-bottom:1px solid #ccc}"]
|
|
3339
3331
|
}),
|
|
3340
|
-
__metadata("design:paramtypes", [core.ElementRef,
|
|
3341
|
-
core.Renderer2,
|
|
3342
|
-
core.ChangeDetectorRef,
|
|
3343
|
-
core.NgZone])
|
|
3332
|
+
__metadata("design:paramtypes", [core.ElementRef, core.Renderer2, core.ChangeDetectorRef, core.NgZone])
|
|
3344
3333
|
], GridsterComponent);
|
|
3345
3334
|
return GridsterComponent;
|
|
3346
3335
|
}());
|
|
@@ -5032,6 +5021,10 @@
|
|
|
5032
5021
|
core.Input('global-filter'),
|
|
5033
5022
|
__metadata("design:type", Object)
|
|
5034
5023
|
], RaBaseDashboardTemplate.prototype, "globalFilter", void 0);
|
|
5024
|
+
__decorate([
|
|
5025
|
+
core.Input('dashboard-info'),
|
|
5026
|
+
__metadata("design:type", Object)
|
|
5027
|
+
], RaBaseDashboardTemplate.prototype, "dashboardInfo", void 0);
|
|
5035
5028
|
__decorate([
|
|
5036
5029
|
core.Input(),
|
|
5037
5030
|
__metadata("design:type", Object)
|