@tsparticles/configs 3.0.3 → 3.2.0

package/umd/e/emitterSpawnColor.js

@@ -0,0 +1,175 @@
+(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"], factory);
+    }
+})(function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    const emitterRate = {
+        delay: 0.1,
+        quantity: 2,
+    }, options = {
+        key: "emitterSpawnColor",
+        name: "Emitter Spawn Color",
+        particles: {
+            opacity: {
+                value: 1,
+            },
+            size: {
+                value: 3,
+            },
+            life: {
+                count: 1,
+                duration: {
+                    value: 5,
+                },
+            },
+            move: {
+                enable: true,
+                speed: 3,
+                outModes: {
+                    default: "destroy",
+                },
+            },
+        },
+        background: {
+            color: "#000000",
+        },
+        emitters: [
+            {
+                position: {
+                    x: 33,
+                    y: 0,
+                },
+                rate: emitterRate,
+                particles: {
+                    move: {
+                        direction: "bottom-right",
+                    },
+                },
+                spawnColor: {
+                    value: "#ff0000",
+                    animation: {
+                        h: {
+                            enable: true,
+                            speed: 10,
+                        },
+                    },
+                },
+            },
+            {
+                position: {
+                    x: 33,
+                    y: 100,
+                },
+                rate: emitterRate,
+                particles: {
+                    move: {
+                        direction: "top-right",
+                    },
+                },
+                spawnColor: {
+                    value: "#ff0000",
+                    animation: {
+                        s: {
+                            enable: true,
+                            speed: 10,
+                            offset: {
+                                min: -10,
+                                max: 10,
+                            },
+                        },
+                    },
+                },
+            },
+            {
+                position: {
+                    x: 100,
+                    y: 0,
+                },
+                rate: emitterRate,
+                particles: {
+                    move: {
+                        direction: "bottom-left",
+                    },
+                },
+                spawnColor: {
+                    value: "#ff0000",
+                    animation: {
+                        l: {
+                            enable: true,
+                            speed: 10,
+                            offset: {
+                                min: -10,
+                                max: 10,
+                            },
+                        },
+                    },
+                },
+            },
+            {
+                position: {
+                    x: 100,
+                    y: 100,
+                },
+                rate: emitterRate,
+                particles: {
+                    move: {
+                        direction: "top-left",
+                    },
+                },
+                spawnColor: {
+                    value: "#ff0000",
+                    animation: {
+                        h: {
+                            enable: true,
+                            speed: 10,
+                        },
+                        s: {
+                            enable: true,
+                            speed: 10,
+                            offset: {
+                                min: -10,
+                                max: 10,
+                            },
+                        },
+                    },
+                },
+            },
+            {
+                position: {
+                    x: 66,
+                    y: 50,
+                },
+                rate: emitterRate,
+                particles: {
+                    move: {
+                        direction: "none",
+                    },
+                },
+                spawnColor: {
+                    value: "#ff0000",
+                    animation: {
+                        h: {
+                            enable: true,
+                            speed: 10,
+                        },
+                        l: {
+                            enable: true,
+                            speed: 10,
+                            offset: {
+                                min: -10,
+                                max: 10,
+                            },
+                        },
+                    },
+                },
+            },
+        ],
+    };
+    exports.default = options;
+});

package/umd/e/emitterTextShape.js

