@tsparticles/interaction-external-trail 4.0.0-alpha.8 → 4.0.0-beta.1

package/esm/TrailMaker.js

@@ -1,10 +1,15 @@
+import { AnimatableColor, deepExtend, getRangeMax, getRangeMin, hMax, isInArray, itemFromSingleOrMultiple, lMax, millisecondsToSeconds, rangeColorToHsl, sMax, } from "@tsparticles/engine";
 import { ExternalInteractorBase, } from "@tsparticles/plugin-interactivity";
-import { isInArray, millisecondsToSeconds, } from "@tsparticles/engine";
 import { Trail } from "./Options/Classes/Trail.js";
-const trailMode = "trail";
+const trailMode = "trail", defaultMin = 0, defaultWeight = 0;
 export class TrailMaker extends ExternalInteractorBase {
-    constructor(container) {
+    maxDistance = 0;
+    _delay;
+    _lastPosition;
+    _pluginManager;
+    constructor(pluginManager, container) {
         super(container);
+        this._pluginManager = pluginManager;
         this._delay = 0;
     }
     clear() {
@@ -13,32 +18,56 @@ export class TrailMaker extends ExternalInteractorBase {
     }
     interact(interactivityData, delta) {
         const container = this.container;
-        if (!container.retina.reduceFactor) {
+        if (!container.retina.reduceFactor)
             return;
-        }
         const options = container.actualOptions, trailOptions = options.interactivity?.modes.trail;
-        if (!trailOptions) {
+        if (!trailOptions)
             return;
-        }
         const optDelay = (trailOptions.delay * millisecondsToSeconds) / this.container.retina.reduceFactor;
         if (this._delay < optDelay) {
             this._delay += delta.value;
         }
-        if (this._delay < optDelay) {
+        if (this._delay < optDelay)
             return;
-        }
-        const canEmit = !(trailOptions.pauseOnStop &&
-            (interactivityData.mouse.position === this._lastPosition ||
-                (interactivityData.mouse.position?.x === this._lastPosition?.x &&
-                    interactivityData.mouse.position?.y === this._lastPosition?.y))), mousePos = interactivityData.mouse.position;
+        const mousePos = interactivityData.mouse.position, canEmit = !(trailOptions.pauseOnStop &&
+            (mousePos === this._lastPosition ||
+                (mousePos?.x === this._lastPosition?.x && mousePos?.y === this._lastPosition?.y)));
         if (mousePos) {
             this._lastPosition = { ...mousePos };
         }
         else {
             delete this._lastPosition;
         }
-        if (canEmit) {
-            container.particles.push(trailOptions.quantity, interactivityData.mouse.position, trailOptions.particles);
+        if (canEmit && mousePos) {
+            let particleOptions = trailOptions.particles;
+            const colorCoords = trailOptions.colorCoords;
+            if (colorCoords) {
+                const { width, height } = container.canvas.size, norm = {
+                    x: mousePos.x / width,
+                    y: mousePos.y / height,
+                }, hasWeights = (comp) => {
+                    return !!(comp?.weights?.x ?? comp?.weights?.y);
+                }, calculateValue = (comp, originalValue, defaultMax) => {
+                    if (!hasWeights(comp))
+                        return undefined;
+                    const w = comp?.weights, factor = norm.x * (w?.x ?? defaultWeight) + norm.y * (w?.y ?? defaultWeight), rangeSource = comp?.value ?? originalValue, min = getRangeMin(rangeSource ?? defaultMin), max = getRangeMax(rangeSource ?? defaultMax), result = min + factor * (max - min);
+                    return Math.min(max, Math.max(min, result));
+                }, fillData = trailOptions.particles?.fill ? itemFromSingleOrMultiple(trailOptions.particles.fill) : undefined, baseHsl = fillData
+                    ? rangeColorToHsl(this._pluginManager, AnimatableColor.create(undefined, fillData.color))
+                    : undefined, h = calculateValue(colorCoords.h, baseHsl?.h, hMax), s = calculateValue(colorCoords.s, baseHsl?.s, sMax), l = calculateValue(colorCoords.l, baseHsl?.l, lMax);
+                if (h !== undefined || s !== undefined || l !== undefined) {
+                    particleOptions = deepExtend({}, trailOptions.particles, {
+                        color: {
+                            value: {
+                                h: h ?? baseHsl?.h,
+                                s: s ?? baseHsl?.s,
+                                l: l ?? baseHsl?.l,
+                            },
+                        },
+                    });
+                }
+            }
+            container.particles.push(trailOptions.quantity, mousePos, particleOptions);
         }
         this._delay -= optDelay;
     }

package/esm/index.js

@@ -1,11 +1,11 @@
 export async function loadExternalTrailInteraction(engine) {
-    engine.checkVersion("4.0.0-alpha.8");
-    await engine.register(async (e) => {
-        const { loadInteractivityPlugin } = await import("@tsparticles/plugin-interactivity");
-        await loadInteractivityPlugin(e);
-        e.addInteractor?.("externalTrail", async (container) => {
+    engine.checkVersion("4.0.0-beta.1");
+    await engine.pluginManager.register(async (e) => {
+        const { ensureInteractivityPluginLoaded } = await import("@tsparticles/plugin-interactivity");
+        ensureInteractivityPluginLoaded(e);
+        e.pluginManager.addInteractor?.("externalTrail", async (container) => {
             const { TrailMaker } = await import("./TrailMaker.js");
-            return new TrailMaker(container);
+            return new TrailMaker(e.pluginManager, container);
         });
     });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/interaction-external-trail",
-  "version": "4.0.0-alpha.8",
+  "version": "4.0.0-beta.1",
   "description": "tsParticles trail external interaction",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -87,8 +87,8 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "4.0.0-alpha.8",
-    "@tsparticles/plugin-interactivity": "4.0.0-alpha.8"
+    "@tsparticles/engine": "4.0.0-beta.1",
+    "@tsparticles/plugin-interactivity": "4.0.0-beta.1"
   },
   "publishConfig": {
     "access": "public"