gridstack#550 gridstack#607

radiolips · Apr 21, 2017 · 1bc10c1 · 1bc10c1
1 parent 66f46ce
commit 1bc10c1
Show file tree

Hide file tree

Showing 6 changed files with 57 additions and 30 deletions.
diff --git a/README.md b/README.md
@@ -509,9 +509,14 @@ Changes
 
 #### v0.3.0-dev (Development Version)
 
-- trigger custom event for resizestop (gsresizestop) ([#577](https://github.com/troolee/gridstack.js/issues/577)).
-- prevent dragging/resizing in oneColumnMode ([#593](https://github.com/troolee/gridstack.js/issues/593)).
-- add oneColumnModeClass option to grid.
+- remove placeholder when dragging widget below grid (already worked when dragging left, above, and to the right of grid).
+- prevent extra checks for removing widget when dragging off grid.
+- trigger `added` when a widget is added via dropping from one grid to another.
+- trigger `removed` when a widget is removed via dropping from one grid to another.
+- trigger `removed` when a widget is removed via dropping on a removable zone ([#607](https://github.com/troolee/gridstack.js/issues/607) and [#550])(https://github.com/troolee/gridstack.js/issues/550)).
+- trigger custom event for `resizestop` called `gsresizestop` ([#577](https://github.com/troolee/gridstack.js/issues/577) and [#398](https://github.com/troolee/gridstack.js/issues/398)).
+- prevent dragging/resizing in `oneColumnMode` ([#593](https://github.com/troolee/gridstack.js/issues/593)).
+- add `oneColumnModeClass` option to grid.
 - remove 768px CSS styles, moved to grid-stack-one-column-mode class.
 - add max-width override on grid-stck-one-column-mode ([#462](https://github.com/troolee/gridstack.js/issues/462)).
 - add internal function`isNodeChangedPosition`, minor optimization to move/drag.

diff --git a/dist/gridstack.all.js b/dist/gridstack.all.js
diff --git a/dist/gridstack.js b/dist/gridstack.js
@@ -859,6 +859,10 @@
                     node._grid = self;
                     var el = $(ui.draggable).clone(false);
                     el.data('_gridstack_node', node);
+                    var originalNode = $(ui.draggable).data('_gridstack_node_orig');
+                    if (typeof originalNode !== 'undefined') {
+                        originalNode._grid._triggerRemoveEvent();
+                    }
                     $(ui.draggable).remove();
                     node.el = el;
                     self.placeholder.hide();
@@ -876,6 +880,8 @@
                     self.container.append(el);
                     self._prepareElementsByNode(el, node);
                     self._updateContainerHeight();
+                    self.grid._addedNodes.push(node);
+                    self._triggerAddEvent();
                     self._triggerChangeEvent();
 
                     self.grid.endUpdate();
@@ -1059,20 +1065,22 @@
             }
 
             if (event.type == 'drag') {
-                if (x < 0 || x >= self.grid.width || y < 0) {
-                    if (self.opts.removable === true) {
-                        self._setupRemovingTimeout(el);
-                    }
+                if (x < 0 || x >= self.grid.width || y < 0 || (!self.grid.float && y > self.grid.getGridHeight())) {
+                    if (!node._temporaryRemoved) {
+                        if (self.opts.removable === true) {
+                            self._setupRemovingTimeout(el);
+                        }
 
-                    x = node._beforeDragX;
-                    y = node._beforeDragY;
+                        x = node._beforeDragX;
+                        y = node._beforeDragY;
 
-                    self.placeholder.detach();
-                    self.placeholder.hide();
-                    self.grid.removeNode(node);
-                    self._updateContainerHeight();
+                        self.placeholder.detach();
+                        self.placeholder.hide();
+                        self.grid.removeNode(node);
+                        self._updateContainerHeight();
 
-                    node._temporaryRemoved = true;
+                        node._temporaryRemoved = true;
+                    }
                 } else {
                     self._clearRemovingTimeout(el);
 
@@ -1149,6 +1157,8 @@
 
             if (node._isAboutToRemove) {
                 forceNotify = true;
+                var gridToNotify = el.data('_gridstack_node')._grid;
+                gridToNotify._triggerRemoveEvent();
                 el.removeData('_gridstack_node');
                 el.remove();
             } else {
@@ -1183,6 +1193,7 @@
                     $(el).data('gridstack').onResizeHandler();
                 });
                 o.find('.grid-stack-item').trigger('resizestop');
+                o.find('.grid-stack-item').trigger('gsresizestop');
             }
             if (event.type == 'resizestop') {
                 self.container.trigger('gsresizestop', o);

diff --git a/dist/gridstack.min.js b/dist/gridstack.min.js
diff --git a/dist/gridstack.min.map b/dist/gridstack.min.map
diff --git a/src/gridstack.js b/src/gridstack.js
@@ -859,6 +859,10 @@
                     node._grid = self;
                     var el = $(ui.draggable).clone(false);
                     el.data('_gridstack_node', node);
+                    var originalNode = $(ui.draggable).data('_gridstack_node_orig');
+                    if (typeof originalNode !== 'undefined') {
+                        originalNode._grid._triggerRemoveEvent();
+                    }
                     $(ui.draggable).remove();
                     node.el = el;
                     self.placeholder.hide();
@@ -876,6 +880,8 @@
                     self.container.append(el);
                     self._prepareElementsByNode(el, node);
                     self._updateContainerHeight();
+                    self.grid._addedNodes.push(node);
+                    self._triggerAddEvent();
                     self._triggerChangeEvent();
 
                     self.grid.endUpdate();
@@ -1059,20 +1065,22 @@
             }
 
             if (event.type == 'drag') {
-                if (x < 0 || x >= self.grid.width || y < 0) {
-                    if (self.opts.removable === true) {
-                        self._setupRemovingTimeout(el);
-                    }
+                if (x < 0 || x >= self.grid.width || y < 0 || (!self.grid.float && y > self.grid.getGridHeight())) {
+                    if (!node._temporaryRemoved) {
+                        if (self.opts.removable === true) {
+                            self._setupRemovingTimeout(el);
+                        }
 
-                    x = node._beforeDragX;
-                    y = node._beforeDragY;
+                        x = node._beforeDragX;
+                        y = node._beforeDragY;
 
-                    self.placeholder.detach();
-                    self.placeholder.hide();
-                    self.grid.removeNode(node);
-                    self._updateContainerHeight();
+                        self.placeholder.detach();
+                        self.placeholder.hide();
+                        self.grid.removeNode(node);
+                        self._updateContainerHeight();
 
-                    node._temporaryRemoved = true;
+                        node._temporaryRemoved = true;
+                    }
                 } else {
                     self._clearRemovingTimeout(el);
 
@@ -1149,6 +1157,8 @@
 
             if (node._isAboutToRemove) {
                 forceNotify = true;
+                var gridToNotify = el.data('_gridstack_node')._grid;
+                gridToNotify._triggerRemoveEvent();
                 el.removeData('_gridstack_node');
                 el.remove();
             } else {
@@ -1183,6 +1193,7 @@
                     $(el).data('gridstack').onResizeHandler();
                 });
                 o.find('.grid-stack-item').trigger('resizestop');
+                o.find('.grid-stack-item').trigger('gsresizestop');
             }
             if (event.type == 'resizestop') {
                 self.container.trigger('gsresizestop', o);