@tsparticles/plugin-motion 3.0.0-alpha.1 → 3.0.0-beta.1

package/tsparticles.plugin.motion.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
- * v3.0.0-alpha.1
+ * v3.0.0-beta.1
  */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
@@ -91,7 +91,7 @@ __webpack_require__.r(__webpack_exports__);
 
 // EXPORTS
 __webpack_require__.d(__webpack_exports__, {
-  "loadMotionPlugin": () => (/* binding */ loadMotionPlugin)
+  loadMotionPlugin: () => (/* binding */ loadMotionPlugin)
 });
 
 ;// CONCATENATED MODULE: ./dist/browser/Options/Classes/MotionReduce.js
@@ -135,41 +135,41 @@ var engine_root_window_ = __webpack_require__(533);
 
 class MotionInstance {
   constructor(container, engine) {
+    this._handleMotionChange = mediaQuery => {
+      const container = this._container,
+        motion = container.actualOptions.motion;
+      if (!motion) {
+        return;
+      }
+      container.retina.reduceFactor = mediaQuery.matches ? motion.disable ? 0 : motion.reduce.value ? 1 / motion.reduce.factor : 1 : 1;
+    };
     this._container = container;
     this._engine = engine;
   }
   async init() {
     const container = this._container,
       options = container.actualOptions.motion;
-    if (options && (options.disable || options.reduce.value)) {
-      const mediaQuery = (0,engine_root_window_.safeMatchMedia)("(prefers-reduced-motion: reduce)");
-      if (mediaQuery) {
-        this._handleMotionChange(mediaQuery);
-        const handleChange = async () => {
-          this._handleMotionChange(mediaQuery);
-          try {
-            await container.refresh();
-          } catch (_a) {}
-        };
-        if (mediaQuery.addEventListener !== undefined) {
-          mediaQuery.addEventListener("change", handleChange);
-        } else if (mediaQuery.addListener !== undefined) {
-          mediaQuery.addListener(handleChange);
-        }
-      } else {
-        container.retina.reduceFactor = 1;
-      }
-    } else {
+    if (!(options && (options.disable || options.reduce.value))) {
       container.retina.reduceFactor = 1;
+      return;
     }
-  }
-  _handleMotionChange(mediaQuery) {
-    const container = this._container,
-      motion = container.actualOptions.motion;
-    if (!motion) {
+    const mediaQuery = (0,engine_root_window_.safeMatchMedia)("(prefers-reduced-motion: reduce)");
+    if (!mediaQuery) {
+      container.retina.reduceFactor = 1;
       return;
     }
-    container.retina.reduceFactor = mediaQuery.matches ? motion.disable ? 0 : motion.reduce.value ? 1 / motion.reduce.factor : 1 : 1;
+    this._handleMotionChange(mediaQuery);
+    const handleChange = async () => {
+      this._handleMotionChange(mediaQuery);
+      try {
+        await container.refresh();
+      } catch {}
+    };
+    if (mediaQuery.addEventListener !== undefined) {
+      mediaQuery.addEventListener("change", handleChange);
+    } else if (mediaQuery.addListener !== undefined) {
+      mediaQuery.addListener(handleChange);
+    }
   }
 }
 ;// CONCATENATED MODULE: ./dist/browser/index.js
@@ -188,18 +188,17 @@ class MotionPlugin {
       return;
     }
     let motionOptions = options.motion;
-    if ((motionOptions === null || motionOptions === void 0 ? void 0 : motionOptions.load) === undefined) {
+    if (!motionOptions?.load) {
       options.motion = motionOptions = new Motion();
     }
-    motionOptions.load(source === null || source === void 0 ? void 0 : source.motion);
+    motionOptions.load(source?.motion);
   }
   needsPlugin() {
     return true;
   }
 }
-async function loadMotionPlugin(engine) {
-  const plugin = new MotionPlugin(engine);
-  await engine.addPlugin(plugin);
+async function loadMotionPlugin(engine, refresh = true) {
+  await engine.addPlugin(new MotionPlugin(engine), refresh);
 }
 })();
 

package/tsparticles.plugin.motion.min.js

