@tsparticles/path-perlin-noise 3.0.0-alpha.1 → 3.0.0-beta.1

package/esm/PerlinNoiseGenerator.js

@@ -1,7 +1,62 @@
 import { Vector, getRandom } from "@tsparticles/engine";
-import { PerlinNoise } from "./PerlinNoise";
+import { PerlinNoise } from "./PerlinNoise.js";
 export class PerlinNoiseGenerator {
     constructor() {
+        this._calculateField = () => {
+            const { field, noiseGen, options } = this;
+            for (let x = 0; x < options.columns; x++) {
+                const column = field[x];
+                for (let y = 0; y < options.rows; y++) {
+                    const cell = column[y];
+                    cell.length = noiseGen.noise(x / 100 + 40000, y / 100 + 40000, this.noiseZ);
+                    cell.angle = noiseGen.noise(x / 50, y / 50, this.noiseZ) * Math.PI * 2;
+                }
+            }
+        };
+        this._drawField = (ctx) => {
+            const { field, options } = this;
+            for (let x = 0; x < options.columns; x++) {
+                const column = field[x];
+                for (let y = 0; y < options.rows; y++) {
+                    const cell = column[y], { angle, length } = cell;
+                    ctx.setTransform(1, 0, 0, 1, x * this.options.size, y * this.options.size);
+                    ctx.rotate(angle);
+                    ctx.strokeStyle = "white";
+                    ctx.beginPath();
+                    ctx.moveTo(0, 0);
+                    ctx.lineTo(0, this.options.size * length);
+                    ctx.stroke();
+                    ctx.setTransform(1, 0, 0, 1, 0, 0);
+                }
+            }
+        };
+        this._initField = () => {
+            const { columns, rows } = this.options;
+            this.field = new Array(columns);
+            for (let x = 0; x < columns; x++) {
+                this.field[x] = new Array(rows);
+                for (let y = 0; y < rows; y++) {
+                    this.field[x][y] = Vector.origin;
+                }
+            }
+        };
+        this._resetField = (container) => {
+            const sourceOptions = container.actualOptions.particles.move.path.options, { options } = this;
+            options.size = sourceOptions.size > 0 ? sourceOptions.size : 20;
+            options.increment = sourceOptions.increment > 0 ? sourceOptions.increment : 0.004;
+            options.draw = !!sourceOptions.draw;
+            options.width = container.canvas.size.width;
+            options.height = container.canvas.size.height;
+            this.noiseGen.seed(sourceOptions.seed ?? getRandom());
+            options.columns = Math.floor(this.options.width / this.options.size) + 1;
+            options.rows = Math.floor(this.options.height / this.options.size) + 1;
+            this._initField();
+        };
+        this._setup = (container) => {
+            this.noiseZ = 0;
+            this._resetField(container);
+            window.addEventListener("resize", () => this._resetField(container));
+        };
         this.noiseGen = new PerlinNoise();
         this.field = [];
         this.noiseZ = 0;
@@ -16,20 +71,15 @@ export class PerlinNoiseGenerator {
         };
     }
     generate(particle) {
-        const pos = particle.getPosition(), point = {
-            x: Math.max(Math.floor(pos.x / this.options.size), 0),
-            y: Math.max(Math.floor(pos.y / this.options.size), 0),
-        }, v = Vector.origin;
-        if (!this.field || !this.field[point.x] || !this.field[point.x][point.y]) {
-            return v;
-        }
-        v.length = this.field[point.x][point.y][1];
-        v.angle = this.field[point.x][point.y][0];
-        return v;
+        const pos = particle.getPosition(), { size } = this.options, point = {
+            x: Math.max(Math.floor(pos.x / size), 0),
+            y: Math.max(Math.floor(pos.y / size), 0),
+        }, { field } = this;
+        return !field || !field[point.x] || !field[point.x][point.y] ? Vector.origin : field[point.x][point.y].copy();
     }
     init(container) {
         this.container = container;
-        this.setup(container);
+        this._setup(container);
     }
     reset() {
     }
@@ -37,63 +87,10 @@ export class PerlinNoiseGenerator {
         if (!this.container) {
             return;
         }
-        this.calculateField();
+        this._calculateField();
         this.noiseZ += this.options.increment;
         if (this.options.draw) {
-            this.container.canvas.draw((ctx) => this.drawField(ctx));
+            this.container.canvas.draw((ctx) => this._drawField(ctx));
         }
     }
-    calculateField() {
-        for (let x = 0; x < this.options.columns; x++) {
-            for (let y = 0; y < this.options.rows; y++) {
-                const angle = this.noiseGen.noise(x / 50, y / 50, this.noiseZ) * Math.PI * 2;
-                const length = this.noiseGen.noise(x / 100 + 40000, y / 100 + 40000, this.noiseZ);
-                this.field[x][y][0] = angle;
-                this.field[x][y][1] = length;
-            }
-        }
-    }
-    drawField(ctx) {
-        for (let x = 0; x < this.options.columns; x++) {
-            for (let y = 0; y < this.options.rows; y++) {
-                const angle = this.field[x][y][0];
-                const length = this.field[x][y][1];
-                ctx.setTransform(1, 0, 0, 1, x * this.options.size, y * this.options.size);
-                ctx.rotate(angle);
-                ctx.strokeStyle = "white";
-                ctx.beginPath();
-                ctx.moveTo(0, 0);
-                ctx.lineTo(0, this.options.size * length);
-                ctx.stroke();
-                ctx.setTransform(1, 0, 0, 1, 0, 0);
-            }
-        }
-    }
-    initField() {
-        this.field = new Array(this.options.columns);
-        for (let x = 0; x < this.options.columns; x++) {
-            this.field[x] = new Array(this.options.rows);
-            for (let y = 0; y < this.options.rows; y++) {
-                this.field[x][y] = [0, 0];
-            }
-        }
-    }
-    resetField(container) {
-        var _a;
-        const sourceOptions = container.actualOptions.particles.move.path.options;
-        this.options.size = sourceOptions.size > 0 ? sourceOptions.size : 20;
-        this.options.increment = sourceOptions.increment > 0 ? sourceOptions.increment : 0.004;
-        this.options.draw = !!sourceOptions.draw;
-        this.options.width = container.canvas.size.width;
-        this.options.height = container.canvas.size.height;
-        this.noiseGen.seed((_a = sourceOptions.seed) !== null && _a !== void 0 ? _a : getRandom());
-        this.options.columns = Math.floor(this.options.width / this.options.size) + 1;
-        this.options.rows = Math.floor(this.options.height / this.options.size) + 1;
-        this.initField();
-    }
-    setup(container) {
-        this.noiseZ = 0;
-        this.resetField(container);
-        window.addEventListener("resize", () => this.resetField(container));
-    }
 }

