gridstack 5.0.0 → 6.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +78 -53
- package/dist/{h5/dd-base-impl.d.ts → dd-base-impl.d.ts} +2 -2
- package/dist/{h5/dd-base-impl.js → dd-base-impl.js} +2 -4
- package/dist/dd-base-impl.js.map +1 -0
- package/dist/{es5/h5/dd-draggable.d.ts → dd-draggable.d.ts} +7 -8
- package/dist/dd-draggable.js +313 -0
- package/dist/dd-draggable.js.map +1 -0
- package/dist/{es5/h5/dd-droppable.d.ts → dd-droppable.d.ts} +4 -3
- package/dist/dd-droppable.js +149 -0
- package/dist/dd-droppable.js.map +1 -0
- package/dist/{es5/h5/dd-element.d.ts → dd-element.d.ts} +2 -2
- package/dist/{h5/dd-element.js → dd-element.js} +1 -1
- package/dist/dd-element.js.map +1 -0
- package/dist/dd-gridstack.d.ts +36 -0
- package/dist/{gridstack-dd.js → dd-gridstack.js} +154 -52
- package/dist/dd-gridstack.js.map +1 -0
- package/dist/dd-manager.d.ts +17 -0
- package/dist/{h5/dd-manager.js → dd-manager.js} +4 -1
- package/dist/dd-manager.js.map +1 -0
- package/dist/{es5/h5/dd-resizable-handle.d.ts → dd-resizable-handle.d.ts} +2 -2
- package/dist/{h5/dd-resizable-handle.js → dd-resizable-handle.js} +33 -9
- package/dist/dd-resizable-handle.js.map +1 -0
- package/dist/{h5/dd-resizable.d.ts → dd-resizable.d.ts} +3 -3
- package/dist/{h5/dd-resizable.js → dd-resizable.js} +29 -28
- package/dist/dd-resizable.js.map +1 -0
- package/dist/dd-touch.d.ts +33 -0
- package/dist/dd-touch.js +179 -0
- package/dist/dd-touch.js.map +1 -0
- package/dist/es5/{h5/dd-base-impl.d.ts → dd-base-impl.d.ts} +2 -2
- package/dist/es5/{h5/dd-base-impl.js → dd-base-impl.js} +2 -4
- package/dist/es5/dd-base-impl.js.map +1 -0
- package/dist/{h5 → es5}/dd-draggable.d.ts +7 -8
- package/dist/es5/dd-draggable.js +335 -0
- package/dist/es5/dd-draggable.js.map +1 -0
- package/dist/{h5 → es5}/dd-droppable.d.ts +4 -3
- package/dist/es5/dd-droppable.js +180 -0
- package/dist/es5/dd-droppable.js.map +1 -0
- package/dist/{h5 → es5}/dd-element.d.ts +2 -2
- package/dist/es5/{h5/dd-element.js → dd-element.js} +1 -1
- package/dist/es5/dd-element.js.map +1 -0
- package/dist/es5/dd-gridstack.d.ts +36 -0
- package/dist/es5/{gridstack-dd.js → dd-gridstack.js} +164 -71
- package/dist/es5/dd-gridstack.js.map +1 -0
- package/dist/es5/dd-manager.d.ts +17 -0
- package/dist/es5/{h5/dd-manager.js → dd-manager.js} +4 -1
- package/dist/es5/dd-manager.js.map +1 -0
- package/dist/{h5 → es5}/dd-resizable-handle.d.ts +2 -2
- package/dist/es5/{h5/dd-resizable-handle.js → dd-resizable-handle.js} +33 -9
- package/dist/es5/dd-resizable-handle.js.map +1 -0
- package/dist/es5/{h5/dd-resizable.d.ts → dd-resizable.d.ts} +3 -3
- package/dist/es5/{h5/dd-resizable.js → dd-resizable.js} +29 -28
- package/dist/es5/dd-resizable.js.map +1 -0
- package/dist/es5/dd-touch.d.ts +33 -0
- package/dist/es5/dd-touch.js +182 -0
- package/dist/es5/dd-touch.js.map +1 -0
- package/dist/es5/gridstack-all.js +3 -0
- package/dist/{gridstack-static.js.LICENSE.txt → es5/gridstack-all.js.LICENSE.txt} +2 -2
- package/dist/es5/gridstack-all.js.map +1 -0
- package/dist/es5/gridstack-engine.d.ts +12 -9
- package/dist/es5/gridstack-engine.js +45 -55
- package/dist/es5/gridstack-engine.js.map +1 -1
- package/dist/es5/gridstack-poly.js +1 -1
- package/dist/es5/gridstack.d.ts +17 -12
- package/dist/es5/gridstack.js +70 -43
- package/dist/es5/gridstack.js.map +1 -1
- package/dist/es5/types.d.ts +19 -20
- package/dist/es5/types.js +1 -1
- package/dist/es5/types.js.map +1 -1
- package/dist/es5/utils.d.ts +12 -2
- package/dist/es5/utils.js +79 -18
- package/dist/es5/utils.js.map +1 -1
- package/dist/gridstack-all.js +3 -0
- package/dist/{es5/gridstack-h5.js.LICENSE.txt → gridstack-all.js.LICENSE.txt} +2 -2
- package/dist/gridstack-all.js.map +1 -0
- package/dist/gridstack-engine.d.ts +12 -9
- package/dist/gridstack-engine.js +44 -54
- package/dist/gridstack-engine.js.map +1 -1
- package/dist/gridstack.css +21 -9
- package/dist/gridstack.d.ts +17 -12
- package/dist/gridstack.js +68 -43
- package/dist/gridstack.js.map +1 -1
- package/dist/gridstack.min.css +1 -1
- package/dist/src/gridstack.scss +19 -12
- package/dist/types.d.ts +19 -20
- package/dist/types.js +1 -1
- package/dist/types.js.map +1 -1
- package/dist/utils.d.ts +12 -2
- package/dist/utils.js +75 -17
- package/dist/utils.js.map +1 -1
- package/doc/CHANGES.md +21 -2
- package/doc/README.md +29 -24
- package/package.json +5 -5
- package/dist/es5/gridstack-dd.d.ts +0 -35
- package/dist/es5/gridstack-dd.js.map +0 -1
- package/dist/es5/gridstack-ddi.d.ts +0 -17
- package/dist/es5/gridstack-ddi.js +0 -31
- package/dist/es5/gridstack-ddi.js.map +0 -1
- package/dist/es5/gridstack-h5.d.ts +0 -10
- package/dist/es5/gridstack-h5.js +0 -3
- package/dist/es5/gridstack-h5.js.map +0 -1
- package/dist/es5/gridstack-jq.d.ts +0 -10
- package/dist/es5/gridstack-jq.js +0 -3
- package/dist/es5/gridstack-jq.js.LICENSE.txt +0 -99
- package/dist/es5/gridstack-jq.js.map +0 -1
- package/dist/es5/gridstack-static.d.ts +0 -9
- package/dist/es5/gridstack-static.js +0 -3
- package/dist/es5/gridstack-static.js.LICENSE.txt +0 -7
- package/dist/es5/gridstack-static.js.map +0 -1
- package/dist/es5/h5/dd-base-impl.js.map +0 -1
- package/dist/es5/h5/dd-draggable.js +0 -329
- package/dist/es5/h5/dd-draggable.js.map +0 -1
- package/dist/es5/h5/dd-droppable.js +0 -199
- package/dist/es5/h5/dd-droppable.js.map +0 -1
- package/dist/es5/h5/dd-element.js.map +0 -1
- package/dist/es5/h5/dd-manager.d.ts +0 -8
- package/dist/es5/h5/dd-manager.js.map +0 -1
- package/dist/es5/h5/dd-resizable-handle.js.map +0 -1
- package/dist/es5/h5/dd-resizable.js.map +0 -1
- package/dist/es5/h5/dd-utils.d.ts +0 -19
- package/dist/es5/h5/dd-utils.js +0 -111
- package/dist/es5/h5/dd-utils.js.map +0 -1
- package/dist/es5/h5/gridstack-dd-native.d.ts +0 -26
- package/dist/es5/h5/gridstack-dd-native.js +0 -175
- package/dist/es5/h5/gridstack-dd-native.js.map +0 -1
- package/dist/es5/jq/gridstack-dd-jqueryui.d.ts +0 -22
- package/dist/es5/jq/gridstack-dd-jqueryui.js +0 -162
- package/dist/es5/jq/gridstack-dd-jqueryui.js.map +0 -1
- package/dist/gridstack-dd.d.ts +0 -35
- package/dist/gridstack-dd.js.map +0 -1
- package/dist/gridstack-ddi.d.ts +0 -17
- package/dist/gridstack-ddi.js +0 -28
- package/dist/gridstack-ddi.js.map +0 -1
- package/dist/gridstack-h5.d.ts +0 -10
- package/dist/gridstack-h5.js +0 -3
- package/dist/gridstack-h5.js.LICENSE.txt +0 -7
- package/dist/gridstack-h5.js.map +0 -1
- package/dist/gridstack-jq.d.ts +0 -10
- package/dist/gridstack-jq.js +0 -3
- package/dist/gridstack-jq.js.LICENSE.txt +0 -99
- package/dist/gridstack-jq.js.map +0 -1
- package/dist/gridstack-static.d.ts +0 -9
- package/dist/gridstack-static.js +0 -3
- package/dist/gridstack-static.js.map +0 -1
- package/dist/h5/dd-base-impl.js.map +0 -1
- package/dist/h5/dd-draggable.js +0 -305
- package/dist/h5/dd-draggable.js.map +0 -1
- package/dist/h5/dd-droppable.js +0 -168
- package/dist/h5/dd-droppable.js.map +0 -1
- package/dist/h5/dd-element.js.map +0 -1
- package/dist/h5/dd-manager.d.ts +0 -8
- package/dist/h5/dd-manager.js.map +0 -1
- package/dist/h5/dd-resizable-handle.js.map +0 -1
- package/dist/h5/dd-resizable.js.map +0 -1
- package/dist/h5/dd-utils.d.ts +0 -19
- package/dist/h5/dd-utils.js +0 -94
- package/dist/h5/dd-utils.js.map +0 -1
- package/dist/h5/gridstack-dd-native.d.ts +0 -26
- package/dist/h5/gridstack-dd-native.js +0 -140
- package/dist/h5/gridstack-dd-native.js.map +0 -1
- package/dist/jq/gridstack-dd-jqueryui.d.ts +0 -22
- package/dist/jq/gridstack-dd-jqueryui.js +0 -133
- package/dist/jq/gridstack-dd-jqueryui.js.map +0 -1
- package/dist/jq/jquery-ui.js +0 -2
- package/dist/jq/jquery-ui.js.map +0 -1
- package/dist/jq/jquery.js +0 -2
- package/dist/jq/jquery.js.map +0 -1
- package/dist/jq/jquery.ui.touch-punch.js +0 -2
- package/dist/jq/jquery.ui.touch-punch.js.map +0 -1
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* dd-manager.ts 6.0.0
|
|
3
|
+
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
4
|
+
*/
|
|
5
|
+
import { DDDraggable } from './dd-draggable';
|
|
6
|
+
import { DDDroppable } from './dd-droppable';
|
|
7
|
+
/**
|
|
8
|
+
* globals that are shared across Drag & Drop instances
|
|
9
|
+
*/
|
|
10
|
+
export declare class DDManager {
|
|
11
|
+
/** true if a mouse down event was handled */
|
|
12
|
+
static mouseHandled: boolean;
|
|
13
|
+
/** item being dragged */
|
|
14
|
+
static dragElement: DDDraggable;
|
|
15
|
+
/** item we are currently over as drop target */
|
|
16
|
+
static dropElement: DDDroppable;
|
|
17
|
+
}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
/**
|
|
3
|
-
* dd-manager.ts
|
|
3
|
+
* dd-manager.ts 6.0.0
|
|
4
4
|
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
5
5
|
*/
|
|
6
6
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
7
|
exports.DDManager = void 0;
|
|
8
|
+
/**
|
|
9
|
+
* globals that are shared across Drag & Drop instances
|
|
10
|
+
*/
|
|
8
11
|
var DDManager = /** @class */ (function () {
|
|
9
12
|
function DDManager() {
|
|
10
13
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dd-manager.js","sourceRoot":"","sources":["../../src/dd-manager.ts"],"names":[],"mappings":";AAAA;;;GAGG;;;AAKH;;GAEG;AACH;IAAA;IASA,CAAC;IAAD,gBAAC;AAAD,CAAC,AATD,IASC;AATY,8BAAS","sourcesContent":["/**\n * dd-manager.ts 6.0.0\n * Copyright (c) 2021 Alain Dumesny - see GridStack root license\n */\n\nimport { DDDraggable } from './dd-draggable';\nimport { DDDroppable } from './dd-droppable';\n\n/**\n * globals that are shared across Drag & Drop instances\n */\nexport class DDManager {\n /** true if a mouse down event was handled */\n public static mouseHandled: boolean;\n\n /** item being dragged */\n public static dragElement: DDDraggable;\n\n /** item we are currently over as drop target */\n public static dropElement: DDDroppable;\n}\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* dd-resizable-handle.ts
|
|
3
|
-
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
2
|
+
* dd-resizable-handle.ts 6.0.0
|
|
3
|
+
* Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license
|
|
4
4
|
*/
|
|
5
5
|
export interface DDResizableHandleOpt {
|
|
6
6
|
start?: (event: any) => void;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
/**
|
|
3
|
-
* dd-resizable-handle.ts
|
|
4
|
-
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
3
|
+
* dd-resizable-handle.ts 6.0.0
|
|
4
|
+
* Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license
|
|
5
5
|
*/
|
|
6
6
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
7
|
exports.DDResizableHandle = void 0;
|
|
8
|
+
var dd_touch_1 = require("./dd-touch");
|
|
8
9
|
var DDResizableHandle = /** @class */ (function () {
|
|
9
10
|
function DDResizableHandle(host, direction, option) {
|
|
10
11
|
/** @internal true after we've moved enough pixels to start a resize */
|
|
@@ -28,6 +29,11 @@ var DDResizableHandle = /** @class */ (function () {
|
|
|
28
29
|
this.el = el;
|
|
29
30
|
this.host.appendChild(this.el);
|
|
30
31
|
this.el.addEventListener('mousedown', this._mouseDown);
|
|
32
|
+
if (dd_touch_1.isTouch) {
|
|
33
|
+
this.el.addEventListener('touchstart', dd_touch_1.touchstart);
|
|
34
|
+
this.el.addEventListener('pointerdown', dd_touch_1.pointerdown);
|
|
35
|
+
// this.el.style.touchAction = 'none'; // not needed unlike pointerdown doc comment
|
|
36
|
+
}
|
|
31
37
|
return this;
|
|
32
38
|
};
|
|
33
39
|
/** call this when resize handle needs to be removed and cleaned up */
|
|
@@ -35,6 +41,10 @@ var DDResizableHandle = /** @class */ (function () {
|
|
|
35
41
|
if (this.moving)
|
|
36
42
|
this._mouseUp(this.mouseDownEvent);
|
|
37
43
|
this.el.removeEventListener('mousedown', this._mouseDown);
|
|
44
|
+
if (dd_touch_1.isTouch) {
|
|
45
|
+
this.el.removeEventListener('touchstart', dd_touch_1.touchstart);
|
|
46
|
+
this.el.removeEventListener('pointerdown', dd_touch_1.pointerdown);
|
|
47
|
+
}
|
|
38
48
|
this.host.removeChild(this.el);
|
|
39
49
|
delete this.el;
|
|
40
50
|
delete this.host;
|
|
@@ -42,22 +52,30 @@ var DDResizableHandle = /** @class */ (function () {
|
|
|
42
52
|
};
|
|
43
53
|
/** @internal called on mouse down on us: capture move on the entire document (mouse might not stay on us) until we release the mouse */
|
|
44
54
|
DDResizableHandle.prototype._mouseDown = function (e) {
|
|
45
|
-
e.preventDefault();
|
|
46
55
|
this.mouseDownEvent = e;
|
|
47
56
|
document.addEventListener('mousemove', this._mouseMove, true); // capture, not bubble
|
|
48
|
-
document.addEventListener('mouseup', this._mouseUp);
|
|
57
|
+
document.addEventListener('mouseup', this._mouseUp, true);
|
|
58
|
+
if (dd_touch_1.isTouch) {
|
|
59
|
+
this.el.addEventListener('touchmove', dd_touch_1.touchmove);
|
|
60
|
+
this.el.addEventListener('touchend', dd_touch_1.touchend);
|
|
61
|
+
}
|
|
62
|
+
e.stopPropagation();
|
|
63
|
+
e.preventDefault();
|
|
49
64
|
};
|
|
50
65
|
/** @internal */
|
|
51
66
|
DDResizableHandle.prototype._mouseMove = function (e) {
|
|
52
67
|
var s = this.mouseDownEvent;
|
|
53
|
-
|
|
54
|
-
|
|
68
|
+
if (this.moving) {
|
|
69
|
+
this._triggerEvent('move', e);
|
|
70
|
+
}
|
|
71
|
+
else if (Math.abs(e.x - s.x) + Math.abs(e.y - s.y) > 2) {
|
|
72
|
+
// don't start unless we've moved at least 3 pixels
|
|
55
73
|
this.moving = true;
|
|
56
74
|
this._triggerEvent('start', this.mouseDownEvent);
|
|
57
|
-
}
|
|
58
|
-
else if (this.moving) {
|
|
59
75
|
this._triggerEvent('move', e);
|
|
60
76
|
}
|
|
77
|
+
e.stopPropagation();
|
|
78
|
+
e.preventDefault();
|
|
61
79
|
};
|
|
62
80
|
/** @internal */
|
|
63
81
|
DDResizableHandle.prototype._mouseUp = function (e) {
|
|
@@ -65,9 +83,15 @@ var DDResizableHandle = /** @class */ (function () {
|
|
|
65
83
|
this._triggerEvent('stop', e);
|
|
66
84
|
}
|
|
67
85
|
document.removeEventListener('mousemove', this._mouseMove, true);
|
|
68
|
-
document.removeEventListener('mouseup', this._mouseUp);
|
|
86
|
+
document.removeEventListener('mouseup', this._mouseUp, true);
|
|
87
|
+
if (dd_touch_1.isTouch) {
|
|
88
|
+
this.el.removeEventListener('touchmove', dd_touch_1.touchmove);
|
|
89
|
+
this.el.removeEventListener('touchend', dd_touch_1.touchend);
|
|
90
|
+
}
|
|
69
91
|
delete this.moving;
|
|
70
92
|
delete this.mouseDownEvent;
|
|
93
|
+
e.stopPropagation();
|
|
94
|
+
e.preventDefault();
|
|
71
95
|
};
|
|
72
96
|
/** @internal */
|
|
73
97
|
DDResizableHandle.prototype._triggerEvent = function (name, event) {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dd-resizable-handle.js","sourceRoot":"","sources":["../../src/dd-resizable-handle.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * dd-resizable-handle.ts 6.0.0\n * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license\n */\n\nimport { isTouch, pointerdown, touchend, touchmove, touchstart } from './dd-touch';\n\nexport interface DDResizableHandleOpt {\n start?: (event) => void;\n move?: (event) => void;\n stop?: (event) => void;\n}\n\nexport class DDResizableHandle {\n /** @internal */\n protected el: HTMLElement;\n /** @internal */\n protected host: HTMLElement;\n /** @internal */\n protected option: DDResizableHandleOpt;\n /** @internal */\n protected dir: string;\n /** @internal true after we've moved enough pixels to start a resize */\n protected moving = false;\n /** @internal */\n protected mouseDownEvent: MouseEvent;\n /** @internal */\n protected static prefix = 'ui-resizable-';\n\n constructor(host: HTMLElement, direction: string, option: DDResizableHandleOpt) {\n this.host = host;\n this.dir = direction;\n this.option = option;\n // create var event binding so we can easily remove and still look like TS methods (unlike anonymous functions)\n this._mouseDown = this._mouseDown.bind(this);\n this._mouseMove = this._mouseMove.bind(this);\n this._mouseUp = this._mouseUp.bind(this);\n\n this._init();\n }\n\n /** @internal */\n protected _init(): DDResizableHandle {\n const el = document.createElement('div');\n el.classList.add('ui-resizable-handle');\n el.classList.add(`${DDResizableHandle.prefix}${this.dir}`);\n el.style.zIndex = '100';\n el.style.userSelect = 'none';\n this.el = el;\n this.host.appendChild(this.el);\n this.el.addEventListener('mousedown', this._mouseDown);\n if (isTouch) {\n this.el.addEventListener('touchstart', touchstart);\n this.el.addEventListener('pointerdown', pointerdown);\n // this.el.style.touchAction = 'none'; // not needed unlike pointerdown doc comment\n }\n return this;\n }\n\n /** call this when resize handle needs to be removed and cleaned up */\n public destroy(): DDResizableHandle {\n if (this.moving) this._mouseUp(this.mouseDownEvent);\n this.el.removeEventListener('mousedown', this._mouseDown);\n if (isTouch) {\n this.el.removeEventListener('touchstart', touchstart);\n this.el.removeEventListener('pointerdown', pointerdown);\n }\n this.host.removeChild(this.el);\n delete this.el;\n delete this.host;\n return this;\n }\n\n /** @internal called on mouse down on us: capture move on the entire document (mouse might not stay on us) until we release the mouse */\n protected _mouseDown(e: MouseEvent) {\n this.mouseDownEvent = e;\n document.addEventListener('mousemove', this._mouseMove, true); // capture, not bubble\n document.addEventListener('mouseup', this._mouseUp, true);\n if (isTouch) {\n this.el.addEventListener('touchmove', touchmove);\n this.el.addEventListener('touchend', touchend);\n }\n e.stopPropagation();\n e.preventDefault();\n }\n\n /** @internal */\n protected _mouseMove(e: MouseEvent) {\n let s = this.mouseDownEvent;\n if (this.moving) {\n this._triggerEvent('move', e);\n } else if (Math.abs(e.x - s.x) + Math.abs(e.y - s.y) > 2) {\n // don't start unless we've moved at least 3 pixels\n this.moving = true;\n this._triggerEvent('start', this.mouseDownEvent);\n this._triggerEvent('move', e);\n }\n e.stopPropagation();\n e.preventDefault();\n }\n\n /** @internal */\n protected _mouseUp(e: MouseEvent) {\n if (this.moving) {\n this._triggerEvent('stop', e);\n }\n document.removeEventListener('mousemove', this._mouseMove, true);\n document.removeEventListener('mouseup', this._mouseUp, true);\n if (isTouch) {\n this.el.removeEventListener('touchmove', touchmove);\n this.el.removeEventListener('touchend', touchend);\n }\n delete this.moving;\n delete this.mouseDownEvent;\n e.stopPropagation();\n e.preventDefault();\n }\n\n /** @internal */\n protected _triggerEvent(name: string, event: MouseEvent): DDResizableHandle {\n if (this.option[name]) this.option[name](event);\n return this;\n }\n}\n"]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* dd-resizable.ts
|
|
3
|
-
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
2
|
+
* dd-resizable.ts 6.0.0
|
|
3
|
+
* Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license
|
|
4
4
|
*/
|
|
5
5
|
import { DDBaseImplement, HTMLElementExtendOpt } from './dd-base-impl';
|
|
6
|
-
import { DDUIData } from '
|
|
6
|
+
import { DDUIData } from './types';
|
|
7
7
|
export interface DDResizableOpt {
|
|
8
8
|
autoHide?: boolean;
|
|
9
9
|
handles?: string;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
/**
|
|
3
|
-
* dd-resizable.ts
|
|
4
|
-
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
3
|
+
* dd-resizable.ts 6.0.0
|
|
4
|
+
* Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license
|
|
5
5
|
*/
|
|
6
6
|
var __extends = (this && this.__extends) || (function () {
|
|
7
7
|
var extendStatics = function (d, b) {
|
|
@@ -20,22 +20,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
20
20
|
exports.DDResizable = void 0;
|
|
21
21
|
var dd_resizable_handle_1 = require("./dd-resizable-handle");
|
|
22
22
|
var dd_base_impl_1 = require("./dd-base-impl");
|
|
23
|
-
var
|
|
24
|
-
var utils_1 = require("../utils");
|
|
23
|
+
var utils_1 = require("./utils");
|
|
25
24
|
var DDResizable = /** @class */ (function (_super) {
|
|
26
25
|
__extends(DDResizable, _super);
|
|
27
26
|
function DDResizable(el, opts) {
|
|
28
27
|
if (opts === void 0) { opts = {}; }
|
|
29
28
|
var _this = _super.call(this) || this;
|
|
30
29
|
/** @internal */
|
|
31
|
-
_this._showHandlers = function () {
|
|
32
|
-
_this.el.classList.remove('ui-resizable-autohide');
|
|
33
|
-
};
|
|
34
|
-
/** @internal */
|
|
35
|
-
_this._hideHandlers = function () {
|
|
36
|
-
_this.el.classList.add('ui-resizable-autohide');
|
|
37
|
-
};
|
|
38
|
-
/** @internal */
|
|
39
30
|
_this._ui = function () {
|
|
40
31
|
var containmentEl = _this.el.parentElement;
|
|
41
32
|
var containmentRect = containmentEl.getBoundingClientRect();
|
|
@@ -72,8 +63,11 @@ var DDResizable = /** @class */ (function (_super) {
|
|
|
72
63
|
};
|
|
73
64
|
_this.el = el;
|
|
74
65
|
_this.option = opts;
|
|
66
|
+
// create var event binding so we can easily remove and still look like TS methods (unlike anonymous functions)
|
|
67
|
+
_this._mouseOver = _this._mouseOver.bind(_this);
|
|
68
|
+
_this._mouseOut = _this._mouseOut.bind(_this);
|
|
75
69
|
_this.enable();
|
|
76
|
-
_this._setupAutoHide();
|
|
70
|
+
_this._setupAutoHide(_this.option.autoHide);
|
|
77
71
|
_this._setupHandlers();
|
|
78
72
|
return _this;
|
|
79
73
|
}
|
|
@@ -95,10 +89,7 @@ var DDResizable = /** @class */ (function (_super) {
|
|
|
95
89
|
};
|
|
96
90
|
DDResizable.prototype.destroy = function () {
|
|
97
91
|
this._removeHandlers();
|
|
98
|
-
|
|
99
|
-
this.el.removeEventListener('mouseover', this._showHandlers);
|
|
100
|
-
this.el.removeEventListener('mouseout', this._hideHandlers);
|
|
101
|
-
}
|
|
92
|
+
this._setupAutoHide(false);
|
|
102
93
|
this.el.classList.remove('ui-resizable');
|
|
103
94
|
delete this.el;
|
|
104
95
|
_super.prototype.destroy.call(this);
|
|
@@ -113,26 +104,36 @@ var DDResizable = /** @class */ (function (_super) {
|
|
|
113
104
|
this._setupHandlers();
|
|
114
105
|
}
|
|
115
106
|
if (updateAutoHide) {
|
|
116
|
-
this._setupAutoHide();
|
|
107
|
+
this._setupAutoHide(this.option.autoHide);
|
|
117
108
|
}
|
|
118
109
|
return this;
|
|
119
110
|
};
|
|
120
|
-
/** @internal */
|
|
121
|
-
DDResizable.prototype._setupAutoHide = function () {
|
|
122
|
-
if (
|
|
111
|
+
/** @internal turns auto hide on/off */
|
|
112
|
+
DDResizable.prototype._setupAutoHide = function (auto) {
|
|
113
|
+
if (auto) {
|
|
123
114
|
this.el.classList.add('ui-resizable-autohide');
|
|
124
115
|
// use mouseover/mouseout instead of mouseenter/mouseleave to get better performance;
|
|
125
|
-
this.el.addEventListener('mouseover', this.
|
|
126
|
-
this.el.addEventListener('mouseout', this.
|
|
116
|
+
this.el.addEventListener('mouseover', this._mouseOver);
|
|
117
|
+
this.el.addEventListener('mouseout', this._mouseOut);
|
|
127
118
|
}
|
|
128
119
|
else {
|
|
129
120
|
this.el.classList.remove('ui-resizable-autohide');
|
|
130
|
-
this.el.removeEventListener('mouseover', this.
|
|
131
|
-
this.el.removeEventListener('mouseout', this.
|
|
121
|
+
this.el.removeEventListener('mouseover', this._mouseOver);
|
|
122
|
+
this.el.removeEventListener('mouseout', this._mouseOut);
|
|
132
123
|
}
|
|
133
124
|
return this;
|
|
134
125
|
};
|
|
135
126
|
/** @internal */
|
|
127
|
+
DDResizable.prototype._mouseOver = function (e) {
|
|
128
|
+
this.el.classList.remove('ui-resizable-autohide');
|
|
129
|
+
e.stopPropagation();
|
|
130
|
+
};
|
|
131
|
+
/** @internal */
|
|
132
|
+
DDResizable.prototype._mouseOut = function (e) {
|
|
133
|
+
this.el.classList.add('ui-resizable-autohide');
|
|
134
|
+
e.stopPropagation();
|
|
135
|
+
};
|
|
136
|
+
/** @internal */
|
|
136
137
|
DDResizable.prototype._setupHandlers = function () {
|
|
137
138
|
var _this = this;
|
|
138
139
|
var handlerDirection = this.option.handles || 'e,s,se';
|
|
@@ -163,7 +164,7 @@ var DDResizable = /** @class */ (function (_super) {
|
|
|
163
164
|
this.startEvent = event;
|
|
164
165
|
this._setupHelper();
|
|
165
166
|
this._applyChange();
|
|
166
|
-
var ev =
|
|
167
|
+
var ev = utils_1.Utils.initEvent(event, { type: 'resizestart', target: this.el });
|
|
167
168
|
if (this.option.start) {
|
|
168
169
|
this.option.start(ev, this._ui());
|
|
169
170
|
}
|
|
@@ -176,7 +177,7 @@ var DDResizable = /** @class */ (function (_super) {
|
|
|
176
177
|
this.scrolled = this.scrollEl.scrollTop - this.scrollY;
|
|
177
178
|
this.temporalRect = this._getChange(event, dir);
|
|
178
179
|
this._applyChange();
|
|
179
|
-
var ev =
|
|
180
|
+
var ev = utils_1.Utils.initEvent(event, { type: 'resize', target: this.el });
|
|
180
181
|
if (this.option.resize) {
|
|
181
182
|
this.option.resize(ev, this._ui());
|
|
182
183
|
}
|
|
@@ -185,7 +186,7 @@ var DDResizable = /** @class */ (function (_super) {
|
|
|
185
186
|
};
|
|
186
187
|
/** @internal */
|
|
187
188
|
DDResizable.prototype._resizeStop = function (event) {
|
|
188
|
-
var ev =
|
|
189
|
+
var ev = utils_1.Utils.initEvent(event, { type: 'resizestop', target: this.el });
|
|
189
190
|
if (this.option.stop) {
|
|
190
191
|
this.option.stop(ev); // Note: ui() not used by gridstack so don't pass
|
|
191
192
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dd-resizable.js","sourceRoot":"","sources":["../../src/dd-resizable.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * dd-resizable.ts 6.0.0\n * Copyright (c) 2021-2022 Alain Dumesny - see GridStack root license\n */\n\nimport { DDResizableHandle } from './dd-resizable-handle';\nimport { DDBaseImplement, HTMLElementExtendOpt } from './dd-base-impl';\nimport { Utils } from './utils';\nimport { DDUIData, Rect, Size } from './types';\n\n// TODO: merge with DDDragOpt\nexport interface DDResizableOpt {\n autoHide?: boolean;\n handles?: string;\n maxHeight?: number;\n maxWidth?: number;\n minHeight?: number;\n minWidth?: number;\n start?: (event: Event, ui: DDUIData) => void;\n stop?: (event: Event) => void;\n resize?: (event: Event, ui: DDUIData) => void;\n}\n\nexport class DDResizable extends DDBaseImplement implements HTMLElementExtendOpt<DDResizableOpt> {\n\n // have to be public else complains for HTMLElementExtendOpt ?\n public el: HTMLElement;\n public option: DDResizableOpt;\n\n /** @internal */\n protected handlers: DDResizableHandle[];\n /** @internal */\n protected originalRect: Rect;\n /** @internal */\n protected temporalRect: Rect;\n /** @internal */\n protected scrollY: number;\n /** @internal */\n protected scrolled: number;\n /** @internal */\n protected scrollEl: HTMLElement;\n /** @internal */\n protected startEvent: MouseEvent;\n /** @internal value saved in the same order as _originStyleProp[] */\n protected elOriginStyleVal: string[];\n /** @internal */\n protected parentOriginStylePosition: string;\n /** @internal */\n protected static _originStyleProp = ['width', 'height', 'position', 'left', 'top', 'opacity', 'zIndex'];\n\n constructor(el: HTMLElement, opts: DDResizableOpt = {}) {\n super();\n this.el = el;\n this.option = opts;\n // create var event binding so we can easily remove and still look like TS methods (unlike anonymous functions)\n this._mouseOver = this._mouseOver.bind(this);\n this._mouseOut = this._mouseOut.bind(this);\n this.enable();\n this._setupAutoHide(this.option.autoHide);\n this._setupHandlers();\n }\n\n public on(event: 'resizestart' | 'resize' | 'resizestop', callback: (event: DragEvent) => void): void {\n super.on(event, callback);\n }\n\n public off(event: 'resizestart' | 'resize' | 'resizestop'): void {\n super.off(event);\n }\n\n public enable(): void {\n super.enable();\n this.el.classList.add('ui-resizable');\n this.el.classList.remove('ui-resizable-disabled');\n }\n\n public disable(): void {\n super.disable();\n this.el.classList.add('ui-resizable-disabled');\n this.el.classList.remove('ui-resizable');\n }\n\n public destroy(): void {\n this._removeHandlers();\n this._setupAutoHide(false);\n this.el.classList.remove('ui-resizable');\n delete this.el;\n super.destroy();\n }\n\n public updateOption(opts: DDResizableOpt): DDResizable {\n let updateHandles = (opts.handles && opts.handles !== this.option.handles);\n let updateAutoHide = (opts.autoHide && opts.autoHide !== this.option.autoHide);\n Object.keys(opts).forEach(key => this.option[key] = opts[key]);\n if (updateHandles) {\n this._removeHandlers();\n this._setupHandlers();\n }\n if (updateAutoHide) {\n this._setupAutoHide(this.option.autoHide);\n }\n return this;\n }\n\n /** @internal turns auto hide on/off */\n protected _setupAutoHide(auto: boolean): DDResizable {\n if (auto) {\n this.el.classList.add('ui-resizable-autohide');\n // use mouseover/mouseout instead of mouseenter/mouseleave to get better performance;\n this.el.addEventListener('mouseover', this._mouseOver);\n this.el.addEventListener('mouseout', this._mouseOut);\n } else {\n this.el.classList.remove('ui-resizable-autohide');\n this.el.removeEventListener('mouseover', this._mouseOver);\n this.el.removeEventListener('mouseout', this._mouseOut);\n }\n return this;\n }\n\n /** @internal */\n protected _mouseOver(e: Event) {\n this.el.classList.remove('ui-resizable-autohide');\n e.stopPropagation();\n }\n\n /** @internal */\n protected _mouseOut(e: Event) {\n this.el.classList.add('ui-resizable-autohide');\n e.stopPropagation();\n }\n\n /** @internal */\n protected _setupHandlers(): DDResizable {\n let handlerDirection = this.option.handles || 'e,s,se';\n if (handlerDirection === 'all') {\n handlerDirection = 'n,e,s,w,se,sw,ne,nw';\n }\n this.handlers = handlerDirection.split(',')\n .map(dir => dir.trim())\n .map(dir => new DDResizableHandle(this.el, dir, {\n start: (event: MouseEvent) => {\n this._resizeStart(event);\n },\n stop: (event: MouseEvent) => {\n this._resizeStop(event);\n },\n move: (event: MouseEvent) => {\n this._resizing(event, dir);\n }\n }));\n return this;\n }\n\n /** @internal */\n protected _resizeStart(event: MouseEvent): DDResizable {\n this.originalRect = this.el.getBoundingClientRect();\n this.scrollEl = Utils.getScrollElement(this.el);\n this.scrollY = this.scrollEl.scrollTop;\n this.scrolled = 0;\n this.startEvent = event;\n this._setupHelper();\n this._applyChange();\n const ev = Utils.initEvent<MouseEvent>(event, { type: 'resizestart', target: this.el });\n if (this.option.start) {\n this.option.start(ev, this._ui());\n }\n this.el.classList.add('ui-resizable-resizing');\n this.triggerEvent('resizestart', ev);\n return this;\n }\n\n /** @internal */\n protected _resizing(event: MouseEvent, dir: string): DDResizable {\n this.scrolled = this.scrollEl.scrollTop - this.scrollY;\n this.temporalRect = this._getChange(event, dir);\n this._applyChange();\n const ev = Utils.initEvent<MouseEvent>(event, { type: 'resize', target: this.el });\n if (this.option.resize) {\n this.option.resize(ev, this._ui());\n }\n this.triggerEvent('resize', ev);\n return this;\n }\n\n /** @internal */\n protected _resizeStop(event: MouseEvent): DDResizable {\n const ev = Utils.initEvent<MouseEvent>(event, { type: 'resizestop', target: this.el });\n if (this.option.stop) {\n this.option.stop(ev); // Note: ui() not used by gridstack so don't pass\n }\n this.el.classList.remove('ui-resizable-resizing');\n this.triggerEvent('resizestop', ev);\n this._cleanHelper();\n delete this.startEvent;\n delete this.originalRect;\n delete this.temporalRect;\n delete this.scrollY;\n delete this.scrolled;\n return this;\n }\n\n /** @internal */\n protected _setupHelper(): DDResizable {\n this.elOriginStyleVal = DDResizable._originStyleProp.map(prop => this.el.style[prop]);\n this.parentOriginStylePosition = this.el.parentElement.style.position;\n if (window.getComputedStyle(this.el.parentElement).position.match(/static/)) {\n this.el.parentElement.style.position = 'relative';\n }\n this.el.style.position = 'absolute';\n this.el.style.opacity = '0.8';\n return this;\n }\n\n /** @internal */\n protected _cleanHelper(): DDResizable {\n DDResizable._originStyleProp.forEach((prop, i) => {\n this.el.style[prop] = this.elOriginStyleVal[i] || null;\n });\n this.el.parentElement.style.position = this.parentOriginStylePosition || null;\n return this;\n }\n\n /** @internal */\n protected _getChange(event: MouseEvent, dir: string): Rect {\n const oEvent = this.startEvent;\n const newRect = { // Note: originalRect is a complex object, not a simple Rect, so copy out.\n width: this.originalRect.width,\n height: this.originalRect.height + this.scrolled,\n left: this.originalRect.left,\n top: this.originalRect.top - this.scrolled\n };\n\n const offsetX = event.clientX - oEvent.clientX;\n const offsetY = event.clientY - oEvent.clientY;\n\n if (dir.indexOf('e') > -1) {\n newRect.width += offsetX;\n } else if (dir.indexOf('w') > -1) {\n newRect.width -= offsetX;\n newRect.left += offsetX;\n }\n if (dir.indexOf('s') > -1) {\n newRect.height += offsetY;\n } else if (dir.indexOf('n') > -1) {\n newRect.height -= offsetY;\n newRect.top += offsetY\n }\n const constrain = this._constrainSize(newRect.width, newRect.height);\n if (Math.round(newRect.width) !== Math.round(constrain.width)) { // round to ignore slight round-off errors\n if (dir.indexOf('w') > -1) {\n newRect.left += newRect.width - constrain.width;\n }\n newRect.width = constrain.width;\n }\n if (Math.round(newRect.height) !== Math.round(constrain.height)) {\n if (dir.indexOf('n') > -1) {\n newRect.top += newRect.height - constrain.height;\n }\n newRect.height = constrain.height;\n }\n return newRect;\n }\n\n /** @internal constrain the size to the set min/max values */\n protected _constrainSize(oWidth: number, oHeight: number): Size {\n const maxWidth = this.option.maxWidth || Number.MAX_SAFE_INTEGER;\n const minWidth = this.option.minWidth || oWidth;\n const maxHeight = this.option.maxHeight || Number.MAX_SAFE_INTEGER;\n const minHeight = this.option.minHeight || oHeight;\n const width = Math.min(maxWidth, Math.max(minWidth, oWidth));\n const height = Math.min(maxHeight, Math.max(minHeight, oHeight));\n return { width, height };\n }\n\n /** @internal */\n protected _applyChange(): DDResizable {\n let containmentRect = { left: 0, top: 0, width: 0, height: 0 };\n if (this.el.style.position === 'absolute') {\n const containmentEl = this.el.parentElement;\n const { left, top } = containmentEl.getBoundingClientRect();\n containmentRect = { left, top, width: 0, height: 0 };\n }\n if (!this.temporalRect) return this;\n Object.keys(this.temporalRect).forEach(key => {\n const value = this.temporalRect[key];\n this.el.style[key] = value - containmentRect[key] + 'px';\n });\n return this;\n }\n\n /** @internal */\n protected _removeHandlers(): DDResizable {\n this.handlers.forEach(handle => handle.destroy());\n delete this.handlers;\n return this;\n }\n\n /** @internal */\n protected _ui = (): DDUIData => {\n const containmentEl = this.el.parentElement;\n const containmentRect = containmentEl.getBoundingClientRect();\n const newRect = { // Note: originalRect is a complex object, not a simple Rect, so copy out.\n width: this.originalRect.width,\n height: this.originalRect.height + this.scrolled,\n left: this.originalRect.left,\n top: this.originalRect.top - this.scrolled\n };\n const rect = this.temporalRect || newRect;\n return {\n position: {\n left: rect.left - containmentRect.left,\n top: rect.top - containmentRect.top\n },\n size: {\n width: rect.width,\n height: rect.height\n }\n /* Gridstack ONLY needs position set above... keep around in case.\n element: [this.el], // The object representing the element to be resized\n helper: [], // TODO: not support yet - The object representing the helper that's being resized\n originalElement: [this.el],// we don't wrap here, so simplify as this.el //The object representing the original element before it is wrapped\n originalPosition: { // The position represented as { left, top } before the resizable is resized\n left: this.originalRect.left - containmentRect.left,\n top: this.originalRect.top - containmentRect.top\n },\n originalSize: { // The size represented as { width, height } before the resizable is resized\n width: this.originalRect.width,\n height: this.originalRect.height\n }\n */\n };\n }\n}\n"]}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* touch.ts 6.0.0
|
|
3
|
+
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* Detect touch support - Windows Surface devices and other touch devices
|
|
7
|
+
* should we use this instead ? (what we had for always showing resize handles)
|
|
8
|
+
* /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
|
|
9
|
+
*/
|
|
10
|
+
export declare const isTouch: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Handle the touchstart events
|
|
13
|
+
* @param {Object} e The widget element's touchstart event
|
|
14
|
+
*/
|
|
15
|
+
export declare function touchstart(e: TouchEvent): void;
|
|
16
|
+
/**
|
|
17
|
+
* Handle the touchmove events
|
|
18
|
+
* @param {Object} e The document's touchmove event
|
|
19
|
+
*/
|
|
20
|
+
export declare function touchmove(e: TouchEvent): void;
|
|
21
|
+
/**
|
|
22
|
+
* Handle the touchend events
|
|
23
|
+
* @param {Object} e The document's touchend event
|
|
24
|
+
*/
|
|
25
|
+
export declare function touchend(e: TouchEvent): void;
|
|
26
|
+
/**
|
|
27
|
+
* Note we don't get touchenter/touchleave (which are deprecated)
|
|
28
|
+
* see https://stackoverflow.com/questions/27908339/js-touch-equivalent-for-mouseenter
|
|
29
|
+
* so instead of PointerEvent to still get enter/leave and send the matching mouse event.
|
|
30
|
+
*/
|
|
31
|
+
export declare function pointerdown(e: PointerEvent): void;
|
|
32
|
+
export declare function pointerenter(e: PointerEvent): void;
|
|
33
|
+
export declare function pointerleave(e: PointerEvent): void;
|
|
@@ -0,0 +1,182 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* touch.ts 6.0.0
|
|
4
|
+
* Copyright (c) 2021 Alain Dumesny - see GridStack root license
|
|
5
|
+
*/
|
|
6
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.pointerleave = exports.pointerenter = exports.pointerdown = exports.touchend = exports.touchmove = exports.touchstart = exports.isTouch = void 0;
|
|
8
|
+
var dd_manager_1 = require("./dd-manager");
|
|
9
|
+
/**
|
|
10
|
+
* Detect touch support - Windows Surface devices and other touch devices
|
|
11
|
+
* should we use this instead ? (what we had for always showing resize handles)
|
|
12
|
+
* /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
|
|
13
|
+
*/
|
|
14
|
+
exports.isTouch = ('ontouchstart' in document
|
|
15
|
+
|| 'ontouchstart' in window
|
|
16
|
+
// || !!window.TouchEvent // true on Windows 10 Chrome desktop so don't use this
|
|
17
|
+
|| (window.DocumentTouch && document instanceof window.DocumentTouch)
|
|
18
|
+
|| navigator.maxTouchPoints > 0
|
|
19
|
+
|| navigator.msMaxTouchPoints > 0);
|
|
20
|
+
// interface TouchCoord {x: number, y: number};
|
|
21
|
+
var DDTouch = /** @class */ (function () {
|
|
22
|
+
function DDTouch() {
|
|
23
|
+
}
|
|
24
|
+
return DDTouch;
|
|
25
|
+
}());
|
|
26
|
+
/**
|
|
27
|
+
* Get the x,y position of a touch event
|
|
28
|
+
*/
|
|
29
|
+
// function getTouchCoords(e: TouchEvent): TouchCoord {
|
|
30
|
+
// return {
|
|
31
|
+
// x: e.changedTouches[0].pageX,
|
|
32
|
+
// y: e.changedTouches[0].pageY
|
|
33
|
+
// };
|
|
34
|
+
// }
|
|
35
|
+
/**
|
|
36
|
+
* Simulate a mouse event based on a corresponding touch event
|
|
37
|
+
* @param {Object} e A touch event
|
|
38
|
+
* @param {String} simulatedType The corresponding mouse event
|
|
39
|
+
*/
|
|
40
|
+
function simulateMouseEvent(e, simulatedType) {
|
|
41
|
+
// Ignore multi-touch events
|
|
42
|
+
if (e.touches.length > 1)
|
|
43
|
+
return;
|
|
44
|
+
// Prevent "Ignored attempt to cancel a touchmove event with cancelable=false" errors
|
|
45
|
+
if (e.cancelable)
|
|
46
|
+
e.preventDefault();
|
|
47
|
+
var touch = e.changedTouches[0], simulatedEvent = document.createEvent('MouseEvents');
|
|
48
|
+
// Initialize the simulated mouse event using the touch event's coordinates
|
|
49
|
+
simulatedEvent.initMouseEvent(simulatedType, // type
|
|
50
|
+
true, // bubbles
|
|
51
|
+
true, // cancelable
|
|
52
|
+
window, // view
|
|
53
|
+
1, // detail
|
|
54
|
+
touch.screenX, // screenX
|
|
55
|
+
touch.screenY, // screenY
|
|
56
|
+
touch.clientX, // clientX
|
|
57
|
+
touch.clientY, // clientY
|
|
58
|
+
false, // ctrlKey
|
|
59
|
+
false, // altKey
|
|
60
|
+
false, // shiftKey
|
|
61
|
+
false, // metaKey
|
|
62
|
+
0, // button
|
|
63
|
+
null // relatedTarget
|
|
64
|
+
);
|
|
65
|
+
// Dispatch the simulated event to the target element
|
|
66
|
+
e.target.dispatchEvent(simulatedEvent);
|
|
67
|
+
}
|
|
68
|
+
/**
|
|
69
|
+
* Simulate a mouse event based on a corresponding Pointer event
|
|
70
|
+
* @param {Object} e A pointer event
|
|
71
|
+
* @param {String} simulatedType The corresponding mouse event
|
|
72
|
+
*/
|
|
73
|
+
function simulatePointerMouseEvent(e, simulatedType) {
|
|
74
|
+
// Prevent "Ignored attempt to cancel a touchmove event with cancelable=false" errors
|
|
75
|
+
if (e.cancelable)
|
|
76
|
+
e.preventDefault();
|
|
77
|
+
var simulatedEvent = document.createEvent('MouseEvents');
|
|
78
|
+
// Initialize the simulated mouse event using the touch event's coordinates
|
|
79
|
+
simulatedEvent.initMouseEvent(simulatedType, // type
|
|
80
|
+
true, // bubbles
|
|
81
|
+
true, // cancelable
|
|
82
|
+
window, // view
|
|
83
|
+
1, // detail
|
|
84
|
+
e.screenX, // screenX
|
|
85
|
+
e.screenY, // screenY
|
|
86
|
+
e.clientX, // clientX
|
|
87
|
+
e.clientY, // clientY
|
|
88
|
+
false, // ctrlKey
|
|
89
|
+
false, // altKey
|
|
90
|
+
false, // shiftKey
|
|
91
|
+
false, // metaKey
|
|
92
|
+
0, // button
|
|
93
|
+
null // relatedTarget
|
|
94
|
+
);
|
|
95
|
+
// Dispatch the simulated event to the target element
|
|
96
|
+
e.target.dispatchEvent(simulatedEvent);
|
|
97
|
+
}
|
|
98
|
+
/**
|
|
99
|
+
* Handle the touchstart events
|
|
100
|
+
* @param {Object} e The widget element's touchstart event
|
|
101
|
+
*/
|
|
102
|
+
function touchstart(e) {
|
|
103
|
+
// Ignore the event if another widget is already being handled
|
|
104
|
+
if (DDTouch.touchHandled)
|
|
105
|
+
return;
|
|
106
|
+
DDTouch.touchHandled = true;
|
|
107
|
+
// Simulate the mouse events
|
|
108
|
+
// simulateMouseEvent(e, 'mouseover');
|
|
109
|
+
// simulateMouseEvent(e, 'mousemove');
|
|
110
|
+
simulateMouseEvent(e, 'mousedown');
|
|
111
|
+
}
|
|
112
|
+
exports.touchstart = touchstart;
|
|
113
|
+
/**
|
|
114
|
+
* Handle the touchmove events
|
|
115
|
+
* @param {Object} e The document's touchmove event
|
|
116
|
+
*/
|
|
117
|
+
function touchmove(e) {
|
|
118
|
+
// Ignore event if not handled by us
|
|
119
|
+
if (!DDTouch.touchHandled)
|
|
120
|
+
return;
|
|
121
|
+
simulateMouseEvent(e, 'mousemove');
|
|
122
|
+
}
|
|
123
|
+
exports.touchmove = touchmove;
|
|
124
|
+
/**
|
|
125
|
+
* Handle the touchend events
|
|
126
|
+
* @param {Object} e The document's touchend event
|
|
127
|
+
*/
|
|
128
|
+
function touchend(e) {
|
|
129
|
+
// Ignore event if not handled
|
|
130
|
+
if (!DDTouch.touchHandled)
|
|
131
|
+
return;
|
|
132
|
+
// cancel delayed leave event when we release on ourself which happens BEFORE we get this!
|
|
133
|
+
if (DDTouch.pointerLeaveTimeout) {
|
|
134
|
+
window.clearTimeout(DDTouch.pointerLeaveTimeout);
|
|
135
|
+
delete DDTouch.pointerLeaveTimeout;
|
|
136
|
+
}
|
|
137
|
+
var wasDragging = !!dd_manager_1.DDManager.dragElement;
|
|
138
|
+
// Simulate the mouseup event
|
|
139
|
+
simulateMouseEvent(e, 'mouseup');
|
|
140
|
+
// simulateMouseEvent(event, 'mouseout');
|
|
141
|
+
// If the touch interaction did not move, it should trigger a click
|
|
142
|
+
if (!wasDragging) {
|
|
143
|
+
simulateMouseEvent(e, 'click');
|
|
144
|
+
}
|
|
145
|
+
// Unset the flag to allow other widgets to inherit the touch event
|
|
146
|
+
DDTouch.touchHandled = false;
|
|
147
|
+
}
|
|
148
|
+
exports.touchend = touchend;
|
|
149
|
+
/**
|
|
150
|
+
* Note we don't get touchenter/touchleave (which are deprecated)
|
|
151
|
+
* see https://stackoverflow.com/questions/27908339/js-touch-equivalent-for-mouseenter
|
|
152
|
+
* so instead of PointerEvent to still get enter/leave and send the matching mouse event.
|
|
153
|
+
*/
|
|
154
|
+
function pointerdown(e) {
|
|
155
|
+
e.target.releasePointerCapture(e.pointerId); // <- Important!
|
|
156
|
+
}
|
|
157
|
+
exports.pointerdown = pointerdown;
|
|
158
|
+
function pointerenter(e) {
|
|
159
|
+
// ignore the initial one we get on pointerdown on ourself
|
|
160
|
+
if (!dd_manager_1.DDManager.dragElement) {
|
|
161
|
+
// console.log('pointerenter ignored');
|
|
162
|
+
return;
|
|
163
|
+
}
|
|
164
|
+
// console.log('pointerenter');
|
|
165
|
+
simulatePointerMouseEvent(e, 'mouseenter');
|
|
166
|
+
}
|
|
167
|
+
exports.pointerenter = pointerenter;
|
|
168
|
+
function pointerleave(e) {
|
|
169
|
+
// ignore the leave on ourself we get before releasing the mouse over ourself
|
|
170
|
+
// by delaying sending the event and having the up event cancel us
|
|
171
|
+
if (!dd_manager_1.DDManager.dragElement) {
|
|
172
|
+
// console.log('pointerleave ignored');
|
|
173
|
+
return;
|
|
174
|
+
}
|
|
175
|
+
DDTouch.pointerLeaveTimeout = window.setTimeout(function () {
|
|
176
|
+
delete DDTouch.pointerLeaveTimeout;
|
|
177
|
+
// console.log('pointerleave delayed');
|
|
178
|
+
simulatePointerMouseEvent(e, 'mouseleave');
|
|
179
|
+
}, 10);
|
|
180
|
+
}
|
|
181
|
+
exports.pointerleave = pointerleave;
|
|
182
|
+
//# sourceMappingURL=dd-touch.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dd-touch.js","sourceRoot":"","sources":["../../src/dd-touch.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * touch.ts 6.0.0\n * Copyright (c) 2021 Alain Dumesny - see GridStack root license\n */\n\nimport { DDManager } from './dd-manager';\n\n/**\n * Detect touch support - Windows Surface devices and other touch devices\n * should we use this instead ? (what we had for always showing resize handles)\n * /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)\n */\nexport const isTouch: boolean = ( 'ontouchstart' in document\n || 'ontouchstart' in window\n // || !!window.TouchEvent // true on Windows 10 Chrome desktop so don't use this\n || ((window as any).DocumentTouch && document instanceof (window as any).DocumentTouch)\n || navigator.maxTouchPoints > 0\n || (navigator as any).msMaxTouchPoints > 0\n);\n\n// interface TouchCoord {x: number, y: number};\n\nclass DDTouch {\n public static touchHandled: boolean;\n public static pointerLeaveTimeout: number;\n}\n\n/**\n* Get the x,y position of a touch event\n*/\n// function getTouchCoords(e: TouchEvent): TouchCoord {\n// return {\n// x: e.changedTouches[0].pageX,\n// y: e.changedTouches[0].pageY\n// };\n// }\n\n/**\n * Simulate a mouse event based on a corresponding touch event\n * @param {Object} e A touch event\n * @param {String} simulatedType The corresponding mouse event\n */\nfunction simulateMouseEvent(e: TouchEvent, simulatedType: string) {\n\n // Ignore multi-touch events\n if (e.touches.length > 1) return;\n\n // Prevent \"Ignored attempt to cancel a touchmove event with cancelable=false\" errors\n if (e.cancelable) e.preventDefault();\n\n const touch = e.changedTouches[0], simulatedEvent = document.createEvent('MouseEvents');\n\n // Initialize the simulated mouse event using the touch event's coordinates\n simulatedEvent.initMouseEvent(\n simulatedType, // type\n true, // bubbles\n true, // cancelable\n window, // view\n 1, // detail\n touch.screenX, // screenX\n touch.screenY, // screenY\n touch.clientX, // clientX\n touch.clientY, // clientY\n false, // ctrlKey\n false, // altKey\n false, // shiftKey\n false, // metaKey\n 0, // button\n null // relatedTarget\n );\n\n // Dispatch the simulated event to the target element\n e.target.dispatchEvent(simulatedEvent);\n}\n\n/**\n * Simulate a mouse event based on a corresponding Pointer event\n * @param {Object} e A pointer event\n * @param {String} simulatedType The corresponding mouse event\n */\nfunction simulatePointerMouseEvent(e: PointerEvent, simulatedType: string) {\n\n // Prevent \"Ignored attempt to cancel a touchmove event with cancelable=false\" errors\n if (e.cancelable) e.preventDefault();\n\n const simulatedEvent = document.createEvent('MouseEvents');\n\n // Initialize the simulated mouse event using the touch event's coordinates\n simulatedEvent.initMouseEvent(\n simulatedType, // type\n true, // bubbles\n true, // cancelable\n window, // view\n 1, // detail\n e.screenX, // screenX\n e.screenY, // screenY\n e.clientX, // clientX\n e.clientY, // clientY\n false, // ctrlKey\n false, // altKey\n false, // shiftKey\n false, // metaKey\n 0, // button\n null // relatedTarget\n );\n\n // Dispatch the simulated event to the target element\n e.target.dispatchEvent(simulatedEvent);\n}\n\n\n/**\n * Handle the touchstart events\n * @param {Object} e The widget element's touchstart event\n */\nexport function touchstart(e: TouchEvent) {\n // Ignore the event if another widget is already being handled\n if (DDTouch.touchHandled) return; DDTouch.touchHandled = true;\n\n // Simulate the mouse events\n // simulateMouseEvent(e, 'mouseover');\n // simulateMouseEvent(e, 'mousemove');\n simulateMouseEvent(e, 'mousedown');\n}\n\n/**\n * Handle the touchmove events\n * @param {Object} e The document's touchmove event\n */\nexport function touchmove(e: TouchEvent) {\n // Ignore event if not handled by us\n if (!DDTouch.touchHandled) return;\n\n simulateMouseEvent(e, 'mousemove');\n}\n\n/**\n * Handle the touchend events\n * @param {Object} e The document's touchend event\n */\nexport function touchend(e: TouchEvent) {\n\n // Ignore event if not handled\n if (!DDTouch.touchHandled) return;\n\n // cancel delayed leave event when we release on ourself which happens BEFORE we get this!\n if (DDTouch.pointerLeaveTimeout) {\n window.clearTimeout(DDTouch.pointerLeaveTimeout);\n delete DDTouch.pointerLeaveTimeout;\n }\n\n const wasDragging = !!DDManager.dragElement;\n\n // Simulate the mouseup event\n simulateMouseEvent(e, 'mouseup');\n // simulateMouseEvent(event, 'mouseout');\n\n // If the touch interaction did not move, it should trigger a click\n if (!wasDragging) {\n simulateMouseEvent(e, 'click');\n }\n\n // Unset the flag to allow other widgets to inherit the touch event\n DDTouch.touchHandled = false;\n}\n\n/**\n * Note we don't get touchenter/touchleave (which are deprecated)\n * see https://stackoverflow.com/questions/27908339/js-touch-equivalent-for-mouseenter\n * so instead of PointerEvent to still get enter/leave and send the matching mouse event.\n */\nexport function pointerdown(e: PointerEvent) {\n (e.target as HTMLElement).releasePointerCapture(e.pointerId) // <- Important!\n}\n\nexport function pointerenter(e: PointerEvent) {\n // ignore the initial one we get on pointerdown on ourself\n if (!DDManager.dragElement) {\n // console.log('pointerenter ignored');\n return;\n }\n // console.log('pointerenter');\n simulatePointerMouseEvent(e, 'mouseenter');\n}\n\nexport function pointerleave(e: PointerEvent) {\n // ignore the leave on ourself we get before releasing the mouse over ourself\n // by delaying sending the event and having the up event cancel us\n if (!DDManager.dragElement) {\n // console.log('pointerleave ignored');\n return;\n }\n DDTouch.pointerLeaveTimeout = window.setTimeout(() => {\n delete DDTouch.pointerLeaveTimeout;\n // console.log('pointerleave delayed');\n simulatePointerMouseEvent(e, 'mouseleave');\n }, 10);\n}\n\n"]}
|