angular-gridster2 - npm Package Compare versions

Comparing version 2.7.0 to 2.7.1

dist/gridster.component.d.ts

@@ -7,3 +7,2 @@ import { OnInit, ElementRef, OnDestroy, Renderer2 } from '@angular/core';
     options: GridsterConfig;
-    detectScrollBarLayout: () => void;
     calculateLayoutDebounce: Function;
@@ -26,3 +25,2 @@ onResizeFunction: (event: any) => void;
     };
-    transitionend: Function;
     windowResize: Function;
@@ -36,3 +34,3 @@ private cleanCallback;
     onResize(): void;
-    detectScrollBar(): void;
+    checkIfToResize(): boolean;
     setGridSize(): void;
@@ -39,0 +37,0 @@ setGridDimensions(): void;

dist/gridster.component.js

@@ -28,5 +28,3 @@ "use strict";
         this.setGridSize();
-        this.detectScrollBarLayout = gridsterUtils_service_1.GridsterUtils.debounce(this.detectScrollBar.bind(this), 50);
         this.calculateLayoutDebounce = gridsterUtils_service_1.GridsterUtils.debounce(this.calculateLayout.bind(this), 5);
-        this.transitionend = this.renderer.listen(this.el, 'transitionend', this.detectScrollBarLayout);
         this.calculateLayoutDebounce();
@@ -38,5 +36,13 @@ this.onResizeFunction = this.onResize.bind(this);
     GridsterComponent.prototype.ngDoCheck = function () {
-        var clientWidth = this.el.clientWidth;
-        var clientHeight = this.el.clientHeight;
-        if (clientWidth !== this.state.curWidth || clientHeight !== this.state.curHeight) {
+        var height;
+        var width;
+        if (this.state.options.gridType === 'fit' && !this.state.mobile) {
+            width = this.el.offsetWidth;
+            height = this.el.offsetHeight;
+        }
+        else {
+            width = this.el.clientWidth;
+            height = this.el.clientHeight;
+        }
+        if ((width !== this.state.curWidth || height !== this.state.curHeight) && this.checkIfToResize()) {
             this.onResize();
@@ -51,3 +57,2 @@ }
         this.windowResize();
-        this.transitionend();
         if (typeof this.cleanCallback === 'function') {
@@ -63,3 +68,3 @@ this.cleanCallback();
     ;
-    GridsterComponent.prototype.detectScrollBar = function () {
+    GridsterComponent.prototype.checkIfToResize = function () {
         var clientWidth = this.el.clientWidth;
@@ -71,23 +76,23 @@ var offsetWidth = this.el.offsetWidth;
         var scrollHeight = this.el.scrollHeight;
-        var verticalScrollPresent = clientWidth < offsetWidth &&
-            offsetHeight - clientHeight <
-                scrollWidth - offsetWidth;
-        var horizontalScrollPresent = clientHeight < offsetHeight &&
-            offsetWidth - clientWidth <
-                scrollHeight - offsetHeight;
-        if (this.state.scrollBarPresent && !verticalScrollPresent && !horizontalScrollPresent) {
-            this.state.scrollBarPresent = !this.state.scrollBarPresent;
-            this.onResize();
+        var verticalScrollPresent = clientWidth < offsetWidth && scrollHeight > offsetHeight && scrollHeight - offsetHeight < offsetWidth - clientWidth;
+        var horizontalScrollPresent = clientHeight < offsetHeight && scrollWidth > offsetWidth && scrollWidth - offsetWidth < offsetHeight - clientHeight;
+        if (verticalScrollPresent) {
+            return false;
         }
-        else if (!this.state.scrollBarPresent && (verticalScrollPresent || horizontalScrollPresent)) {
-            this.state.scrollBarPresent = !this.state.scrollBarPresent;
-            this.onResize();
-        }
+        return !horizontalScrollPresent;
     };
     ;
     GridsterComponent.prototype.setGridSize = function () {
-        var clientWidth = this.el.clientWidth;
-        var clientHeight = this.el.clientHeight;
-        this.state.curWidth = clientWidth;
-        this.state.curHeight = clientHeight;
+        var width = this.el.clientWidth;
+        var height = this.el.clientHeight;
+        if (this.state.options.gridType === 'fit' && !this.state.mobile) {
+            width = this.el.offsetWidth;
+            height = this.el.offsetHeight;
+        }
+        else {
+            width = this.el.clientWidth;
+            height = this.el.clientHeight;
+        }
+        this.state.curWidth = width;
+        this.state.curHeight = height;
     };
@@ -170,3 +175,3 @@ ;
         }
-        this.detectScrollBarLayout();
+        setTimeout(this.ngDoCheck.bind(this), 100);
     };
@@ -173,0 +178,0 @@ ;

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":"<ng-content></ng-content><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; }  :host gridster-preview {   background: rgba(0, 0, 0, 0.15);   position: absolute; }"]}]}],"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"}],"detectScrollBar":[{"__symbolic":"method"}],"setGridSize":[{"__symbolic":"method"}],"setGridDimensions":[{"__symbolic":"method"}],"calculateLayout":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"removeItem":[{"__symbolic":"method"}],"checkCollision":[{"__symbolic":"method"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<ng-content></ng-content><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; }  :host gridster-preview {   background: rgba(0, 0, 0, 0.15);   position: absolute; }"]}]}],"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"}],"detectScrollBar":[{"__symbolic":"method"}],"setGridSize":[{"__symbolic":"method"}],"setGridDimensions":[{"__symbolic":"method"}],"calculateLayout":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"removeItem":[{"__symbolic":"method"}],"checkCollision":[{"__symbolic":"method"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<ng-content></ng-content><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; }  :host gridster-preview {   background: rgba(0, 0, 0, 0.15);   position: absolute; }"]}]}],"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"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"GridsterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"gridster","template":"<ng-content></ng-content><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; }  :host gridster-preview {   background: rgba(0, 0, 0, 0.15);   position: absolute; }"]}]}],"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"}],"findItemWithItem":[{"__symbolic":"method"}],"autoPositionItem":[{"__symbolic":"method"}],"pixelsToPosition":[{"__symbolic":"method"}],"positionXToPixels":[{"__symbolic":"method"}],"positionYToPixels":[{"__symbolic":"method"}],"checkCompactUp":[{"__symbolic":"method"}],"moveUpTillCollision":[{"__symbolic":"method"}],"checkCompactLeft":[{"__symbolic":"method"}],"moveLeftTillCollision":[{"__symbolic":"method"}]}}}}]

package.json

 {
   "name": "angular-gridster2",
-  "version": "2.7.0",
+  "version": "2.7.1",
   "license": "MIT",
@@ -13,2 +13,3 @@ "main": "dist/index.js",
     "start": "ng serve",
+    "serve": "ng serve",
     "build": "ng build",
@@ -59,3 +60,3 @@ "test": "ng test",
     "@angular/language-service": "4.0.1",
-    "@angular/material": "2.0.0-beta.2",
+    "@angular/material": "2.0.0-beta.3",
     "@angular/platform-browser": "4.0.1",
@@ -62,0 +63,0 @@ "@angular/platform-browser-dynamic": "4.0.1",

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

161468

increased by0.03%

Lines of code

1492

increased by0.2%

No dependency changes