@tsparticles/interaction-external-particle 4.0.0-alpha.5 → 4.0.0-beta.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/828.min.js +1 -0
- package/README.md +5 -0
- package/browser/InteractivityParticleMaker.js +4 -0
- package/browser/Options/Classes/InteractivityParticleOptions.js +4 -0
- package/browser/index.js +3 -3
- package/cjs/InteractivityParticleMaker.js +4 -0
- package/cjs/Options/Classes/InteractivityParticleOptions.js +4 -0
- package/cjs/index.js +3 -3
- package/dist_browser_InteractivityParticleMaker_js.js +3 -3
- package/esm/InteractivityParticleMaker.js +4 -0
- package/esm/Options/Classes/InteractivityParticleOptions.js +4 -0
- package/esm/index.js +3 -3
- package/package.json +3 -3
- package/report.html +3 -3
- package/tsparticles.interaction.external.particle.js +31 -19
- package/tsparticles.interaction.external.particle.min.js +2 -2
- package/types/InteractivityParticleMaker.d.ts +1 -0
- package/umd/InteractivityParticleMaker.js +4 -0
- package/umd/Options/Classes/InteractivityParticleOptions.js +4 -0
- package/umd/index.js +3 -3
- package/623.min.js +0 -2
- package/623.min.js.LICENSE.txt +0 -1
- package/tsparticles.interaction.external.particle.min.js.LICENSE.txt +0 -1
package/828.min.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(this.webpackChunk_tsparticles_interaction_external_particle=this.webpackChunk_tsparticles_interaction_external_particle||[]).push([[828],{828(t,e,i){i.d(e,{InteractivityParticleMaker:()=>n});var s=i(702),o=i(303);class r{options;pauseOnStop;replaceCursor;stopDelay;constructor(){this.replaceCursor=!1,this.pauseOnStop=!1,this.stopDelay=0}load(t){(0,o.isNull)(t)||(void 0!==t.options&&(this.options=(0,o.deepExtend)({},t.options)),void 0!==t.replaceCursor&&(this.replaceCursor=t.replaceCursor),void 0!==t.pauseOnStop&&(this.pauseOnStop=t.pauseOnStop),void 0!==t.stopDelay&&(this.stopDelay=t.stopDelay))}}let a="particle";class n extends s.ExternalInteractorBase{maxDistance=0;_clearTimeout;_lastPosition;_particle;constructor(t){super(t)}clear(){}init(){}interact(t){let e=this.container,i=e.actualOptions;if(!e.retina.reduceFactor)return;let s=t.mouse.position,r=i.interactivity?.modes.particle;if(!r)return;let a=r.pauseOnStop&&(t.mouse.position===this._lastPosition||t.mouse.position?.x===this._lastPosition?.x&&t.mouse.position?.y===this._lastPosition?.y),n=r.stopDelay;if(s?this._lastPosition={...s}:delete this._lastPosition,this._lastPosition){if(a){if(this._clearTimeout)return;this._clearTimeout=setTimeout(()=>{if(this._particle){if(r.replaceCursor){let e=t.element;e&&(e instanceof Window?(0,o.safeDocument)().body.style.cursor="":e.style.cursor="")}this.container.particles.remove(this._particle,void 0,!0),delete this._particle}},n);return}if(this._clearTimeout&&(clearTimeout(this._clearTimeout),delete this._clearTimeout),!this._particle){let i=(0,o.deepExtend)(r.options,{move:{enable:!1}});if(this._particle=e.particles.addParticle(this._lastPosition,i),r.replaceCursor){let e=t.element;e&&(e instanceof Window?(0,o.safeDocument)().body.style.cursor="none":e.style.cursor="none")}}this._particle&&(this._particle.position.x=this._lastPosition.x,this._particle.position.y=this._lastPosition.y)}}isEnabled(t,e){let i=this.container.actualOptions,s=t.mouse,r=(e?.interactivity??i.interactivity)?.events;return!!r&&(s.clicking&&s.inside&&!!s.position&&(0,o.isInArray)(a,r.onClick.mode)||s.inside&&!!s.position&&(0,o.isInArray)(a,r.onHover.mode))}loadModeOptions(t,...e){for(let i of(t.particle??=new r,e))t.particle.load(i?.particle)}reset(){}}}}]);
|
package/README.md
CHANGED
|
@@ -28,6 +28,7 @@ Once the scripts are loaded you can set up `tsParticles` and the interaction plu
|
|
|
28
28
|
|
|
29
29
|
```javascript
|
|
30
30
|
(async () => {
|
|
31
|
+
await loadInteractivityPlugin(tsParticles);
|
|
31
32
|
await loadExternalParticleInteraction(tsParticles);
|
|
32
33
|
|
|
33
34
|
await tsParticles.load({
|
|
@@ -57,9 +58,11 @@ Then you need to import it in the app, like this:
|
|
|
57
58
|
|
|
58
59
|
```javascript
|
|
59
60
|
const { tsParticles } = require("@tsparticles/engine");
|
|
61
|
+
const { loadInteractivityPlugin } = require("@tsparticles/plugin-interactivity");
|
|
60
62
|
const { loadExternalParticleInteraction } = require("@tsparticles/interaction-external-particle");
|
|
61
63
|
|
|
62
64
|
(async () => {
|
|
65
|
+
await loadInteractivityPlugin(tsParticles);
|
|
63
66
|
await loadExternalParticleInteraction(tsParticles);
|
|
64
67
|
})();
|
|
65
68
|
```
|
|
@@ -68,9 +71,11 @@ or
|
|
|
68
71
|
|
|
69
72
|
```javascript
|
|
70
73
|
import { tsParticles } from "@tsparticles/engine";
|
|
74
|
+
import { loadInteractivityPlugin } from "@tsparticles/plugin-interactivity";
|
|
71
75
|
import { loadExternalParticleInteraction } from "@tsparticles/interaction-external-particle";
|
|
72
76
|
|
|
73
77
|
(async () => {
|
|
78
|
+
await loadInteractivityPlugin(tsParticles);
|
|
74
79
|
await loadExternalParticleInteraction(tsParticles);
|
|
75
80
|
})();
|
|
76
81
|
```
|
|
@@ -3,6 +3,10 @@ import { deepExtend, isInArray, safeDocument, } from "@tsparticles/engine";
|
|
|
3
3
|
import { InteractivityParticleOptions } from "./Options/Classes/InteractivityParticleOptions.js";
|
|
4
4
|
const particleMode = "particle";
|
|
5
5
|
export class InteractivityParticleMaker extends ExternalInteractorBase {
|
|
6
|
+
maxDistance = 0;
|
|
7
|
+
_clearTimeout;
|
|
8
|
+
_lastPosition;
|
|
9
|
+
_particle;
|
|
6
10
|
constructor(container) {
|
|
7
11
|
super(container);
|
|
8
12
|
}
|
package/browser/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export async function loadExternalParticleInteraction(engine) {
|
|
2
|
-
engine.checkVersion("4.0.0-
|
|
2
|
+
engine.checkVersion("4.0.0-beta.0");
|
|
3
3
|
await engine.register(async (e) => {
|
|
4
|
-
const {
|
|
5
|
-
|
|
4
|
+
const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
|
|
5
|
+
ensureInteractivityPluginLoaded(e);
|
|
6
6
|
e.addInteractor?.("externalParticle", async (container) => {
|
|
7
7
|
const { InteractivityParticleMaker } = await import("./InteractivityParticleMaker.js");
|
|
8
8
|
return new InteractivityParticleMaker(container);
|
|
@@ -3,6 +3,10 @@ import { deepExtend, isInArray, safeDocument, } from "@tsparticles/engine";
|
|
|
3
3
|
import { InteractivityParticleOptions } from "./Options/Classes/InteractivityParticleOptions.js";
|
|
4
4
|
const particleMode = "particle";
|
|
5
5
|
export class InteractivityParticleMaker extends ExternalInteractorBase {
|
|
6
|
+
maxDistance = 0;
|
|
7
|
+
_clearTimeout;
|
|
8
|
+
_lastPosition;
|
|
9
|
+
_particle;
|
|
6
10
|
constructor(container) {
|
|
7
11
|
super(container);
|
|
8
12
|
}
|
package/cjs/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export async function loadExternalParticleInteraction(engine) {
|
|
2
|
-
engine.checkVersion("4.0.0-
|
|
2
|
+
engine.checkVersion("4.0.0-beta.0");
|
|
3
3
|
await engine.register(async (e) => {
|
|
4
|
-
const {
|
|
5
|
-
|
|
4
|
+
const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
|
|
5
|
+
ensureInteractivityPluginLoaded(e);
|
|
6
6
|
e.addInteractor?.("externalParticle", async (container) => {
|
|
7
7
|
const { InteractivityParticleMaker } = await import("./InteractivityParticleMaker.js");
|
|
8
8
|
return new InteractivityParticleMaker(container);
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* Demo / Generator : https://particles.js.org/
|
|
5
5
|
* GitHub : https://www.github.com/matteobruni/tsparticles
|
|
6
6
|
* How to use? : Check the GitHub README
|
|
7
|
-
* v4.0.0-
|
|
7
|
+
* v4.0.0-beta.0
|
|
8
8
|
*/
|
|
9
9
|
"use strict";
|
|
10
10
|
/*
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
\****************************************************/
|
|
24
24
|
(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
|
|
25
25
|
|
|
26
|
-
eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ InteractivityParticleMaker: () => (/* binding */ InteractivityParticleMaker)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/plugin-interactivity */ \"@tsparticles/plugin-interactivity\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Options_Classes_InteractivityParticleOptions_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/InteractivityParticleOptions.js */ \"./dist/browser/Options/Classes/InteractivityParticleOptions.js\");\n\n\n\nconst particleMode = \"particle\";\nclass InteractivityParticleMaker extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n
|
|
26
|
+
eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ InteractivityParticleMaker: () => (/* binding */ InteractivityParticleMaker)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/plugin-interactivity */ \"@tsparticles/plugin-interactivity\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Options_Classes_InteractivityParticleOptions_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/InteractivityParticleOptions.js */ \"./dist/browser/Options/Classes/InteractivityParticleOptions.js\");\n\n\n\nconst particleMode = \"particle\";\nclass InteractivityParticleMaker extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n maxDistance = 0;\n _clearTimeout;\n _lastPosition;\n _particle;\n constructor(container){\n super(container);\n }\n clear() {}\n init() {}\n interact(interactivityData) {\n const container = this.container, options = container.actualOptions;\n if (!container.retina.reduceFactor) {\n return;\n }\n const mousePos = interactivityData.mouse.position, interactivityParticleOptions = options.interactivity?.modes.particle;\n if (!interactivityParticleOptions) {\n return;\n }\n const mouseStopped = interactivityParticleOptions.pauseOnStop && (interactivityData.mouse.position === this._lastPosition || interactivityData.mouse.position?.x === this._lastPosition?.x && interactivityData.mouse.position?.y === this._lastPosition?.y), clearDelay = interactivityParticleOptions.stopDelay;\n if (mousePos) {\n this._lastPosition = {\n ...mousePos\n };\n } else {\n delete this._lastPosition;\n }\n if (!this._lastPosition) {\n return;\n }\n if (mouseStopped) {\n if (this._clearTimeout) {\n return;\n }\n this._clearTimeout = setTimeout(()=>{\n if (!this._particle) {\n return;\n }\n if (interactivityParticleOptions.replaceCursor) {\n const element = interactivityData.element;\n if (element) {\n if (element instanceof Window) {\n (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.safeDocument)().body.style.cursor = \"\";\n } else {\n element.style.cursor = \"\";\n }\n }\n }\n this.container.particles.remove(this._particle, undefined, true);\n delete this._particle;\n }, clearDelay);\n return;\n }\n if (this._clearTimeout) {\n clearTimeout(this._clearTimeout);\n delete this._clearTimeout;\n }\n if (!this._particle) {\n const particleOptions = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.deepExtend)(interactivityParticleOptions.options, {\n move: {\n enable: false\n }\n });\n this._particle = container.particles.addParticle(this._lastPosition, particleOptions);\n if (interactivityParticleOptions.replaceCursor) {\n const element = interactivityData.element;\n if (element) {\n if (element instanceof Window) {\n (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.safeDocument)().body.style.cursor = \"none\";\n } else {\n element.style.cursor = \"none\";\n }\n }\n }\n }\n if (!this._particle) {\n return;\n }\n this._particle.position.x = this._lastPosition.x;\n this._particle.position.y = this._lastPosition.y;\n }\n isEnabled(interactivityData, particle) {\n const container = this.container, options = container.actualOptions, mouse = interactivityData.mouse, events = (particle?.interactivity ?? options.interactivity)?.events;\n return !!events && (mouse.clicking && mouse.inside && !!mouse.position && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isInArray)(particleMode, events.onClick.mode) || mouse.inside && !!mouse.position && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isInArray)(particleMode, events.onHover.mode));\n }\n loadModeOptions(options, ...sources) {\n options.particle ??= new _Options_Classes_InteractivityParticleOptions_js__WEBPACK_IMPORTED_MODULE_2__.InteractivityParticleOptions();\n for (const source of sources){\n options.particle.load(source?.particle);\n }\n }\n reset() {}\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-particle/./dist/browser/InteractivityParticleMaker.js?\n}");
|
|
27
27
|
|
|
28
28
|
/***/ },
|
|
29
29
|
|
|
@@ -33,7 +33,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
|
|
|
33
33
|
\**********************************************************************/
|
|
34
34
|
(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
|
|
35
35
|
|
|
36
|
-
eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ InteractivityParticleOptions: () => (/* binding */ InteractivityParticleOptions)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nclass InteractivityParticleOptions {\n
|
|
36
|
+
eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ InteractivityParticleOptions: () => (/* binding */ InteractivityParticleOptions)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nclass InteractivityParticleOptions {\n options;\n pauseOnStop;\n replaceCursor;\n stopDelay;\n constructor(){\n this.replaceCursor = false;\n this.pauseOnStop = false;\n this.stopDelay = 0;\n }\n load(data) {\n if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isNull)(data)) {\n return;\n }\n if (data.options !== undefined) {\n this.options = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.deepExtend)({}, data.options);\n }\n if (data.replaceCursor !== undefined) {\n this.replaceCursor = data.replaceCursor;\n }\n if (data.pauseOnStop !== undefined) {\n this.pauseOnStop = data.pauseOnStop;\n }\n if (data.stopDelay !== undefined) {\n this.stopDelay = data.stopDelay;\n }\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-particle/./dist/browser/Options/Classes/InteractivityParticleOptions.js?\n}");
|
|
37
37
|
|
|
38
38
|
/***/ }
|
|
39
39
|
|
|
@@ -3,6 +3,10 @@ import { deepExtend, isInArray, safeDocument, } from "@tsparticles/engine";
|
|
|
3
3
|
import { InteractivityParticleOptions } from "./Options/Classes/InteractivityParticleOptions.js";
|
|
4
4
|
const particleMode = "particle";
|
|
5
5
|
export class InteractivityParticleMaker extends ExternalInteractorBase {
|
|
6
|
+
maxDistance = 0;
|
|
7
|
+
_clearTimeout;
|
|
8
|
+
_lastPosition;
|
|
9
|
+
_particle;
|
|
6
10
|
constructor(container) {
|
|
7
11
|
super(container);
|
|
8
12
|
}
|
package/esm/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export async function loadExternalParticleInteraction(engine) {
|
|
2
|
-
engine.checkVersion("4.0.0-
|
|
2
|
+
engine.checkVersion("4.0.0-beta.0");
|
|
3
3
|
await engine.register(async (e) => {
|
|
4
|
-
const {
|
|
5
|
-
|
|
4
|
+
const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
|
|
5
|
+
ensureInteractivityPluginLoaded(e);
|
|
6
6
|
e.addInteractor?.("externalParticle", async (container) => {
|
|
7
7
|
const { InteractivityParticleMaker } = await import("./InteractivityParticleMaker.js");
|
|
8
8
|
return new InteractivityParticleMaker(container);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tsparticles/interaction-external-particle",
|
|
3
|
-
"version": "4.0.0-
|
|
3
|
+
"version": "4.0.0-beta.0",
|
|
4
4
|
"description": "tsParticles particle external interaction",
|
|
5
5
|
"homepage": "https://particles.js.org",
|
|
6
6
|
"repository": {
|
|
@@ -87,8 +87,8 @@
|
|
|
87
87
|
"./package.json": "./package.json"
|
|
88
88
|
},
|
|
89
89
|
"dependencies": {
|
|
90
|
-
"@tsparticles/engine": "4.0.0-
|
|
91
|
-
"@tsparticles/plugin-interactivity": "4.0.0-
|
|
90
|
+
"@tsparticles/engine": "4.0.0-beta.0",
|
|
91
|
+
"@tsparticles/plugin-interactivity": "4.0.0-beta.0"
|
|
92
92
|
},
|
|
93
93
|
"publishConfig": {
|
|
94
94
|
"access": "public"
|