@tsparticles/engine 3.0.0-alpha.0

package/esm/engine.js

@@ -0,0 +1,175 @@
+import { Container } from "./Core/Container";
+import { EventDispatcher } from "./Utils/EventDispatcher";
+import { Plugins } from "./Core/Utils/Plugins";
+import { generatedAttribute } from "./Core/Utils/Constants";
+import { getRandom } from "./Utils/NumberUtils";
+import { itemFromSingleOrMultiple } from "./Utils/Utils";
+async function getDataFromUrl(data) {
+    const url = itemFromSingleOrMultiple(data.url, data.index);
+    if (!url) {
+        return data.fallback;
+    }
+    const response = await fetch(url);
+    if (response.ok) {
+        return response.json();
+    }
+    console.error(`tsParticles - Error ${response.status} while retrieving config file`);
+    return data.fallback;
+}
+export class Engine {
+    constructor() {
+        this._configs = new Map();
+        this._domArray = [];
+        this._eventDispatcher = new EventDispatcher();
+        this.plugins = new Plugins(this);
+    }
+    get configs() {
+        const res = {};
+        for (const [name, config] of this._configs) {
+            res[name] = config;
+        }
+        return res;
+    }
+    addConfig(nameOrConfig, config) {
+        var _a;
+        if (typeof nameOrConfig === "string") {
+            if (config) {
+                config.name = nameOrConfig;
+                this._configs.set(nameOrConfig, config);
+            }
+        }
+        else {
+            this._configs.set((_a = nameOrConfig.name) !== null && _a !== void 0 ? _a : "default", nameOrConfig);
+        }
+    }
+    addEventListener(type, listener) {
+        this._eventDispatcher.addEventListener(type, listener);
+    }
+    async addInteractor(name, interactorInitializer) {
+        this.plugins.addInteractor(name, interactorInitializer);
+        await this.refresh();
+    }
+    async addMover(name, moverInitializer) {
+        this.plugins.addParticleMover(name, moverInitializer);
+        await this.refresh();
+    }
+    async addParticleUpdater(name, updaterInitializer) {
+        this.plugins.addParticleUpdater(name, updaterInitializer);
+        await this.refresh();
+    }
+    async addPathGenerator(name, generator) {
+        this.plugins.addPathGenerator(name, generator);
+        await this.refresh();
+    }
+    async addPlugin(plugin) {
+        this.plugins.addPlugin(plugin);
+        await this.refresh();
+    }
+    async addPreset(preset, options, override = false) {
+        this.plugins.addPreset(preset, options, override);
+        await this.refresh();
+    }
+    async addShape(shape, drawer, init, afterEffect, destroy) {
+        let customDrawer;
+        if (typeof drawer === "function") {
+            customDrawer = {
+                afterEffect: afterEffect,
+                destroy: destroy,
+                draw: drawer,
+                init: init,
+            };
+        }
+        else {
+            customDrawer = drawer;
+        }
+        this.plugins.addShapeDrawer(shape, customDrawer);
+        await this.refresh();
+    }
+    dispatchEvent(type, args) {
+        this._eventDispatcher.dispatchEvent(type, args);
+    }
+    dom() {
+        return this._domArray;
+    }
+    domItem(index) {
+        const dom = this.dom(), item = dom[index];
+        if (item && !item.destroyed) {
+            return item;
+        }
+        dom.splice(index, 1);
+    }
+    async load(params) {
+        var _a, _b, _c;
+        const id = (_a = params.id) !== null && _a !== void 0 ? _a : `tsparticles${Math.floor(getRandom() * 10000)}`, { index, url } = params, options = url
+            ? await getDataFromUrl({
+                fallback: params.options,
+                index,
+                url: url,
+            })
+            : params.options;
+        let domContainer = (_b = params.element) !== null && _b !== void 0 ? _b : document.getElementById(id);
+        if (!domContainer) {
+            domContainer = document.createElement("div");
+            domContainer.id = id;
+            (_c = document.querySelector("body")) === null || _c === void 0 ? void 0 : _c.append(domContainer);
+        }
+        const currentOptions = itemFromSingleOrMultiple(options, index), dom = this.dom(), oldIndex = dom.findIndex((v) => v.id === id);
+        if (oldIndex >= 0) {
+            const old = this.domItem(oldIndex);
+            if (old && !old.destroyed) {
+                old.destroy();
+                dom.splice(oldIndex, 1);
+            }
+        }
+        let canvasEl;
+        if (domContainer.tagName.toLowerCase() === "canvas") {
+            canvasEl = domContainer;
+            canvasEl.dataset[generatedAttribute] = "false";
+        }
+        else {
+            const existingCanvases = domContainer.getElementsByTagName("canvas");
+            if (existingCanvases.length) {
+                canvasEl = existingCanvases[0];
+                canvasEl.dataset[generatedAttribute] = "false";
+            }
+            else {
+                canvasEl = document.createElement("canvas");
+                canvasEl.dataset[generatedAttribute] = "true";
+                domContainer.appendChild(canvasEl);
+            }
+        }
+        if (!canvasEl.style.width) {
+            canvasEl.style.width = "100%";
+        }
+        if (!canvasEl.style.height) {
+            canvasEl.style.height = "100%";
+        }
+        const newItem = new Container(this, id, currentOptions);
+        if (oldIndex >= 0) {
+            dom.splice(oldIndex, 0, newItem);
+        }
+        else {
+            dom.push(newItem);
+        }
+        newItem.canvas.loadCanvas(canvasEl);
+        await newItem.start();
+        return newItem;
+    }
+    async refresh() {
+        for (const instance of this.dom()) {
+            await instance.refresh();
+        }
+    }
+    removeEventListener(type, listener) {
+        this._eventDispatcher.removeEventListener(type, listener);
+    }
+    setOnClickHandler(callback) {
+        const dom = this.dom();
+        if (!dom.length) {
+            throw new Error("Can only set click handlers after calling tsParticles.load()");
+        }
+        for (const domItem of dom) {
+            domItem.addClickHandler(callback);
+        }
+    }
+}

