Skip to content

Commit 836d161

Browse files
authored
Merge pull request #2711 from adumesny/master
support for multiple drag targets fix
2 parents 790888a + 621dddd commit 836d161

File tree

2 files changed

+6
-7
lines changed

2 files changed

+6
-7
lines changed

doc/CHANGES.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,7 @@ Change log
114114
## 10.2.0-dev (TBD)
115115
* fix: [#2683](https://github.com/gridstack/gridstack.js/issues/2683) check for fixed grid maxRow during resize
116116
* fix: [#2694](https://github.com/gridstack/gridstack.js/issues/2694) prevent 'r' rotation to items that can't resize (locked, noResize, fixed sizes)
117+
* fix: [#2709](https://github.com/gridstack/gridstack.js/pull/2709) support for multiple drag targets - Thank you [nickfulcher](https://github.com/nickfulcher)
117118

118119
## 10.2.0 (2024-06-02)
119120
* feat: [#2682](https://github.com/gridstack/gridstack.js/pull/2682) You can now press 'Esc' to cancel a move|resize, 'r' to rotate during a drag. added `GridStack.rotate()` as well - Thank you John B. for this feature sponsor.

src/dd-draggable.ts

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -54,8 +54,6 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
5454
/** @internal */
5555
protected dragElementOriginStyle: Array<string>;
5656
/** @internal */
57-
protected dragEl: HTMLElement;
58-
/** @internal */
5957
protected dragEls: HTMLElement[];
6058
/** @internal true while we are dragging an item around */
6159
protected dragging: boolean;
@@ -152,7 +150,7 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
152150
if (e.button !== 0) return true; // only left click
153151

154152
// make sure we are not clicking on known object that handles mouseDown, or ones supplied by the user
155-
if (e.target !== this.dragEl && (e.target as HTMLElement).closest(skipMouseDown)) return true;
153+
if (!this.dragEls.find(el => el === e.target) && (e.target as HTMLElement).closest(skipMouseDown)) return true;
156154
if (this.option.cancel) {
157155
if ((e.target as HTMLElement).closest(this.option.cancel)) return true;
158156
}
@@ -173,8 +171,8 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
173171
document.addEventListener('mousemove', this._mouseMove, { capture: true, passive: true }); // true=capture, not bubble
174172
document.addEventListener('mouseup', this._mouseUp, true);
175173
if (isTouch) {
176-
this.dragEl.addEventListener('touchmove', touchmove);
177-
this.dragEl.addEventListener('touchend', touchend);
174+
e.target.addEventListener('touchmove', touchmove);
175+
e.target.addEventListener('touchend', touchend);
178176
}
179177

180178
e.preventDefault();
@@ -248,8 +246,8 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
248246
document.removeEventListener('mousemove', this._mouseMove, true);
249247
document.removeEventListener('mouseup', this._mouseUp, true);
250248
if (isTouch) {
251-
this.dragEl.removeEventListener('touchmove', touchmove, true);
252-
this.dragEl.removeEventListener('touchend', touchend, true);
249+
e.target.removeEventListener('touchmove', touchmove, true);
250+
e.target.removeEventListener('touchend', touchend, true);
253251
}
254252
if (this.dragging) {
255253
delete this.dragging;

0 commit comments

Comments
 (0)