@@ -9,11 +9,10 @@
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    const rate = {
+    const minAlphaFilter = 0, rate = {
         delay: 0.1,
         quantity: 100,
-    };
-    const generateEmitter = (shape, options, fill, position) => {
+    }, generateEmitter = (shape, options, fill, position) => {
         return {
             shape: {
                 type: shape,
@@ -29,8 +28,8 @@
             rate,
             fill,
         };
-    };
-    const options = {
+    }, options = {
+        key: "emitterTextShape",
         name: "Emitter Text Shape",
         particles: {
             number: {
@@ -90,7 +89,7 @@
             generateEmitter("canvas", {
                 scale: 1,
                 pixels: {
-                    filter: "pixelTextFilter",
+                    filter: (pixel) => pixel.a > minAlphaFilter,
                     offset: 4,
                 },
                 text: {

package/umd/e/emitterTextStrokeShape.js

@@ -9,11 +9,10 @@
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    const rate = {
+    const minAlphaFilter = 0, rate = {
         delay: 0.1,
         quantity: 100,
-    };
-    const generateEmitter = (shape, options, fill, position) => {
+    }, generateEmitter = (shape, options, fill, position) => {
         return {
             shape: {
                 type: shape,
@@ -29,8 +28,8 @@
             rate,
             fill,
         };
-    };
-    const options = {
+    }, options = {
+        key: "emitterTextStrokeShape",
         name: "Emitter Text Stroke Shape",
         particles: {
             number: {
@@ -90,7 +89,7 @@
             generateEmitter("canvas", {
                 scale: 1,
                 pixels: {
-                    filter: "pixelTextFilter",
+                    filter: (pixel) => pixel.a > minAlphaFilter,
                     offset: 4,
                 },
                 text: {

package/umd/e/index.js

@@ -7,7 +7,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./effectBubble.js", "./effectTrail.js", "./emitter.js", "./emitterAbsorber.js", "./emitterAngled.js", "./emitterImageShape.js", "./emitterImages.js", "./emitterPaths.js", "./emitterShapes.js", "./emitterTextShape.js", "./emitterTextStrokeShape.js"], factory);
+        define(["require", "exports", "./effectBubble.js", "./effectTrail.js", "./emitter.js", "./emitterAbsorber.js", "./emitterAngled.js", "./emitterImageShape.js", "./emitterImages.js", "./emitterPaths.js", "./emitterShapes.js", "./emitterSpawnColor.js", "./emitterTextShape.js", "./emitterTextStrokeShape.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -21,6 +21,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     const emitterImages_js_1 = __importDefault(require("./emitterImages.js"));
     const emitterPaths_js_1 = __importDefault(require("./emitterPaths.js"));
     const emitterShapes_js_1 = __importDefault(require("./emitterShapes.js"));
+    const emitterSpawnColor_js_1 = __importDefault(require("./emitterSpawnColor.js"));
     const emitterTextShape_js_1 = __importDefault(require("./emitterTextShape.js"));
     const emitterTextStrokeShape_js_1 = __importDefault(require("./emitterTextStrokeShape.js"));
     exports.default = {
@@ -33,6 +34,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
         emitterImages: emitterImages_js_1.default,
         emitterPaths: emitterPaths_js_1.default,
         emitterShapes: emitterShapes_js_1.default,
+        emitterSpawnColor: emitterSpawnColor_js_1.default,
         emitterTextShape: emitterTextShape_js_1.default,
         emitterTextStrokeShape: emitterTextStrokeShape_js_1.default,
     };

package/umd/f/fireworks.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "fireworks",
         name: "Fireworks",
         fullScreen: {
             enable: true,
@@ -176,8 +177,8 @@
             enable: true,
             events: [
                 {
-                    event: "particleDestroyed",
-                    filter: "explodeSoundCheck",
+                    event: "particleRemoved",
+                    filter: (args) => args.data.particle.options.move.gravity.inverse,
                     audio: [
                         "https://particles.js.org/audio/explosion0.mp3",
                         "https://particles.js.org/audio/explosion1.mp3",

package/umd/f/fireworks2.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "fireworks2",
         name: "Fireworks 2",
         fullScreen: {
             enable: true,
@@ -23,6 +24,9 @@
         },
         backgroundMask: {
             enable: true,
+            cover: {
+                color: "#000",
+            },
         },
         emitters: {
             direction: "top",
@@ -158,9 +162,6 @@
                     },
                 },
             },
-            rotate: {
-                path: true,
-            },
             shape: {
                 type: "circle",
             },
@@ -190,7 +191,7 @@
             events: [
                 {
                     event: "particleRemoved",
-                    filter: "explodeSoundCheck",
+                    filter: (args) => args.data.particle.options.move.gravity.inverse,
                     audio: [
                         "https://particles.js.org/audio/explosion0.mp3",
                         "https://particles.js.org/audio/explosion1.mp3",

package/umd/f/fontawesome.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "fontawesome",
         name: "Font Awesome",
         interactivity: {
             events: {

package/umd/f/forward.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "forward",
         name: "Forward",
         particles: {
             number: {

package/umd/g/gifs.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "gifs",
         name: "Gifs",
         interactivity: {
             events: {

package/umd/g/grabRandomColor.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "grabRandomColor",
         name: "Grab Random Color",
         particles: {
             number: {

package/umd/g/gradients.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "gradients",
         name: "Gradients",
         particles: {
             number: {
@@ -86,6 +87,75 @@
                         },
                     ],
                 },
+                {
+                    type: "radial",
+                    colors: [
+                        {
+                            stop: 0.25,
+                            value: {
+                                value: "#ff0000",
+                                animation: {
+                                    enable: true,
+                                    speed: 60,
+                                    sync: true,
+                                },
+                            },
+                        },
+                        {
+                            stop: 0.5,
+                            value: {
+                                value: "#00ff00",
+                                animation: {
+                                    enable: true,
+                                    speed: 60,
+                                    sync: true,
+                                },
+                            },
+                        },
+                        {
+                            stop: 0.75,
+                            value: {
+                                value: "#0000ff",
+                                animation: {
+                                    enable: true,
+                                    speed: 60,
+                                    sync: true,
+                                },
+                            },
+                        },
+                        {
+                            stop: 1,
+                            value: "#000000",
+                            opacity: 0,
+                        },
+                    ],
+                },
+                {
+                    type: "linear",
+                    angle: {
+                        value: 0,
+                        direction: "random",
+                        animation: {
+                            enable: true,
+                            speed: 60,
+                            sync: true,
+                        },
+                    },
+                    colors: [
+                        {
+                            stop: 0,
+                            value: "#00ffff",
+                        },
+                        {
+                            stop: 0.5,
+                            value: "#ff00ff",
+                        },
+                        {
+                            stop: 1,
+                            value: "#ffff00",
+                        },
+                    ],
+                },
             ],
             shape: {
                 type: "circle",

package/umd/g/gravity.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "gravity",
         name: "Gravity",
         particles: {
             destroy: {

package/umd/g/growing.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "growing",
         name: "Growing",
         emitters: {
             direction: "top",

package/umd/h/hexagonPath.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "hexagonPath",
         name: "Hexagon Path",
         particles: {
             color: {

package/umd/h/hollowknight.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "hollowknight",
         name: "Hollow Knight",
         interactivity: {
             events: {

package/umd/h/hyperspace.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "hyperspace",
         name: "Hyperspace",
         background: {
             color: "#000",

package/umd/i/imageMask.js

@@ -9,7 +9,8 @@
 })(function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    const options = {
+    const minFilterValue = 30, minFilterAlpha = 0, options = {
+        key: "imageMask",
         name: "Image Mask",
         smooth: true,
         interactivity: {
@@ -57,7 +58,9 @@
             enable: true,
             scale: 5,
             pixels: {
-                filter: "pixelFilter",
+                filter: (pixel) => pixel.r < minFilterValue && pixel.g < minFilterValue && pixel.b < minFilterValue
+                    ? false
+                    : pixel.a > minFilterAlpha,
             },
             image: {
                 src: "https://particles.js.org/images/amongus_cyan.png",

package/umd/i/images.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "images",
         name: "Images",
         interactivity: {
             events: {

package/umd/i/imagesDirections.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "imagesDirections",
         name: "Images with Custom Directions",
         interactivity: {
             events: {

package/umd/i/infection.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "infection",
         name: "Infection",
         infection: {
             enable: true,

package/umd/l/life.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "life",
         name: "Life",
         particles: {
             number: {

package/umd/l/lightHover.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "lightHover",
         name: "Light Hover",
         particles: {
             number: {

package/umd/l/linkTriangles.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "linkTriangles",
         name: "Link Triangles",
         particles: {
             number: {

package/umd/l/localPolygonMask.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "localPolygonMask",
         name: "Local Polygon Mask",
         interactivity: {
             events: {

package/umd/m/index.js

@@ -7,7 +7,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./manual.js", "./motionDisable.js", "./motionReduce.js", "./mouseAttract.js", "./mouseBounce.js", "./mouseFollow.js", "./mouseTrail.js", "./mouseTrailNoise.js", "./moveAngle.js", "./moveDistance.js", "./moveInside.js", "./moveOutside.js", "./multipleClickEmitters.js", "./multiplePolygonMasks.js"], factory);
+        define(["require", "exports", "./manual.js", "./motionDisable.js", "./motionReduce.js", "./mouseAttract.js", "./mouseBounce.js", "./mouseFollow.js", "./mouseParticle.js", "./mouseParticle2.js", "./mouseTrail.js", "./mouseTrailNoise.js", "./moveAngle.js", "./moveDistance.js", "./moveInside.js", "./moveOutside.js", "./multipleClickEmitters.js", "./multiplePolygonMasks.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -18,6 +18,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     const mouseAttract_js_1 = __importDefault(require("./mouseAttract.js"));
     const mouseBounce_js_1 = __importDefault(require("./mouseBounce.js"));
     const mouseFollow_js_1 = __importDefault(require("./mouseFollow.js"));
+    const mouseParticle_js_1 = __importDefault(require("./mouseParticle.js"));
+    const mouseParticle2_js_1 = __importDefault(require("./mouseParticle2.js"));
     const mouseTrail_js_1 = __importDefault(require("./mouseTrail.js"));
     const mouseTrailNoise_js_1 = __importDefault(require("./mouseTrailNoise.js"));
     const moveAngle_js_1 = __importDefault(require("./moveAngle.js"));
@@ -33,6 +35,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
         mouseAttract: mouseAttract_js_1.default,
         mouseBounce: mouseBounce_js_1.default,
         mouseFollow: mouseFollow_js_1.default,
+        mouseParticle: mouseParticle_js_1.default,
+        mouseParticle2: mouseParticle2_js_1.default,
         mouseTrail: mouseTrail_js_1.default,
         mouseTrailNoise: mouseTrailNoise_js_1.default,
         moveAngle: moveAngle_js_1.default,

package/umd/m/manual.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "manual",
         name: "Manual Particles",
         manualParticles: [
             {

package/umd/m/motionDisable.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "motionDisable",
         name: "Motion Disable",
         motion: {
             disable: true,

package/umd/m/motionReduce.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "motionReduce",
         name: "Motion Reduce",
         motion: {
             disable: false,

package/umd/m/mouseAttract.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "mouseAttract",
         name: "Mouse Attract",
         particles: {
             number: {

package/umd/m/mouseBounce.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "mouseBounce",
         name: "Mouse Bounce",
         particles: {
             number: {

package/umd/m/mouseFollow.js

@@ -10,6 +10,7 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     const options = {
+        key: "mouseFollow",
         name: "Mouse Follow",
         background: {
             color: "#000000",