Merge pull request #2350 from adumesny/master

grid NoMove vs item NoMove support

Author: adumesny

doc/CHANGES.md

@@ -5,6 +5,7 @@ Change log
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
 **Table of Contents**  *generated with [DocToc](http://doctoc.herokuapp.com/)*
 
+- [8.2.1-dev (TBD)](#821-dev-tbd)
 - [8.2.1 (2023-05-26)](#821-2023-05-26)
 - [8.2.0 (2023-05-24)](#820-2023-05-24)
 - [8.1.2 (2023-05-22)](#812-2023-05-22)
@@ -89,6 +90,9 @@ Change log
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
+## 8.2.1-dev (TBD)
+* fix [#2349](https://github.com/gridstack/gridstack.js/issues/2349) grid NoMove vs item NoMove support
+
 ## 8.2.1 (2023-05-26)
 * fix: make sure `removeNode()` uses internal _id (unique) and not node itself (since we clone those often)
 * fix: after calling `addRemoveCB` make sure we don't makeWidget() (incorrectly) a second time

src/gridstack.ts

@@ -1134,8 +1134,8 @@ export class GridStack {
    * @param recurse true (default) if sub-grids also get updated
    */
   public setStatic(val: boolean, updateClass = true, recurse = true): GridStack {
-    if (this.opts.staticGrid === val) return this;
-    this.opts.staticGrid = val;
+    if (!!this.opts.staticGrid === val) return this;
+    val ? this.opts.staticGrid = true : delete this.opts.staticGrid;
     this._setupRemoveDrop();
     this._setupAcceptWidget();
     this.engine.nodes.forEach(n => {
@@ -1686,31 +1686,31 @@ export class GridStack {
    * Enables/Disables dragging by the user of specific grid element. If you want all items, and have it affect future items, use enableMove() instead. No-op for static grids.
    * IF you are looking to prevent an item from moving (due to being pushed around by another during collision) use locked property instead.
    * @param els widget or selector to modify.
-   * @param val if true widget will be draggable.
+   * @param val if true widget will be draggable, assuming the parent grid isn't noMove or static.
    */
   public movable(els: GridStackElement, val: boolean): GridStack {
     if (this.opts.staticGrid) return this; // can't move a static grid!
     GridStack.getElements(els).forEach(el => {
-      let node = el.gridstackNode;
-      if (!node) return;
-      if (val) delete node.noMove; else node.noMove = true;
-      this._prepareDragDropByNode(node); // init DD if need be, and adjust
+      let n = el.gridstackNode;
+      if (!n) return;
+      val ? delete n.noMove : n.noMove = true;
+      this._prepareDragDropByNode(n); // init DD if need be, and adjust
     });
     return this;
   }
 
   /**
    * Enables/Disables user resizing of specific grid element. If you want all items, and have it affect future items, use enableResize() instead. No-op for static grids.
    * @param els  widget or selector to modify
-   * @param val  if true widget will be resizable.
+   * @param val  if true widget will be resizable, assuming the parent grid isn't noResize or static.
    */
   public resizable(els: GridStackElement, val: boolean): GridStack {
     if (this.opts.staticGrid) return this; // can't resize a static grid!
     GridStack.getElements(els).forEach(el => {
-      let node = el.gridstackNode;
-      if (!node) return;
-      if (val) delete node.noResize; else node.noResize = true;
-      this._prepareDragDropByNode(node); // init DD if need be, and adjust
+      let n = el.gridstackNode;
+      if (!n) return;
+      val ? delete n.noResize : n.noResize = true;
+      this._prepareDragDropByNode(n); // init DD if need be, and adjust
     });
     return this;
   }
@@ -1728,7 +1728,7 @@ export class GridStack {
   public disable(recurse = true): GridStack {
     if (this.opts.staticGrid) return;
     this.enableMove(false, recurse);
-    this.enableResize(false, recurse);// @ts-ignore
+    this.enableResize(false, recurse);
     this._triggerEvent('disable');
     return this;
   }
@@ -1744,20 +1744,20 @@ export class GridStack {
   public enable(recurse = true): GridStack {
     if (this.opts.staticGrid) return;
     this.enableMove(true, recurse);
-    this.enableResize(true, recurse);// @ts-ignore
+    this.enableResize(true, recurse);
     this._triggerEvent('enable');
     return this;
   }
 
   /**
-   * Enables/disables widget moving. No-op for static grids.
+   * Enables/disables widget moving. No-op for static grids, and locally defined items still overrule
    * @param recurse true (default) if sub-grids also get updated
    */
   public enableMove(doEnable: boolean, recurse = true): GridStack {
     if (this.opts.staticGrid) return this; // can't move a static grid!
-    this.opts.disableDrag = !doEnable; // FIRST before we update children as grid overrides #1658
+    doEnable ? delete this.opts.disableDrag : this.opts.disableDrag = true; // FIRST before we update children as grid overrides #1658
     this.engine.nodes.forEach(n => {
-      this.movable(n.el, doEnable);
+      this._prepareDragDropByNode(n);
       if (n.subGrid && recurse) n.subGrid.enableMove(doEnable, recurse);
     });
     return this;
@@ -1769,9 +1769,9 @@ export class GridStack {
    */
   public enableResize(doEnable: boolean, recurse = true): GridStack {
     if (this.opts.staticGrid) return this; // can't size a static grid!
-    this.opts.disableResize = !doEnable; // FIRST before we update children as grid overrides #1658
+    doEnable ? delete this.opts.disableResize : this.opts.disableResize = true; // FIRST before we update children as grid overrides #1658
     this.engine.nodes.forEach(n => {
-      this.resizable(n.el, doEnable);
+      this._prepareDragDropByNode(n);
       if (n.subGrid && recurse) n.subGrid.enableResize(doEnable, recurse);
     });
     return this;