From 3c447eb7e0935eedfa3ebcd7cd30661518270c30 Mon Sep 17 00:00:00 2001 From: Alain Dumesny Date: Sat, 8 Oct 2022 15:15:10 -0700 Subject: [PATCH 1/3] fix #2055 maxRow=1 resize outside * fix bug introduced when fixing #2043 (checking for 50% coverage before swap) --- doc/CHANGES.md | 4 ++++ src/gridstack-engine.ts | 8 ++++---- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/doc/CHANGES.md b/doc/CHANGES.md index 04c2177fa..0fd523e86 100644 --- a/doc/CHANGES.md +++ b/doc/CHANGES.md @@ -5,6 +5,7 @@ Change log **Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)* +- [6.0.2-dev (TBD)](#602-dev-tbd) - [6.0.2 (2022-09-23)](#602-2022-09-23) - [6.0.1 (2022-08-27)](#601-2022-08-27) - [6.0.0 (2022-08-21)](#600-2022-08-21) @@ -71,6 +72,9 @@ Change log +## 6.0.2-dev (TBD) +* fixed [#2055](https://github.com/gridstack/gridstack.js/issues/2055) maxRow=1 resize outside + ## 6.0.2 (2022-09-23) * 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 diff --git a/src/gridstack-engine.ts b/src/gridstack-engine.ts index e14fe6dd5..6919de678 100644 --- a/src/gridstack-engine.ts +++ b/src/gridstack-engine.ts @@ -543,10 +543,10 @@ export class GridStackEngine { if (!clonedNode) return false; // 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 + let canMove = clone.moveNode(clonedNode, o) && clone.getRow() <= this.maxRow; + // else check if we can force a swap (float=true, or different shapes) on non-resize + if (!canMove && !o.resizing && o.collide) { + let collide = o.collide.el.gridstackNode; // find the source node the clone collided with at 50% if (this.swap(node, collide)) { // swaps and mark dirty this._notify(); return true; From b6e5b39b79e74ee9d45e9641ae10122c44ee2db7 Mon Sep 17 00:00:00 2001 From: Alain Dumesny Date: Sat, 8 Oct 2022 17:13:55 -0700 Subject: [PATCH 2/3] Can't enter text in textarea * fix for #2054 * make sure to prevent mousedown handling over known list of tags (like jqueryui did) --- demo/serialization.html | 3 ++- doc/CHANGES.md | 3 ++- src/dd-draggable.ts | 17 ++++++++++++----- 3 files changed, 16 insertions(+), 7 deletions(-) diff --git a/demo/serialization.html b/demo/serialization.html index d420addbd..adaadace0 100644 --- a/demo/serialization.html +++ b/demo/serialization.html @@ -30,6 +30,7 @@