package/esm/index.js

@@ -1,5 +1,5 @@
-import { PerlinNoiseGenerator } from "./PerlinNoiseGenerator";
+import { PerlinNoiseGenerator } from "./PerlinNoiseGenerator.js";
 export const perlinNoisePathName = "perlinNoise";
-export function loadPerlinNoisePath(engine) {
-    engine.addPathGenerator(perlinNoisePathName, new PerlinNoiseGenerator());
+export async function loadPerlinNoisePath(engine, refresh = true) {
+    await engine.addPathGenerator(perlinNoisePathName, new PerlinNoiseGenerator(), refresh);
 }

package/esm/package.json

@@ -0,0 +1 @@
+{ "type": "module" }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/path-perlin-noise",
-  "version": "3.0.0-alpha.1",
+  "version": "3.0.0-beta.1",
   "description": "tsParticles perlin noise path",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -63,6 +63,9 @@
     "@tsparticles/plugin",
     "@tsparticles/path"
   ],
+  "publishConfig": {
+    "access": "public"
+  },
   "author": "Matteo Bruni <matteo.bruni@me.com>",
   "license": "MIT",
   "bugs": {
@@ -73,20 +76,34 @@
       "type": "github",
       "url": "https://github.com/sponsors/matteobruni"
     },
+    {
+      "type": "github",
+      "url": "https://github.com/sponsors/tsparticles"
+    },
     {
       "type": "buymeacoffee",
       "url": "https://www.buymeacoffee.com/matteobruni"
     }
   ],
-  "main": "cjs/index.js",
+  "sideEffects": false,
   "jsdelivr": "tsparticles.path.perlin.noise.min.js",
   "unpkg": "tsparticles.path.perlin.noise.min.js",
+  "browser": "browser/index.js",
+  "main": "cjs/index.js",
   "module": "esm/index.js",
   "types": "types/index.d.ts",
-  "publishConfig": {
-    "access": "public"
+  "exports": {
+    ".": {
+      "types": "./types/index.d.ts",
+      "browser": "./browser/index.js",
+      "import": "./esm/index.js",
+      "require": "./cjs/index.js",
+      "umd": "./umd/index.js",
+      "default": "./cjs/index.js"
+    },
+    "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "^3.0.0-alpha.1"
+    "@tsparticles/engine": "^3.0.0-beta.1"
   }
-}
+}