angular-gridster2 - npm Package Compare versions

Comparing version 3.0.2 to 3.1.0

dist/gridster.component.d.ts

@@ -5,2 +5,3 @@ import { OnInit, ElementRef, OnDestroy, Renderer2 } from '@angular/core';
 import { GridsterGridComponent } from './gridsterGrid.component';
+import { GridsterItem } from './gridsterItem.interface';
 export declare class GridsterComponent implements OnInit, OnDestroy {
@@ -27,3 +28,3 @@ renderer: Renderer2;
     private cleanCallback;
-    static checkCollisionTwoItems(item: GridsterItemComponent, item2: GridsterItemComponent): boolean;
+    static checkCollisionTwoItems(item: GridsterItem, item2: GridsterItem): boolean;
     constructor(el: ElementRef, renderer: Renderer2);
@@ -41,6 +42,7 @@ ngOnInit(): void;
     removeItem(itemComponent: GridsterItemComponent): void;
-    checkCollision(itemComponent: GridsterItemComponent, ignoreItem?: GridsterItemComponent): GridsterItemComponent | boolean;
-    checkGridCollision(itemComponent: GridsterItemComponent): boolean;
-    findItemWithItem(itemComponent: GridsterItemComponent, ignoreItem?: GridsterItemComponent): GridsterItemComponent;
+    checkCollision(itemComponent: GridsterItem, ignoreItem?: GridsterItem): GridsterItemComponent | boolean;
+    checkGridCollision(itemComponent: GridsterItem): boolean;
+    findItemWithItem(itemComponent: GridsterItem, ignoreItem?: GridsterItem): GridsterItemComponent;
     autoPositionItem(itemComponent: GridsterItemComponent): void;
+    getNextPossiblePosition(newItem: GridsterItem): boolean;
     pixelsToPosition(x: number, y: number, roundingMethod: Function): [number, number];
@@ -47,0 +49,0 @@ pixelsToPositionX(x: number, roundingMethod: Function): number;

dist/gridster.component.js

@@ -24,6 +24,6 @@ "use strict";
     GridsterComponent.checkCollisionTwoItems = function (item, item2) {
-        return item.$item.x < item2.$item.x + item2.$item.cols
-            && item.$item.x + item.$item.cols > item2.$item.x
-            && item.$item.y < item2.$item.y + item2.$item.rows
-            && item.$item.y + item.$item.rows > item2.$item.y;
+        return item.x < item2.x + item2.cols
+            && item.x + item.cols > item2.x
+            && item.y < item2.y + item2.rows
+            && item.y + item.rows > item2.y;
     };
@@ -34,3 +34,4 @@ GridsterComponent.prototype.ngOnInit = function () {
             optionsChanged: this.optionsChanged.bind(this),
-            resize: this.resize.bind(this)
+            resize: this.resize.bind(this),
+            getNextPossiblePosition: this.getNextPossiblePosition.bind(this)
         };
@@ -202,3 +203,3 @@ this.columns = gridsterConfig_constant_1.GridsterConfigService.minCols;
         }
