@tsparticles/configs 3.9.1 → 4.0.0-alpha.1

package/browser/f/fireworksMask.js

@@ -0,0 +1,195 @@
+import { EventType } from "@tsparticles/engine";
+const options = {
+    key: "fireworksMask",
+    name: "Fireworks Background Mask",
+    fullScreen: {
+        enable: true,
+    },
+    background: {
+        color: "#ffffff",
+        image: "url('https://particles.js.org/images/hdr/background3.jpg')",
+        position: "50% 50%",
+        repeat: "no-repeat",
+        size: "cover",
+    },
+    backgroundMask: {
+        enable: true,
+        cover: {
+            color: "#000",
+        },
+    },
+    emitters: {
+        direction: "top",
+        life: {
+            count: 0,
+            duration: 0.1,
+            delay: 0.1,
+        },
+        rate: {
+            delay: 0.15,
+            quantity: 1,
+        },
+        size: {
+            width: 100,
+            height: 0,
+        },
+        position: {
+            y: 100,
+            x: 50,
+        },
+    },
+    particles: {
+        color: {
+            value: "#fff",
+        },
+        number: {
+            value: 0,
+        },
+        destroy: {
+            bounds: {
+                top: 30,
+            },
+            mode: "split",
+            split: {
+                count: 1,
+                factor: {
+                    value: 0.333333,
+                },
+                rate: {
+                    value: 100,
+                },
+                particles: {
+                    stroke: {
+                        width: 0,
+                    },
+                    color: {
+                        value: ["#ff595e", "#ffca3a", "#8ac926", "#1982c4", "#6a4c93"],
+                    },
+                    number: {
+                        value: 0,
+                    },
+                    collisions: {
+                        enable: false,
+                    },
+                    destroy: {
+                        bounds: {
+                            top: 0,
+                        },
+                    },
+                    opacity: {
+                        value: {
+                            min: 0.1,
+                            max: 1,
+                        },
+                        animation: {
+                            enable: true,
+                            speed: 0.7,
+                            sync: false,
+                            startValue: "max",
+                            destroy: "min",
+                        },
+                    },
+                    effect: {
+                        type: "trail",
+                        options: {
+                            trail: {
+                                length: {
+                                    min: 5,
+                                    max: 10,
+                                },
+                            },
+                        },
+                    },
+                    shape: {
+                        type: "circle",
+                    },
+                    size: {
+                        value: 2,
+                        animation: {
+                            enable: false,
+                        },
+                    },
+                    life: {
+                        count: 1,
+                        duration: {
+                            value: {
+                                min: 1,
+                                max: 2,
+                            },
+                        },
+                    },
+                    move: {
+                        enable: true,
+                        gravity: {
+                            enable: true,
+                            acceleration: 9.81,
+                            inverse: false,
+                        },
+                        decay: 0.1,
+                        speed: {
+                            min: 10,
+                            max: 25,
+                        },
+                        direction: "outside",
+                        outModes: "destroy",
+                    },
+                },
+            },
+        },
+        life: {
+            count: 1,
+        },
+        effect: {
+            type: "trail",
+            options: {
+                trail: {
+                    length: {
+                        min: 10,
+                        max: 30,
+                    },
+                    minWidth: 1,
+                    maxWidth: 1,
+                },
+            },
+        },
+        shape: {
+            type: "circle",
+        },
+        size: {
+            value: 1,
+        },
+        move: {
+            enable: true,
+            gravity: {
+                acceleration: 15,
+                enable: true,
+                inverse: true,
+                maxSpeed: 100,
+            },
+            speed: {
+                min: 10,
+                max: 20,
+            },
+            outModes: {
+                default: "destroy",
+                top: "none",
+            },
+        },
+    },
+    sounds: {
+        enable: true,
+        events: [
+            {
+                event: EventType.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",
+                    "https://particles.js.org/audio/explosion2.mp3",
+                ],
+            },
+        ],
+        volume: 50,
+    },
+};
+export default options;

package/browser/f/fontawesome.js

