@tsparticles/interaction-external-parallax 4.0.0-alpha.8 → 4.0.0-beta.1

package/203.min.js

@@ -0,0 +1 @@
+"use strict";(this.webpackChunk_tsparticles_interaction_external_parallax=this.webpackChunk_tsparticles_interaction_external_parallax||[]).push([[203],{203(a,t,e){e.d(t,{Parallaxer:()=>n});var r=e(321),i=e(303),l=e(702);class n extends r.ExternalInteractorBase{maxDistance=0;constructor(a){super(a)}clear(){}init(){}interact(a){for(let t of this.container.particles.filter(t=>this.isEnabled(a,t)))this._parallaxInteract(a,t)}isEnabled(a,t){let e=this.container,r=a.mouse,l=(t?.interactivity??e.actualOptions.interactivity)?.events;return!!l?.onHover.enable&&!!r.position&&(0,i.isInArray)("parallax",l.onHover.mode)}loadModeOptions(a,...t){for(let e of(a.parallax??=new l.k,t))a.parallax.load(e?.parallax)}reset(){}_parallaxInteract(a,t){if(!this.isEnabled(a,t))return;let e=this.container,r=e.actualOptions,l=r.interactivity?.modes.parallax;if(!l)return;let n=l.force,s=a.mouse.position;if(!s)return;let o=e.canvas.size,c={x:o.width*i.half,y:o.height*i.half},x=l.smooth,p=t.getRadius()/n,h={x:(s.x-c.x)*p,y:(s.y-c.y)*p},{offset:u}=t;u.x+=(h.x-u.x)/x,u.y+=(h.y-u.y)/x}}}}]);

package/README.md

@@ -28,6 +28,7 @@ Once the scripts are loaded you can set up `tsParticles` and the interaction plu
 
 ```javascript
 (async () => {
+  await loadInteractivityPlugin(tsParticles);
   await loadExternalParallaxInteraction(tsParticles);
 
   await tsParticles.load({
@@ -57,9 +58,11 @@ Then you need to import it in the app, like this:
 
 ```javascript
 const { tsParticles } = require("@tsparticles/engine");
+const { loadInteractivityPlugin } = require("@tsparticles/plugin-interactivity");
 const { loadExternalParallaxInteraction } = require("@tsparticles/interaction-external-parallax");
 
 (async () => {
+  await loadInteractivityPlugin(tsParticles);
   await loadExternalParallaxInteraction(tsParticles);
 })();
 ```
@@ -68,9 +71,11 @@ or
 
 ```javascript
 import { tsParticles } from "@tsparticles/engine";
