angular-gridster2 - npm Package Compare versions

Comparing version 2.10.6 to 3.0.0

dist/gridster.component.d.ts

@@ -1,6 +0,6 @@
-import { OnInit, ElementRef, OnDestroy, Renderer2, DoCheck } from '@angular/core';
+import { OnInit, ElementRef, OnDestroy, Renderer2 } from '@angular/core';
 import { GridsterConfig } from './gridsterConfig.interface';
 import { GridsterItemComponent } from './gridsterItem.component';
 import { GridsterGridComponent } from './gridsterGrid.component';
-export declare class GridsterComponent implements OnInit, OnDestroy, DoCheck {
+export declare class GridsterComponent implements OnInit, OnDestroy {
     renderer: Renderer2;
@@ -29,3 +29,3 @@ options: GridsterConfig;
     ngOnInit(): void;
-    ngDoCheck(): void;
+    resize(): void;
     optionsChanged(): void;
@@ -49,2 +49,3 @@ ngOnDestroy(): void;
     positionYToPixels(y: number): number;
+    checkCompact(): void;
     checkCompactUp(): boolean;
@@ -51,0 +52,0 @@ moveUpTillCollision(itemComponent: GridsterItemComponent): boolean;

dist/gridster.component.js

@@ -30,4 +30,7 @@ "use strict";
     GridsterComponent.prototype.ngOnInit = function () {
-        this.options.optionsChanged = this.optionsChanged.bind(this);
         this.$options = gridsterUtils_service_1.GridsterUtils.merge(this.$options, this.options, this.$options);
+        this.options.api = {
+            optionsChanged: this.optionsChanged.bind(this),
+            resize: this.resize.bind(this)
+        };
         this.columns = gridsterConfig_constant_1.GridsterConfigService.minCols;
@@ -40,4 +43,7 @@ this.rows = gridsterConfig_constant_1.GridsterConfigService.minRows;
         this.windowResize = this.renderer.listen('window', 'resize', this.onResizeFunction);
+        if (this.options.initCallback) {
+            this.options.initCallback();
+        }
     };
-    GridsterComponent.prototype.ngDoCheck = function () {
+    GridsterComponent.prototype.resize = function () {
         var height;
@@ -117,6 +123,4 @@ var width;
     GridsterComponent.prototype.calculateLayout = function () {
-        // check to compact up
-        this.checkCompactUp();
-        // check to compact left
-        this.checkCompactLeft();
+        // check to compact
+        this.checkCompact();
         this.setGridDimensions();
@@ -183,3 +187,3 @@ if (this.$options.outerMargin) {
         }
-        setTimeout(this.ngDoCheck.bind(this), 100);
+        setTimeout(this.resize.bind(this), 100);
     };
@@ -295,20 +299,37 @@ GridsterComponent.prototype.addItem = function (itemComponent) {
     };
-    GridsterComponent.prototype.checkCompactUp = function () {
-        if (this.$options.compactUp) {
-            var widgetMovedUp = false, widget = void 0, moved = void 0;
-            var l = this.grid.length;
-            for (var i = 0; i < l; i++) {
-                widget = this.grid[i];
-                moved = this.moveUpTillCollision(widget);
-                if (moved) {
-                    widgetMovedUp = true;
-                    widget.itemChanged();
-                }
+    GridsterComponent.prototype.checkCompact = function () {
+        if (this.$options.compactType !== 'none') {
+            if (this.$options.compactType === 'compactUp') {
+                this.checkCompactUp();
             }
-            if (widgetMovedUp) {
+            else if (this.$options.compactType === 'compactLeft') {
+                this.checkCompactLeft();
+            }
+            else if (this.$options.compactType === 'compactUp&Left') {
                 this.checkCompactUp();
-                return widgetMovedUp;
+                this.checkCompactLeft();
             }
+            else if (this.$options.compactType === 'compactLeft&Up') {
+                this.checkCompactLeft();
+                this.checkCompactUp();
+            }
         }
     };
+    GridsterComponent.prototype.checkCompactUp = function () {
+        var widgetMovedUp = false, widget, moved;
+        var l = this.grid.length;
+        for (var i = 0; i < l; i++) {
+            widget = this.grid[i];
+            moved = this.moveUpTillCollision(widget);
+            if (moved) {
+                widgetMovedUp = true;
+                widget.item.y = widget.$item.y;
+                widget.itemChanged();
+            }
+        }
+        if (widgetMovedUp) {
+            this.checkCompactUp();
+            return widgetMovedUp;
+        }
+    };
     GridsterComponent.prototype.moveUpTillCollision = function (itemComponent) {
@@ -326,18 +347,17 @@ itemComponent.$item.y -= 1;
     GridsterComponent.prototype.checkCompactLeft = function () {
-        if (this.$options.compactLeft) {
-            var widgetMovedUp = false, widget = void 0, moved = void 0;
-            var l = this.grid.length;
-            for (var i = 0; i < l; i++) {
-                widget = this.grid[i];
-                moved = this.moveLeftTillCollision(widget);
-                if (moved) {
-                    widgetMovedUp = true;
-                    widget.itemChanged();
-                }
+        var widgetMovedUp = false, widget, moved;
+        var l = this.grid.length;
+        for (var i = 0; i < l; i++) {
+            widget = this.grid[i];
+            moved = this.moveLeftTillCollision(widget);
+            if (moved) {
+                widgetMovedUp = true;
+                widget.item.x = widget.$item.x;
+                widget.itemChanged();
             }
-            if (widgetMovedUp) {
-                this.checkCompactLeft();
-                return widgetMovedUp;
-            }
         }
+        if (widgetMovedUp) {
+            this.checkCompactLeft();
+            return widgetMovedUp;
+        }
     };
@@ -344,0 +364,0 @@ GridsterComponent.prototype.moveLeftTillCollision = function (itemComponent) {

dist/gridster.component.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<gridster-grid class=\"gridster-grid\"></gridster-grid> <ng-content></ng-content> <gridster-preview class=\"gridster-preview\"></gridster-preview>","styles":[":host {   position: relative;   display: flex;   overflow: auto;   flex: 1 auto;   background: grey;   width: 100%;   height: 100%; }  :host(.fit) {   overflow-x: hidden;   overflow-y: hidden; }  :host(.scrollVertical) {   overflow-x: hidden;   overflow-y: auto; }  :host(.scrollHorizontal) {   overflow-x: auto;   overflow-y: hidden; }  :host(.fixed) {   overflow: auto; }  :host(.mobile) {   overflow-x: hidden;   overflow-y: auto;   display: block; }  :host(.mobile) /deep/ gridster-item {   position: relative; }"]}]}],"members":{"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"optionsChanged":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onResize":[{"__symbolic":"method"}],"checkIfToResize":[{"__symbolic":"method"}],"setGridSize":[{"__symbolic":"method"}],"setGridDimensions":[{"__symbolic":"method"}],"calculateLayout":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"removeItem":[{"__symbolic":"method"}],"checkCollision":[{"__symbolic":"method"}],"checkGridCollision":[{"__symbolic":"method"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"pixelsToPositionX":[{"__symbolic":"method"}],"pixelsToPositionY":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]},"statics":{"checkCollisionTwoItems":{"__symbolic":"function","parameters":["item","item2"],"value":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"cols"}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"cols"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"}}},"right":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"rows"}}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"rows"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"}}}}}}}},{"__symbolic":"module","version":1,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<gridster-grid class=\"gridster-grid\"></gridster-grid> <ng-content></ng-content> <gridster-preview class=\"gridster-preview\"></gridster-preview>","styles":[":host {   position: relative;   display: flex;   overflow: auto;   flex: 1 auto;   background: grey;   width: 100%;   height: 100%; }  :host(.fit) {   overflow-x: hidden;   overflow-y: hidden; }  :host(.scrollVertical) {   overflow-x: hidden;   overflow-y: auto; }  :host(.scrollHorizontal) {   overflow-x: auto;   overflow-y: hidden; }  :host(.fixed) {   overflow: auto; }  :host(.mobile) {   overflow-x: hidden;   overflow-y: auto;   display: block; }  :host(.mobile) /deep/ gridster-item {   position: relative; }"]}]}],"members":{"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"optionsChanged":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onResize":[{"__symbolic":"method"}],"checkIfToResize":[{"__symbolic":"method"}],"setGridSize":[{"__symbolic":"method"}],"setGridDimensions":[{"__symbolic":"method"}],"calculateLayout":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"removeItem":[{"__symbolic":"method"}],"checkCollision":[{"__symbolic":"method"}],"checkGridCollision":[{"__symbolic":"method"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"pixelsToPositionX":[{"__symbolic":"method"}],"pixelsToPositionY":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]},"statics":{"checkCollisionTwoItems":{"__symbolic":"function","parameters":["item","item2"],"value":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"cols"}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"cols"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"}}},"right":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"rows"}}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"rows"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"}}}}}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<gridster-grid class=\"gridster-grid\"></gridster-grid> <ng-content></ng-content> <gridster-preview class=\"gridster-preview\"></gridster-preview>","styles":[":host {   position: relative;   display: flex;   overflow: auto;   flex: 1 auto;   background: grey;   width: 100%;   height: 100%; }  :host(.fit) {   overflow-x: hidden;   overflow-y: hidden; }  :host(.scrollVertical) {   overflow-x: hidden;   overflow-y: auto; }  :host(.scrollHorizontal) {   overflow-x: auto;   overflow-y: hidden; }  :host(.fixed) {   overflow: auto; }  :host(.mobile) {   overflow-x: hidden;   overflow-y: auto;   display: block; }  :host(.mobile) /deep/ gridster-item {   position: relative; }"]}]}],"members":{"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"}]}],"ngOnInit":[{"__symbolic":"method"}],"resize":[{"__symbolic":"method"}],"optionsChanged":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onResize":[{"__symbolic":"method"}],"checkIfToResize":[{"__symbolic":"method"}],"setGridSize":[{"__symbolic":"method"}],"setGridDimensions":[{"__symbolic":"method"}],"calculateLayout":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"removeItem":[{"__symbolic":"method"}],"checkCollision":[{"__symbolic":"method"}],"checkGridCollision":[{"__symbolic":"method"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"pixelsToPositionX":[{"__symbolic":"method"}],"pixelsToPositionY":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompact":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]},"statics":{"checkCollisionTwoItems":{"__symbolic":"function","parameters":["item","item2"],"value":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"cols"}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"cols"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"}}},"right":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"rows"}}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"rows"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"}}}}}}}},{"__symbolic":"module","version":1,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<gridster-grid class=\"gridster-grid\"></gridster-grid> <ng-content></ng-content> <gridster-preview class=\"gridster-preview\"></gridster-preview>","styles":[":host {   position: relative;   display: flex;   overflow: auto;   flex: 1 auto;   background: grey;   width: 100%;   height: 100%; }  :host(.fit) {   overflow-x: hidden;   overflow-y: hidden; }  :host(.scrollVertical) {   overflow-x: hidden;   overflow-y: auto; }  :host(.scrollHorizontal) {   overflow-x: auto;   overflow-y: hidden; }  :host(.fixed) {   overflow: auto; }  :host(.mobile) {   overflow-x: hidden;   overflow-y: auto;   display: block; }  :host(.mobile) /deep/ gridster-item {   position: relative; }"]}]}],"members":{"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"}]}],"ngOnInit":[{"__symbolic":"method"}],"resize":[{"__symbolic":"method"}],"optionsChanged":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onResize":[{"__symbolic":"method"}],"checkIfToResize":[{"__symbolic":"method"}],"setGridSize":[{"__symbolic":"method"}],"setGridDimensions":[{"__symbolic":"method"}],"calculateLayout":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"removeItem":[{"__symbolic":"method"}],"checkCollision":[{"__symbolic":"method"}],"checkGridCollision":[{"__symbolic":"method"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"pixelsToPositionX":[{"__symbolic":"method"}],"pixelsToPositionY":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompact":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]},"statics":{"checkCollisionTwoItems":{"__symbolic":"function","parameters":["item","item2"],"value":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"&&","left":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"cols"}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"cols"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"x"}}},"right":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"rows"}}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"$item"},"member":"rows"}},"right":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"$item"},"member":"y"}}}}}}}}]