@@ -33,11 +33,6 @@ const options = {
             distance: 150,
             enable: true,
             opacity: 0.4,
-            shadow: {
-                blur: 5,
-                color: "lime",
-                enable: false,
-            },
             width: 1,
         },
         move: {

package/browser/f/forward.js

@@ -27,7 +27,7 @@ const options = {
             type: "image",
             options: {
                 image: {
-                    src: "https://particles.js.org/images/arrow.png",
+                    src: "https://particles.js.org/images/hdr/arrow.png",
                     width: 512,
                     height: 512,
                     replaceColor: true,

package/browser/f/index.js

@@ -1,10 +1,14 @@
+import fallingConfetti from "./fallingConfetti.js";
 import fireworks from "./fireworks.js";
 import fireworks2 from "./fireworks2.js";
+import fireworksMask from "./fireworksMask.js";
 import fontawesome from "./fontawesome.js";
 import forward from "./forward.js";
 export default {
+    fallingConfetti,
     fireworks,
     fireworks2,
+    fireworksMask,
     fontawesome,
     forward,
 };

package/browser/g/gravity.js

@@ -47,11 +47,6 @@ const options = {
                 default: "bounce",
                 top: "none",
             },
-            trail: {
-                enable: true,
-                fill: { color: "#000000" },
-                length: 10,
-            },
         },
     },
     background: {
@@ -112,5 +107,10 @@ const options = {
             },
         },
     },
+    trail: {
+        enable: true,
+        fill: { color: "#000000" },
+        length: 10,
+    },
 };
 export default options;

package/browser/g/index.js

@@ -2,7 +2,7 @@ import gifs from "./gifs.js";
 import grabRandomColor from "./grabRandomColor.js";
 import gradients from "./gradients.js";
 import gravity from "./gravity.js";
-import groups from "./groups";
+import groups from "./groups.js";
 import growing from "./growing.js";
 export default {
     gifs,

package/browser/h/hexagonPath.js

@@ -29,11 +29,6 @@ const options = {
                 },
             },
             speed: 3,
-            trail: {
-                fill: { color: "#000" },
-                length: 20,
-                enable: true,
-            },
         },
         number: {
             density: {
@@ -69,5 +64,10 @@ const options = {
             y: 50,
         },
     },
+    trail: {
+        fill: { color: "#000" },
+        length: 20,
+        enable: true,
+    },
 };
 export default options;

package/browser/h/hollowknight.js

@@ -105,7 +105,7 @@ const options = {
         },
         scale: 2,
         type: "inline",
-        url: "https://particles.js.org/images/hollowknight.svg",
+        url: "https://particles.js.org/images/hdr/hollowknight.svg",
     },
     background: {
         color: "#000000",

package/browser/h/hyperspace.js

@@ -14,11 +14,6 @@ const options = {
                 default: "destroy",
             },
             speed: 3,
-            trail: {
-                fill: { color: "#000" },
-                length: 30,
-                enable: true,
-            },
         },
         number: {
             density: {
@@ -61,5 +56,10 @@ const options = {
             y: 50,
         },
     },
+    trail: {
+        fill: { color: "#000" },
+        length: 30,
+        enable: true,
+    },
 };
 export default options;

package/browser/i/imageMask.js