@@ -1,2 +1,2 @@
 /*! For license information please see tsparticles.plugin.motion.min.js.LICENSE.txt */
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var o="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var i in o)("object"==typeof exports?exports:e)[i]=o[i]}}(this,(e=>(()=>{"use strict";var t={533:t=>{t.exports=e}},o={};function i(e){var n=o[e];if(void 0!==n)return n.exports;var r=o[e]={exports:{}};return t[e](r,r.exports,i),r.exports}i.d=(e,t)=>{for(var o in t)i.o(t,o)&&!i.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{i.r(n),i.d(n,{loadMotionPlugin:()=>s});class e{constructor(){this.factor=4,this.value=!0}load(e){e&&(void 0!==e.factor&&(this.factor=e.factor),void 0!==e.value&&(this.value=e.value))}}class t{constructor(){this.disable=!1,this.reduce=new e}load(e){e&&(void 0!==e.disable&&(this.disable=e.disable),this.reduce.load(e.reduce))}}var o=i(533);class r{constructor(e,t){this._container=e,this._engine=t}async init(){const e=this._container,t=e.actualOptions.motion;if(t&&(t.disable||t.reduce.value)){const t=(0,o.safeMatchMedia)("(prefers-reduced-motion: reduce)");if(t){this._handleMotionChange(t);const o=async()=>{this._handleMotionChange(t);try{await e.refresh()}catch(e){}};void 0!==t.addEventListener?t.addEventListener("change",o):void 0!==t.addListener&&t.addListener(o)}else e.retina.reduceFactor=1}else e.retina.reduceFactor=1}_handleMotionChange(e){const t=this._container,o=t.actualOptions.motion;o&&(t.retina.reduceFactor=e.matches?o.disable?0:o.reduce.value?1/o.reduce.factor:1:1)}}class a{constructor(e){this.id="motion",this._engine=e}getPlugin(e){return new r(e,this._engine)}loadOptions(e,o){if(!this.needsPlugin())return;let i=e.motion;void 0===(null==i?void 0:i.load)&&(e.motion=i=new t),i.load(null==o?void 0:o.motion)}needsPlugin(){return!0}}async function s(e){const t=new a(e);await e.addPlugin(t)}})(),n})()));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var o="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var i in o)("object"==typeof exports?exports:e)[i]=o[i]}}(this,(e=>(()=>{"use strict";var t={533:t=>{t.exports=e}},o={};function i(e){var n=o[e];if(void 0!==n)return n.exports;var r=o[e]={exports:{}};return t[e](r,r.exports,i),r.exports}i.d=(e,t)=>{for(var o in t)i.o(t,o)&&!i.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{i.r(n),i.d(n,{loadMotionPlugin:()=>s});class e{constructor(){this.factor=4,this.value=!0}load(e){e&&(void 0!==e.factor&&(this.factor=e.factor),void 0!==e.value&&(this.value=e.value))}}class t{constructor(){this.disable=!1,this.reduce=new e}load(e){e&&(void 0!==e.disable&&(this.disable=e.disable),this.reduce.load(e.reduce))}}var o=i(533);class r{constructor(e,t){this._handleMotionChange=e=>{const t=this._container,o=t.actualOptions.motion;o&&(t.retina.reduceFactor=e.matches?o.disable?0:o.reduce.value?1/o.reduce.factor:1:1)},this._container=e,this._engine=t}async init(){const e=this._container,t=e.actualOptions.motion;if(!t||!t.disable&&!t.reduce.value)return void(e.retina.reduceFactor=1);const i=(0,o.safeMatchMedia)("(prefers-reduced-motion: reduce)");if(!i)return void(e.retina.reduceFactor=1);this._handleMotionChange(i);const n=async()=>{this._handleMotionChange(i);try{await e.refresh()}catch{}};void 0!==i.addEventListener?i.addEventListener("change",n):void 0!==i.addListener&&i.addListener(n)}}class a{constructor(e){this.id="motion",this._engine=e}getPlugin(e){return new r(e,this._engine)}loadOptions(e,o){if(!this.needsPlugin())return;let i=e.motion;i?.load||(e.motion=i=new t),i.load(o?.motion)}needsPlugin(){return!0}}async function s(e,t=!0){await e.addPlugin(new a(e),t)}})(),n})()));