dist/gridsterConfig.constant.js

@@ -10,4 +10,3 @@ "use strict";
     fixedRowHeight: 250,
-    compactUp: false,
-    compactLeft: false,
+    compactType: 'none',
     mobileBreakpoint: 640,
@@ -28,2 +27,3 @@ minCols: 1,
     scrollSpeed: 20,
+    initCallback: undefined,
     itemChangeCallback: undefined,
@@ -30,0 +30,0 @@ itemResizeCallback: undefined,

dist/gridsterConfig.constant.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"GridsterConfigService":{"gridType":"fit","fixedColWidth":250,"fixedRowHeight":250,"compactUp":false,"compactLeft":false,"mobileBreakpoint":640,"minCols":1,"maxCols":100,"minRows":1,"maxRows":100,"defaultItemCols":1,"defaultItemRows":1,"maxItemCols":50,"maxItemRows":50,"minItemCols":1,"minItemRows":1,"margin":10,"outerMargin":true,"scrollSensitivity":10,"scrollSpeed":20,"itemChangeCallback":{"__symbolic":"reference","name":"undefined"},"itemResizeCallback":{"__symbolic":"reference","name":"undefined"},"draggable":{"enabled":false,"ignoreContentClass":"gridster-item-content","stop":{"__symbolic":"reference","name":"undefined"}},"resizable":{"enabled":false,"handles":{"s":true,"e":true,"n":true,"w":true,"se":true,"ne":true,"sw":true,"nw":true},"stop":{"__symbolic":"reference","name":"undefined"}},"swap":true,"pushItems":false,"displayGrid":"onDrag&Resize"}}},{"__symbolic":"module","version":1,"metadata":{"GridsterConfigService":{"gridType":"fit","fixedColWidth":250,"fixedRowHeight":250,"compactUp":false,"compactLeft":false,"mobileBreakpoint":640,"minCols":1,"maxCols":100,"minRows":1,"maxRows":100,"defaultItemCols":1,"defaultItemRows":1,"maxItemCols":50,"maxItemRows":50,"minItemCols":1,"minItemRows":1,"margin":10,"outerMargin":true,"scrollSensitivity":10,"scrollSpeed":20,"itemChangeCallback":{"__symbolic":"reference","name":"undefined"},"itemResizeCallback":{"__symbolic":"reference","name":"undefined"},"draggable":{"enabled":false,"ignoreContentClass":"gridster-item-content","stop":{"__symbolic":"reference","name":"undefined"}},"resizable":{"enabled":false,"handles":{"s":true,"e":true,"n":true,"w":true,"se":true,"ne":true,"sw":true,"nw":true},"stop":{"__symbolic":"reference","name":"undefined"}},"swap":true,"pushItems":false,"displayGrid":"onDrag&Resize"}}}]
+[{"__symbolic":"module","version":3,"metadata":{"GridsterConfigService":{"gridType":"fit","fixedColWidth":250,"fixedRowHeight":250,"compactType":"none","mobileBreakpoint":640,"minCols":1,"maxCols":100,"minRows":1,"maxRows":100,"defaultItemCols":1,"defaultItemRows":1,"maxItemCols":50,"maxItemRows":50,"minItemCols":1,"minItemRows":1,"margin":10,"outerMargin":true,"scrollSensitivity":10,"scrollSpeed":20,"initCallback":{"__symbolic":"reference","name":"undefined"},"itemChangeCallback":{"__symbolic":"reference","name":"undefined"},"itemResizeCallback":{"__symbolic":"reference","name":"undefined"},"draggable":{"enabled":false,"ignoreContentClass":"gridster-item-content","stop":{"__symbolic":"reference","name":"undefined"}},"resizable":{"enabled":false,"handles":{"s":true,"e":true,"n":true,"w":true,"se":true,"ne":true,"sw":true,"nw":true},"stop":{"__symbolic":"reference","name":"undefined"}},"swap":true,"pushItems":false,"displayGrid":"onDrag&Resize"}}},{"__symbolic":"module","version":1,"metadata":{"GridsterConfigService":{"gridType":"fit","fixedColWidth":250,"fixedRowHeight":250,"compactType":"none","mobileBreakpoint":640,"minCols":1,"maxCols":100,"minRows":1,"maxRows":100,"defaultItemCols":1,"defaultItemRows":1,"maxItemCols":50,"maxItemRows":50,"minItemCols":1,"minItemRows":1,"margin":10,"outerMargin":true,"scrollSensitivity":10,"scrollSpeed":20,"initCallback":{"__symbolic":"reference","name":"undefined"},"itemChangeCallback":{"__symbolic":"reference","name":"undefined"},"itemResizeCallback":{"__symbolic":"reference","name":"undefined"},"draggable":{"enabled":false,"ignoreContentClass":"gridster-item-content","stop":{"__symbolic":"reference","name":"undefined"}},"resizable":{"enabled":false,"handles":{"s":true,"e":true,"n":true,"w":true,"se":true,"ne":true,"sw":true,"nw":true},"stop":{"__symbolic":"reference","name":"undefined"}},"swap":true,"pushItems":false,"displayGrid":"onDrag&Resize"}}}]

