tsparticles 1.41.3 → 1.41.6

package/Core/Canvas.js

@@ -98,10 +98,7 @@ class Canvas {
         const container = this.container;
         const pxRatio = container.retina.pixelRatio;
         const size = container.canvas.size;
-        const oldSize = {
-            width: size.width,
-            height: size.height,
-        };
+        const oldSize = Object.assign({}, size);
         size.width = this.element.offsetWidth * pxRatio;
         size.height = this.element.offsetHeight * pxRatio;
         this.element.width = size.width;

package/Core/Particle.d.ts

@@ -13,6 +13,7 @@ export declare class Particle implements IParticle {
     readonly container: Container;
     readonly group?: string | undefined;
     destroyed: boolean;
+    ignoresResizeRatio: boolean;
     lastPathTime: number;
     misplaced: boolean;
     spawning: boolean;

package/Core/Particle.js

@@ -45,6 +45,7 @@ class Particle {
         this.retina = {
             maxDistance: {},
         };
+        this.ignoresResizeRatio = true;
         const pxRatio = container.retina.pixelRatio;
         const mainOptions = container.actualOptions;
         const particlesOptions = new ParticlesOptions_1.ParticlesOptions();

package/Core/Particles.js

@@ -111,10 +111,11 @@ class Particles {
         }
         for (const particle of this.array) {
             const resizeFactor = container.canvas.resizeFactor;
-            if (resizeFactor) {
+            if (resizeFactor && !particle.ignoresResizeRatio) {
                 particle.position.x *= resizeFactor.width;
                 particle.position.y *= resizeFactor.height;
             }
+            particle.ignoresResizeRatio = false;
             particle.bubble.inRange = false;
             for (const [, plugin] of this.container.plugins) {
                 if (particle.destroyed) {

package/Plugins/Emitters/EmitterInstance.js

@@ -18,8 +18,8 @@ const Emitter_1 = require("./Options/Classes/Emitter");
 const EmitterSize_1 = require("./Options/Classes/EmitterSize");
 class EmitterInstance {
     constructor(engine, emitters, container, options, position) {
-        var _a, _b, _c, _d, _e, _f;
-        var _g;
+        var _a, _b, _c, _d, _e, _f, _g;
+        var _h;
         this.emitters = emitters;
         this.container = container;
         _EmitterInstance_firstSpawn.set(this, void 0);
@@ -38,22 +38,23 @@ class EmitterInstance {
             this.options.load(options);
         }
         this.spawnDelay = (((_a = this.options.life.delay) !== null && _a !== void 0 ? _a : 0) * 1000) / this.container.retina.reduceFactor;
+        this.position = (_b = this.initialPosition) !== null && _b !== void 0 ? _b : this.calcPosition();
         this.name = this.options.name;
-        this.shape = (_b = __classPrivateFieldGet(this, _EmitterInstance_engine, "f").emitterShapeManager) === null || _b === void 0 ? void 0 : _b.getShape(this.options.shape);
+        this.shape = (_c = __classPrivateFieldGet(this, _EmitterInstance_engine, "f").emitterShapeManager) === null || _c === void 0 ? void 0 : _c.getShape(this.options.shape);
         this.fill = this.options.fill;
         __classPrivateFieldSet(this, _EmitterInstance_firstSpawn, !this.options.life.wait, "f");
         __classPrivateFieldSet(this, _EmitterInstance_startParticlesAdded, false, "f");
         let particlesOptions = (0, Utils_1.deepExtend)({}, this.options.particles);
         particlesOptions !== null && particlesOptions !== void 0 ? particlesOptions : (particlesOptions = {});
-        (_c = particlesOptions.move) !== null && _c !== void 0 ? _c : (particlesOptions.move = {});
-        (_d = (_g = particlesOptions.move).direction) !== null && _d !== void 0 ? _d : (_g.direction = this.options.direction);
+        (_d = particlesOptions.move) !== null && _d !== void 0 ? _d : (particlesOptions.move = {});
+        (_e = (_h = particlesOptions.move).direction) !== null && _e !== void 0 ? _e : (_h.direction = this.options.direction);
         if (this.options.spawnColor) {
             this.spawnColor = (0, Utils_1.colorToHsl)(this.options.spawnColor);
         }
         this.paused = !this.options.autoPlay;
         this.particlesOptions = particlesOptions;
         this.size =
-            (_e = this.options.size) !== null && _e !== void 0 ? _e : (() => {
+            (_f = this.options.size) !== null && _f !== void 0 ? _f : (() => {
                 const size = new EmitterSize_1.EmitterSize();
                 size.load({
                     height: 0,
@@ -62,7 +63,7 @@ class EmitterInstance {
                 });
                 return size;
             })();
-        this.lifeCount = (_f = this.options.life.count) !== null && _f !== void 0 ? _f : -1;
+        this.lifeCount = (_g = this.options.life.count) !== null && _g !== void 0 ? _g : -1;
         this.immortal = this.lifeCount <= 0;
         this.play();
     }

package/Updaters/Size/SizeUpdater.js

@@ -48,7 +48,6 @@ function updateSize(particle, delta) {
                 particle.size.loops++;
             }
             else {
-                console.log("decreasing");
                 particle.size.value -= sizeVelocity;
             }
     }

package/browser/Core/Canvas.js

@@ -117,10 +117,7 @@ export class Canvas {
         const container = this.container;
         const pxRatio = container.retina.pixelRatio;
         const size = container.canvas.size;
-        const oldSize = {
-            width: size.width,
-            height: size.height,
-        };
+        const oldSize = Object.assign({}, size);
         size.width = this.element.offsetWidth * pxRatio;
         size.height = this.element.offsetHeight * pxRatio;
         this.element.width = size.width;

package/browser/Core/Particle.d.ts

@@ -17,6 +17,7 @@ export declare class Particle implements IParticle {
     readonly container: Container;
     readonly group?: string | undefined;
     destroyed: boolean;
+    ignoresResizeRatio: boolean;
     lastPathTime: number;
     misplaced: boolean;
     spawning: boolean;

package/browser/Core/Particle.js

@@ -46,6 +46,7 @@ export class Particle {
         this.retina = {
             maxDistance: {},
         };
+        this.ignoresResizeRatio = true;
         const pxRatio = container.retina.pixelRatio;
         const mainOptions = container.actualOptions;
         const particlesOptions = new ParticlesOptions();

package/browser/Core/Particles.js

@@ -121,10 +121,11 @@ export class Particles {
             //     p.vy = f * Math.sin(t);
             // }
             const resizeFactor = container.canvas.resizeFactor;
-            if (resizeFactor) {
+            if (resizeFactor && !particle.ignoresResizeRatio) {
                 particle.position.x *= resizeFactor.width;
                 particle.position.y *= resizeFactor.height;
             }
+            particle.ignoresResizeRatio = false;
             particle.bubble.inRange = false;
             for (const [, plugin] of this.container.plugins) {
                 if (particle.destroyed) {

package/browser/Plugins/Emitters/EmitterInstance.js

@@ -18,8 +18,8 @@ import { EmitterSize } from "./Options/Classes/EmitterSize";
  */
 export class EmitterInstance {
     constructor(engine, emitters, container, options, position) {
-        var _a, _b, _c, _d, _e, _f;
-        var _g;
+        var _a, _b, _c, _d, _e, _f, _g;
+        var _h;
         this.emitters = emitters;
         this.container = container;
         _EmitterInstance_firstSpawn.set(this, void 0);
@@ -38,22 +38,23 @@ export class EmitterInstance {
             this.options.load(options);
         }
         this.spawnDelay = (((_a = this.options.life.delay) !== null && _a !== void 0 ? _a : 0) * 1000) / this.container.retina.reduceFactor;
+        this.position = (_b = this.initialPosition) !== null && _b !== void 0 ? _b : this.calcPosition();
         this.name = this.options.name;
-        this.shape = (_b = __classPrivateFieldGet(this, _EmitterInstance_engine, "f").emitterShapeManager) === null || _b === void 0 ? void 0 : _b.getShape(this.options.shape);
+        this.shape = (_c = __classPrivateFieldGet(this, _EmitterInstance_engine, "f").emitterShapeManager) === null || _c === void 0 ? void 0 : _c.getShape(this.options.shape);
         this.fill = this.options.fill;
         __classPrivateFieldSet(this, _EmitterInstance_firstSpawn, !this.options.life.wait, "f");
         __classPrivateFieldSet(this, _EmitterInstance_startParticlesAdded, false, "f");
         let particlesOptions = deepExtend({}, this.options.particles);
         particlesOptions !== null && particlesOptions !== void 0 ? particlesOptions : (particlesOptions = {});
-        (_c = particlesOptions.move) !== null && _c !== void 0 ? _c : (particlesOptions.move = {});
-        (_d = (_g = particlesOptions.move).direction) !== null && _d !== void 0 ? _d : (_g.direction = this.options.direction);
+        (_d = particlesOptions.move) !== null && _d !== void 0 ? _d : (particlesOptions.move = {});
+        (_e = (_h = particlesOptions.move).direction) !== null && _e !== void 0 ? _e : (_h.direction = this.options.direction);
         if (this.options.spawnColor) {
             this.spawnColor = colorToHsl(this.options.spawnColor);
         }
         this.paused = !this.options.autoPlay;
         this.particlesOptions = particlesOptions;
         this.size =
-            (_e = this.options.size) !== null && _e !== void 0 ? _e : (() => {
+            (_f = this.options.size) !== null && _f !== void 0 ? _f : (() => {
                 const size = new EmitterSize();
                 size.load({
                     height: 0,
@@ -62,7 +63,7 @@ export class EmitterInstance {
                 });
                 return size;
             })();
-        this.lifeCount = (_f = this.options.life.count) !== null && _f !== void 0 ? _f : -1;
+        this.lifeCount = (_g = this.options.life.count) !== null && _g !== void 0 ? _g : -1;
         this.immortal = this.lifeCount <= 0;
         this.play();
     }

package/browser/Updaters/Size/SizeUpdater.js

@@ -45,7 +45,6 @@ function updateSize(particle, delta) {
                 particle.size.loops++;
             }
             else {
-                console.log("decreasing");
                 particle.size.value -= sizeVelocity;
             }
     }

package/esm/Core/Canvas.js

@@ -95,10 +95,7 @@ export class Canvas {
         const container = this.container;
         const pxRatio = container.retina.pixelRatio;
         const size = container.canvas.size;
-        const oldSize = {
-            width: size.width,
-            height: size.height,
-        };
+        const oldSize = Object.assign({}, size);
         size.width = this.element.offsetWidth * pxRatio;
         size.height = this.element.offsetHeight * pxRatio;
         this.element.width = size.width;

package/esm/Core/Particle.d.ts

@@ -13,6 +13,7 @@ export declare class Particle implements IParticle {
     readonly container: Container;
     readonly group?: string | undefined;
     destroyed: boolean;
+    ignoresResizeRatio: boolean;
     lastPathTime: number;
     misplaced: boolean;
     spawning: boolean;

package/esm/Core/Particle.js

@@ -42,6 +42,7 @@ export class Particle {
         this.retina = {
             maxDistance: {},
         };
+        this.ignoresResizeRatio = true;
         const pxRatio = container.retina.pixelRatio;
         const mainOptions = container.actualOptions;
         const particlesOptions = new ParticlesOptions();

package/esm/Core/Particles.js

@@ -108,10 +108,11 @@ export class Particles {
         }
         for (const particle of this.array) {
             const resizeFactor = container.canvas.resizeFactor;
-            if (resizeFactor) {
+            if (resizeFactor && !particle.ignoresResizeRatio) {
                 particle.position.x *= resizeFactor.width;
                 particle.position.y *= resizeFactor.height;
             }
+            particle.ignoresResizeRatio = false;
             particle.bubble.inRange = false;
             for (const [, plugin] of this.container.plugins) {
                 if (particle.destroyed) {

package/esm/Plugins/Emitters/EmitterInstance.js

@@ -15,8 +15,8 @@ import { Emitter } from "./Options/Classes/Emitter";
 import { EmitterSize } from "./Options/Classes/EmitterSize";
 export class EmitterInstance {
     constructor(engine, emitters, container, options, position) {
-        var _a, _b, _c, _d, _e, _f;
-        var _g;
+        var _a, _b, _c, _d, _e, _f, _g;
+        var _h;
         this.emitters = emitters;
         this.container = container;
         _EmitterInstance_firstSpawn.set(this, void 0);
@@ -35,22 +35,23 @@ export class EmitterInstance {
             this.options.load(options);
         }
         this.spawnDelay = (((_a = this.options.life.delay) !== null && _a !== void 0 ? _a : 0) * 1000) / this.container.retina.reduceFactor;
+        this.position = (_b = this.initialPosition) !== null && _b !== void 0 ? _b : this.calcPosition();
         this.name = this.options.name;
-        this.shape = (_b = __classPrivateFieldGet(this, _EmitterInstance_engine, "f").emitterShapeManager) === null || _b === void 0 ? void 0 : _b.getShape(this.options.shape);
+        this.shape = (_c = __classPrivateFieldGet(this, _EmitterInstance_engine, "f").emitterShapeManager) === null || _c === void 0 ? void 0 : _c.getShape(this.options.shape);
         this.fill = this.options.fill;
         __classPrivateFieldSet(this, _EmitterInstance_firstSpawn, !this.options.life.wait, "f");
         __classPrivateFieldSet(this, _EmitterInstance_startParticlesAdded, false, "f");
         let particlesOptions = deepExtend({}, this.options.particles);
         particlesOptions !== null && particlesOptions !== void 0 ? particlesOptions : (particlesOptions = {});
-        (_c = particlesOptions.move) !== null && _c !== void 0 ? _c : (particlesOptions.move = {});
-        (_d = (_g = particlesOptions.move).direction) !== null && _d !== void 0 ? _d : (_g.direction = this.options.direction);
+        (_d = particlesOptions.move) !== null && _d !== void 0 ? _d : (particlesOptions.move = {});
+        (_e = (_h = particlesOptions.move).direction) !== null && _e !== void 0 ? _e : (_h.direction = this.options.direction);
         if (this.options.spawnColor) {
             this.spawnColor = colorToHsl(this.options.spawnColor);
         }
         this.paused = !this.options.autoPlay;
         this.particlesOptions = particlesOptions;
         this.size =
-            (_e = this.options.size) !== null && _e !== void 0 ? _e : (() => {
+            (_f = this.options.size) !== null && _f !== void 0 ? _f : (() => {
                 const size = new EmitterSize();
                 size.load({
                     height: 0,
@@ -59,7 +60,7 @@ export class EmitterInstance {
                 });
                 return size;
             })();
-        this.lifeCount = (_f = this.options.life.count) !== null && _f !== void 0 ? _f : -1;
+        this.lifeCount = (_g = this.options.life.count) !== null && _g !== void 0 ? _g : -1;
         this.immortal = this.lifeCount <= 0;
         this.play();
     }

package/esm/Updaters/Size/SizeUpdater.js

@@ -45,7 +45,6 @@ function updateSize(particle, delta) {
                 particle.size.loops++;
             }
             else {
-                console.log("decreasing");
                 particle.size.value -= sizeVelocity;
             }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tsparticles",
-  "version": "1.41.3",
+  "version": "1.41.6",
   "description": "Easily create highly customizable particle animations and use them as animated backgrounds for your website. Ready to use components available also for React, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Riot.js, Inferno.",
   "homepage": "https://particles.js.org/",
   "scripts": {