@@ -52,7 +52,7 @@ const minFilterValue = 30, minFilterAlpha = 0, options = {
                 : pixel.a > minFilterAlpha,
         },
         image: {
-            src: "https://particles.js.org/images/amongus_cyan.png",
+            src: "https://particles.js.org/images/hdr/amongus_cyan.png",
         },
     },
     background: {

package/browser/i/images.js

@@ -117,97 +117,97 @@ const options = {
     },
     preload: [
         {
-            src: "https://particles.js.org/images/fruits/apple.png",
+            src: "https://particles.js.org/images/hdr/fruits/apple.png",
             name: "apple",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/avocado.png",
+            src: "https://particles.js.org/images/hdr/fruits/avocado.png",
             name: "avocado",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/banana.png",
+            src: "https://particles.js.org/images/hdr/fruits/banana.png",
             name: "banana",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/berries.png",
+            src: "https://particles.js.org/images/hdr/fruits/berries.png",
             name: "berries",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/cherry.png",
+            src: "https://particles.js.org/images/hdr/fruits/cherry.png",
             name: "cherry",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/grapes.png",
+            src: "https://particles.js.org/images/hdr/fruits/grapes.png",
             name: "grapes",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/lemon.png",
+            src: "https://particles.js.org/images/hdr/fruits/lemon.png",
             name: "lemon",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/orange.png",
+            src: "https://particles.js.org/images/hdr/fruits/orange.png",
             name: "orange",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/peach.png",
+            src: "https://particles.js.org/images/hdr/fruits/peach.png",
             name: "peach",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/pear.png",
+            src: "https://particles.js.org/images/hdr/fruits/pear.png",
             name: "pear",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/pepper.png",
+            src: "https://particles.js.org/images/hdr/fruits/pepper.png",
             name: "pepper",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/plum.png",
+            src: "https://particles.js.org/images/hdr/fruits/plum.png",
             name: "plum",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/star.png",
+            src: "https://particles.js.org/images/hdr/fruits/star.png",
             name: "star",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/strawberry.png",
+            src: "https://particles.js.org/images/hdr/fruits/strawberry.png",
             name: "strawberry",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/watermelon.png",
+            src: "https://particles.js.org/images/hdr/fruits/watermelon.png",
             name: "watermelon",
             width: 32,
             height: 32,
         },
         {
-            src: "https://particles.js.org/images/fruits/watermelon_slice.png",
+            src: "https://particles.js.org/images/hdr/fruits/watermelon_slice.png",
             name: "watermelon_slice",
             width: 32,
             height: 32,

package/browser/i/imagesDirections.js

@@ -57,7 +57,7 @@ const options = {
             options: {
                 image: [
                     {
-                        src: "https://particles.js.org/images/fruits/apple.png",
+                        src: "https://particles.js.org/images/hdr/fruits/apple.png",
                         width: 32,
                         height: 32,
                         particles: {
@@ -67,7 +67,7 @@ const options = {
                         },
                     },
                     {
-                        src: "https://particles.js.org/images/fruits/avocado.png",
+                        src: "https://particles.js.org/images/hdr/fruits/avocado.png",
                         width: 32,
                         height: 32,
                         particles: {

package/browser/index.js

@@ -54,6 +54,10 @@ const configs = {
     ...z,
 };
 for (const key of Object.keys(configs)) {
-    tsParticles.addConfig(configs[key]);
+    const config = configs[key];
+    if (!config) {
+        continue;
+    }
+    tsParticles.addConfig(config);
 }
 export default configs;

package/browser/m/multiplePolygonMasks.js

@@ -115,7 +115,7 @@ const options = {
         },
         scale: 1,
         type: "inline",
-        url: "https://particles.js.org/images/google.svg",
+        url: "https://particles.js.org/images/hdr/google.svg",
     },
     background: {
         color: "#000000",

package/browser/n/noisePlanesFractal.js

@@ -42,7 +42,7 @@ const options = {
             path: {
                 enable: true,
                 options: {
-                    size: 32,
+                    size: 64,
                     draw: false,
                     increment: 0.004,
                 },
@@ -68,7 +68,7 @@ const options = {
             options: {
                 image: {
                     height: 128,
-                    src: "https://particles.js.org/images/plane_alt.png",
+                    src: "https://particles.js.org/images/hdr/plane_alt.png",
                     width: 128,
                 },
             },

package/browser/n/noisePlanesPerlin.js

@@ -68,7 +68,7 @@ const options = {
             options: {
                 image: {
                     height: 128,
-                    src: "https://particles.js.org/images/plane_alt.png",
+                    src: "https://particles.js.org/images/hdr/plane_alt.png",
                     width: 128,
                 },
             },

package/browser/n/noisePlanesSimplex.js

@@ -68,7 +68,7 @@ const options = {
             options: {
                 image: {
                     height: 128,
-                    src: "https://particles.js.org/images/plane_alt.png",
+                    src: "https://particles.js.org/images/hdr/plane_alt.png",
                     width: 128,
                 },
             },

package/browser/p/pathSvg.js

@@ -24,13 +24,6 @@ const options = {
                 },
                 generator: "svgPathGenerator",
             },
-            trail: {
-                enable: true,
-                length: 10,
-                fill: {
-                    color: "#000000",
-                },
-            },
         },
         number: {
             value: 80,
@@ -48,5 +41,12 @@ const options = {
     background: {
         color: "#000000",
     },
+    trail: {
+        enable: true,
+        length: 10,
+        fill: {
+            color: "#000000",
+        },
+    },
 };
 export default options;

package/browser/p/pathZigZag.js

@@ -17,13 +17,6 @@ const options = {
                 },
                 generator: "zigZagPathGenerator",
             },
-            trail: {
-                enable: true,
-                length: 20,
-                fill: {
-                    color: "#000000",
-                },
-            },
         },
         number: {
             value: 80,
@@ -41,5 +34,12 @@ const options = {
     background: {
         color: "#000000",
     },
+    trail: {
+        enable: true,
+        length: 20,
+        fill: {
+            color: "#000000",
+        },
+    },
 };
 export default options;

package/browser/p/planes.js

@@ -39,7 +39,7 @@ const options = {
             options: {
                 image: {
                     height: 128,
-                    src: "https://particles.js.org/images/plane_alt.png",
+                    src: "https://particles.js.org/images/hdr/plane_alt.png",
                     width: 128,
                 },
             },

package/browser/p/polygonMask.js

@@ -115,7 +115,7 @@ const options = {
         },
         scale: 0.5,
         type: "inline",
-        url: "https://particles.js.org/images/smalldeer.svg",
+        url: "https://particles.js.org/images/hdr/smalldeer.svg",
     },
     background: {
         color: "#000000",