Serialization demo

}); grid.on('added removed change', function(e, items) { + if (!items) return; let str = ''; items.forEach(function(item) { str += ' (x,y)=' + item.x + ',' + item.y; }); console.log(e.type + ' ' + items.length + ' items:' + str ); @@ -37,7 +38,7 @@

Serialization demo

let serializedData = [ {x: 0, y: 0, w: 2, h: 2, id: '0'}, - {x: 3, y: 1, h: 2, id: '1', content: ""}, + {x: 3, y: 1, h: 2, id: '1', content: "
text area
Input Field
"}, {x: 4, y: 1, id: '2'}, {x: 2, y: 3, w: 3, id: '3'}, {x: 1, y: 3, id: '4'} diff --git a/doc/CHANGES.md b/doc/CHANGES.md index 0fd523e86..9dbf71ef3 100644 --- a/doc/CHANGES.md +++ b/doc/CHANGES.md @@ -73,7 +73,8 @@ Change log ## 6.0.2-dev (TBD) -* fixed [#2055](https://github.com/gridstack/gridstack.js/issues/2055) maxRow=1 resize outside +* fixed [#2055](https://github.com/gridstack/gridstack.js/issues/2055) maxRow=1 resize outside (broke in 6.0.1) +* fixed [#2054](https://github.com/gridstack/gridstack.js/issues/2054) Can't enter text in textarea/input (broke in v6) ## 6.0.2 (2022-09-23) * fixed [#2034](https://github.com/gridstack/gridstack.js/issues/2034) `removeWidget()` breaking resize handle feedback diff --git a/src/dd-draggable.ts b/src/dd-draggable.ts index a3d7bfc9f..b32eca066 100644 --- a/src/dd-draggable.ts +++ b/src/dd-draggable.ts @@ -125,12 +125,19 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt if (DDManager.mouseHandled) return; if (e.button !== 0) return true; // only left click + // make sure we are not clicking on known object that handles mouseDown (TODO: make this extensible ?) #2054 + const skipMouseDown = ['input', 'textarea', 'button', 'select', 'option']; + const name = (e.target as HTMLElement).nodeName.toLowerCase(); + if (skipMouseDown.find(skip => skip === name)) return true; + // make sure we are clicking on a drag handle or child of it... // Note: we don't need to check that's handle is an immediate child, as mouseHandled will prevent parents from also handling it (lowest wins) - let className = this.option.handle.substring(1); - let el = e.target as HTMLElement; - while (el && !el.classList.contains(className)) { el = el.parentElement; } - if (!el) return; + // + // REMOVE: why would we get the event if it wasn't for us or child ? + // let className = this.option.handle.substring(1); + // let el = e.target as HTMLElement; + // while (el && !el.classList.contains(className)) { el = el.parentElement; } + // if (!el) return; this.mouseDownEvent = e; delete this.dragging; delete DDManager.dragElement; @@ -184,7 +191,7 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt } this.triggerEvent('dragstart', ev); } - e.preventDefault(); + e.preventDefault(); // needed otherwise we get text sweep text selection as we drag around return true; } From 884bdb19c00147de2d4935ea850814b360e95579 Mon Sep 17 00:00:00 2001 From: Alain Dumesny Date: Sat, 8 Oct 2022 17:19:10 -0700 Subject: [PATCH 3/3] v6.0.3 --- doc/CHANGES.md | 4 ++-- package.json | 2 +- src/dd-base-impl.ts | 2 +- src/dd-draggable.ts | 2 +- src/dd-droppable.ts | 2 +- src/dd-element.ts | 2 +- src/dd-gridstack.ts | 2 +- src/dd-manager.ts | 2 +- src/dd-resizable-handle.ts | 2 +- src/dd-resizable.ts | 2 +- src/dd-touch.ts | 2 +- src/gridstack-engine.ts | 2 +- src/gridstack-poly.js | 2 +- src/gridstack.scss | 2 +- src/gridstack.ts | 4 ++-- src/types.ts | 2 +- src/utils.ts | 2 +- 17 files changed, 19 insertions(+), 19 deletions(-) diff --git a/doc/CHANGES.md b/doc/CHANGES.md index 9dbf71ef3..37be8b273 100644 --- a/doc/CHANGES.md +++ b/doc/CHANGES.md @@ -5,7 +5,7 @@ Change log **Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)* -- [6.0.2-dev (TBD)](#602-dev-tbd) +- [6.0.3 (2022-10-08)](#603-2022-10-08) - [6.0.2 (2022-09-23)](#602-2022-09-23) - [6.0.1 (2022-08-27)](#601-2022-08-27) - [6.0.0 (2022-08-21)](#600-2022-08-21) @@ -72,7 +72,7 @@ Change log -## 6.0.2-dev (TBD) +## 6.0.3 (2022-10-08) * fixed [#2055](https://github.com/gridstack/gridstack.js/issues/2055) maxRow=1 resize outside (broke in 6.0.1) * fixed [#2054](https://github.com/gridstack/gridstack.js/issues/2054) Can't enter text in textarea/input (broke in v6) diff --git a/package.json b/package.json index 4ffc5eabb..984fdfffe 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "gridstack", - "version": "6.0.2-dev", + "version": "6.0.3", "description": "TypeScript/JS lib for dashboard layout and creation, no external dependencies, with many wrappers (React, Angular, Vue, Ember, knockout...)", "main": "./dist/gridstack.js", "types": "./dist/gridstack.d.ts", diff --git a/src/dd-base-impl.ts b/src/dd-base-impl.ts index 1cbe57d66..3ec219c01 100644 --- a/src/dd-base-impl.ts +++ b/src/dd-base-impl.ts @@ -1,5 +1,5 @@ /** - * dd-base-impl.ts 6.0.2-dev + * dd-base-impl.ts 6.0.3 * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-draggable.ts b/src/dd-draggable.ts index b32eca066..011f625d0 100644 --- a/src/dd-draggable.ts +++ b/src/dd-draggable.ts @@ -1,5 +1,5 @@ /** - * dd-draggable.ts 6.0.2-dev + * dd-draggable.ts 6.0.3 * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-droppable.ts b/src/dd-droppable.ts index 483f1e31e..b7fdf0fb8 100644 --- a/src/dd-droppable.ts +++ b/src/dd-droppable.ts @@ -1,5 +1,5 @@ /** - * dd-droppable.ts 6.0.2-dev + * dd-droppable.ts 6.0.3 * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-element.ts b/src/dd-element.ts index c49b2fb37..4150299b8 100644 --- a/src/dd-element.ts +++ b/src/dd-element.ts @@ -1,5 +1,5 @@ /** - * dd-elements.ts 6.0.2-dev + * dd-elements.ts 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-gridstack.ts b/src/dd-gridstack.ts index 32e429653..b253573e1 100644 --- a/src/dd-gridstack.ts +++ b/src/dd-gridstack.ts @@ -1,5 +1,5 @@ /** - * dd-gridstack.ts 6.0.2-dev + * dd-gridstack.ts 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-manager.ts b/src/dd-manager.ts index b9267542f..b2865eb25 100644 --- a/src/dd-manager.ts +++ b/src/dd-manager.ts @@ -1,5 +1,5 @@ /** - * dd-manager.ts 6.0.2-dev + * dd-manager.ts 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-resizable-handle.ts b/src/dd-resizable-handle.ts index 9fa1e8b44..b02577f97 100644 --- a/src/dd-resizable-handle.ts +++ b/src/dd-resizable-handle.ts @@ -1,5 +1,5 @@ /** - * dd-resizable-handle.ts 6.0.2-dev + * dd-resizable-handle.ts 6.0.3 * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-resizable.ts b/src/dd-resizable.ts index f45d0d483..38f509c00 100644 --- a/src/dd-resizable.ts +++ b/src/dd-resizable.ts @@ -1,5 +1,5 @@ /** - * dd-resizable.ts 6.0.2-dev + * dd-resizable.ts 6.0.3 * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license */ diff --git a/src/dd-touch.ts b/src/dd-touch.ts index 61b1796bb..59298f176 100644 --- a/src/dd-touch.ts +++ b/src/dd-touch.ts @@ -1,5 +1,5 @@ /** - * touch.ts 6.0.2-dev + * touch.ts 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/gridstack-engine.ts b/src/gridstack-engine.ts index 6919de678..b27a08eba 100644 --- a/src/gridstack-engine.ts +++ b/src/gridstack-engine.ts @@ -1,5 +1,5 @@ /** - * gridstack-engine.ts 6.0.2-dev + * gridstack-engine.ts 6.0.3 * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license */ diff --git a/src/gridstack-poly.js b/src/gridstack-poly.js index 486b49751..58bb6c1f4 100644 --- a/src/gridstack-poly.js +++ b/src/gridstack-poly.js @@ -1,5 +1,5 @@ /** - * gridstack-poly.ts 6.0.2-dev used for IE and older browser support (not supported in v2-v4.3.1, but again in v4.4) + * gridstack-poly.ts 6.0.3 used for IE and older browser support (not supported in v2-v4.3.1, but again in v4.4) * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/gridstack.scss b/src/gridstack.scss index a49cbb2c4..cf14ce7f4 100644 --- a/src/gridstack.scss +++ b/src/gridstack.scss @@ -1,5 +1,5 @@ /** - * gridstack SASS styles 6.0.2-dev + * gridstack SASS styles 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/gridstack.ts b/src/gridstack.ts index c5f7251f0..0f4f51e11 100644 --- a/src/gridstack.ts +++ b/src/gridstack.ts @@ -1,5 +1,5 @@ /*! - * GridStack 6.0.2-dev + * GridStack 6.0.3 * https://gridstackjs.com/ * * Copyright (c) 2021-2022 Alain Dumesny @@ -1480,7 +1480,7 @@ export class GridStack { return this; } - static GDRev = '6.0.2-dev'; + static GDRev = '6.0.3'; /* * drag&drop empty stubs that will be implemented in dd-gridstack.ts for non static grid diff --git a/src/types.ts b/src/types.ts index 05fa0d3e1..35184a181 100644 --- a/src/types.ts +++ b/src/types.ts @@ -1,5 +1,5 @@ /** - * types.ts 6.0.2-dev + * types.ts 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */ diff --git a/src/utils.ts b/src/utils.ts index 16aa07958..f7768c5b8 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,5 +1,5 @@ /** - * utils.ts 6.0.2-dev + * utils.ts 6.0.3 * Copyright (c) 2021 Alain Dumesny - see GridStack root license */