@tsparticles/engine 4.0.0-alpha.22 → 4.0.0-alpha.24

package/umd/Core/Utils/QuadTree.js

@@ -16,48 +16,68 @@
     class QuadTree {
         rectangle;
         capacity;
-        _divided;
-        _points;
-        _subs;
+        _points = [];
+        _subs = null;
         constructor(rectangle, capacity) {
             this.rectangle = rectangle;
             this.capacity = capacity;
-            this._points = [];
-            this._divided = false;
-            this._subs = [];
         }
         insert(point) {
             if (!this.rectangle.contains(point.position)) {
                 return false;
             }
-            if (this._points.length < this.capacity) {
-                this._points.push(point);
-                return true;
-            }
-            if (!this._divided) {
+            const subs = this._subs;
+            if (!subs) {
+                if (this._points.length < this.capacity) {
+                    this._points.push(point);
+                    return true;
+                }
                 this._subdivide();
+                const newSubs = this._subs;
+                for (const p of this._points) {
+                    for (let s = 0; s < Constants_js_1.subdivideCount; s++) {
+                        if (newSubs?.[s]?.insert(p)) {
+                            break;
+                        }
+                    }
+                }
+                this._points.length = 0;
+                for (let s = 0; s < Constants_js_1.subdivideCount; s++) {
+                    if (newSubs?.[s]?.insert(point)) {
+                        return true;
+                    }
+                }
+                return false;
             }
-            return this._subs.some(sub => sub.insert(point));
+            for (let s = 0; s < Constants_js_1.subdivideCount; s++) {
+                if (subs[s]?.insert(point)) {
+                    return true;
+                }
+            }
+            return false;
         }
-        query(range, check) {
-            const res = [];
+        query(range, check, out = []) {
             if (!range.intersects(this.rectangle)) {
-                return [];
+                return out;
             }
-            for (const p of this._points) {
-                if (!range.contains(p.position) &&
-                    (0, MathUtils_js_1.getDistance)(range.position, p.position) > p.particle.getRadius() &&
-                    (!check || check(p.particle))) {
+            const points = this._points;
+            for (const p of points) {
+                const particle = p.particle;
+                if (!range.contains(p.position) && (0, MathUtils_js_1.getDistance)(range.position, p.position) > particle.getRadius()) {
+                    continue;
+                }
+                if (check && !check(particle)) {
                     continue;
                 }
-                res.push(p.particle);
+                out.push(particle);
             }
-            if (this._divided) {
-                for (const sub of this._subs) {
-                    res.push(...sub.query(range, check));
+            const subs = this._subs;
+            if (subs) {
+                for (const s of subs) {
+                    s.query(range, check, out);
                 }
             }
-            return res;
+            return out;
         }
         queryCircle(position, radius, check) {
             return this.query(new Ranges_js_1.Circle(position.x, position.y, radius), check);
@@ -65,14 +85,15 @@
         queryRectangle(position, size, check) {
             return this.query(new Ranges_js_1.Rectangle(position.x, position.y, size.width, size.height), check);
         }
-        _subdivide = () => {
-            const { x, y } = this.rectangle.position, { width, height } = this.rectangle.size, { capacity } = this;
-            for (let i = 0; i < Constants_js_1.subdivideCount; i++) {
-                const fixedIndex = i % Constants_js_1.double;
-                this._subs.push(new QuadTree(new Ranges_js_1.Rectangle(x + width * Constants_js_1.half * fixedIndex, y + height * Constants_js_1.half * (Math.round(i * Constants_js_1.half) - fixedIndex), width * Constants_js_1.half, height * Constants_js_1.half), capacity));
-            }
-            this._divided = true;
-        };
+        _subdivide() {
+            const rect = this.rectangle, { x, y } = rect.position, { width, height } = rect.size, halfWidth = width * Constants_js_1.half, halfHeight = height * Constants_js_1.half, capacity = this.capacity;
+            this._subs = [
+                new QuadTree(new Ranges_js_1.Rectangle(x, y, halfWidth, halfHeight), capacity),
+                new QuadTree(new Ranges_js_1.Rectangle(x + halfWidth, y, halfWidth, halfHeight), capacity),
+                new QuadTree(new Ranges_js_1.Rectangle(x, y + halfHeight, halfWidth, halfHeight), capacity),
+                new QuadTree(new Ranges_js_1.Rectangle(x + halfWidth, y + halfHeight, halfWidth, halfHeight), capacity),
+            ];
+        }
     }
     exports.QuadTree = QuadTree;
 });

package/umd/Core/Utils/Ranges.js

@@ -37,7 +37,7 @@
         intersects(range) {
             const pos1 = this.position, pos2 = range.position, distPos = { x: Math.abs(pos2.x - pos1.x), y: Math.abs(pos2.y - pos1.y) }, r = this.radius;
             if (range instanceof Circle || range.type === RangeType_js_1.RangeType.circle) {
-                const circleRange = range, rSum = r + circleRange.radius, dist = Math.sqrt(distPos.x ** Constants_js_1.squareExp + distPos.y ** Constants_js_1.squareExp);
+                const circleRange = range, rSum = r + circleRange.radius, dist = Math.hypot(distPos.x, distPos.y);
                 return rSum > dist;
             }
             else if (range instanceof Rectangle || range.type === RangeType_js_1.RangeType.rectangle) {

package/umd/Utils/CanvasUtils.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "../Core/Utils/Constants.js", "../Enums/Types/AlterType.js"], factory);
+        define(["require", "exports", "../Core/Utils/Constants.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -19,9 +19,7 @@
     exports.drawShapeAfterDraw = drawShapeAfterDraw;
     exports.drawShapeBeforeDraw = drawShapeBeforeDraw;
     exports.drawParticlePlugin = drawParticlePlugin;
-    exports.alterHsl = alterHsl;
     const Constants_js_1 = require("../Core/Utils/Constants.js");
-    const AlterType_js_1 = require("../Enums/Types/AlterType.js");
     function paintBase(context, dimension, baseColor) {
         context.fillStyle = baseColor ?? "rgba(0,0,0,0)";
         context.fillRect(Constants_js_1.originPoint.x, Constants_js_1.originPoint.y, dimension.width, dimension.height);
@@ -38,7 +36,10 @@
         context.clearRect(Constants_js_1.originPoint.x, Constants_js_1.originPoint.y, dimension.width, dimension.height);
     }
     function drawParticle(data) {
-        const { container, context, particle, delta, colorStyles, radius, opacity, transform } = data, pos = particle.getPosition(), transformData = particle.getTransformData(transform);
+        const { container, context, particle, delta, colorStyles, radius, opacity, transform } = data, pos = particle.getPosition(), transformData = particle.getTransformData(transform), drawScale = Constants_js_1.defaultZoom, drawPosition = {
+            x: pos.x,
+            y: pos.y,
+        };
         context.setTransform(transformData.a, transformData.b, transformData.c, transformData.d, pos.x, pos.y);
         if (colorStyles.fill) {
             context.fillStyle = colorStyles.fill;
@@ -52,13 +53,20 @@
             context,
             particle,
             radius,
+            drawRadius: radius * drawScale,
             opacity,
             delta,
             pixelRatio: container.retina.pixelRatio,
             fill: particle.shapeFill,
             stroke: strokeWidth > Constants_js_1.minStrokeWidth || !particle.shapeFill,
             transformData,
+            position: { ...pos },
+            drawPosition,
+            drawScale,
         };
+        for (const plugin of container.plugins) {
+            plugin.drawParticleTransform?.(drawData);
+        }
         drawBeforeEffect(container, drawData);
         drawShapeBeforeDraw(container, drawData);
         drawShape(container, drawData);
@@ -137,11 +145,4 @@
         }
         plugin.drawParticle(context, particle, delta);
     }
-    function alterHsl(color, type, value) {
-        return {
-            h: color.h,
-            s: color.s,
-            l: color.l + (type === AlterType_js_1.AlterType.darken ? -Constants_js_1.lFactor : Constants_js_1.lFactor) * value,
-        };
-    }
 });

package/umd/Utils/ColorUtils.js

@@ -4,7 +4,7 @@
         if (v !== undefined) module.exports = v;
     }
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./MathUtils.js", "../Core/Utils/Constants.js", "./TypeUtils.js", "../Enums/AnimationStatus.js", "./Utils.js"], factory);
+        define(["require", "exports", "./MathUtils.js", "../Core/Utils/Constants.js", "./TypeUtils.js", "../Enums/Types/AlterType.js", "../Enums/AnimationStatus.js", "./Utils.js"], factory);
     }
 })(function (require, exports) {
     "use strict";
@@ -28,9 +28,11 @@
     exports.getHslAnimationFromHsl = getHslAnimationFromHsl;
     exports.updateColorValue = updateColorValue;
     exports.updateColor = updateColor;
+    exports.alterHsl = alterHsl;
     const MathUtils_js_1 = require("./MathUtils.js");
     const Constants_js_1 = require("../Core/Utils/Constants.js");
     const TypeUtils_js_1 = require("./TypeUtils.js");
+    const AlterType_js_1 = require("../Enums/Types/AlterType.js");
     const AnimationStatus_js_1 = require("../Enums/AnimationStatus.js");
     const Utils_js_1 = require("./Utils.js");
     const styleCache = new Map(), maxCacheSize = 1000, firstIndex = 0, rgbFixedPrecision = 2, hslFixedPrecision = 2;
@@ -380,4 +382,11 @@
         updateColorValue(s, ranges.s, true, delta);
         updateColorValue(l, ranges.l, true, delta);
     }
+    function alterHsl(color, type, value) {
+        return {
+            h: color.h,
+            s: color.s,
+            l: color.l + (type === AlterType_js_1.AlterType.darken ? -Constants_js_1.lFactor : Constants_js_1.lFactor) * value,
+        };
+    }
 });

package/umd/Utils/MathUtils.js

@@ -57,10 +57,8 @@
         return getRandom() * (max - min) + min;
     }
     function setAnimationFunctions(nextFrame, cancel) {
-        _animationLoop.nextFrame = (callback) => nextFrame(callback);
-        _animationLoop.cancel = (handle) => {
-            cancel(handle);
-        };
+        _animationLoop.nextFrame = nextFrame;
+        _animationLoop.cancel = cancel;
     }
     function animate(fn) {
         return _animationLoop.nextFrame(fn);
@@ -104,8 +102,8 @@
             : setRangeValue(min, max);
     }
     function getDistances(pointA, pointB) {
-        const dx = pointA.x - pointB.x, dy = pointA.y - pointB.y, squareExp = 2;
-        return { dx: dx, dy: dy, distance: Math.sqrt(dx ** squareExp + dy ** squareExp) };
+        const dx = pointA.x - pointB.x, dy = pointA.y - pointB.y;
+        return { dx: dx, dy: dy, distance: Math.hypot(dx, dy) };
     }
     function getDistance(pointA, pointB) {
         return getDistances(pointA, pointB).distance;