* when swapping shapes in maxRow grid, make sure we still check for 50% coverage

adumesny · adumesny · commit 6b8c36169f65 · 2022-09-23T08:02:14.000-07:00
diff --git a/doc/CHANGES.md b/doc/CHANGES.md
@@ -73,6 +73,7 @@ Change log
 
 ## 6.0.1-dev (TBD)
 * fixed [#2034](https://github.com/gridstack/gridstack.js/issues/2034) `removeWidget()` breaking resize handle feedback
+* fixed [#2043](https://github.com/gridstack/gridstack.js/issues/2043) when swapping shapes in maxRow grid, make sure we still check for 50% coverage
 
 ## 6.0.1 (2022-08-27)
 * fixed `float(val)` to set on grid and engine, so save() will read it.
diff --git a/src/dd-resizable.ts b/src/dd-resizable.ts
@@ -120,7 +120,7 @@ export class DDResizable extends DDBaseImplement implements HTMLElementExtendOpt
       this.el.removeEventListener('mouseout', this._mouseOut);
       if (DDManager.overResizeElement === this) {
         delete DDManager.overResizeElement;
-      }  
+      }
     }
     return this;
   }
diff --git a/src/gridstack-engine.ts b/src/gridstack-engine.ts
@@ -175,6 +175,7 @@ export class GridStackEngine {
         collide = n;
       }
     });
+    o.collide = collide; // save it so we don't have to find it again
     return collide;
   }
 
@@ -541,12 +542,12 @@ export class GridStackEngine {
     });
     if (!clonedNode) return false;
 
-    // make sure we are still valid size
-    let canMove = clone.moveNode(clonedNode, o) && clone.getRow() <= this.maxRow;
-    // turns out we can't grow, then see if we can swap instead (ex: full grid) if we're not resizing
-    if (!canMove && !o.resizing) {
-      let collide = this.collide(node, o);
-      if (collide && this.swap(node, collide)) {
+    // check if we're covering 50% collision and could move
+    let canMove = clone.moveNode(clonedNode, o);
+    // make sure we are still valid grid max, else check if we can force a swap (float=true, or different shapes) on non-resize
+    if (!o.resizing && canMove && o.collide && this.float && clone.getRow() > this.maxRow) {
+      let collide = o.collide.el.gridstackNode; // find the source node the clone collided with
+      if (this.swap(node, collide)) { // swaps and mark dirty
         this._notify();
         return true;
       }
diff --git a/src/types.ts b/src/types.ts
@@ -253,6 +253,8 @@ export interface GridStackMoveOpts extends GridStackPosition {
   rect?: GridStackPosition;
   /** true if we're live resizing */
   resizing?: boolean;
+  /** best node (most coverage) we collied with */
+  collide?: GridStackNode;
 }
 
 export interface GridStackPosition {

Original file line number	Diff line number	Diff line change
`@@ -120,7 +120,7 @@ export class DDResizable extends DDBaseImplement implements HTMLElementExtendOpt`
`120`	`120`	`this.el.removeEventListener('mouseout', this._mouseOut);`
`121`	`121`	`if (DDManager.overResizeElement === this) {`
`122`	`122`	`delete DDManager.overResizeElement;`
`123`		`- }`
	`123`	`+ }`
`124`	`124`	`}`
`125`	`125`	`return this;`
`126`	`126`	`}`
Original file line number	Diff line number	Diff line change
`@@ -253,6 +253,8 @@ export interface GridStackMoveOpts extends GridStackPosition {`
`253`	`253`	`rect?: GridStackPosition;`
`254`	`254`	`/** true if we're live resizing */`
`255`	`255`	`resizing?: boolean;`
	`256`	`+ /** best node (most coverage) we collied with */`
	`257`	`+ collide?: GridStackNode;`
`256`	`258`	`}`
`257`	`259`
`258`	`260`	`export interface GridStackPosition {`