-        else if (this.checkCollision(itemComponent)) {
+        else if (this.checkCollision(itemComponent.$item)) {
             console.warn('Can\'t be placed in the bounds of the dashboard, trying to auto position!/n' +
@@ -227,11 +228,11 @@ JSON.stringify(itemComponent.item, ['cols', 'rows', 'x', 'y']));
     GridsterComponent.prototype.checkGridCollision = function (itemComponent) {
-        var noNegativePosition = itemComponent.$item.y > -1 && itemComponent.$item.x > -1;
-        var maxGridCols = itemComponent.$item.cols + itemComponent.$item.x <= this.$options.maxCols;
-        var maxGridRows = itemComponent.$item.rows + itemComponent.$item.y <= this.$options.maxRows;
-        var maxItemCols = itemComponent.$item.maxItemCols === undefined ? this.$options.maxItemCols : itemComponent.$item.maxItemCols;
-        var minItemCols = itemComponent.$item.minItemCols === undefined ? this.$options.minItemCols : itemComponent.$item.minItemCols;
-        var maxItemRows = itemComponent.$item.maxItemRows === undefined ? this.$options.maxItemRows : itemComponent.$item.maxItemRows;
-        var minItemRows = itemComponent.$item.minItemRows === undefined ? this.$options.minItemRows : itemComponent.$item.minItemRows;
-        var inColsLimits = itemComponent.$item.cols <= maxItemCols && itemComponent.$item.cols >= minItemCols;
-        var inRowsLimits = itemComponent.$item.rows <= maxItemRows && itemComponent.$item.rows >= minItemRows;
+        var noNegativePosition = itemComponent.y > -1 && itemComponent.x > -1;
+        var maxGridCols = itemComponent.cols + itemComponent.x <= this.$options.maxCols;
+        var maxGridRows = itemComponent.rows + itemComponent.y <= this.$options.maxRows;
+        var maxItemCols = itemComponent.maxItemCols === undefined ? this.$options.maxItemCols : itemComponent.maxItemCols;
+        var minItemCols = itemComponent.minItemCols === undefined ? this.$options.minItemCols : itemComponent.minItemCols;
+        var maxItemRows = itemComponent.maxItemRows === undefined ? this.$options.maxItemRows : itemComponent.maxItemRows;
+        var minItemRows = itemComponent.minItemRows === undefined ? this.$options.minItemRows : itemComponent.minItemRows;
+        var inColsLimits = itemComponent.cols <= maxItemCols && itemComponent.cols >= minItemCols;
+        var inRowsLimits = itemComponent.rows <= maxItemRows && itemComponent.rows >= minItemRows;
         return !(noNegativePosition && maxGridCols && maxGridRows && inColsLimits && inRowsLimits);
@@ -243,4 +244,4 @@ };
             widget = this.grid[widgetsIndex];
-            if (widget !== itemComponent && widget !== ignoreItem
-                && GridsterComponent.checkCollisionTwoItems(widget, itemComponent)) {
+            if (widget.$item !== itemComponent && widget.$item !== ignoreItem
+                && GridsterComponent.checkCollisionTwoItems(widget.$item, itemComponent)) {
                 return widget;
@@ -251,14 +252,29 @@ }
     GridsterComponent.prototype.autoPositionItem = function (itemComponent) {
+        if (this.getNextPossiblePosition(itemComponent.$item)) {
+            itemComponent.item.x = itemComponent.$item.x;
+            itemComponent.item.y = itemComponent.$item.y;
+            itemComponent.itemChanged();
+        }
+        else {
+            itemComponent.notPlaced = true;
+            console.warn('Can\'t be placed in the bounds of the dashboard!/n' +
+                JSON.stringify(itemComponent.item, ['cols', 'rows', 'x', 'y']));
+        }
+    };
+    GridsterComponent.prototype.getNextPossiblePosition = function (newItem) {
+        if (newItem.cols === undefined) {
+            newItem.cols = this.$options.defaultItemCols;
+        }
+        if (newItem.rows === undefined) {
+            newItem.rows = this.$options.defaultItemRows;
+        }
         this.setGridDimensions();
         var rowsIndex = 0, colsIndex;
         for (; rowsIndex < this.rows; rowsIndex++) {
-            itemComponent.$item.y = rowsIndex;
+            newItem.y = rowsIndex;
             colsIndex = 0;
             for (; colsIndex < this.columns; colsIndex++) {
-                itemComponent.$item.x = colsIndex;
-                if (!this.checkCollision(itemComponent)) {
-                    itemComponent.item.x = itemComponent.$item.x;
-                    itemComponent.item.y = itemComponent.$item.y;
-                    itemComponent.itemChanged();
-                    return;
+                newItem.x = colsIndex;
+                if (!this.checkCollision(newItem)) {
+                    return true;
                 }
@@ -268,19 +284,11 @@ }
         if (this.rows >= this.columns && this.$options.maxCols > this.columns) {
-            itemComponent.$item.x = this.columns;
-            itemComponent.$item.y = 0;
-            itemComponent.item.x = itemComponent.$item.x;
-            itemComponent.item.y = itemComponent.$item.y;
-            itemComponent.itemChanged();
+            newItem.x = this.columns;
+            newItem.y = 0;
+            return true;
         }
         else if (this.$options.maxRows > this.rows) {
-            itemComponent.$item.y = this.rows;
-            itemComponent.$item.x = 0;
-            itemComponent.item.x = itemComponent.$item.x;
-            itemComponent.item.y = itemComponent.$item.y;
-            itemComponent.itemChanged();
+            newItem.y = this.rows;
+            newItem.x = 0;
+            return true;
         }
-        else {
-            console.warn('Can\'t be placed in the bounds of the dashboard!/n' +
-                JSON.stringify(itemComponent.item, ['cols', 'rows', 'x', 'y']));
-        }
     };
@@ -339,3 +347,3 @@ GridsterComponent.prototype.pixelsToPosition = function (x, y, roundingMethod) {
         itemComponent.$item.y -= 1;
-        if (this.checkCollision(itemComponent)) {
+        if (this.checkCollision(itemComponent.$item)) {
             itemComponent.$item.y += 1;
@@ -368,3 +376,3 @@ return false;
         itemComponent.$item.x -= 1;
-        if (this.checkCollision(itemComponent)) {
+        if (this.checkCollision(itemComponent.$item)) {
             itemComponent.$item.x += 1;
@@ -371,0 +379,0 @@ return false;

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"}],"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"}}}}}}}}]
+[{"__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"}],"getNextPossiblePosition":[{"__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":"reference","name":"item"},"member":"x"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"cols"}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"cols"}},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"x"}}},"right":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"y"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"rows"}}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"rows"}},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"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"}],"getNextPossiblePosition":[{"__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":"reference","name":"item"},"member":"x"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"cols"}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"x"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"cols"}},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"x"}}},"right":{"__symbolic":"binop","operator":"<","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"y"},"right":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"rows"}}}},"right":{"__symbolic":"binop","operator":">","left":{"__symbolic":"binop","operator":"+","left":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"y"},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item"},"member":"rows"}},"right":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"item2"},"member":"y"}}}}}}}}]