package/esm/index.js

@@ -0,0 +1,199 @@
+import { Engine } from "./engine";
+import { HslColorManager } from "./Utils/HslColorManager";
+import { RgbColorManager } from "./Utils/RgbColorManager";
+import { addColorManager } from "./Utils/ColorUtils";
+const rgbColorManager = new RgbColorManager(), hslColorManager = new HslColorManager();
+addColorManager(rgbColorManager);
+addColorManager(hslColorManager);
+const tsParticles = new Engine();
+export * from "./Core/Interfaces/Colors";
+export * from "./Core/Interfaces/IBounds";
+export * from "./Core/Interfaces/IBubbleParticleData";
+export * from "./Core/Interfaces/ICircleBouncer";
+export * from "./Core/Interfaces/IColorManager";
+export * from "./Core/Interfaces/IContainerInteractivity";
+export * from "./Core/Interfaces/IContainerPlugin";
+export * from "./Core/Interfaces/ICoordinates";
+export * from "./Core/Interfaces/IDelta";
+export * from "./Core/Interfaces/IDimension";
+export * from "./Core/Interfaces/IDistance";
+export * from "./Core/Interfaces/IDrawParticleParams";
+export * from "./Core/Interfaces/IExternalInteractor";
+export * from "./Core/Interfaces/IInteractor";
+export * from "./Core/Interfaces/IMouseData";
+export * from "./Core/Interfaces/IMovePathGenerator";
+export * from "./Core/Interfaces/IParticle";
+export * from "./Core/Interfaces/IParticleColorStyle";
+export * from "./Core/Interfaces/IParticleHslAnimation";
+export * from "./Core/Interfaces/IParticlesInteractor";
+export * from "./Core/Interfaces/IParticleLife";
+export * from "./Core/Interfaces/IParticleOverride";
+export * from "./Core/Interfaces/IParticleRetinaProps";
+export * from "./Core/Interfaces/IParticleRoll";
+export * from "./Core/Interfaces/IParticleTransformValues";
+export * from "./Core/Interfaces/IParticleUpdater";
+export * from "./Core/Interfaces/IParticleValueAnimation";
+export * from "./Core/Interfaces/IParticlesMover";
+export * from "./Core/Interfaces/IPlugin";
+export * from "./Core/Interfaces/IRangeValue";
+export * from "./Core/Interfaces/IRectSideResult";
+export * from "./Core/Interfaces/IShapeDrawer";
+export * from "./Core/Interfaces/IShapeValues";
+export * from "./Core/Interfaces/ISlowParticleData";
+export * from "./Core/Interfaces/ITrailFillData";
+export * from "./Core/Utils/Circle";
+export * from "./Core/Utils/Constants";
+export * from "./Core/Utils/ExternalInteractorBase";
+export * from "./Core/Utils/ParticlesInteractorBase";
+export * from "./Core/Utils/Point";
+export * from "./Core/Utils/Range";
+export * from "./Core/Utils/Rectangle";
+export * from "./Core/Utils/Vector";
+export * from "./Core/Utils/Vector3d";
+export * from "./Enums/Directions/MoveDirection";
+export * from "./Enums/Directions/RotateDirection";
+export * from "./Enums/Directions/OutModeDirection";
+export * from "./Enums/Modes/ClickMode";
+export * from "./Enums/Modes/DivMode";
+export * from "./Enums/Modes/HoverMode";
+export * from "./Enums/Modes/CollisionMode";
+export * from "./Enums/Modes/OutMode";
+export * from "./Enums/Modes/SizeMode";
+export * from "./Enums/Modes/ThemeMode";
+export * from "./Enums/Modes/ResponsiveMode";
+export * from "./Enums/Types/AlterType";
+export * from "./Enums/Types/DestroyType";
+export * from "./Enums/Types/GradientType";
+export * from "./Enums/Types/InteractorType";
+export * from "./Enums/Types/ParticleOutType";
+export * from "./Enums/Types/StartValueType";
+export * from "./Enums/Types/DivType";
+export * from "./Enums/Types/EasingType";
+export * from "./Enums/Types/EventType";
+export * from "./Enums/AnimationStatus";
+export * from "./Enums/InteractivityDetect";
+export * from "./Options/Classes/AnimatableColor";
+export * from "./Options/Classes/AnimationOptions";
+export * from "./Options/Classes/Background/Background";
+export * from "./Options/Classes/BackgroundMask/BackgroundMask";
+export * from "./Options/Classes/BackgroundMask/BackgroundMaskCover";
+export * from "./Options/Classes/ColorAnimation";
+export * from "./Options/Classes/FullScreen/FullScreen";
+export * from "./Options/Classes/HslAnimation";
+export * from "./Options/Classes/Interactivity/Events/ClickEvent";
+export * from "./Options/Classes/Interactivity/Events/DivEvent";
+export * from "./Options/Classes/Interactivity/Events/ClickEvent";
+export * from "./Options/Classes/Interactivity/Events/DivEvent";
+export * from "./Options/Classes/Interactivity/Events/Events";
+export * from "./Options/Classes/Interactivity/Events/HoverEvent";
+export * from "./Options/Classes/Interactivity/Events/Parallax";
+export * from "./Options/Classes/Interactivity/Interactivity";
+export * from "./Options/Classes/Interactivity/Modes/Modes";
+export * from "./Options/Classes/Interactivity/Events/ResizeEvent";
+export * from "./Options/Classes/ManualParticle";
+export * from "./Options/Classes/Options";
+export * from "./Options/Classes/OptionsColor";
+export * from "./Options/Classes/Particles/Bounce/ParticlesBounce";
+export * from "./Options/Classes/Particles/Bounce/ParticlesBounceFactor";
+export * from "./Options/Classes/Particles/Collisions/Collisions";
+export * from "./Options/Classes/Particles/Collisions/CollisionsAbsorb";
+export * from "./Options/Classes/Particles/Collisions/CollisionsOverlap";
+export * from "./Options/Classes/Particles/ParticlesOptions";
+export * from "./Options/Classes/Particles/Shadow";
+export * from "./Options/Classes/Particles/Stroke";
+export * from "./Options/Classes/Particles/Move/MoveAttract";
+export * from "./Options/Classes/Particles/Move/Move";
+export * from "./Options/Classes/Particles/Move/MoveAngle";
+export * from "./Options/Classes/Particles/Move/MoveCenter";
+export * from "./Options/Classes/Particles/Move/MoveGravity";
+export * from "./Options/Classes/Particles/Move/MoveTrail";
+export * from "./Options/Classes/Particles/Move/MoveTrailFill";
+export * from "./Options/Classes/Particles/Move/OutModes";
+export * from "./Options/Classes/Particles/Move/Path/MovePath";
+export * from "./Options/Classes/Particles/Move/Spin";
+export * from "./Options/Classes/Particles/Number/ParticlesNumber";
+export * from "./Options/Classes/Particles/Number/ParticlesDensity";
+export * from "./Options/Classes/Particles/Opacity/Opacity";
+export * from "./Options/Classes/Particles/Opacity/OpacityAnimation";
+export * from "./Options/Classes/Particles/Shape/Shape";
+export * from "./Options/Classes/Particles/Size/Size";
+export * from "./Options/Classes/Particles/Size/SizeAnimation";
+export * from "./Options/Classes/Particles/ZIndex/ZIndex";
+export * from "./Options/Classes/Responsive";
+export * from "./Options/Classes/Theme/Theme";
+export * from "./Options/Classes/Theme/ThemeDefault";
+export * from "./Options/Classes/ValueWithRandom";
+export * from "./Options/Interfaces/Background/IBackground";
+export * from "./Options/Interfaces/BackgroundMask/IBackgroundMask";
+export * from "./Options/Interfaces/BackgroundMask/IBackgroundMaskCover";
+export * from "./Options/Interfaces/FullScreen/IFullScreen";
+export * from "./Options/Interfaces/IAnimatable";
+export * from "./Options/Interfaces/IAnimatableColor";
+export * from "./Options/Interfaces/IAnimation";
+export * from "./Options/Interfaces/IColorAnimation";
+export * from "./Options/Interfaces/IHslAnimation";
+export * from "./Options/Interfaces/IManualParticle";
+export * from "./Options/Interfaces/IOptionLoader";
+export * from "./Options/Interfaces/IOptions";
+export * from "./Options/Interfaces/IOptionsColor";
+export * from "./Options/Interfaces/IResponsive";
+export * from "./Options/Interfaces/IValueWithRandom";
+export * from "./Options/Interfaces/Interactivity/Events/IClickEvent";
+export * from "./Options/Interfaces/Interactivity/Events/IDivEvent";
+export * from "./Options/Interfaces/Interactivity/Events/IEvents";
+export * from "./Options/Interfaces/Interactivity/Events/IHoverEvent";
+export * from "./Options/Interfaces/Interactivity/Events/IParallax";
+export * from "./Options/Interfaces/Interactivity/Events/IResizeEvent";
+export * from "./Options/Interfaces/Interactivity/Modes/IModeDiv";
+export * from "./Options/Interfaces/Interactivity/Modes/IModes";
+export * from "./Options/Interfaces/Interactivity/IInteractivity";
+export * from "./Options/Interfaces/Particles/Bounce/IParticlesBounce";
+export * from "./Options/Interfaces/Particles/Collisions/ICollisions";
+export * from "./Options/Interfaces/Particles/Collisions/ICollisionsAbsorb";
+export * from "./Options/Interfaces/Particles/Collisions/ICollisionsOverlap";
+export * from "./Options/Interfaces/Particles/IParticlesOptions";
+export * from "./Options/Interfaces/Particles/IShadow";
+export * from "./Options/Interfaces/Particles/IStroke";
+export * from "./Options/Interfaces/Particles/Move/IMoveAttract";
+export * from "./Options/Interfaces/Particles/Move/IMove";
+export * from "./Options/Interfaces/Particles/Move/IMoveAngle";
+export * from "./Options/Interfaces/Particles/Move/IMoveCenter";
+export * from "./Options/Interfaces/Particles/Move/IMoveGravity";
+export * from "./Options/Interfaces/Particles/Move/IMoveTrail";
+export * from "./Options/Interfaces/Particles/Move/IMoveTrailFill";
+export * from "./Options/Interfaces/Particles/Move/Path/IMovePath";
+export * from "./Options/Interfaces/Particles/Move/IOutModes";
+export * from "./Options/Interfaces/Particles/Move/ISpin";
+export * from "./Options/Interfaces/Particles/Number/IParticlesDensity";
+export * from "./Options/Interfaces/Particles/Number/IParticlesNumber";
+export * from "./Options/Interfaces/Particles/Opacity/IOpacity";
+export * from "./Options/Interfaces/Particles/Opacity/IOpacityAnimation";
+export * from "./Options/Interfaces/Particles/Shape/ICharacterShape";
+export * from "./Options/Interfaces/Particles/Shape/IImageShape";
+export * from "./Options/Interfaces/Particles/Shape/IPolygonShape";
+export * from "./Options/Interfaces/Particles/Shape/IShape";
+export * from "./Options/Interfaces/Particles/Shape/IShapeValues";
+export * from "./Options/Interfaces/Particles/Shape/IStarShape";
+export * from "./Options/Interfaces/Particles/Size/ISize";
+export * from "./Options/Interfaces/Particles/Size/ISizeAnimation";
+export * from "./Options/Interfaces/Particles/ZIndex/IZIndex";
+export * from "./Options/Interfaces/Theme/ITheme";
+export * from "./Options/Interfaces/Theme/IThemeDefault";
+export * from "./Types/CustomEventArgs";
+export * from "./Types/CustomEventListener";
+export * from "./Types/ISourceOptions";
+export * from "./Types/ParticlesGroups";
+export * from "./Types/PathOptions";
+export * from "./Types/RangeValue";
+export * from "./Types/RecursivePartial";
+export * from "./Types/ShapeData";
+export * from "./Types/ShapeDrawerFunctions";
+export * from "./Types/SingleOrMultiple";
+export * from "./Utils/CanvasUtils";
+export * from "./Utils/ColorUtils";
+export * from "./Utils/HslColorManager";
+export * from "./Utils/NumberUtils";
+export * from "./Utils/OptionsUtils";
+export * from "./Utils/RgbColorManager";
+export * from "./Utils/Utils";
+export { tsParticles };

