Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 20fc3a3

Browse files
committed
Merge branch 'develop'
2 parents 3440710 + f705110 commit 20fc3a3

File tree

8 files changed

+96
-52
lines changed

8 files changed

+96
-52
lines changed

README.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
gridstack.js
22
============
33

4-
[![Build Status](https://travis-ci.org/troolee/gridstack.js.svg?branch=master)](https://travis-ci.org/troolee/gridstack.js)
4+
[![Build Status](https://travis-ci.org/gridstack/gridstack.js.svg?branch=develop)](https://travis-ci.org/gridstack/gridstack.js)
55
[![Coverage Status](https://coveralls.io/repos/github/troolee/gridstack.js/badge.svg?branch=master)](https://coveralls.io/github/troolee/gridstack.js?branch=master)
66
[![Dependency Status](https://david-dm.org/troolee/gridstack.js.svg)](https://david-dm.org/troolee/gridstack.js)
77
[![devDependency Status](https://david-dm.org/troolee/gridstack.js/dev-status.svg)](https://david-dm.org/troolee/gridstack.js#info=devDependencies)
@@ -49,7 +49,7 @@ Version 1.0 is coming! Check out the blog post here for more information:
4949
Demo and examples
5050
====
5151

52-
Please visit http://troolee.github.io/gridstack.js/ for a demo or check out [these examples](http://troolee.github.io/gridstack.js/demo/).
52+
Please visit http://gridstackjs.com for a demo or check out [these examples](http://gridstackjs.com/demo/).
5353

5454

5555
Usage
@@ -147,7 +147,7 @@ We're working on implementing support for other drag'n'drop libraries through th
147147

148148
## API Documentation
149149

150-
Documentation can be found [here](https://github.com/troolee/gridstack.js/tree/develop/doc).
150+
Documentation can be found [here](https://github.com/gridstack/gridstack.js/tree/develop/doc).
151151

152152

153153
## Touch devices support
@@ -175,7 +175,7 @@ $(function () {
175175
});
176176
```
177177

178-
If you're still experiencing issues on touch devices please check [#444](https://github.com/troolee/gridstack.js/issues/444)
178+
If you're still experiencing issues on touch devices please check [#444](https://github.com/gridstack/gridstack.js/issues/444)
179179

180180

181181
## gridstack.js for specific frameworks
@@ -216,7 +216,7 @@ For 4-column grid it should be:
216216

217217
and so on.
218218

219-
Here is a SASS code snipped which can make life easier (Thanks to @ascendantofrain, [#81](https://github.com/troolee/gridstack.js/issues/81)):
219+
Here is a SASS code snipped which can make life easier (Thanks to @ascendantofrain, [#81](https://github.com/gridstack/gridstack.js/issues/81)):
220220

221221
```sass
222222
.grid-stack-item {
@@ -249,7 +249,7 @@ You can use other than 12 grid width:
249249
$('.grid-stack').gridstack({width: N});
250250
```
251251

252-
See example: [2 grids demo](http://troolee.github.io/gridstack.js/demo/two.html)
252+
See example: [2 grids demo](http://gridstack.github.io/gridstack.js/demo/two.html)
253253

254254
## Override resizable/draggable options
255255

@@ -271,7 +271,7 @@ Note: It's not recommended to enable `nw`, `n`, `ne` resizing handles. Their beh
271271
Support of IE8 is quite limited and is not a goal at this time. As far as IE8 doesn't support DOM Level 2 I cannot manipulate with
272272
CSS stylesheet dynamically. As a workaround you can do the following:
273273

274-
- Create `gridstack-ie8.css` for your configuration (sample for grid with cell height of 60px can be found [here](https://gist.github.com/troolee/6edfea5857f4cd73e6f1)).
274+
- Create `gridstack-ie8.css` for your configuration (sample for grid with cell height of 60px can be found [here](https://gist.github.com/gridstack/6edfea5857f4cd73e6f1)).
275275
- Include this CSS:
276276

277277
```html
@@ -309,7 +309,7 @@ for i in range(N):
309309
```
310310

311311
There are at least two more issues with gridstack in IE8 with jQueryUI resizable (it seems it doesn't work) and
312-
droppable. If you have any suggestions about support of IE8 you are welcome here: https://github.com/troolee/gridstack.js/issues/76
312+
droppable. If you have any suggestions about support of IE8 you are welcome here: https://github.com/gridstack/gridstack.js/issues/76
313313

314314
## Use with require.js
315315

@@ -320,10 +320,10 @@ working properly.
320320
Changes
321321
=====
322322

323-
View our change log [here](https://github.com/troolee/gridstack.js/tree/develop/doc/CHANGES.md).
323+
View our change log [here](https://github.com/gridstack/gridstack.js/tree/develop/doc/CHANGES.md).
324324

325325

326326
The Team
327327
========
328328

329-
gridstack.js is currently maintained by [Pavel Reznikov](https://github.com/troolee) and [Dylan Weiss](https://github.com/radiolips). We appreciate [all contributors](https://github.com/troolee/gridstack.js/graphs/contributors) for help.
329+
gridstack.js is currently maintained by [Pavel Reznikov](https://github.com/troolee) and [Dylan Weiss](https://github.com/radiolips). We appreciate [all contributors](https://github.com/gridstack/gridstack.js/graphs/contributors) for help.

dist/gridstack.all.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/gridstack.js

Lines changed: 41 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,25 @@
106106
height = parseFloat(match[1]);
107107
}
108108
return {height: height, unit: heightUnit};
109+
},
110+
111+
removePositioningStyles: function(el) {
112+
var style = el[0].style;
113+
if (style.position) {
114+
style.removeProperty('position');
115+
}
116+
if (style.left) {
117+
style.removeProperty('left');
118+
}
119+
if (style.top) {
120+
style.removeProperty('top');
121+
}
122+
if (style.width) {
123+
style.removeProperty('width');
124+
}
125+
if (style.height) {
126+
style.removeProperty('height');
127+
}
109128
}
110129
};
111130

@@ -233,6 +252,7 @@
233252
var newY = n.y;
234253
while (newY >= n._origY) {
235254
var collisionNode = _.chain(this.nodes)
255+
.take(i)
236256
.find(_.bind(Utils._didCollide, {n: n, newY: newY}))
237257
.value();
238258

@@ -779,13 +799,14 @@
779799
var onDrag = function(event, ui) {
780800
var el = draggingElement;
781801
var node = el.data('_gridstack_node');
782-
var pos = self.getCellFromPixel(ui.offset, true);
802+
var pos = self.getCellFromPixel({left: event.pageX, top: event.pageY}, true);
783803
var x = Math.max(0, pos.x);
784804
var y = Math.max(0, pos.y);
785805
if (!node._added) {
786806
node._added = true;
787807

788808
node.el = el;
809+
node.autoPosition = true;
789810
node.x = x;
790811
node.y = y;
791812
self.grid.cleanNodes();
@@ -803,14 +824,13 @@
803824
node._beforeDragX = node.x;
804825
node._beforeDragY = node.y;
805826

806-
self._updateContainerHeight();
807-
} else {
808-
if (!self.grid.canMoveNode(node, x, y)) {
809-
return;
810-
}
811-
self.grid.moveNode(node, x, y);
812827
self._updateContainerHeight();
813828
}
829+
if (!self.grid.canMoveNode(node, x, y)) {
830+
return;
831+
}
832+
self.grid.moveNode(node, x, y);
833+
self._updateContainerHeight();
814834
};
815835

816836
this.dd
@@ -869,13 +889,15 @@
869889
$(ui.helper).remove();
870890
node.el = el;
871891
self.placeholder.hide();
892+
Utils.removePositioningStyles(el);
893+
el.find('div.ui-resizable-handle').remove();
894+
872895
el
873896
.attr('data-gs-x', node.x)
874897
.attr('data-gs-y', node.y)
875898
.attr('data-gs-width', node.width)
876899
.attr('data-gs-height', node.height)
877900
.addClass(self.opts.itemClass)
878-
.removeAttr('style')
879901
.enableSelection()
880902
.removeData('draggable')
881903
.removeClass('ui-draggable ui-draggable-dragging ui-draggable-disabled')
@@ -947,14 +969,14 @@
947969
if (typeof maxHeight == 'undefined') {
948970
maxHeight = this._styles._max;
949971
}
972+
if (this._styles._max !== 0 && maxHeight <= this._styles._max) { // Keep this._styles._max increasing
973+
return ;
974+
}
950975
this._initStyles();
951976
this._updateContainerHeight();
952977
if (!this.opts.cellHeight) { // The rest will be handled by CSS
953978
return ;
954979
}
955-
if (this._styles._max !== 0 && maxHeight <= this._styles._max) {
956-
return ;
957-
}
958980

959981
if (!this.opts.verticalMargin || this.opts.cellHeightUnit === this.opts.verticalMarginUnit) {
960982
getHeight = function(nbRows, nbMargins) {
@@ -1008,6 +1030,10 @@
10081030
return;
10091031
}
10101032
var height = this.grid.getGridHeight();
1033+
var minHeight = parseInt(this.container.css('min-height')) / this.cellHeight();
1034+
if (height < minHeight) {
1035+
height = minHeight;
1036+
}
10111037
this.container.attr('data-gs-current-height', height);
10121038
if (!this.opts.cellHeight) {
10131039
return ;
@@ -1170,19 +1196,19 @@
11701196
} else {
11711197
self._clearRemovingTimeout(el);
11721198
if (!node._temporaryRemoved) {
1199+
Utils.removePositioningStyles(o);
11731200
o
11741201
.attr('data-gs-x', node.x)
11751202
.attr('data-gs-y', node.y)
11761203
.attr('data-gs-width', node.width)
1177-
.attr('data-gs-height', node.height)
1178-
.removeAttr('style');
1204+
.attr('data-gs-height', node.height);
11791205
} else {
1206+
Utils.removePositioningStyles(o);
11801207
o
11811208
.attr('data-gs-x', node._beforeDragX)
11821209
.attr('data-gs-y', node._beforeDragY)
11831210
.attr('data-gs-width', node.width)
1184-
.attr('data-gs-height', node.height)
1185-
.removeAttr('style');
1211+
.attr('data-gs-height', node.height);
11861212
node.x = node._beforeDragX;
11871213
node.y = node._beforeDragY;
11881214
self.grid.addNode(node);

dist/gridstack.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/gridstack.min.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

doc/CHANGES.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,9 @@ Change log
2323
- widgets can have their own resize handles. Use `data-gs-resize-handles` element attribute to use. For example, `data-gs-resize-handles="e,w"` will make the particular widget only resize west and east. ([#494](https://github.com/troolee/gridstack.js/issues/494)).
2424
- enable sidebar items to be duplicated properly. Pass `helper: 'clone'` in `draggable` options. ([#661](https://github.com/troolee/gridstack.js/issues/661), ([#396](https://github.com/troolee/gridstack.js/issues/396), ([#499](https://github.com/troolee/gridstack.js/issues/499)).
2525
- fix `staticGrid` grid option ([#743](https://github.com/troolee/gridstack.js/issues/743))
26+
- preserve inline styles when moving/cloning items (thanks silverwind)
27+
- fix bug causing heights not to get set ([#744](https://github.com/troolee/gridstack.js/issues/744))
28+
- allow grid to have min-height, fixes ([#628](https://github.com/troolee/gridstack.js/issues/628))
2629

2730
## v0.3.0 (2017-04-21)
2831

src/gridstack.jQueryUI.js

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -77,13 +77,7 @@
7777

7878
JQueryUIGridStackDragDropPlugin.prototype.droppable = function(el, opts) {
7979
el = $(el);
80-
if (opts === 'disable' || opts === 'enable') {
81-
el.droppable(opts);
82-
} else {
83-
el.droppable({
84-
accept: opts.accept
85-
});
86-
}
80+
el.droppable(opts);
8781
return this;
8882
};
8983

src/gridstack.js

Lines changed: 36 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -109,10 +109,22 @@
109109
},
110110

111111
removePositioningStyles: function(el) {
112-
var style = el[0].style;
113-
if (style.position) style.removeProperty('position');
114-
if (style.left) style.removeProperty('left');
115-
if (style.top) style.removeProperty('top');
112+
var style = el[0].style;
113+
if (style.position) {
114+
style.removeProperty('position');
115+
}
116+
if (style.left) {
117+
style.removeProperty('left');
118+
}
119+
if (style.top) {
120+
style.removeProperty('top');
121+
}
122+
if (style.width) {
123+
style.removeProperty('width');
124+
}
125+
if (style.height) {
126+
style.removeProperty('height');
127+
}
116128
}
117129
};
118130

@@ -240,6 +252,7 @@
240252
var newY = n.y;
241253
while (newY >= n._origY) {
242254
var collisionNode = _.chain(this.nodes)
255+
.take(i)
243256
.find(_.bind(Utils._didCollide, {n: n, newY: newY}))
244257
.value();
245258

@@ -610,6 +623,9 @@
610623
disableResize: opts.disableResize || false,
611624
rtl: 'auto',
612625
removable: false,
626+
removableOptions: _.defaults(opts.removableOptions || {}, {
627+
accept: '.' + opts.itemClass
628+
}),
613629
removeTimeout: 2000,
614630
verticalMarginUnit: 'px',
615631
cellHeightUnit: 'px',
@@ -757,9 +773,7 @@
757773
if (!self.opts.staticGrid && typeof self.opts.removable === 'string') {
758774
var trashZone = $(self.opts.removable);
759775
if (!this.dd.isDroppable(trashZone)) {
760-
this.dd.droppable(trashZone, {
761-
accept: '.' + self.opts.itemClass
762-
});
776+
this.dd.droppable(trashZone, self.opts.removableOptions);
763777
}
764778
this.dd
765779
.on(trashZone, 'dropover', function(event, ui) {
@@ -768,6 +782,7 @@
768782
if (node._grid !== self) {
769783
return;
770784
}
785+
el.data('inTrashZone', true);
771786
self._setupRemovingTimeout(el);
772787
})
773788
.on(trashZone, 'dropout', function(event, ui) {
@@ -776,6 +791,7 @@
776791
if (node._grid !== self) {
777792
return;
778793
}
794+
el.data('inTrashZone', false);
779795
self._clearRemovingTimeout(el);
780796
});
781797
}
@@ -786,13 +802,14 @@
786802
var onDrag = function(event, ui) {
787803
var el = draggingElement;
788804
var node = el.data('_gridstack_node');
789-
var pos = self.getCellFromPixel(ui.offset, true);
805+
var pos = self.getCellFromPixel({left: event.pageX, top: event.pageY}, true);
790806
var x = Math.max(0, pos.x);
791807
var y = Math.max(0, pos.y);
792808
if (!node._added) {
793809
node._added = true;
794810

795811
node.el = el;
812+
node.autoPosition = true;
796813
node.x = x;
797814
node.y = y;
798815
self.grid.cleanNodes();
@@ -810,14 +827,13 @@
810827
node._beforeDragX = node.x;
811828
node._beforeDragY = node.y;
812829

813-
self._updateContainerHeight();
814-
} else {
815-
if (!self.grid.canMoveNode(node, x, y)) {
816-
return;
817-
}
818-
self.grid.moveNode(node, x, y);
819830
self._updateContainerHeight();
820831
}
832+
if (!self.grid.canMoveNode(node, x, y)) {
833+
return;
834+
}
835+
self.grid.moveNode(node, x, y);
836+
self._updateContainerHeight();
821837
};
822838

823839
this.dd
@@ -877,6 +893,7 @@
877893
node.el = el;
878894
self.placeholder.hide();
879895
Utils.removePositioningStyles(el);
896+
el.find('div.ui-resizable-handle').remove();
880897

881898
el
882899
.attr('data-gs-x', node.x)
@@ -1016,6 +1033,10 @@
10161033
return;
10171034
}
10181035
var height = this.grid.getGridHeight();
1036+
var minHeight = parseInt(this.container.css('min-height')) / this.cellHeight();
1037+
if (height < minHeight) {
1038+
height = minHeight;
1039+
}
10191040
this.container.attr('data-gs-current-height', height);
10201041
if (!this.opts.cellHeight) {
10211042
return ;
@@ -1079,7 +1100,7 @@
10791100
}
10801101

10811102
if (event.type == 'drag') {
1082-
if (x < 0 || x >= self.grid.width || y < 0 || (!self.grid.float && y > self.grid.getGridHeight())) {
1103+
if (el.data('inTrashZone') || x < 0 || x >= self.grid.width || y < 0 || (!self.grid.float && y > self.grid.getGridHeight())) {
10831104
if (!node._temporaryRemoved) {
10841105
if (self.opts.removable === true) {
10851106
self._setupRemovingTimeout(el);

0 commit comments

Comments
 (0)