dist/gridsterConfig.interface.d.ts

@@ -35,2 +35,3 @@ export declare type GridType = 'fit' | 'scrollVertical' | 'scrollHorizontal' | 'fixed';
         optionsChanged?: Function;
+        getNextPossiblePosition?: Function;
     };
@@ -37,0 +38,0 @@ [propName: string]: any;

dist/gridsterDraggable.service.js

@@ -141,3 +141,3 @@ "use strict";
         this.gridsterItem.$item.y = this.positionY;
-        if (this.gridster.checkGridCollision(this.gridsterItem)) {
+        if (this.gridster.checkGridCollision(this.gridsterItem.$item)) {
             this.gridsterItem.$item.x = this.positionXBackup;
@@ -166,3 +166,3 @@ this.gridsterItem.$item.y = this.positionYBackup;
             this.swap.swapItems();
-            if (this.gridster.checkCollision(this.gridsterItem)) {
+            if (this.gridster.checkCollision(this.gridsterItem.$item)) {
                 this.gridsterItem.$item.x = this.positionXBackup;
@@ -169,0 +169,0 @@ this.gridsterItem.$item.y = this.positionYBackup;

dist/gridsterItem.component.d.ts

@@ -25,2 +25,3 @@ import { OnInit, ElementRef, OnDestroy, EventEmitter, Renderer2 } from '@angular/core';
     resize: GridsterResizable;
+    notPlaced: boolean;
     constructor(el: ElementRef, gridster: GridsterComponent, renderer: Renderer2);
@@ -27,0 +28,0 @@ ngOnInit(): void;

dist/gridsterItem.component.js

@@ -64,3 +64,3 @@ "use strict";
         }
-        this.renderer.setStyle(this.el, 'display', 'block');
+        this.renderer.setStyle(this.el, 'display', this.notPlaced ? 'none' : 'block');
         this.renderer.setStyle(this.el, 'top', this.top + 'px');
@@ -92,3 +92,3 @@ this.renderer.setStyle(this.el, 'left', this.left + 'px');
         }
-        if (this.gridster.checkCollision(this)) {
+        if (this.gridster.checkCollision(this.$item)) {
             this.$item.x = oldValue.x;
@@ -95,0 +95,0 @@ this.$item.y = oldValue.y;

dist/gridsterPush.service.js

@@ -53,3 +53,3 @@ "use strict";
     GridsterPush.prototype.push = function (gridsterItem, direction, pushedBy) {
-        var gridsterItemCollision = this.gridster.checkCollision(gridsterItem, pushedBy);
+        var gridsterItemCollision = this.gridster.checkCollision(gridsterItem.$item, pushedBy.$item);
         if (gridsterItemCollision && gridsterItemCollision !== true &&
@@ -78,3 +78,3 @@ gridsterItemCollision !== this.gridsterItem) {
         gridsterItemCollide.$item.y = gridsterItem.$item.y + gridsterItem.$item.rows;
-        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide, gridsterItem)
+        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide.$item, gridsterItem.$item)
             && this.push(gridsterItemCollide, this.fromNorth, gridsterItem)) {
@@ -93,3 +93,4 @@ gridsterItemCollide.setSize(true);
         gridsterItemCollide.$item.y = gridsterItem.$item.y - gridsterItemCollide.$item.rows;
-        if (this.push(gridsterItemCollide, this.fromSouth, gridsterItem)) {
+        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide.$item, gridsterItem.$item)
+            && this.push(gridsterItemCollide, this.fromSouth, gridsterItem)) {
             gridsterItemCollide.setSize(true);
@@ -107,3 +108,3 @@ this.addToPushed(gridsterItemCollide);
         gridsterItemCollide.$item.x = gridsterItem.$item.x + gridsterItem.$item.cols;
-        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide, gridsterItem)
+        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide.$item, gridsterItem.$item)
             && this.push(gridsterItemCollide, this.fromWest, gridsterItem)) {
@@ -122,3 +123,3 @@ gridsterItemCollide.setSize(true);
         gridsterItemCollide.$item.x = gridsterItem.$item.x - gridsterItemCollide.$item.cols;
-        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide, gridsterItem)
+        if (!gridster_component_1.GridsterComponent.checkCollisionTwoItems(gridsterItemCollide.$item, gridsterItem.$item)
             && this.push(gridsterItemCollide, this.fromEast, gridsterItem)) {
@@ -164,3 +165,3 @@ gridsterItemCollide.setSize(true);
             pushedItem.$item.y = lastPosition.y;
-            if (!this.gridster.findItemWithItem(pushedItem)) {
+            if (!this.gridster.findItemWithItem(pushedItem.$item)) {
                 pushedItem.setSize(true);
@@ -167,0 +168,0 @@ path.splice(j + 1, path.length - 1 - j);

dist/gridsterResizable.service.js

@@ -163,3 +163,3 @@ "use strict";
             this.push.pushItems(this.push.fromSouth);
-            if (this.gridster.checkCollision(this.gridsterItem)) {
+            if (this.gridster.checkCollision(this.gridsterItem.$item)) {
                 this.gridsterItem.$item.y = this.itemBackup[1];
@@ -194,3 +194,3 @@ this.gridsterItem.$item.rows = this.itemBackup[3];
             this.push.pushItems(this.push.fromEast);
-            if (this.gridster.checkCollision(this.gridsterItem)) {
+            if (this.gridster.checkCollision(this.gridsterItem.$item)) {
                 this.gridsterItem.$item.x = this.itemBackup[0];
@@ -222,3 +222,3 @@ this.gridsterItem.$item.cols = this.itemBackup[2];
             this.push.pushItems(this.push.fromNorth);
-            if (this.gridster.checkCollision(this.gridsterItem)) {
+            if (this.gridster.checkCollision(this.gridsterItem.$item)) {
                 this.gridsterItem.$item.rows = this.itemBackup[3];
@@ -247,3 +247,3 @@ this.gridsterItem.renderer.setStyle(this.gridsterItem.el, 'height', this.gridster.positionYToPixels(this.gridsterItem.$item.rows)
             this.push.pushItems(this.push.fromWest);
-            if (this.gridsterItem.$item.cols < 1 || this.gridster.checkCollision(this.gridsterItem)) {
+            if (this.gridsterItem.$item.cols < 1 || this.gridster.checkCollision(this.gridsterItem.$item)) {
                 this.gridsterItem.$item.cols = this.itemBackup[2];
@@ -250,0 +250,0 @@ this.gridsterItem.renderer.setStyle(this.gridsterItem.el, 'width', this.gridster.positionXToPixels(this.gridsterItem.$item.cols)

dist/gridsterSwap.service.js

@@ -23,3 +23,3 @@ "use strict";
             this.swapedItem.$item.y = this.swapedItem.item.y;
-            if (this.gridster.checkCollision(this.swapedItem)) {
+            if (this.gridster.checkCollision(this.swapedItem.$item)) {
                 this.swapedItem.$item.x = x;
@@ -51,3 +51,3 @@ this.swapedItem.$item.y = y;
     GridsterSwap.prototype.checkSwap = function (pushedBy) {
-        var gridsterItemCollision = this.gridster.checkCollision(pushedBy);
+        var gridsterItemCollision = this.gridster.checkCollision(pushedBy.$item);
         if (gridsterItemCollision && gridsterItemCollision !== true) {
@@ -59,3 +59,3 @@ var gridsterItemCollide = gridsterItemCollision;
             pushedBy.$item.y = gridsterItemCollide.item.y;
-            if (this.gridster.checkCollision(gridsterItemCollide) || this.gridster.checkCollision(pushedBy)) {
+            if (this.gridster.checkCollision(gridsterItemCollide.$item) || this.gridster.checkCollision(pushedBy.$item)) {
                 pushedBy.$item.x = gridsterItemCollide.$item.x;
@@ -62,0 +62,0 @@ pushedBy.$item.y = gridsterItemCollide.$item.y;

package.json

 {
   "name": "angular-gridster2",
-  "version": "3.0.2",
+  "version": "3.1.0",
   "license": "MIT",
@@ -64,3 +64,3 @@ "main": "dist/index.js",
     "@types/jasmine": "2.5.53",
-    "@types/node": "8.0.2",
+    "@types/node": "8.0.4",
     "codelyzer": "3.1.1",
@@ -67,0 +67,0 @@ "core-js": "2.4.1",

README.md

@@ -179,2 +179,3 @@ angular-gridster2
     this.options.api.optionsChanged(); // call on change of options after initialization
+    this.options.api.getNextPossiblePosition(item: GridsterItem); // call to get a viable position for item. Returns true if found
 ```
@@ -181,0 +182,0 @@

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

Lines of code

1997

increased by0.66%

Number of lines in readme file

258

increased by0.39%

Worsened metrics

Total package byte prevSize

212104

decreased by-0.21%

No dependency changes