dist/gridsterConfig.interface.d.ts

 export declare type GridType = 'fit' | 'scrollVertical' | 'scrollHorizontal' | 'fixed';
 export declare type displayGrid = 'always' | 'onDrag&Resize' | 'none';
+export declare type compactType = 'none' | 'compactUp' | 'compactLeft' | 'compactUp&Left' | 'compactLeft&Up';
 export interface GridsterConfig {
@@ -7,4 +8,3 @@ gridType?: GridType;
     fixedRowHeight?: number;
-    compactUp?: boolean;
-    compactLeft?: boolean;
+    compactType?: compactType;
     mobileBreakpoint?: number;
@@ -25,2 +25,3 @@ minCols?: number;
     scrollSpeed?: number;
+    initCallback?: Function;
     itemChangeCallback?: Function;
@@ -34,2 +35,6 @@ itemResizeCallback?: Function;
     displayGrid?: displayGrid;
+    api?: {
+        resize?: Function;
+        optionsChanged?: Function;
+    };
     [propName: string]: any;
@@ -36,0 +41,0 @@ }

package.json

 {
   "name": "angular-gridster2",
-  "version": "2.10.6",
+  "version": "3.0.0",
   "license": "MIT",
@@ -49,16 +49,16 @@ "main": "dist/index.js",
   "devDependencies": {
-    "@angular/animations": "4.2.2",
-    "@angular/cli": "1.1.1",
-    "@angular/common": "4.2.2",
-    "@angular/compiler": "4.2.2",
-    "@angular/compiler-cli": "4.2.2",
-    "@angular/core": "4.2.2",
-    "@angular/forms": "4.2.2",
-    "@angular/http": "4.2.2",
-    "@angular/language-service": "4.2.2",
+    "@angular/animations": "4.2.3",
+    "@angular/cli": "1.1.2",
+    "@angular/common": "4.2.3",
+    "@angular/compiler": "4.2.3",
+    "@angular/compiler-cli": "4.2.3",
+    "@angular/core": "4.2.3",
+    "@angular/forms": "4.2.3",
+    "@angular/http": "4.2.3",
+    "@angular/language-service": "4.2.3",
     "@angular/material": "2.0.0-beta.6",
-    "@angular/platform-browser": "4.2.2",
-    "@angular/platform-browser-dynamic": "4.2.2",
-    "@angular/platform-server": "4.2.2",
-    "@angular/router": "4.2.2",
+    "@angular/platform-browser": "4.2.3",
+    "@angular/platform-browser-dynamic": "4.2.3",
+    "@angular/platform-server": "4.2.3",
+    "@angular/router": "4.2.3",
     "@types/jasmine": "2.5.52",
@@ -72,3 +72,3 @@ "@types/node": "7.0.31",
     "hammerjs": "2.0.8",
-    "jasmine-core": "2.6.3",
+    "jasmine-core": "2.6.4",
     "jasmine-spec-reporter": "4.1.0",
@@ -82,4 +82,4 @@ "karma": "1.7.0",
     "protractor": "5.1.2",
-    "systemjs": "0.20.13",
-    "rxjs": "5.4.0",
+    "systemjs": "0.20.14",
+    "rxjs": "5.4.1",
     "ts-helpers": "1.1.2",
@@ -86,0 +86,0 @@ "ts-node": "3.0.6",

README.md

@@ -106,3 +106,3 @@ angular-gridster2
    changedOptions() {
-     this.options.optionsChanged();
+     this.options.api.optionsChanged();
    }
@@ -130,4 +130,3 @@
   fixedRowHeight: 250, // fixed row height for gridType: 'fixed'
-  compactUp: false, // compact items up if there is room
-  compactLeft: false, // compact items left if there is room
+  compactType: 'none', // compact items: 'none' | 'compactUp' | 'compactLeft' | 'compactUp&Left' | 'compactLeft&Up'
   mobileBreakpoint: 640, // if the screen is not wider that this, remove the grid layout and stack the items
@@ -148,2 +147,3 @@ minCols: 1, // minimum amount of columns in the grid
   scrollSpeed: 20,  // how much to scroll each mouse move when in the scrollSensitivity zone
+  initCallback: undefined, // callback to call after grid has initialized
   itemChangeCallback: undefined,  // callback to call for each item when is changes x, y, rows, cols. Arguments: gridsterItem
@@ -178,2 +178,8 @@ itemResizeCallback: undefined,  // callback to call for each item when width/height changes. Arguments: gridsterItem
 
+##### Gridster options api
+```typescript
+    this.options.api.resize(); // call if size of container changes. Grid will auto resize on window resize.
+    this.options.api.optionsChanged(); // call after change of options after initialization
+```
+
 ##### Gridster item options:
@@ -180,0 +186,0 @@ ```typescript

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

212046

increased by1.01%

Lines of code

1984

increased by1.33%

Number of lines in readme file

257

increased by2.39%

No dependency changes