Skip to content

Commit 39aff94

Browse files
adumesnyadumesny
committed
enableMove() fix
* fix #1658 * we now set the grid options BEFORE we update each item as that override * enableMove() and enableResize() no longer take a second optional param as we must set grid options for things to work (if you want to enable current items but not change the grid itself, there is already the `movable('.grid-stack-item')` method that doesn't change the grid (no need for 2 ways) * did some more cleanup and added test case.
1 parent 0ea5bc8 commit 39aff94

File tree

7 files changed

+170
-147
lines changed

7 files changed

+170
-147
lines changed

‎doc/CHANGES.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ Change log
55
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
66
**Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)*
77

8+
- [4.0.1-dev](#401-dev)
89
- [4.0.1 (2021-3-20)](#401-2021-3-20)
910
- [4.0.0 (2021-3-19)](#400-2021-3-19)
1011
- [3.3.0 (2021-2-2)](#330-2021-2-2)
@@ -49,6 +50,9 @@ Change log
4950
- [v0.1.0 (2014-11-18)](#v010-2014-11-18)
5051

5152
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
53+
## 4.0.1-dev
54+
55+
- fix [#1658](https://github.com/gridstack/gridstack.js/issues/1658) `enableMove(T/F)` not working correctly
5256
## 4.0.1 (2021-3-20)
5357

5458
- fix [#1669](https://github.com/gridstack/gridstack.js/issues/1669) JQ resize broken

‎doc/README.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,8 @@ gridstack.js API
3838
- [`destroy([removeDOM])`](#destroyremovedom)
3939
- [`disable()`](#disable)
4040
- [`enable()`](#enable)
41-
- [`enableMove(doEnable, includeNewWidgets)`](#enablemovedoenable-includenewwidgets)
42-
- [`enableResize(doEnable, includeNewWidgets)`](#enableresizedoenable-includenewwidgets)
41+
- [`enableMove(doEnable)`](#enablemovedoenable)
42+
- [`enableResize(doEnable)`](#enableresizedoenable)
4343
- [`float(val?)`](#floatval)
4444
- [`getCellHeight()`](#getcellheight)
4545
- [`getCellFromPixel(position[, useOffset])`](#getcellfrompixelposition-useoffset)
@@ -403,22 +403,22 @@ grid.enableMove(true);
403403
grid.enableResize(true);
404404
```
405405

406-
### `enableMove(doEnable, includeNewWidgets)`
406+
### `enableMove(doEnable)`
407407

408-
Enables/disables widget moving. `includeNewWidgets` will force new widgets to be draggable as per `doEnable`'s value by changing the `disableDrag` grid option (default: true). This is a shortcut for:
408+
Enables/disables widget moving (default: true), and setting the `disableDrag` grid option. This is a shortcut for:
409409

410410
```js
411-
grid.movable('.grid-stack-item', doEnable);
412411
grid.opts.disableDrag = !doEnable;
412+
grid.movable('.grid-stack-item', doEnable);
413413
```
414414

415-
### `enableResize(doEnable, includeNewWidgets)`
415+
### `enableResize(doEnable)`
416416

417-
Enables/disables widget resizing. `includeNewWidgets` will force new widgets to be resizable as per `doEnable`'s value by changing the `disableResize` grid option (default: true). This is a shortcut for:
417+
Enables/disables widget sizing (default: true), and setting the `disableResize` grid option. This is a shortcut for:
418418

419419
```js
420-
grid.resizable('.grid-stack-item', doEnable);
421420
grid.opts.disableResize = !doEnable;
421+
grid.resizable('.grid-stack-item', doEnable);
422422
```
423423

424424
### `float(val?)`
@@ -445,7 +445,7 @@ Returns an object with properties `x` and `y` i.e. the column and row in the gri
445445

446446
### `getGridItems(): GridItemHTMLElement[]`
447447

448-
Return list of GridItem HTML dom elements (excluding temporary placeholder)
448+
Return list of GridItem HTML elements (excluding temporary placeholder) in DOM order, wether they are node items yet or not (looks by class)
449449

450450
### `getMargin()`
451451

‎spec/e2e/html/1658_enableMove.html

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>Float grid demo</title>
8+
9+
<link rel="stylesheet" href="../../../demo/demo.css"/>
10+
<script src="../../../dist/gridstack-h5.js"></script>
11+
12+
</head>
13+
<body>
14+
<div class="container-fluid">
15+
<h1>Float grid demo</h1>
16+
<div>
17+
<a class="btn btn-primary" onClick="addNewWidget()" href="#">Add Widget</a>
18+
<a class="btn btn-primary" onclick="toggleFloat()" id="float" href="#">float: true</a>
19+
<a class="btn btn-primary" onclick="grid.enableMove(true)" href="#">enable</a>
20+
<a class="btn btn-primary" onclick="grid.disable()" href="#">disable</a>
21+
</div>
22+
<br><br>
23+
<div class="grid-stack"></div>
24+
</div>
25+
<script src="../../../demo/events.js"></script>
26+
<script type="text/javascript">
27+
let grid = GridStack.init({disableResize: true, disableDrag: true});
28+
addEvents(grid);
29+
30+
let items = [
31+
{x: 1, y: 1},
32+
{x: 2, y: 2, w: 3},
33+
{x: 4, y: 2},
34+
{x: 3, y: 1, h: 2},
35+
{x: 0, y: 6, w: 2, h: 2}
36+
];
37+
let count = 0;
38+
39+
addNewWidget = function() {
40+
let n = items[count] || {
41+
x: Math.round(12 * Math.random()),
42+
y: Math.round(5 * Math.random()),
43+
w: Math.round(1 + 3 * Math.random()),
44+
h: Math.round(1 + 3 * Math.random())
45+
};
46+
n.content = String(count++);
47+
grid.addWidget(n);
48+
};
49+
50+
toggleFloat = function() {
51+
grid.float(! grid.getFloat());
52+
document.querySelector('#float').innerHTML = 'float: ' + grid.getFloat();
53+
};
54+
addNewWidget();
55+
</script>
56+
</body>
57+
</html>

‎spec/gridstack-spec.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1420,7 +1420,7 @@ describe('gridstack', function() {
14201420
}
14211421
expect(grid.opts.disableDrag).toBe(true);
14221422

1423-
grid.enableMove(true, true);
1423+
grid.enableMove(true);
14241424
for (let i = 0; i < items.length; i++) {
14251425
expect(items[i].classList.contains('ui-draggable-disabled')).toBe(false);
14261426
}
@@ -1438,11 +1438,11 @@ describe('gridstack', function() {
14381438
}
14391439
expect(grid.opts.disableDrag).toBe(false);
14401440

1441-
grid.enableMove(false, false);
1441+
grid.enableMove(false);
14421442
for (let i = 0; i < items.length; i++) {
14431443
expect(items[i].classList.contains('ui-draggable-disabled')).toBe(true);
14441444
}
1445-
expect(grid.opts.disableDrag).toBe(false);
1445+
expect(grid.opts.disableDrag).toBe(true);
14461446
});
14471447
});
14481448

0 commit comments

Comments
 (0)