+import { loadInteractivityPlugin } from "@tsparticles/plugin-interactivity";
 import { loadExternalParallaxInteraction } from "@tsparticles/interaction-external-parallax";
 
 (async () => {
+  await loadInteractivityPlugin(tsParticles);
   await loadExternalParallaxInteraction(tsParticles);
 })();
 ```

package/browser/Options/Classes/Parallax.js

@@ -1,5 +1,7 @@
 import { isNull } from "@tsparticles/engine";
 export class Parallax {
+    force;
+    smooth;
     constructor() {
         this.force = 2;
         this.smooth = 10;

package/browser/Parallaxer.js

@@ -3,6 +3,7 @@ import { half, isInArray } from "@tsparticles/engine";
 import { Parallax } from "./Options/Classes/Parallax.js";
 const parallaxMode = "parallax";
 export class Parallaxer extends ExternalInteractorBase {
+    maxDistance = 0;
     constructor(container) {
         super(container);
     }

package/browser/index.js

@@ -1,9 +1,9 @@
 export async function loadExternalParallaxInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.8");
-    await engine.register(async (e) => {
-        const { loadInteractivityPlugin } = await import("@tsparticles/plugin-interactivity");
-        await loadInteractivityPlugin(e);
-        e.addInteractor?.("externalParallax", async (container) => {
+    engine.checkVersion("4.0.0-beta.1");
+    await engine.pluginManager.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.pluginManager.addInteractor?.("externalParallax", async (container) => {
             const { Parallaxer } = await import("./Parallaxer.js");
             return new Parallaxer(container);
         });

package/cjs/Options/Classes/Parallax.js

@@ -1,5 +1,7 @@
 import { isNull } from "@tsparticles/engine";
 export class Parallax {
+    force;
+    smooth;
     constructor() {
         this.force = 2;
         this.smooth = 10;

package/cjs/Parallaxer.js

@@ -3,6 +3,7 @@ import { half, isInArray } from "@tsparticles/engine";
 import { Parallax } from "./Options/Classes/Parallax.js";
 const parallaxMode = "parallax";
 export class Parallaxer extends ExternalInteractorBase {
+    maxDistance = 0;
     constructor(container) {
         super(container);
     }

package/cjs/index.js

@@ -1,9 +1,9 @@
 export async function loadExternalParallaxInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.8");
-    await engine.register(async (e) => {
-        const { loadInteractivityPlugin } = await import("@tsparticles/plugin-interactivity");
-        await loadInteractivityPlugin(e);
-        e.addInteractor?.("externalParallax", async (container) => {
+    engine.checkVersion("4.0.0-beta.1");
+    await engine.pluginManager.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.pluginManager.addInteractor?.("externalParallax", async (container) => {
             const { Parallaxer } = await import("./Parallaxer.js");
             return new Parallaxer(container);
         });

package/dist_browser_Parallaxer_js.js

@@ -4,7 +4,7 @@
  * Demo / Generator : https://particles.js.org/
  * GitHub : https://www.github.com/matteobruni/tsparticles
  * How to use? : Check the GitHub README
- * v4.0.0-alpha.8
+ * v4.0.0-beta.1
  */
 "use strict";
 /*
@@ -23,7 +23,7 @@
   \************************************/
 (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
 
-eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Parallaxer: () => (/* binding */ Parallaxer)\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_Parallax_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Parallax.js */ \"./dist/browser/Options/Classes/Parallax.js\");\n\n\n\nconst parallaxMode = \"parallax\";\nclass Parallaxer extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n  constructor(container) {\n    super(container);\n  }\n  clear() {}\n  init() {}\n  interact(interactivityData) {\n    for (const particle of this.container.particles.filter(p => this.isEnabled(interactivityData, p))) {\n      this._parallaxInteract(interactivityData, particle);\n    }\n  }\n  isEnabled(interactivityData, particle) {\n    const container = this.container,\n      mouse = interactivityData.mouse,\n      events = (particle?.interactivity ?? container.actualOptions.interactivity)?.events;\n    return !!events?.onHover.enable && !!mouse.position && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isInArray)(parallaxMode, events.onHover.mode);\n  }\n  loadModeOptions(options, ...sources) {\n    options.parallax ??= new _Options_Classes_Parallax_js__WEBPACK_IMPORTED_MODULE_2__.Parallax();\n    for (const source of sources) {\n      options.parallax.load(source?.parallax);\n    }\n  }\n  reset() {}\n  _parallaxInteract(interactivityData, particle) {\n    if (!this.isEnabled(interactivityData, particle)) {\n      return;\n    }\n    const container = this.container,\n      options = container.actualOptions,\n      parallaxOptions = options.interactivity?.modes.parallax;\n    if (!parallaxOptions) {\n      return;\n    }\n    const parallaxForce = parallaxOptions.force,\n      mousePos = interactivityData.mouse.position;\n    if (!mousePos) {\n      return;\n    }\n    const canvasSize = container.canvas.size,\n      canvasCenter = {\n        x: canvasSize.width * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.half,\n        y: canvasSize.height * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.half\n      },\n      parallaxSmooth = parallaxOptions.smooth,\n      factor = particle.getRadius() / parallaxForce,\n      centerDistance = {\n        x: (mousePos.x - canvasCenter.x) * factor,\n        y: (mousePos.y - canvasCenter.y) * factor\n      },\n      {\n        offset\n      } = particle;\n    offset.x += (centerDistance.x - offset.x) / parallaxSmooth;\n    offset.y += (centerDistance.y - offset.y) / parallaxSmooth;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-external-parallax/./dist/browser/Parallaxer.js?\n}");
+eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Parallaxer: () => (/* binding */ Parallaxer)\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_Parallax_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Parallax.js */ \"./dist/browser/Options/Classes/Parallax.js\");\n\n\n\nconst parallaxMode = \"parallax\";\nclass Parallaxer extends _tsparticles_plugin_interactivity__WEBPACK_IMPORTED_MODULE_0__.ExternalInteractorBase {\n    maxDistance = 0;\n    constructor(container){\n        super(container);\n    }\n    clear() {}\n    init() {}\n    interact(interactivityData) {\n        for (const particle of this.container.particles.filter((p)=>this.isEnabled(interactivityData, p))){\n            this._parallaxInteract(interactivityData, particle);\n        }\n    }\n    isEnabled(interactivityData, particle) {\n        const container = this.container, mouse = interactivityData.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity)?.events;\n        return !!events?.onHover.enable && !!mouse.position && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isInArray)(parallaxMode, events.onHover.mode);\n    }\n    loadModeOptions(options, ...sources) {\n        options.parallax ??= new _Options_Classes_Parallax_js__WEBPACK_IMPORTED_MODULE_2__.Parallax();\n        for (const source of sources){\n            options.parallax.load(source?.parallax);\n        }\n    }\n    reset() {}\n    _parallaxInteract(interactivityData, particle) {\n        if (!this.isEnabled(interactivityData, particle)) {\n            return;\n        }\n        const container = this.container, options = container.actualOptions, parallaxOptions = options.interactivity?.modes.parallax;\n        if (!parallaxOptions) {\n            return;\n        }\n        const parallaxForce = parallaxOptions.force, mousePos = interactivityData.mouse.position;\n        if (!mousePos) {\n            return;\n        }\n        const canvasSize = container.canvas.size, canvasCenter = {\n            x: canvasSize.width * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.half,\n            y: canvasSize.height * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.half\n        }, parallaxSmooth = parallaxOptions.smooth, factor = particle.getRadius() / parallaxForce, centerDistance = {\n            x: (mousePos.x - canvasCenter.x) * factor,\n            y: (mousePos.y - canvasCenter.y) * factor\n        }, { offset } = particle;\n        offset.x += (centerDistance.x - offset.x) / parallaxSmooth;\n        offset.y += (centerDistance.y - offset.y) / parallaxSmooth;\n    }\n}\n\n\n//# sourceURL=webpack://@tsparticles/interaction-external-parallax/./dist/browser/Parallaxer.js?\n}");
 
 /***/ }
 

package/esm/Options/Classes/Parallax.js

@@ -1,5 +1,7 @@
 import { isNull } from "@tsparticles/engine";
 export class Parallax {
+    force;
+    smooth;
     constructor() {
         this.force = 2;
         this.smooth = 10;

package/esm/Parallaxer.js

@@ -3,6 +3,7 @@ import { half, isInArray } from "@tsparticles/engine";
 import { Parallax } from "./Options/Classes/Parallax.js";
 const parallaxMode = "parallax";
 export class Parallaxer extends ExternalInteractorBase {
+    maxDistance = 0;
     constructor(container) {
         super(container);
     }

package/esm/index.js

@@ -1,9 +1,9 @@
 export async function loadExternalParallaxInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.8");
-    await engine.register(async (e) => {
-        const { loadInteractivityPlugin } = await import("@tsparticles/plugin-interactivity");
-        await loadInteractivityPlugin(e);
-        e.addInteractor?.("externalParallax", async (container) => {
+    engine.checkVersion("4.0.0-beta.1");
+    await engine.pluginManager.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.pluginManager.addInteractor?.("externalParallax", async (container) => {
             const { Parallaxer } = await import("./Parallaxer.js");
             return new Parallaxer(container);
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/interaction-external-parallax",
-  "version": "4.0.0-alpha.8",
+  "version": "4.0.0-beta.1",
   "description": "tsParticles parallax external interaction",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -87,8 +87,8 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "4.0.0-alpha.8",
-    "@tsparticles/plugin-interactivity": "4.0.0-alpha.8"
+    "@tsparticles/engine": "4.0.0-beta.1",
+    "@tsparticles/plugin-interactivity": "4.0.0-beta.1"
   },
   "publishConfig": {
     "access": "public"