package/package.json

@@ -0,0 +1,90 @@
+{
+  "name": "@tsparticles/engine",
+  "version": "3.0.0-alpha.0",
+  "description": "Easily create highly customizable particle, confetti and fireworks 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": {
+    "install": "node ./scripts/install.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/matteobruni/tsparticles.git",
+    "directory": "engine"
+  },
+  "keywords": [
+    "front-end",
+    "frontend",
+    "tsparticles",
+    "particles.js",
+    "particlesjs",
+    "particles",
+    "particle",
+    "canvas",
+    "jsparticles",
+    "xparticles",
+    "particles-js",
+    "particles-bg",
+    "particles-bg-vue",
+    "particles-ts",
+    "particles.ts",
+    "react-particles-js",
+    "react-particles.js",
+    "react-particles",
+    "react",
+    "reactjs",
+    "vue-particles",
+    "ngx-particles",
+    "angular-particles",
+    "particleground",
+    "vue",
+    "vuejs",
+    "preact",
+    "preactjs",
+    "jquery",
+    "angularjs",
+    "angular",
+    "typescript",
+    "javascript",
+    "animation",
+    "web",
+    "html5",
+    "web-design",
+    "webdesign",
+    "css",
+    "html",
+    "css3",
+    "animated",
+    "background",
+    "confetti",
+    "canvas",
+    "fireworks",
+    "fireworks-js",
+    "confetti-js",
+    "confettijs",
+    "fireworksjs",
+    "canvas-confetti"
+  ],
+  "author": "Matteo Bruni <matteo.bruni@me.com>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/matteobruni/tsparticles/issues"
+  },
+  "funding": [
+    {
+      "type": "github",
+      "url": "https://github.com/sponsors/matteobruni"
+    },
+    {
+      "type": "buymeacoffee",
+      "url": "https://www.buymeacoffee.com/matteobruni"
+    }
+  ],
+  "main": "cjs/index.js",
+  "module": "esm/index.js",
+  "jsdelivr": "tsparticles.engine.min.js",
+  "unpkg": "tsparticles.engine.min.js",
+  "types": "types/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  }
+}