package/tsparticles.plugin.motion.min.js.LICENSE.txt

@@ -1,8 +1 @@
-/*!
- * Author : Matteo Bruni
- * MIT license: https://opensource.org/licenses/MIT
- * Demo / Generator : https://particles.js.org/
- * GitHub : https://www.github.com/matteobruni/tsparticles
- * How to use? : Check the GitHub README
- * v3.0.0-alpha.1
- */
+/*! tsParticles Motion Plugin v3.0.0-beta.1 by Matteo Bruni */

package/types/MotionInstance.d.ts

@@ -1,9 +1,9 @@
-import type { Engine, IContainerPlugin } from "@tsparticles/engine";
-import type { MotionContainer } from "./types";
+import { type Engine, type IContainerPlugin } from "@tsparticles/engine";
+import type { MotionContainer } from "./types.js";
 export declare class MotionInstance implements IContainerPlugin {
     private readonly _container;
     private readonly _engine;
     constructor(container: MotionContainer, engine: Engine);
     init(): Promise<void>;
-    private _handleMotionChange;
+    private readonly _handleMotionChange;
 }

package/types/Options/Classes/Motion.d.ts

@@ -1,6 +1,6 @@
 import type { IOptionLoader, RecursivePartial } from "@tsparticles/engine";
-import type { IMotion } from "../Interfaces/IMotion";
-import { MotionReduce } from "./MotionReduce";
+import type { IMotion } from "../Interfaces/IMotion.js";
+import { MotionReduce } from "./MotionReduce.js";
 export declare class Motion implements IMotion, IOptionLoader<IMotion> {
     disable: boolean;
     reduce: MotionReduce;

package/types/Options/Classes/MotionReduce.d.ts

@@ -1,5 +1,5 @@
 import type { IOptionLoader, RecursivePartial } from "@tsparticles/engine";
-import type { IMotionReduce } from "../Interfaces/IMotionReduce";
+import type { IMotionReduce } from "../Interfaces/IMotionReduce.js";
 export declare class MotionReduce implements IMotionReduce, IOptionLoader<IMotionReduce> {
     factor: number;
     value: boolean;

package/types/Options/Interfaces/IMotion.d.ts

@@ -1,4 +1,4 @@
-import type { IMotionReduce } from "./IMotionReduce";
+import type { IMotionReduce } from "./IMotionReduce.js";
 export interface IMotion {
     disable: boolean;
     reduce: IMotionReduce;

package/types/index.d.ts

@@ -1,2 +1,2 @@
 import type { Engine } from "@tsparticles/engine";
-export declare function loadMotionPlugin(engine: Engine): Promise<void>;
+export declare function loadMotionPlugin(engine: Engine, refresh?: boolean): Promise<void>;

package/types/types.d.ts

@@ -1,6 +1,6 @@
 import type { Container, IOptions, Options } from "@tsparticles/engine";
-import type { IMotion } from "./Options/Interfaces/IMotion";
-import type { Motion } from "./Options/Classes/Motion";
+import type { IMotion } from "./Options/Interfaces/IMotion.js";
+import type { Motion } from "./Options/Classes/Motion.js";
 export type IMotionOptions = IOptions & {
     motion?: IMotion;
 };

package/umd/MotionInstance.js

@@ -13,50 +13,48 @@
     const engine_1 = require("@tsparticles/engine");
     class MotionInstance {
         constructor(container, engine) {
+            this._handleMotionChange = (mediaQuery) => {
+                const container = this._container, motion = container.actualOptions.motion;
+                if (!motion) {
+                    return;
+                }
+                container.retina.reduceFactor = mediaQuery.matches
+                    ? motion.disable
+                        ? 0
+                        : motion.reduce.value
+                            ? 1 / motion.reduce.factor
+                            : 1
+                    : 1;
+            };
             this._container = container;
             this._engine = engine;
         }
         async init() {
             const container = this._container, options = container.actualOptions.motion;
-            if (options && (options.disable || options.reduce.value)) {
-                const mediaQuery = (0, engine_1.safeMatchMedia)("(prefers-reduced-motion: reduce)");
-                if (mediaQuery) {
-                    this._handleMotionChange(mediaQuery);
-                    const handleChange = async () => {
-                        this._handleMotionChange(mediaQuery);
-                        try {
-                            await container.refresh();
-                        }
-                        catch (_a) {
-                        }
-                    };
-                    if (mediaQuery.addEventListener !== undefined) {
-                        mediaQuery.addEventListener("change", handleChange);
-                    }
-                    else if (mediaQuery.addListener !== undefined) {
-                        mediaQuery.addListener(handleChange);
-                    }
-                }
-                else {
-                    container.retina.reduceFactor = 1;
-                }
-            }
-            else {
+            if (!(options && (options.disable || options.reduce.value))) {
                 container.retina.reduceFactor = 1;
+                return;
             }
-        }
-        _handleMotionChange(mediaQuery) {
-            const container = this._container, motion = container.actualOptions.motion;
-            if (!motion) {
+            const mediaQuery = (0, engine_1.safeMatchMedia)("(prefers-reduced-motion: reduce)");
+            if (!mediaQuery) {
+                container.retina.reduceFactor = 1;
                 return;
             }
-            container.retina.reduceFactor = mediaQuery.matches
-                ? motion.disable
-                    ? 0
-                    : motion.reduce.value
-                        ? 1 / motion.reduce.factor
-                        : 1
-                : 1;
+            this._handleMotionChange(mediaQuery);
+            const handleChange = async () => {
+                this._handleMotionChange(mediaQuery);
+                try {
+                    await container.refresh();
+                }
+                catch {
+                }
+            };
+            if (mediaQuery.addEventListener !== undefined) {
+                mediaQuery.addEventListener("change", handleChange);
+            }
+            else if (mediaQuery.addListener !== undefined) {
+                mediaQuery.addListener(handleChange);
+            }
         }
     }
     exports.MotionInstance = MotionInstance;

package/umd/Options/Classes/Motion.js

@@ -4,17 +4,17 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./MotionReduce"], factory);
+        define(["require", "exports", "./MotionReduce.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.Motion = void 0;
-    const MotionReduce_1 = require("./MotionReduce");
+    const MotionReduce_js_1 = require("./MotionReduce.js");
     class Motion {
         constructor() {
             this.disable = false;
-            this.reduce = new MotionReduce_1.MotionReduce();
+            this.reduce = new MotionReduce_js_1.MotionReduce();
         }
         load(data) {
             if (!data) {

package/umd/index.js

@@ -4,39 +4,38 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./Options/Classes/Motion", "./MotionInstance"], factory);
+        define(["require", "exports", "./Options/Classes/Motion.js", "./MotionInstance.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.loadMotionPlugin = void 0;
-    const Motion_1 = require("./Options/Classes/Motion");
-    const MotionInstance_1 = require("./MotionInstance");
+    const Motion_js_1 = require("./Options/Classes/Motion.js");
+    const MotionInstance_js_1 = require("./MotionInstance.js");
     class MotionPlugin {
         constructor(engine) {
             this.id = "motion";
             this._engine = engine;
         }
         getPlugin(container) {
-            return new MotionInstance_1.MotionInstance(container, this._engine);
+            return new MotionInstance_js_1.MotionInstance(container, this._engine);
         }
         loadOptions(options, source) {
             if (!this.needsPlugin()) {
                 return;
             }
             let motionOptions = options.motion;
-            if ((motionOptions === null || motionOptions === void 0 ? void 0 : motionOptions.load) === undefined) {
-                options.motion = motionOptions = new Motion_1.Motion();
+            if (!motionOptions?.load) {
+                options.motion = motionOptions = new Motion_js_1.Motion();
             }
-            motionOptions.load(source === null || source === void 0 ? void 0 : source.motion);
+            motionOptions.load(source?.motion);
         }
         needsPlugin() {
             return true;
         }
     }
-    async function loadMotionPlugin(engine) {
-        const plugin = new MotionPlugin(engine);
-        await engine.addPlugin(plugin);
+    async function loadMotionPlugin(engine, refresh = true) {
+        await engine.addPlugin(new MotionPlugin(engine), refresh);
     }
     exports.loadMotionPlugin = loadMotionPlugin;
 });