@tsparticles/plugin-interactivity 4.0.0-alpha.4
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/284.min.js +2 -0
- package/284.min.js.LICENSE.txt +1 -0
- package/721.min.js +2 -0
- package/721.min.js.LICENSE.txt +1 -0
- package/LICENSE +21 -0
- package/README.md +74 -0
- package/browser/DivType.js +5 -0
- package/browser/ExternalInteractorBase.js +7 -0
- package/browser/IExternalInteractor.js +1 -0
- package/browser/IInteractivityData.js +1 -0
- package/browser/IInteractor.js +1 -0
- package/browser/IMouseData.js +1 -0
- package/browser/IParticlesInteractor.js +1 -0
- package/browser/InteractionManager.js +202 -0
- package/browser/InteractivityConstants.js +1 -0
- package/browser/InteractivityDetect.js +6 -0
- package/browser/InteractivityEventListeners.js +235 -0
- package/browser/InteractivityPlugin.js +48 -0
- package/browser/InteractivityPluginInstance.js +52 -0
- package/browser/InteractorType.js +5 -0
- package/browser/Options/Classes/Events/ClickEvent.js +18 -0
- package/browser/Options/Classes/Events/DivEvent.js +27 -0
- package/browser/Options/Classes/Events/Events.js +26 -0
- package/browser/Options/Classes/Events/HoverEvent.js +18 -0
- package/browser/Options/Classes/Interactivity.js +22 -0
- package/browser/Options/Classes/Modes/Modes.js +25 -0
- package/browser/Options/Interfaces/Events/IClickEvent.js +1 -0
- package/browser/Options/Interfaces/Events/IDivEvent.js +1 -0
- package/browser/Options/Interfaces/Events/IEvents.js +1 -0
- package/browser/Options/Interfaces/Events/IHoverEvent.js +1 -0
- package/browser/Options/Interfaces/IInteractivity.js +1 -0
- package/browser/Options/Interfaces/Modes/IModeDiv.js +1 -0
- package/browser/Options/Interfaces/Modes/IModes.js +1 -0
- package/browser/ParticlesInteractorBase.js +7 -0
- package/browser/index.js +38 -0
- package/browser/package.json +1 -0
- package/browser/types.js +1 -0
- package/browser/utils.js +32 -0
- package/cjs/DivType.js +5 -0
- package/cjs/ExternalInteractorBase.js +7 -0
- package/cjs/IExternalInteractor.js +1 -0
- package/cjs/IInteractivityData.js +1 -0
- package/cjs/IInteractor.js +1 -0
- package/cjs/IMouseData.js +1 -0
- package/cjs/IParticlesInteractor.js +1 -0
- package/cjs/InteractionManager.js +202 -0
- package/cjs/InteractivityConstants.js +1 -0
- package/cjs/InteractivityDetect.js +6 -0
- package/cjs/InteractivityEventListeners.js +235 -0
- package/cjs/InteractivityPlugin.js +48 -0
- package/cjs/InteractivityPluginInstance.js +52 -0
- package/cjs/InteractorType.js +5 -0
- package/cjs/Options/Classes/Events/ClickEvent.js +18 -0
- package/cjs/Options/Classes/Events/DivEvent.js +27 -0
- package/cjs/Options/Classes/Events/Events.js +26 -0
- package/cjs/Options/Classes/Events/HoverEvent.js +18 -0
- package/cjs/Options/Classes/Interactivity.js +22 -0
- package/cjs/Options/Classes/Modes/Modes.js +25 -0
- package/cjs/Options/Interfaces/Events/IClickEvent.js +1 -0
- package/cjs/Options/Interfaces/Events/IDivEvent.js +1 -0
- package/cjs/Options/Interfaces/Events/IEvents.js +1 -0
- package/cjs/Options/Interfaces/Events/IHoverEvent.js +1 -0
- package/cjs/Options/Interfaces/IInteractivity.js +1 -0
- package/cjs/Options/Interfaces/Modes/IModeDiv.js +1 -0
- package/cjs/Options/Interfaces/Modes/IModes.js +1 -0
- package/cjs/ParticlesInteractorBase.js +7 -0
- package/cjs/index.js +38 -0
- package/cjs/package.json +1 -0
- package/cjs/types.js +1 -0
- package/cjs/utils.js +32 -0
- package/dist_browser_InteractivityPluginInstance_js.js +50 -0
- package/dist_browser_InteractivityPlugin_js.js +70 -0
- package/esm/DivType.js +5 -0
- package/esm/ExternalInteractorBase.js +7 -0
- package/esm/IExternalInteractor.js +1 -0
- package/esm/IInteractivityData.js +1 -0
- package/esm/IInteractor.js +1 -0
- package/esm/IMouseData.js +1 -0
- package/esm/IParticlesInteractor.js +1 -0
- package/esm/InteractionManager.js +202 -0
- package/esm/InteractivityConstants.js +1 -0
- package/esm/InteractivityDetect.js +6 -0
- package/esm/InteractivityEventListeners.js +235 -0
- package/esm/InteractivityPlugin.js +48 -0
- package/esm/InteractivityPluginInstance.js +52 -0
- package/esm/InteractorType.js +5 -0
- package/esm/Options/Classes/Events/ClickEvent.js +18 -0
- package/esm/Options/Classes/Events/DivEvent.js +27 -0
- package/esm/Options/Classes/Events/Events.js +26 -0
- package/esm/Options/Classes/Events/HoverEvent.js +18 -0
- package/esm/Options/Classes/Interactivity.js +22 -0
- package/esm/Options/Classes/Modes/Modes.js +25 -0
- package/esm/Options/Interfaces/Events/IClickEvent.js +1 -0
- package/esm/Options/Interfaces/Events/IDivEvent.js +1 -0
- package/esm/Options/Interfaces/Events/IEvents.js +1 -0
- package/esm/Options/Interfaces/Events/IHoverEvent.js +1 -0
- package/esm/Options/Interfaces/IInteractivity.js +1 -0
- package/esm/Options/Interfaces/Modes/IModeDiv.js +1 -0
- package/esm/Options/Interfaces/Modes/IModes.js +1 -0
- package/esm/ParticlesInteractorBase.js +7 -0
- package/esm/index.js +38 -0
- package/esm/package.json +1 -0
- package/esm/types.js +1 -0
- package/esm/utils.js +32 -0
- package/package.json +95 -0
- package/report.html +40 -0
- package/tsparticles.plugin.interactivity.js +395 -0
- package/tsparticles.plugin.interactivity.min.js +2 -0
- package/tsparticles.plugin.interactivity.min.js.LICENSE.txt +1 -0
- package/types/DivType.d.ts +4 -0
- package/types/ExternalInteractorBase.d.ts +15 -0
- package/types/IExternalInteractor.d.ts +11 -0
- package/types/IInteractivityData.d.ts +6 -0
- package/types/IInteractor.d.ts +12 -0
- package/types/IMouseData.d.ts +9 -0
- package/types/IParticlesInteractor.d.ts +7 -0
- package/types/InteractionManager.d.ts +27 -0
- package/types/InteractivityConstants.d.ts +1 -0
- package/types/InteractivityDetect.d.ts +5 -0
- package/types/InteractivityEventListeners.d.ts +23 -0
- package/types/InteractivityPlugin.d.ts +11 -0
- package/types/InteractivityPluginInstance.d.ts +20 -0
- package/types/InteractorType.d.ts +4 -0
- package/types/Options/Classes/Events/ClickEvent.d.ts +8 -0
- package/types/Options/Classes/Events/DivEvent.d.ts +11 -0
- package/types/Options/Classes/Events/Events.d.ts +12 -0
- package/types/Options/Classes/Events/HoverEvent.d.ts +8 -0
- package/types/Options/Classes/Interactivity.d.ts +14 -0
- package/types/Options/Classes/Modes/Modes.d.ts +10 -0
- package/types/Options/Interfaces/Events/IClickEvent.d.ts +5 -0
- package/types/Options/Interfaces/Events/IDivEvent.d.ts +8 -0
- package/types/Options/Interfaces/Events/IEvents.d.ts +9 -0
- package/types/Options/Interfaces/Events/IHoverEvent.d.ts +5 -0
- package/types/Options/Interfaces/IInteractivity.d.ts +9 -0
- package/types/Options/Interfaces/Modes/IModeDiv.d.ts +4 -0
- package/types/Options/Interfaces/Modes/IModes.d.ts +1 -0
- package/types/ParticlesInteractorBase.d.ts +15 -0
- package/types/index.d.ts +19 -0
- package/types/types.d.ts +32 -0
- package/types/utils.d.ts +7 -0
- package/umd/DivType.js +18 -0
- package/umd/ExternalInteractorBase.js +21 -0
- package/umd/IExternalInteractor.js +12 -0
- package/umd/IInteractivityData.js +12 -0
- package/umd/IInteractor.js +12 -0
- package/umd/IMouseData.js +12 -0
- package/umd/IParticlesInteractor.js +12 -0
- package/umd/InteractionManager.js +216 -0
- package/umd/InteractivityConstants.js +14 -0
- package/umd/InteractivityDetect.js +19 -0
- package/umd/InteractivityEventListeners.js +249 -0
- package/umd/InteractivityPlugin.js +96 -0
- package/umd/InteractivityPluginInstance.js +66 -0
- package/umd/InteractorType.js +18 -0
- package/umd/Options/Classes/Events/ClickEvent.js +32 -0
- package/umd/Options/Classes/Events/DivEvent.js +41 -0
- package/umd/Options/Classes/Events/Events.js +40 -0
- package/umd/Options/Classes/Events/HoverEvent.js +32 -0
- package/umd/Options/Classes/Interactivity.js +36 -0
- package/umd/Options/Classes/Modes/Modes.js +39 -0
- package/umd/Options/Interfaces/Events/IClickEvent.js +12 -0
- package/umd/Options/Interfaces/Events/IDivEvent.js +12 -0
- package/umd/Options/Interfaces/Events/IEvents.js +12 -0
- package/umd/Options/Interfaces/Events/IHoverEvent.js +12 -0
- package/umd/Options/Interfaces/IInteractivity.js +12 -0
- package/umd/Options/Interfaces/Modes/IModeDiv.js +12 -0
- package/umd/Options/Interfaces/Modes/IModes.js +12 -0
- package/umd/ParticlesInteractorBase.js +21 -0
- package/umd/index.js +88 -0
- package/umd/types.js +12 -0
- package/umd/utils.js +48 -0
|
@@ -0,0 +1,249 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine", "./InteractivityConstants.js", "./InteractivityDetect.js"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.InteractivityEventListeners = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
const InteractivityConstants_js_1 = require("./InteractivityConstants.js");
|
|
15
|
+
const InteractivityDetect_js_1 = require("./InteractivityDetect.js");
|
|
16
|
+
class InteractivityEventListeners {
|
|
17
|
+
constructor(container, interactionManager) {
|
|
18
|
+
this._canPush = true;
|
|
19
|
+
this._doMouseTouchClick = e => {
|
|
20
|
+
const container = this._container, interactionManager = this._interactionManager, options = container.actualOptions;
|
|
21
|
+
if (this._canPush) {
|
|
22
|
+
const mouseInteractivity = interactionManager.interactivityData.mouse, mousePos = mouseInteractivity.position;
|
|
23
|
+
if (!mousePos) {
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
mouseInteractivity.clickPosition = { ...mousePos };
|
|
27
|
+
mouseInteractivity.clickTime = Date.now();
|
|
28
|
+
const onClick = options.interactivity?.events.onClick;
|
|
29
|
+
if (!onClick?.mode) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
(0, engine_1.executeOnSingleOrMultiple)(onClick.mode, mode => {
|
|
33
|
+
interactionManager.handleClickMode(mode);
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
if (e.type === "touchend") {
|
|
37
|
+
setTimeout(() => {
|
|
38
|
+
this._mouseTouchFinish();
|
|
39
|
+
}, engine_1.touchDelay);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
this._handleVisibilityChange = () => {
|
|
43
|
+
this._mouseTouchFinish();
|
|
44
|
+
};
|
|
45
|
+
this._manageInteractivityListeners = (mouseLeaveTmpEvent, add) => {
|
|
46
|
+
const handlers = this._handlers, container = this._container, interactionManager = this._interactionManager, options = container.actualOptions, interactivityEl = interactionManager.interactivityData.element;
|
|
47
|
+
if (!interactivityEl) {
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
const html = interactivityEl, canvas = container.canvas;
|
|
51
|
+
canvas.setPointerEvents(html === canvas.element ? "initial" : "none");
|
|
52
|
+
if (!(options.interactivity?.events.onHover.enable || options.interactivity?.events.onClick.enable)) {
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.mouseMoveEvent, handlers.mouseMove, add);
|
|
56
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.touchStartEvent, handlers.touchStart, add);
|
|
57
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.touchMoveEvent, handlers.touchMove, add);
|
|
58
|
+
if (options.interactivity.events.onClick.enable) {
|
|
59
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.touchEndEvent, handlers.touchEndClick, add);
|
|
60
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.mouseUpEvent, handlers.mouseUp, add);
|
|
61
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.mouseDownEvent, handlers.mouseDown, add);
|
|
62
|
+
}
|
|
63
|
+
else {
|
|
64
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.touchEndEvent, handlers.touchEnd, add);
|
|
65
|
+
}
|
|
66
|
+
(0, engine_1.manageListener)(interactivityEl, mouseLeaveTmpEvent, handlers.mouseLeave, add);
|
|
67
|
+
(0, engine_1.manageListener)(interactivityEl, InteractivityConstants_js_1.touchCancelEvent, handlers.touchCancel, add);
|
|
68
|
+
};
|
|
69
|
+
this._manageListeners = add => {
|
|
70
|
+
const handlers = this._handlers, container = this._container, interactionManager = this._interactionManager, options = container.actualOptions, detectType = options.interactivity?.detectsOn, canvasEl = container.canvas.element;
|
|
71
|
+
let mouseLeaveTmpEvent = InteractivityConstants_js_1.mouseLeaveEvent;
|
|
72
|
+
if (detectType === InteractivityDetect_js_1.InteractivityDetect.window) {
|
|
73
|
+
interactionManager.interactivityData.element = globalThis;
|
|
74
|
+
mouseLeaveTmpEvent = InteractivityConstants_js_1.mouseOutEvent;
|
|
75
|
+
}
|
|
76
|
+
else if (detectType === InteractivityDetect_js_1.InteractivityDetect.parent && canvasEl) {
|
|
77
|
+
interactionManager.interactivityData.element = canvasEl.parentElement ?? canvasEl.parentNode;
|
|
78
|
+
}
|
|
79
|
+
else {
|
|
80
|
+
interactionManager.interactivityData.element = canvasEl;
|
|
81
|
+
}
|
|
82
|
+
this._manageInteractivityListeners(mouseLeaveTmpEvent, add);
|
|
83
|
+
(0, engine_1.manageListener)(document, engine_1.visibilityChangeEvent, handlers.visibilityChange, add, false);
|
|
84
|
+
};
|
|
85
|
+
this._mouseDown = () => {
|
|
86
|
+
const { interactivityData } = this._interactionManager, { mouse } = interactivityData;
|
|
87
|
+
mouse.clicking = true;
|
|
88
|
+
mouse.downPosition = mouse.position;
|
|
89
|
+
};
|
|
90
|
+
this._mouseTouchClick = e => {
|
|
91
|
+
const container = this._container, interactionManager = this._interactionManager, options = container.actualOptions, { mouse } = interactionManager.interactivityData;
|
|
92
|
+
mouse.inside = true;
|
|
93
|
+
let handled = false;
|
|
94
|
+
const mousePosition = mouse.position;
|
|
95
|
+
if (!mousePosition || !options.interactivity?.events.onClick.enable) {
|
|
96
|
+
return;
|
|
97
|
+
}
|
|
98
|
+
for (const plugin of container.plugins) {
|
|
99
|
+
if (!plugin.clickPositionValid) {
|
|
100
|
+
continue;
|
|
101
|
+
}
|
|
102
|
+
handled = plugin.clickPositionValid(mousePosition);
|
|
103
|
+
if (handled) {
|
|
104
|
+
break;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
if (!handled) {
|
|
108
|
+
this._doMouseTouchClick(e);
|
|
109
|
+
}
|
|
110
|
+
mouse.clicking = false;
|
|
111
|
+
};
|
|
112
|
+
this._mouseTouchFinish = () => {
|
|
113
|
+
const { interactivityData } = this._interactionManager, { mouse } = interactivityData;
|
|
114
|
+
delete mouse.position;
|
|
115
|
+
delete mouse.clickPosition;
|
|
116
|
+
delete mouse.downPosition;
|
|
117
|
+
interactivityData.status = InteractivityConstants_js_1.mouseLeaveEvent;
|
|
118
|
+
mouse.inside = false;
|
|
119
|
+
mouse.clicking = false;
|
|
120
|
+
};
|
|
121
|
+
this._mouseTouchMove = e => {
|
|
122
|
+
const container = this._container, interactionManager = this._interactionManager, options = container.actualOptions, interactivity = interactionManager.interactivityData, canvasEl = container.canvas.element;
|
|
123
|
+
if (!interactivity.element) {
|
|
124
|
+
return;
|
|
125
|
+
}
|
|
126
|
+
interactivity.mouse.inside = true;
|
|
127
|
+
let pos;
|
|
128
|
+
if (e.type.startsWith("pointer")) {
|
|
129
|
+
this._canPush = true;
|
|
130
|
+
const mouseEvent = e;
|
|
131
|
+
if (interactivity.element === globalThis) {
|
|
132
|
+
if (canvasEl) {
|
|
133
|
+
const clientRect = canvasEl.getBoundingClientRect();
|
|
134
|
+
pos = {
|
|
135
|
+
x: mouseEvent.clientX - clientRect.left,
|
|
136
|
+
y: mouseEvent.clientY - clientRect.top,
|
|
137
|
+
};
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
else if (options.interactivity?.detectsOn === InteractivityDetect_js_1.InteractivityDetect.parent) {
|
|
141
|
+
const source = mouseEvent.target, target = mouseEvent.currentTarget;
|
|
142
|
+
if (canvasEl) {
|
|
143
|
+
const sourceRect = source.getBoundingClientRect(), targetRect = target.getBoundingClientRect(), canvasRect = canvasEl.getBoundingClientRect();
|
|
144
|
+
pos = {
|
|
145
|
+
x: mouseEvent.offsetX + engine_1.double * sourceRect.left - (targetRect.left + canvasRect.left),
|
|
146
|
+
y: mouseEvent.offsetY + engine_1.double * sourceRect.top - (targetRect.top + canvasRect.top),
|
|
147
|
+
};
|
|
148
|
+
}
|
|
149
|
+
else {
|
|
150
|
+
pos = {
|
|
151
|
+
x: mouseEvent.offsetX,
|
|
152
|
+
y: mouseEvent.offsetY,
|
|
153
|
+
};
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
else if (mouseEvent.target === canvasEl) {
|
|
157
|
+
pos = {
|
|
158
|
+
x: mouseEvent.offsetX,
|
|
159
|
+
y: mouseEvent.offsetY,
|
|
160
|
+
};
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
else {
|
|
164
|
+
this._canPush = e.type !== "touchmove";
|
|
165
|
+
if (canvasEl) {
|
|
166
|
+
const touchEvent = e, lastTouch = touchEvent.touches[touchEvent.touches.length - engine_1.lengthOffset], canvasRect = canvasEl.getBoundingClientRect();
|
|
167
|
+
if (!lastTouch) {
|
|
168
|
+
return;
|
|
169
|
+
}
|
|
170
|
+
pos = {
|
|
171
|
+
x: lastTouch.clientX - canvasRect.left,
|
|
172
|
+
y: lastTouch.clientY - canvasRect.top,
|
|
173
|
+
};
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
const pxRatio = container.retina.pixelRatio;
|
|
177
|
+
if (pos) {
|
|
178
|
+
pos.x *= pxRatio;
|
|
179
|
+
pos.y *= pxRatio;
|
|
180
|
+
}
|
|
181
|
+
interactivity.mouse.position = pos;
|
|
182
|
+
interactivity.status = InteractivityConstants_js_1.mouseMoveEvent;
|
|
183
|
+
};
|
|
184
|
+
this._touchEnd = e => {
|
|
185
|
+
const evt = e, touches = Array.from(evt.changedTouches);
|
|
186
|
+
for (const touch of touches) {
|
|
187
|
+
this._touches.delete(touch.identifier);
|
|
188
|
+
}
|
|
189
|
+
this._mouseTouchFinish();
|
|
190
|
+
};
|
|
191
|
+
this._touchEndClick = e => {
|
|
192
|
+
const evt = e, touches = Array.from(evt.changedTouches);
|
|
193
|
+
for (const touch of touches) {
|
|
194
|
+
this._touches.delete(touch.identifier);
|
|
195
|
+
}
|
|
196
|
+
this._mouseTouchClick(e);
|
|
197
|
+
};
|
|
198
|
+
this._touchStart = e => {
|
|
199
|
+
const evt = e, touches = Array.from(evt.changedTouches);
|
|
200
|
+
for (const touch of touches) {
|
|
201
|
+
this._touches.set(touch.identifier, performance.now());
|
|
202
|
+
}
|
|
203
|
+
this._mouseTouchMove(e);
|
|
204
|
+
};
|
|
205
|
+
this._container = container;
|
|
206
|
+
this._interactionManager = interactionManager;
|
|
207
|
+
this._touches = new Map();
|
|
208
|
+
this._handlers = {
|
|
209
|
+
mouseDown: () => {
|
|
210
|
+
this._mouseDown();
|
|
211
|
+
},
|
|
212
|
+
mouseLeave: () => {
|
|
213
|
+
this._mouseTouchFinish();
|
|
214
|
+
},
|
|
215
|
+
mouseMove: (e) => {
|
|
216
|
+
this._mouseTouchMove(e);
|
|
217
|
+
},
|
|
218
|
+
mouseUp: (e) => {
|
|
219
|
+
this._mouseTouchClick(e);
|
|
220
|
+
},
|
|
221
|
+
touchStart: (e) => {
|
|
222
|
+
this._touchStart(e);
|
|
223
|
+
},
|
|
224
|
+
touchMove: (e) => {
|
|
225
|
+
this._mouseTouchMove(e);
|
|
226
|
+
},
|
|
227
|
+
touchEnd: (e) => {
|
|
228
|
+
this._touchEnd(e);
|
|
229
|
+
},
|
|
230
|
+
touchCancel: (e) => {
|
|
231
|
+
this._touchEnd(e);
|
|
232
|
+
},
|
|
233
|
+
touchEndClick: (e) => {
|
|
234
|
+
this._touchEndClick(e);
|
|
235
|
+
},
|
|
236
|
+
visibilityChange: () => {
|
|
237
|
+
this._handleVisibilityChange();
|
|
238
|
+
},
|
|
239
|
+
};
|
|
240
|
+
}
|
|
241
|
+
addListeners() {
|
|
242
|
+
this._manageListeners(true);
|
|
243
|
+
}
|
|
244
|
+
removeListeners() {
|
|
245
|
+
this._manageListeners(false);
|
|
246
|
+
}
|
|
247
|
+
}
|
|
248
|
+
exports.InteractivityEventListeners = InteractivityEventListeners;
|
|
249
|
+
});
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
2
|
+
if (k2 === undefined) k2 = k;
|
|
3
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
4
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
5
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
6
|
+
}
|
|
7
|
+
Object.defineProperty(o, k2, desc);
|
|
8
|
+
}) : (function(o, m, k, k2) {
|
|
9
|
+
if (k2 === undefined) k2 = k;
|
|
10
|
+
o[k2] = m[k];
|
|
11
|
+
}));
|
|
12
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
13
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
14
|
+
}) : function(o, v) {
|
|
15
|
+
o["default"] = v;
|
|
16
|
+
});
|
|
17
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
18
|
+
var ownKeys = function(o) {
|
|
19
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
20
|
+
var ar = [];
|
|
21
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
22
|
+
return ar;
|
|
23
|
+
};
|
|
24
|
+
return ownKeys(o);
|
|
25
|
+
};
|
|
26
|
+
return function (mod) {
|
|
27
|
+
if (mod && mod.__esModule) return mod;
|
|
28
|
+
var result = {};
|
|
29
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
30
|
+
__setModuleDefault(result, mod);
|
|
31
|
+
return result;
|
|
32
|
+
};
|
|
33
|
+
})();
|
|
34
|
+
(function (factory) {
|
|
35
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
36
|
+
var v = factory(require, exports);
|
|
37
|
+
if (v !== undefined) module.exports = v;
|
|
38
|
+
}
|
|
39
|
+
else if (typeof define === "function" && define.amd) {
|
|
40
|
+
define(["require", "exports", "@tsparticles/engine", "./Options/Classes/Interactivity.js"], factory);
|
|
41
|
+
}
|
|
42
|
+
})(function (require, exports) {
|
|
43
|
+
"use strict";
|
|
44
|
+
var __syncRequire = typeof module === "object" && typeof module.exports === "object";
|
|
45
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
46
|
+
exports.InteractivityPlugin = void 0;
|
|
47
|
+
const engine_1 = require("@tsparticles/engine");
|
|
48
|
+
const Interactivity_js_1 = require("./Options/Classes/Interactivity.js");
|
|
49
|
+
class InteractivityPlugin {
|
|
50
|
+
constructor(engine) {
|
|
51
|
+
this._engine = engine;
|
|
52
|
+
this.id = "interactivity";
|
|
53
|
+
}
|
|
54
|
+
async getPlugin(container) {
|
|
55
|
+
const { InteractivityPluginInstance } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./InteractivityPluginInstance.js"))) : new Promise((resolve_1, reject_1) => { require(["./InteractivityPluginInstance.js"], resolve_1, reject_1); }).then(__importStar));
|
|
56
|
+
return new InteractivityPluginInstance(this._engine, container);
|
|
57
|
+
}
|
|
58
|
+
loadOptions(container, options, source) {
|
|
59
|
+
if (!this.needsPlugin()) {
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
let interactivityOptions = options.interactivity;
|
|
63
|
+
if (!interactivityOptions?.load) {
|
|
64
|
+
options.interactivity = interactivityOptions = new Interactivity_js_1.Interactivity(this._engine, container);
|
|
65
|
+
}
|
|
66
|
+
interactivityOptions.load(source?.interactivity);
|
|
67
|
+
const interactors = this._engine.interactors?.get(container);
|
|
68
|
+
if (!interactors) {
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
for (const interactor of interactors) {
|
|
72
|
+
if (interactor.loadOptions) {
|
|
73
|
+
interactor.loadOptions(options, source);
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
loadParticlesOptions(container, options, source) {
|
|
78
|
+
if (source?.interactivity) {
|
|
79
|
+
options.interactivity = (0, engine_1.deepExtend)({}, source.interactivity);
|
|
80
|
+
}
|
|
81
|
+
const interactors = this._engine.interactors?.get(container);
|
|
82
|
+
if (!interactors) {
|
|
83
|
+
return;
|
|
84
|
+
}
|
|
85
|
+
for (const interactor of interactors) {
|
|
86
|
+
if (interactor.loadParticlesOptions) {
|
|
87
|
+
interactor.loadParticlesOptions(options, source);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
needsPlugin() {
|
|
92
|
+
return true;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
exports.InteractivityPlugin = InteractivityPlugin;
|
|
96
|
+
});
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "./InteractionManager.js", "./Options/Classes/Interactivity.js"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.InteractivityPluginInstance = void 0;
|
|
13
|
+
const InteractionManager_js_1 = require("./InteractionManager.js");
|
|
14
|
+
const Interactivity_js_1 = require("./Options/Classes/Interactivity.js");
|
|
15
|
+
class InteractivityPluginInstance {
|
|
16
|
+
constructor(engine, container) {
|
|
17
|
+
this._container = container;
|
|
18
|
+
this._engine = engine;
|
|
19
|
+
this.interactionManager = new InteractionManager_js_1.InteractionManager(engine, container);
|
|
20
|
+
this._container.addClickHandler = (callback) => {
|
|
21
|
+
this.interactionManager.addClickHandler(callback);
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
addClickHandler(callback) {
|
|
25
|
+
this.interactionManager.addClickHandler(callback);
|
|
26
|
+
}
|
|
27
|
+
clearClickHandlers() {
|
|
28
|
+
this.interactionManager.clearClickHandlers();
|
|
29
|
+
}
|
|
30
|
+
destroy() {
|
|
31
|
+
this.clearClickHandlers();
|
|
32
|
+
this._engine.interactors?.delete(this._container);
|
|
33
|
+
}
|
|
34
|
+
particleCreated(particle) {
|
|
35
|
+
const interactivityParticle = particle, interactivity = new Interactivity_js_1.Interactivity(this._engine, this._container);
|
|
36
|
+
interactivity.load(this._container.actualOptions.interactivity);
|
|
37
|
+
interactivity.load(interactivityParticle.options.interactivity);
|
|
38
|
+
interactivityParticle.interactivity = interactivity;
|
|
39
|
+
}
|
|
40
|
+
particleReset(particle) {
|
|
41
|
+
this.interactionManager.reset(particle);
|
|
42
|
+
}
|
|
43
|
+
postParticleUpdate(particle, delta) {
|
|
44
|
+
this.interactionManager.particlesInteract(particle, delta);
|
|
45
|
+
}
|
|
46
|
+
postUpdate(delta) {
|
|
47
|
+
this.interactionManager.externalInteract(delta);
|
|
48
|
+
}
|
|
49
|
+
async preInit() {
|
|
50
|
+
await this.interactionManager.init();
|
|
51
|
+
}
|
|
52
|
+
async redrawInit() {
|
|
53
|
+
await this.interactionManager.init();
|
|
54
|
+
}
|
|
55
|
+
start() {
|
|
56
|
+
this.interactionManager.addListeners();
|
|
57
|
+
this.interactionManager.startObserving();
|
|
58
|
+
return Promise.resolve();
|
|
59
|
+
}
|
|
60
|
+
stop() {
|
|
61
|
+
this.interactionManager.removeListeners();
|
|
62
|
+
this.interactionManager.stopObserving();
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
exports.InteractivityPluginInstance = InteractivityPluginInstance;
|
|
66
|
+
});
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.InteractorType = void 0;
|
|
13
|
+
var InteractorType;
|
|
14
|
+
(function (InteractorType) {
|
|
15
|
+
InteractorType["external"] = "external";
|
|
16
|
+
InteractorType["particles"] = "particles";
|
|
17
|
+
})(InteractorType || (exports.InteractorType = InteractorType = {}));
|
|
18
|
+
});
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.ClickEvent = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
class ClickEvent {
|
|
15
|
+
constructor() {
|
|
16
|
+
this.enable = false;
|
|
17
|
+
this.mode = [];
|
|
18
|
+
}
|
|
19
|
+
load(data) {
|
|
20
|
+
if ((0, engine_1.isNull)(data)) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
if (data.enable !== undefined) {
|
|
24
|
+
this.enable = data.enable;
|
|
25
|
+
}
|
|
26
|
+
if (data.mode !== undefined) {
|
|
27
|
+
this.mode = data.mode;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
exports.ClickEvent = ClickEvent;
|
|
32
|
+
});
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine", "../../../DivType.js"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.DivEvent = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
const DivType_js_1 = require("../../../DivType.js");
|
|
15
|
+
class DivEvent {
|
|
16
|
+
constructor() {
|
|
17
|
+
this.selectors = [];
|
|
18
|
+
this.enable = false;
|
|
19
|
+
this.mode = [];
|
|
20
|
+
this.type = DivType_js_1.DivType.circle;
|
|
21
|
+
}
|
|
22
|
+
load(data) {
|
|
23
|
+
if ((0, engine_1.isNull)(data)) {
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
if (data.selectors !== undefined) {
|
|
27
|
+
this.selectors = data.selectors;
|
|
28
|
+
}
|
|
29
|
+
if (data.enable !== undefined) {
|
|
30
|
+
this.enable = data.enable;
|
|
31
|
+
}
|
|
32
|
+
if (data.mode !== undefined) {
|
|
33
|
+
this.mode = data.mode;
|
|
34
|
+
}
|
|
35
|
+
if (data.type !== undefined) {
|
|
36
|
+
this.type = data.type;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
exports.DivEvent = DivEvent;
|
|
41
|
+
});
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine", "./ClickEvent.js", "./DivEvent.js", "./HoverEvent.js"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.Events = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
const ClickEvent_js_1 = require("./ClickEvent.js");
|
|
15
|
+
const DivEvent_js_1 = require("./DivEvent.js");
|
|
16
|
+
const HoverEvent_js_1 = require("./HoverEvent.js");
|
|
17
|
+
class Events {
|
|
18
|
+
constructor() {
|
|
19
|
+
this.onClick = new ClickEvent_js_1.ClickEvent();
|
|
20
|
+
this.onDiv = new DivEvent_js_1.DivEvent();
|
|
21
|
+
this.onHover = new HoverEvent_js_1.HoverEvent();
|
|
22
|
+
}
|
|
23
|
+
load(data) {
|
|
24
|
+
if ((0, engine_1.isNull)(data)) {
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
27
|
+
this.onClick.load(data.onClick);
|
|
28
|
+
const onDiv = data.onDiv;
|
|
29
|
+
if (onDiv !== undefined) {
|
|
30
|
+
this.onDiv = (0, engine_1.executeOnSingleOrMultiple)(onDiv, t => {
|
|
31
|
+
const tmp = new DivEvent_js_1.DivEvent();
|
|
32
|
+
tmp.load(t);
|
|
33
|
+
return tmp;
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
this.onHover.load(data.onHover);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
exports.Events = Events;
|
|
40
|
+
});
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.HoverEvent = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
class HoverEvent {
|
|
15
|
+
constructor() {
|
|
16
|
+
this.enable = false;
|
|
17
|
+
this.mode = [];
|
|
18
|
+
}
|
|
19
|
+
load(data) {
|
|
20
|
+
if ((0, engine_1.isNull)(data)) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
if (data.enable !== undefined) {
|
|
24
|
+
this.enable = data.enable;
|
|
25
|
+
}
|
|
26
|
+
if (data.mode !== undefined) {
|
|
27
|
+
this.mode = data.mode;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
exports.HoverEvent = HoverEvent;
|
|
32
|
+
});
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine", "./Events/Events.js", "../../InteractivityDetect.js", "./Modes/Modes.js"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.Interactivity = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
const Events_js_1 = require("./Events/Events.js");
|
|
15
|
+
const InteractivityDetect_js_1 = require("../../InteractivityDetect.js");
|
|
16
|
+
const Modes_js_1 = require("./Modes/Modes.js");
|
|
17
|
+
class Interactivity {
|
|
18
|
+
constructor(engine, container) {
|
|
19
|
+
this.detectsOn = InteractivityDetect_js_1.InteractivityDetect.window;
|
|
20
|
+
this.events = new Events_js_1.Events();
|
|
21
|
+
this.modes = new Modes_js_1.Modes(engine, container);
|
|
22
|
+
}
|
|
23
|
+
load(data) {
|
|
24
|
+
if ((0, engine_1.isNull)(data)) {
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
27
|
+
const detectsOn = data.detectsOn;
|
|
28
|
+
if (detectsOn !== undefined) {
|
|
29
|
+
this.detectsOn = detectsOn;
|
|
30
|
+
}
|
|
31
|
+
this.events.load(data.events);
|
|
32
|
+
this.modes.load(data.modes);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
exports.Interactivity = Interactivity;
|
|
36
|
+
});
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports", "@tsparticles/engine"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.Modes = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
class Modes {
|
|
15
|
+
constructor(engine, container) {
|
|
16
|
+
this._engine = engine;
|
|
17
|
+
this._container = container;
|
|
18
|
+
}
|
|
19
|
+
load(data) {
|
|
20
|
+
if ((0, engine_1.isNull)(data)) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
if (!this._container) {
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
const interactors = this._engine.interactors?.get(this._container);
|
|
27
|
+
if (!interactors) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
for (const interactor of interactors) {
|
|
31
|
+
if (!interactor.loadModeOptions) {
|
|
32
|
+
continue;
|
|
33
|
+
}
|
|
34
|
+
interactor.loadModeOptions(this, data);
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
exports.Modes = Modes;
|
|
39
|
+
});
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
(function (factory) {
|
|
2
|
+
if (typeof module === "object" && typeof module.exports === "object") {
|
|
3
|
+
var v = factory(require, exports);
|
|
4
|
+
if (v !== undefined) module.exports = v;
|
|
5
|
+
}
|
|
6
|
+
else if (typeof define === "function" && define.amd) {
|
|
7
|
+
define(["require", "exports"], factory);
|
|
8
|
+
}
|
|
9
|
+
})(function (require, exports) {
|
|
10
|
+
"use strict";
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
});
|