@tsparticles/engine 3.2.2 → 3.4.0

package/umd/Core/Particle.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./Utils/Vectors.js", "../Utils/NumberUtils.js", "../Utils/Utils.js", "./Utils/Constants.js", "../Utils/ColorUtils.js", "../Options/Classes/Interactivity/Interactivity.js", "../Utils/CanvasUtils.js", "../Utils/OptionsUtils.js"], factory);
+        define(["require", "exports", "./Utils/Vectors.js", "../Utils/NumberUtils.js", "../Utils/Utils.js", "./Utils/Constants.js", "../Utils/ColorUtils.js", "../Enums/Types/EventType.js", "../Options/Classes/Interactivity/Interactivity.js", "../Enums/Directions/MoveDirection.js", "../Enums/Modes/OutMode.js", "../Enums/Types/ParticleOutType.js", "../Enums/Modes/PixelMode.js", "../Utils/CanvasUtils.js", "../Utils/OptionsUtils.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -15,10 +15,15 @@
     const Utils_js_1 = require("../Utils/Utils.js");
     const Constants_js_1 = require("./Utils/Constants.js");
     const ColorUtils_js_1 = require("../Utils/ColorUtils.js");
+    const EventType_js_1 = require("../Enums/Types/EventType.js");
     const Interactivity_js_1 = require("../Options/Classes/Interactivity/Interactivity.js");
+    const MoveDirection_js_1 = require("../Enums/Directions/MoveDirection.js");
+    const OutMode_js_1 = require("../Enums/Modes/OutMode.js");
+    const ParticleOutType_js_1 = require("../Enums/Types/ParticleOutType.js");
+    const PixelMode_js_1 = require("../Enums/Modes/PixelMode.js");
     const CanvasUtils_js_1 = require("../Utils/CanvasUtils.js");
     const OptionsUtils_js_1 = require("../Utils/OptionsUtils.js");
-    const defaultRetryCount = 0, double = 2, half = 0.5, squareExp = 2;
+    const defaultRetryCount = 0, double = 2, half = 0.5, squareExp = 2, randomString = "random";
     function loadEffectData(effect, effectOptions, id, reduceDuplicates) {
         const effectData = effectOptions.options[effect];
         if (!effectData) {
@@ -67,7 +72,7 @@
                 }), pos = Vectors_js_1.Vector3d.create(exactPosition.x, exactPosition.y, zIndex), radius = this.getRadius(), outModes = this.options.move.outModes, fixHorizontal = (outMode) => {
                     fixOutMode({
                         outMode,
-                        checkModes: ["bounce"],
+                        checkModes: [OutMode_js_1.OutMode.bounce],
                         coord: pos.x,
                         maxCoord: container.canvas.size.width,
                         setCb: (value) => (pos.x += value),
@@ -76,7 +81,7 @@
                 }, fixVertical = (outMode) => {
                     fixOutMode({
                         outMode,
-                        checkModes: ["bounce"],
+                        checkModes: [OutMode_js_1.OutMode.bounce],
                         coord: pos.y,
                         maxCoord: container.canvas.size.height,
                         setCb: (value) => (pos.y += value),
@@ -95,7 +100,7 @@
             };
             this._calculateVelocity = () => {
                 const baseVelocity = (0, NumberUtils_js_1.getParticleBaseVelocity)(this.direction), res = baseVelocity.copy(), moveOptions = this.options.move;
-                if (moveOptions.direction === "inside" || moveOptions.direction === "outside") {
+                if (moveOptions.direction === MoveDirection_js_1.MoveDirection.inside || moveOptions.direction === MoveDirection_js_1.MoveDirection.outside) {
                     return res;
                 }
                 const rad = (0, NumberUtils_js_1.degToRad)((0, NumberUtils_js_1.getRangeValue)(moveOptions.angle.value)), radOffset = (0, NumberUtils_js_1.degToRad)((0, NumberUtils_js_1.getRangeValue)(moveOptions.angle.offset)), range = {
@@ -123,9 +128,9 @@
                 if (retries >= minRetries && tryCount > retries) {
                     throw new Error(`${Constants_js_1.errorPrefix} particle is overlapping and can't be placed`);
                 }
-                return !!this.container.particles.find((particle) => (0, NumberUtils_js_1.getDistance)(pos, particle.position) < radius + particle.getRadius());
+                return !!this.container.particles.find(particle => (0, NumberUtils_js_1.getDistance)(pos, particle.position) < radius + particle.getRadius());
             };
-            this._getRollColor = (color) => {
+            this._getRollColor = color => {
                 if (!color || !this.roll || (!this.backColor && !this.roll.alter)) {
                     return color;
                 }
@@ -141,7 +146,7 @@
                 }
                 return color;
             };
-            this._initPosition = (position) => {
+            this._initPosition = position => {
                 const container = this.container, zIndexValue = (0, NumberUtils_js_1.getRangeValue)(this.options.zIndex.value), minZ = 0;
                 this.position = this._calcPosition(container, position, (0, NumberUtils_js_1.clamp)(zIndexValue, minZ, container.zLayers));
                 this.initialPosition = this.position.copy();
@@ -149,15 +154,15 @@
                 this.moveCenter = {
                     ...(0, Utils_js_1.getPosition)(this.options.move.center, canvasSize),
                     radius: this.options.move.center.radius ?? defaultRadius,
-                    mode: this.options.move.center.mode ?? "percent",
+                    mode: this.options.move.center.mode ?? PixelMode_js_1.PixelMode.percent,
                 };
                 this.direction = (0, NumberUtils_js_1.getParticleDirectionAngle)(this.options.move.direction, this.position, this.moveCenter);
                 switch (this.options.move.direction) {
-                    case "inside":
-                        this.outType = "inside";
+                    case MoveDirection_js_1.MoveDirection.inside:
+                        this.outType = ParticleOutType_js_1.ParticleOutType.inside;
                         break;
-                    case "outside":
-                        this.outType = "outside";
+                    case MoveDirection_js_1.MoveDirection.outside:
+                        this.outType = ParticleOutType_js_1.ParticleOutType.outside;
                         break;
                 }
                 this.offset = Vectors_js_1.Vector.origin;
@@ -180,19 +185,19 @@
                 updater.particleDestroyed?.(this, override);
             }
             pathGenerator?.reset(this);
-            this._engine.dispatchEvent("particleDestroyed", {
+            this._engine.dispatchEvent(EventType_js_1.EventType.particleDestroyed, {
                 container: this.container,
                 data: {
                     particle: this,
                 },
             });
         }
-        async draw(delta) {
+        draw(delta) {
             const container = this.container, canvas = container.canvas;
             for (const [, plugin] of container.plugins) {
-                await canvas.drawParticlePlugin(plugin, this, delta);
+                canvas.drawParticlePlugin(plugin, this, delta);
             }
-            await canvas.drawParticle(this, delta);
+            canvas.drawParticle(this, delta);
         }
         getFillColor() {
             return this._getRollColor(this.bubble.color ?? (0, ColorUtils_js_1.getHslFromAnimation)(this.color));
@@ -213,7 +218,7 @@
         getStrokeColor() {
             return this._getRollColor(this.bubble.color ?? (0, ColorUtils_js_1.getHslFromAnimation)(this.strokeColor));
         }
-        async init(id, position, overrideOptions, group) {
+        init(id, position, overrideOptions, group) {
             const container = this.container, engine = this._engine;
             this.id = id;
             this.group = group;
@@ -225,14 +230,15 @@
             this.lastPathTime = 0;
             this.destroyed = false;
             this.unbreakable = false;
+            this.isRotating = false;
             this.rotation = 0;
             this.misplaced = false;
             this.retina = {
                 maxDistance: {},
             };
-            this.outType = "normal";
+            this.outType = ParticleOutType_js_1.ParticleOutType.normal;
             this.ignoresResizeRatio = true;
-            const pxRatio = container.retina.pixelRatio, mainOptions = container.actualOptions, particlesOptions = (0, OptionsUtils_js_1.loadParticlesOptions)(this._engine, container, mainOptions.particles), effectType = particlesOptions.effect.type, shapeType = particlesOptions.shape.type, { reduceDuplicates } = particlesOptions;
+            const pxRatio = container.retina.pixelRatio, mainOptions = container.actualOptions, particlesOptions = (0, OptionsUtils_js_1.loadParticlesOptions)(this._engine, container, mainOptions.particles), { reduceDuplicates } = particlesOptions, effectType = particlesOptions.effect.type, shapeType = particlesOptions.shape.type;
             this.effect = (0, Utils_js_1.itemFromSingleOrMultiple)(effectType, this.id, reduceDuplicates);
             this.shape = (0, Utils_js_1.itemFromSingleOrMultiple)(shapeType, this.id, reduceDuplicates);
             const effectOptions = particlesOptions.effect, shapeOptions = particlesOptions.shape;
@@ -252,6 +258,14 @@
                     }
                 }
             }
+            if (this.effect === randomString) {
+                const availableEffects = [...this.container.effectDrawers.keys()];
+                this.effect = availableEffects[Math.floor(Math.random() * availableEffects.length)];
+            }
+            if (this.shape === randomString) {
+                const availableShapes = [...this.container.shapeDrawers.keys()];
+                this.shape = availableShapes[Math.floor(Math.random() * availableShapes.length)];
+            }
             this.effectData = loadEffectData(this.effect, effectOptions, this.id, reduceDuplicates);
             this.shapeData = loadShapeData(this.shape, shapeOptions, this.id, reduceDuplicates);
             particlesOptions.load(overrideOptions);
@@ -277,7 +291,7 @@
             if (pathOptions.generator) {
                 this.pathGenerator = this._engine.getPathGenerator(pathOptions.generator);
                 if (this.pathGenerator && container.addPath(pathOptions.generator, this.pathGenerator)) {
-                    await this.pathGenerator.init(container);
+                    this.pathGenerator.init(container);
                 }
             }
             container.retina.initParticle(this);
@@ -306,7 +320,7 @@
                 }
             }
             if (effectDrawer?.loadEffect) {
-                await effectDrawer.loadEffect(this);
+                effectDrawer.loadEffect(this);
             }
             let shapeDrawer = container.shapeDrawers.get(this.shape);
             if (!shapeDrawer) {
@@ -316,7 +330,7 @@
                 }
             }
             if (shapeDrawer?.loadShape) {
-                await shapeDrawer.loadShape(this);
+                shapeDrawer.loadShape(this);
             }
             const sideCountFunc = shapeDrawer?.getSidesCount;
             if (sideCountFunc) {
@@ -325,13 +339,13 @@
             this.spawning = false;
             this.shadowColor = (0, ColorUtils_js_1.rangeColorToRgb)(this.options.shadow.color);
             for (const updater of particles.updaters) {
-                await updater.init(this);
+                updater.init(this);
             }
             for (const mover of particles.movers) {
-                await mover.init?.(this);
+                mover.init?.(this);
             }
-            await effectDrawer?.particleInit?.(container, this);
-            await shapeDrawer?.particleInit?.(container, this);
+            effectDrawer?.particleInit?.(container, this);
+            shapeDrawer?.particleInit?.(container, this);
             for (const [, plugin] of container.plugins) {
                 plugin.particleCreated?.(this);
             }

package/umd/Core/Particles.js

@@ -1,41 +1,20 @@
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 (function (factory) {
     if (typeof module === "object" && typeof module.exports === "object") {
         var v = factory(require, exports);
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "../Utils/Utils.js", "./Utils/InteractionManager.js", "./Utils/Point.js", "./Utils/QuadTree.js", "./Utils/Ranges.js", "./Utils/Constants.js"], factory);
+        define(["require", "exports", "../Utils/Utils.js", "../Enums/Types/EventType.js", "./Utils/InteractionManager.js", "../Enums/Modes/LimitMode.js", "./Particle.js", "./Utils/Point.js", "./Utils/QuadTree.js", "./Utils/Ranges.js", "./Utils/Constants.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
-    var __syncRequire = typeof module === "object" && typeof module.exports === "object";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.Particles = void 0;
     const Utils_js_1 = require("../Utils/Utils.js");
+    const EventType_js_1 = require("../Enums/Types/EventType.js");
     const InteractionManager_js_1 = require("./Utils/InteractionManager.js");
+    const LimitMode_js_1 = require("../Enums/Modes/LimitMode.js");
+    const Particle_js_1 = require("./Particle.js");
     const Point_js_1 = require("./Utils/Point.js");
     const QuadTree_js_1 = require("./Utils/QuadTree.js");
     const Ranges_js_1 = require("./Utils/Ranges.js");
@@ -48,11 +27,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
     class Particles {
         constructor(engine, container) {
             this._addToPool = (...particles) => {
-                for (const particle of particles) {
-                    this._pool.push(particle);
-                }
+                this._pool.push(...particles);
             };
-            this._applyDensity = async (options, manualCount, group) => {
+            this._applyDensity = (options, manualCount, group) => {
                 const numberOptions = options.number;
                 if (!options.number.density?.enable) {
                     if (group === undefined) {
@@ -63,7 +40,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
                     }
                     return;
                 }
-                const densityFactor = this._initDensityFactor(numberOptions.density), optParticlesNumber = numberOptions.value, minLimit = 0, optParticlesLimit = numberOptions.limit.value > minLimit ? numberOptions.limit.value : optParticlesNumber, particlesNumber = Math.min(optParticlesNumber, optParticlesLimit) * densityFactor + manualCount, particlesCount = Math.min(this.count, this.filter((t) => t.group === group).length);
+                const densityFactor = this._initDensityFactor(numberOptions.density), optParticlesNumber = numberOptions.value, minLimit = 0, optParticlesLimit = numberOptions.limit.value > minLimit ? numberOptions.limit.value : optParticlesNumber, particlesNumber = Math.min(optParticlesNumber, optParticlesLimit) * densityFactor + manualCount, particlesCount = Math.min(this.count, this.filter(t => t.group === group).length);
                 if (group === undefined) {
                     this._limit = numberOptions.limit.value * densityFactor;
                 }
@@ -71,13 +48,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
                     this._groupLimits.set(group, numberOptions.limit.value * densityFactor);
                 }
                 if (particlesCount < particlesNumber) {
-                    await this.push(Math.abs(particlesNumber - particlesCount), undefined, options, group);
+                    this.push(Math.abs(particlesNumber - particlesCount), undefined, options, group);
                 }
                 else if (particlesCount > particlesNumber) {
                     this.removeQuantity(particlesCount - particlesNumber, group);
                 }
             };
-            this._initDensityFactor = (densityOptions) => {
+            this._initDensityFactor = densityOptions => {
                 const container = this._container, defaultFactor = 1;
                 if (!container.canvas.element || !densityOptions.enable) {
                     return defaultFactor;
@@ -85,14 +62,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
                 const canvas = container.canvas.element, pxRatio = container.retina.pixelRatio;
                 return (canvas.width * canvas.height) / (densityOptions.height * densityOptions.width * pxRatio ** squareExp);
             };
-            this._pushParticle = async (position, overrideOptions, group, initializer) => {
+            this._pushParticle = (position, overrideOptions, group, initializer) => {
                 try {
                     let particle = this._pool.pop();
                     if (!particle) {
-                        const { Particle } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./Particle.js"))) : new Promise((resolve_1, reject_1) => { require(["./Particle.js"], resolve_1, reject_1); }).then(__importStar));
-                        particle = new Particle(this._engine, this._container);
+                        particle = new Particle_js_1.Particle(this._engine, this._container);
                     }
-                    await particle.init(this._nextId, position, overrideOptions, group);
+                    particle.init(this._nextId, position, overrideOptions, group);
                     let canAdd = true;
                     if (initializer) {
                         canAdd = initializer(particle);
@@ -103,7 +79,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
                     this._array.push(particle);
                     this._zArray.push(particle);
                     this._nextId++;
-                    this._engine.dispatchEvent("particleAdded", {
+                    this._engine.dispatchEvent(EventType_js_1.EventType.particleAdded, {
                         container: this._container,
                         data: {
                             particle,
@@ -124,7 +100,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
                 this._array.splice(index, deleteCount);
                 this._zArray.splice(zIdx, deleteCount);
                 particle.destroy(override);
-                this._engine.dispatchEvent("particleRemoved", {
+                this._engine.dispatchEvent(EventType_js_1.EventType.particleRemoved, {
                     container: this._container,
                     data: {
                         particle,
@@ -153,28 +129,29 @@ var __importStar = (this && this.__importStar) || function (mod) {
         get count() {
             return this._array.length;
         }
-        async addManualParticles() {
+        addManualParticles() {
             const container = this._container, options = container.actualOptions;
-            for (const particle of options.manualParticles) {
-                await this.addParticle(particle.position ? (0, Utils_js_1.getPosition)(particle.position, container.canvas.size) : undefined, particle.options);
-            }
+            options.manualParticles.forEach(p => this.addParticle(p.position ? (0, Utils_js_1.getPosition)(p.position, container.canvas.size) : undefined, p.options));
         }
-        async addParticle(position, overrideOptions, group, initializer) {
-            const limitOptions = this._container.actualOptions.particles.number.limit, limit = group === undefined ? this._limit : this._groupLimits.get(group) ?? this._limit, currentCount = this.count, minLimit = 0;
+        addParticle(position, overrideOptions, group, initializer) {
+            const limitMode = this._container.actualOptions.particles.number.limit.mode, limit = group === undefined ? this._limit : this._groupLimits.get(group) ?? this._limit, currentCount = this.count, minLimit = 0;
             if (limit > minLimit) {
-                if (limitOptions.mode === "delete") {
-                    const countOffset = 1, minCount = 0, countToRemove = currentCount + countOffset - limit;
-                    if (countToRemove > minCount) {
-                        this.removeQuantity(countToRemove);
-                    }
-                }
-                else if (limitOptions.mode === "wait") {
-                    if (currentCount >= limit) {
-                        return;
+                switch (limitMode) {
+                    case LimitMode_js_1.LimitMode.delete: {
+                        const countOffset = 1, minCount = 0, countToRemove = currentCount + countOffset - limit;
+                        if (countToRemove > minCount) {
+                            this.removeQuantity(countToRemove);
+                        }
+                        break;
                     }
+                    case LimitMode_js_1.LimitMode.wait:
+                        if (currentCount >= limit) {
+                            return;
+                        }
+                        break;
                 }
             }
-            return await this._pushParticle(position, overrideOptions, group, initializer);
+            return this._pushParticle(position, overrideOptions, group, initializer);
         }
         clear() {
             this._array = [];
@@ -187,15 +164,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
             this.movers = [];
             this.updaters = [];
         }
-        async draw(delta) {
+        draw(delta) {
             const container = this._container, canvas = container.canvas;
             canvas.clear();
-            await this.update(delta);
+            this.update(delta);
             for (const [, plugin] of container.plugins) {
-                await canvas.drawPlugin(plugin, delta);
+                canvas.drawPlugin(plugin, delta);
             }
             for (const p of this._zArray) {
-                await p.draw(delta);
+                p.draw(delta);
             }
         }
         filter(condition) {
@@ -217,24 +194,22 @@ var __importStar = (this && this.__importStar) || function (mod) {
             await this.initPlugins();
             let handled = false;
             for (const [, plugin] of container.plugins) {
-                if (plugin.particlesInitialization !== undefined) {
-                    handled = plugin.particlesInitialization();
-                }
+                handled = plugin.particlesInitialization?.() ?? handled;
                 if (handled) {
                     break;
                 }
             }
-            await this.addManualParticles();
+            this.addManualParticles();
             if (!handled) {
                 const particlesOptions = options.particles, groups = particlesOptions.groups;
                 for (const group in groups) {
                     const groupOptions = groups[group];
                     for (let i = this.count, j = 0; j < groupOptions.number?.value && i < particlesOptions.number.value; i++, j++) {
-                        await this.addParticle(undefined, groupOptions, group);
+                        this.addParticle(undefined, groupOptions, group);
                     }
                 }
                 for (let i = this.count; i < particlesOptions.number.value; i++) {
-                    await this.addParticle();
+                    this.addParticle();
                 }
             }
         }
@@ -247,18 +222,18 @@ var __importStar = (this && this.__importStar) || function (mod) {
             this.updaters = await this._engine.getUpdaters(container, true);
             await this._interactionManager.init();
             for (const [, pathGenerator] of container.pathGenerators) {
-                await pathGenerator.init(container);
+                pathGenerator.init(container);
             }
         }
-        async push(nb, mouse, overrideOptions, group) {
+        push(nb, mouse, overrideOptions, group) {
             for (let i = 0; i < nb; i++) {
-                await this.addParticle(mouse?.position, overrideOptions, group);
+                this.addParticle(mouse?.position, overrideOptions, group);
             }
         }
         async redraw() {
             this.clear();
             await this.init();
-            await this.draw({ value: 0, factor: 0 });
+            this.draw({ value: 0, factor: 0 });
         }
         remove(particle, group, override) {
             this.removeAt(this._array.indexOf(particle), undefined, group, override);
@@ -279,12 +254,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
             const defaultIndex = 0;
             this.removeAt(defaultIndex, quantity, group);
         }
-        async setDensity() {
+        setDensity() {
             const options = this._container.actualOptions, groups = options.particles.groups, manualCount = 0;
             for (const group in groups) {
-                await this._applyDensity(groups[group], manualCount, group);
+                this._applyDensity(groups[group], manualCount, group);
             }
-            await this._applyDensity(options.particles, options.manualParticles.length);
+            this._applyDensity(options.particles, options.manualParticles.length);
         }
         setLastZIndex(zIndex) {
             this._lastZIndex = zIndex;
@@ -293,14 +268,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
         setResizeFactor(factor) {
             this._resizeFactor = factor;
         }
-        async update(delta) {
+        update(delta) {
             const container = this._container, particlesToDelete = new Set();
             this.quadTree = new QuadTree_js_1.QuadTree(qTreeRectangle(container.canvas.size), qTreeCapacity);
             for (const [, pathGenerator] of container.pathGenerators) {
                 pathGenerator.update();
             }
             for (const [, plugin] of container.plugins) {
-                await plugin.update?.(delta);
+                plugin.update?.(delta);
             }
             const resizeFactor = this._resizeFactor;
             for (const particle of this._array) {
@@ -320,7 +295,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
                 }
                 for (const mover of this.movers) {
                     if (mover.isEnabled(particle)) {
-                        await mover.move(particle, delta);
+                        mover.move(particle, delta);
                     }
                 }
                 if (particle.destroyed) {
@@ -334,7 +309,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
                 this._array = this.filter(checkDelete);
                 this._zArray = this._zArray.filter(checkDelete);
                 for (const particle of particlesToDelete) {
-                    this._engine.dispatchEvent("particleRemoved", {
+                    this._engine.dispatchEvent(EventType_js_1.EventType.particleRemoved, {
                         container: this._container,
                         data: {
                             particle,
@@ -343,13 +318,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
                 }
                 this._addToPool(...particlesToDelete);
             }
-            await this._interactionManager.externalInteract(delta);
+            this._interactionManager.externalInteract(delta);
             for (const particle of this._array) {
                 for (const updater of this.updaters) {
-                    await updater.update(particle, delta);
+                    updater.update(particle, delta);
                 }
                 if (!particle.destroyed && !particle.spawning) {
-                    await this._interactionManager.particlesInteract(particle, delta);
+                    this._interactionManager.particlesInteract(particle, delta);
                 }
             }
             delete this._resizeFactor;

package/umd/Core/Utils/EventListeners.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "../../Utils/Utils.js", "./Constants.js", "../../Utils/TypeUtils.js"], factory);
+        define(["require", "exports", "../../Utils/Utils.js", "./Constants.js", "../../Enums/InteractivityDetect.js", "../../Utils/TypeUtils.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -12,6 +12,7 @@
     exports.EventListeners = void 0;
     const Utils_js_1 = require("../../Utils/Utils.js");
     const Constants_js_1 = require("./Constants.js");
+    const InteractivityDetect_js_1 = require("../../Enums/InteractivityDetect.js");
     const TypeUtils_js_1 = require("../../Utils/TypeUtils.js");
     const double = 2;
     function manageListener(element, event, handler, add, options) {
@@ -33,7 +34,7 @@
     class EventListeners {
         constructor(container) {
             this.container = container;
-            this._doMouseTouchClick = (e) => {
+            this._doMouseTouchClick = e => {
                 const container = this.container, options = container.actualOptions;
                 if (this._canPush) {
                     const mouseInteractivity = container.interactivity.mouse, mousePos = mouseInteractivity.position;
@@ -43,7 +44,7 @@
                     mouseInteractivity.clickPosition = { ...mousePos };
                     mouseInteractivity.clickTime = new Date().getTime();
                     const onClick = options.interactivity.events.onClick;
-                    (0, Utils_js_1.executeOnSingleOrMultiple)(onClick.mode, (mode) => this.container.handleClickMode(mode));
+                    (0, Utils_js_1.executeOnSingleOrMultiple)(onClick.mode, mode => this.container.handleClickMode(mode));
                 }
                 if (e.type === "touchend") {
                     const touchDelay = 500;
@@ -51,8 +52,8 @@
                 }
             };
             this._handleThemeChange = (e) => {
-                const mediaEvent = e, container = this.container, options = container.options, defaultThemes = options.defaultThemes, themeName = mediaEvent.matches ? defaultThemes.dark : defaultThemes.light, theme = options.themes.find((theme) => theme.name === themeName);
-                if (theme && theme.default.auto) {
+                const mediaEvent = e, container = this.container, options = container.options, defaultThemes = options.defaultThemes, themeName = mediaEvent.matches ? defaultThemes.dark : defaultThemes.light, theme = options.themes.find(theme => theme.name === themeName);
+                if (theme?.default.auto) {
                     void container.loadTheme(themeName);
                 }
             };
@@ -62,7 +63,7 @@
                 if (!options.pauseOnBlur) {
                     return;
                 }
-                if (document && document.hidden) {
+                if (document?.hidden) {
                     container.pageHidden = true;
                     container.pause();
                 }
@@ -114,14 +115,14 @@
                 manageListener(interactivityEl, mouseLeaveTmpEvent, handlers.mouseLeave, add);
                 manageListener(interactivityEl, Constants_js_1.touchCancelEvent, handlers.touchCancel, add);
             };
-            this._manageListeners = (add) => {
+            this._manageListeners = add => {
                 const handlers = this._handlers, container = this.container, options = container.actualOptions, detectType = options.interactivity.detectsOn, canvasEl = container.canvas.element;
                 let mouseLeaveTmpEvent = Constants_js_1.mouseLeaveEvent;
-                if (detectType === "window") {
+                if (detectType === InteractivityDetect_js_1.InteractivityDetect.window) {
                     container.interactivity.element = window;
                     mouseLeaveTmpEvent = Constants_js_1.mouseOutEvent;
                 }
-                else if (detectType === "parent" && canvasEl) {
+                else if (detectType === InteractivityDetect_js_1.InteractivityDetect.parent && canvasEl) {
                     container.interactivity.element = canvasEl.parentElement ?? canvasEl.parentNode;
                 }
                 else {
@@ -134,7 +135,7 @@
                     manageListener(document, Constants_js_1.visibilityChangeEvent, handlers.visibilityChange, add, false);
                 }
             };
-            this._manageMediaMatch = (add) => {
+            this._manageMediaMatch = add => {
                 const handlers = this._handlers, mediaMatch = (0, Utils_js_1.safeMatchMedia)("(prefers-color-scheme: dark)");
                 if (!mediaMatch) {
                     return;
@@ -153,7 +154,7 @@
                     mediaMatch.removeListener(handlers.oldThemeChange);
                 }
             };
-            this._manageResize = (add) => {
+            this._manageResize = add => {
                 const handlers = this._handlers, container = this.container, options = container.actualOptions;
                 if (!options.interactivity.events.resize) {
                     return;
@@ -172,7 +173,7 @@
                 }
                 else if (!this._resizeObserver && add && canvasEl) {
                     this._resizeObserver = new ResizeObserver((entries) => {
-                        const entry = entries.find((e) => e.target === canvasEl);
+                        const entry = entries.find(e => e.target === canvasEl);
                         if (!entry) {
                             return;
                         }
@@ -190,7 +191,7 @@
                 mouse.clicking = true;
                 mouse.downPosition = mouse.position;
             };
-            this._mouseTouchClick = (e) => {
+            this._mouseTouchClick = e => {
                 const container = this.container, options = container.actualOptions, { mouse } = container.interactivity;
                 mouse.inside = true;
                 let handled = false;
@@ -225,7 +226,7 @@
                 mouse.inside = false;
                 mouse.clicking = false;
             };
-            this._mouseTouchMove = (e) => {
+            this._mouseTouchMove = e => {
                 const container = this.container, options = container.actualOptions, interactivity = container.interactivity, canvasEl = container.canvas.element;
                 if (!interactivity?.element) {
                     return;
@@ -244,7 +245,7 @@
                             };
                         }
                     }
-                    else if (options.interactivity.detectsOn === "parent") {
+                    else if (options.interactivity.detectsOn === InteractivityDetect_js_1.InteractivityDetect.parent) {
                         const source = mouseEvent.target, target = mouseEvent.currentTarget;
                         if (source && target && canvasEl) {
                             const sourceRect = source.getBoundingClientRect(), targetRect = target.getBoundingClientRect(), canvasRect = canvasEl.getBoundingClientRect();
@@ -285,21 +286,21 @@
                 interactivity.mouse.position = pos;
                 interactivity.status = Constants_js_1.mouseMoveEvent;
             };
-            this._touchEnd = (e) => {
+            this._touchEnd = e => {
                 const evt = e, touches = Array.from(evt.changedTouches);
                 for (const touch of touches) {
                     this._touches.delete(touch.identifier);
                 }
                 this._mouseTouchFinish();
             };
-            this._touchEndClick = (e) => {
+            this._touchEndClick = e => {
                 const evt = e, touches = Array.from(evt.changedTouches);
                 for (const touch of touches) {
                     this._touches.delete(touch.identifier);
                 }
                 this._mouseTouchClick(e);
             };
-            this._touchStart = (e) => {
+            this._touchStart = e => {
                 const evt = e, touches = Array.from(evt.changedTouches);
                 for (const touch of touches) {
                     this._touches.set(touch.identifier, performance.now());