@tsparticles/plugin-canvas-mask 3.0.3 → 3.2.0

package/dist_browser_CanvasMaskPlugin_js.js

@@ -0,0 +1,100 @@
+/*!
+ * Author : Matteo Bruni
+ * MIT license: https://opensource.org/licenses/MIT
+ * Demo / Generator : https://particles.js.org/
+ * GitHub : https://www.github.com/matteobruni/tsparticles
+ * How to use? : Check the GitHub README
+ * v3.2.0
+ */
+"use strict";
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
+(this["webpackChunk_tsparticles_plugin_canvas_mask"] = this["webpackChunk_tsparticles_plugin_canvas_mask"] || []).push([["dist_browser_CanvasMaskPlugin_js"],{
+
+/***/ "./dist/browser/CanvasMaskPlugin.js":
+/*!******************************************!*\
+  !*** ./dist/browser/CanvasMaskPlugin.js ***!
+  \******************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskPlugin: () => (/* binding */ CanvasMaskPlugin)\n/* harmony export */ });\n/* harmony import */ var _Options_Classes_CanvasMask_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Options/Classes/CanvasMask.js */ \"./dist/browser/Options/Classes/CanvasMask.js\");\n\nclass CanvasMaskPlugin {\n  constructor() {\n    this.id = \"canvasMask\";\n  }\n  async getPlugin(container) {\n    const {\n      CanvasMaskInstance\n    } = await __webpack_require__.e(/*! import() */ \"dist_browser_CanvasMaskInstance_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./CanvasMaskInstance.js */ \"./dist/browser/CanvasMaskInstance.js\"));\n    return new CanvasMaskInstance(container);\n  }\n  loadOptions(options, source) {\n    if (!this.needsPlugin(options) && !this.needsPlugin(source)) {\n      return;\n    }\n    let canvasMaskOptions = options.canvasMask;\n    if (canvasMaskOptions?.load === undefined) {\n      options.canvasMask = canvasMaskOptions = new _Options_Classes_CanvasMask_js__WEBPACK_IMPORTED_MODULE_0__.CanvasMask();\n    }\n    canvasMaskOptions.load(source?.canvasMask);\n  }\n  needsPlugin(options) {\n    return options?.canvasMask?.enable ?? false;\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/CanvasMaskPlugin.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/CanvasMask.js":
+/*!****************************************************!*\
+  !*** ./dist/browser/Options/Classes/CanvasMask.js ***!
+  \****************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMask: () => (/* binding */ CanvasMask)\n/* harmony export */ });\n/* harmony import */ var _CanvasMaskOverride_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./CanvasMaskOverride.js */ \"./dist/browser/Options/Classes/CanvasMaskOverride.js\");\n/* harmony import */ var _CanvasMaskPixels_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CanvasMaskPixels.js */ \"./dist/browser/Options/Classes/CanvasMaskPixels.js\");\n/* harmony import */ var _ImageMask_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ImageMask.js */ \"./dist/browser/Options/Classes/ImageMask.js\");\n/* harmony import */ var _TextMask_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./TextMask.js */ \"./dist/browser/Options/Classes/TextMask.js\");\n\n\n\n\nclass CanvasMask {\n  constructor() {\n    this.enable = false;\n    this.override = new _CanvasMaskOverride_js__WEBPACK_IMPORTED_MODULE_0__.CanvasMaskOverride();\n    this.pixels = new _CanvasMaskPixels_js__WEBPACK_IMPORTED_MODULE_1__.CanvasMaskPixels();\n    this.position = {\n      x: 50,\n      y: 50\n    };\n    this.scale = 1;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.element !== undefined && data.element instanceof HTMLCanvasElement) {\n      this.element = data.element;\n    }\n    if (data.enable !== undefined) {\n      this.enable = data.enable;\n    }\n    if (data.image) {\n      if (!this.image) {\n        this.image = new _ImageMask_js__WEBPACK_IMPORTED_MODULE_2__.ImageMask();\n      }\n      this.image.load(data.image);\n    }\n    this.pixels.load(data.pixels);\n    if (data.position) {\n      this.position = {\n        x: data.position.x ?? this.position.x,\n        y: data.position.y ?? this.position.y\n      };\n    }\n    this.override.load(data.override);\n    if (data.scale !== undefined) {\n      this.scale = data.scale;\n    }\n    if (data.selector !== undefined) {\n      this.selector = data.selector;\n    }\n    if (data.text) {\n      if (!this.text) {\n        this.text = new _TextMask_js__WEBPACK_IMPORTED_MODULE_3__.TextMask();\n      }\n      this.text.load(data.text);\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/CanvasMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/CanvasMaskOverride.js":
+/*!************************************************************!*\
+  !*** ./dist/browser/Options/Classes/CanvasMaskOverride.js ***!
+  \************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskOverride: () => (/* binding */ CanvasMaskOverride)\n/* harmony export */ });\nclass CanvasMaskOverride {\n  constructor() {\n    this.color = true;\n    this.opacity = false;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.color !== undefined) {\n      this.color = data.color;\n    }\n    if (data.opacity !== undefined) {\n      this.opacity = data.opacity;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/CanvasMaskOverride.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/CanvasMaskPixels.js":
+/*!**********************************************************!*\
+  !*** ./dist/browser/Options/Classes/CanvasMaskPixels.js ***!
+  \**********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CanvasMaskPixels: () => (/* binding */ CanvasMaskPixels)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n\nconst minAlpha = 0;\nclass CanvasMaskPixels {\n  constructor() {\n    this.filter = pixel => pixel.a > minAlpha;\n    this.offset = 4;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.filter !== undefined) {\n      if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isString)(data.filter)) {\n        if (Object.hasOwn(window, data.filter)) {\n          const filter = window[data.filter];\n          if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.isFunction)(filter)) {\n            this.filter = filter;\n          }\n        }\n      } else {\n        this.filter = data.filter;\n      }\n    }\n    if (data.offset !== undefined) {\n      this.offset = data.offset;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/CanvasMaskPixels.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/FontTextMask.js":
+/*!******************************************************!*\
+  !*** ./dist/browser/Options/Classes/FontTextMask.js ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   FontTextMask: () => (/* binding */ FontTextMask)\n/* harmony export */ });\nclass FontTextMask {\n  constructor() {\n    this.family = \"sans-serif\";\n    this.size = 100;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.family !== undefined) {\n      this.family = data.family;\n    }\n    if (data.size !== undefined) {\n      this.size = data.size;\n    }\n    if (data.style !== undefined) {\n      this.style = data.style;\n    }\n    if (data.variant !== undefined) {\n      this.variant = data.variant;\n    }\n    if (data.weight !== undefined) {\n      this.weight = data.weight;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/FontTextMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/ImageMask.js":
+/*!***************************************************!*\
+  !*** ./dist/browser/Options/Classes/ImageMask.js ***!
+  \***************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ImageMask: () => (/* binding */ ImageMask)\n/* harmony export */ });\nclass ImageMask {\n  constructor() {\n    this.src = \"\";\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.src !== undefined) {\n      this.src = data.src;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/ImageMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/TextMask.js":
+/*!**************************************************!*\
+  !*** ./dist/browser/Options/Classes/TextMask.js ***!
+  \**************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TextMask: () => (/* binding */ TextMask)\n/* harmony export */ });\n/* harmony import */ var _FontTextMask_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./FontTextMask.js */ \"./dist/browser/Options/Classes/FontTextMask.js\");\n/* harmony import */ var _TextMaskLine_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./TextMaskLine.js */ \"./dist/browser/Options/Classes/TextMaskLine.js\");\n\n\nclass TextMask {\n  constructor() {\n    this.color = \"#000000\";\n    this.font = new _FontTextMask_js__WEBPACK_IMPORTED_MODULE_0__.FontTextMask();\n    this.lines = new _TextMaskLine_js__WEBPACK_IMPORTED_MODULE_1__.TextMaskLine();\n    this.text = \"\";\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.color !== undefined) {\n      this.color = data.color;\n    }\n    this.font.load(data.font);\n    this.lines.load(data.lines);\n    if (data.text !== undefined) {\n      this.text = data.text;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/TextMask.js?");
+
+/***/ }),
+
+/***/ "./dist/browser/Options/Classes/TextMaskLine.js":
+/*!******************************************************!*\
+  !*** ./dist/browser/Options/Classes/TextMaskLine.js ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TextMaskLine: () => (/* binding */ TextMaskLine)\n/* harmony export */ });\nclass TextMaskLine {\n  constructor() {\n    this.separator = \"\\n\";\n    this.spacing = 10;\n  }\n  load(data) {\n    if (!data) {\n      return;\n    }\n    if (data.separator !== undefined) {\n      this.separator = data.separator;\n    }\n    if (data.spacing !== undefined) {\n      this.spacing = data.spacing;\n    }\n  }\n}\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/Options/Classes/TextMaskLine.js?");
+
+/***/ })
+
+}]);

package/esm/CanvasMaskInstance.js

@@ -1,8 +1,7 @@
-import { addParticlesFromCanvasPixels, getCanvasImageData, getImageData, getTextData } from "./utils.js";
+import { addParticlesFromCanvasPixels, getCanvasImageData, getImageData, getTextData, } from "./utils.js";
 export class CanvasMaskInstance {
-    constructor(container, engine) {
+    constructor(container) {
         this._container = container;
-        this._engine = engine;
     }
     async init() {
         const container = this._container, options = container.actualOptions.canvasMask;
@@ -30,8 +29,8 @@ export class CanvasMaskInstance {
             }
             pixelData = data;
         }
-        else if (options.element || options.selector) {
-            const canvas = options.element || (options.selector && document.querySelector(options.selector));
+        else if (options.element ?? options.selector) {
+            const canvas = options.element ?? (options.selector && document.querySelector(options.selector));
             if (!canvas) {
                 return;
             }
@@ -41,6 +40,6 @@ export class CanvasMaskInstance {
             }
             pixelData = getCanvasImageData(context, canvas, offset);
         }
-        addParticlesFromCanvasPixels(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
+        await addParticlesFromCanvasPixels(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);
     }
 }

package/esm/CanvasMaskPlugin.js

@@ -0,0 +1,23 @@
+import { CanvasMask } from "./Options/Classes/CanvasMask.js";
+export class CanvasMaskPlugin {
+    constructor() {
+        this.id = "canvasMask";
+    }
+    async getPlugin(container) {
+        const { CanvasMaskInstance } = await import("./CanvasMaskInstance.js");
+        return new CanvasMaskInstance(container);
+    }
+    loadOptions(options, source) {
+        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
+            return;
+        }
+        let canvasMaskOptions = options.canvasMask;
+        if (canvasMaskOptions?.load === undefined) {
+            options.canvasMask = canvasMaskOptions = new CanvasMask();
+        }
+        canvasMaskOptions.load(source?.canvasMask);
+    }
+    needsPlugin(options) {
+        return options?.canvasMask?.enable ?? false;
+    }
+}

package/esm/Options/Classes/CanvasMaskPixels.js

@@ -1,7 +1,8 @@
 import { isFunction, isString } from "@tsparticles/engine";
+const minAlpha = 0;
 export class CanvasMaskPixels {
     constructor() {
-        this.filter = (pixel) => pixel.a > 0;
+        this.filter = (pixel) => pixel.a > minAlpha;
         this.offset = 4;
     }
     load(data) {

package/esm/index.js

@@ -1,27 +1,4 @@
-import { CanvasMask } from "./Options/Classes/CanvasMask.js";
-import { CanvasMaskInstance } from "./CanvasMaskInstance.js";
-class CanvasMaskPlugin {
-    constructor(engine) {
-        this.id = "canvasMask";
-        this._engine = engine;
-    }
-    getPlugin(container) {
-        return new CanvasMaskInstance(container, this._engine);
-    }
-    loadOptions(options, source) {
-        if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
-            return;
-        }
-        let canvasMaskOptions = options.canvasMask;
-        if (canvasMaskOptions?.load === undefined) {
-            options.canvasMask = canvasMaskOptions = new CanvasMask();
-        }
-        canvasMaskOptions.load(source?.canvasMask);
-    }
-    needsPlugin(options) {
-        return options?.canvasMask?.enable ?? false;
-    }
-}
 export async function loadCanvasMaskPlugin(engine, refresh = true) {
-    await engine.addPlugin(new CanvasMaskPlugin(engine), refresh);
+    const { CanvasMaskPlugin } = await import("./CanvasMaskPlugin.js");
+    await engine.addPlugin(new CanvasMaskPlugin(), refresh);
 }

package/esm/utils.js

@@ -1,13 +1,17 @@
-import { errorPrefix, getRandom, isNumber, } from "@tsparticles/engine";
-export function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
+import { errorPrefix, getRandom, isNumber, percentDenominator, } from "@tsparticles/engine";
+const half = 0.5, origin = {
+    x: 0,
+    y: 0,
+}, defaultWidth = 0;
+export async function addParticlesFromCanvasPixels(container, data, position, scale, override, filter) {
     const { height, width } = data, numPixels = height * width, indexArray = shuffle(range(numPixels)), maxParticles = Math.min(numPixels, container.actualOptions.particles.number.value), canvasSize = container.canvas.size;
     let selectedPixels = 0;
     const positionOffset = {
-        x: (canvasSize.width * position.x) / 100 - (width * scale) / 2,
-        y: (canvasSize.height * position.y) / 100 - (height * scale) / 2,
+        x: (canvasSize.width * position.x) / percentDenominator - width * scale * half,
+        y: (canvasSize.height * position.y) / percentDenominator - height * scale * half,
     };
     while (selectedPixels < maxParticles && indexArray.length) {
-        const nextIndex = indexArray.pop() || 0, pixelPos = {
+        const defaultIndex = 0, nextIndex = indexArray.pop() ?? defaultIndex, pixelPos = {
             x: nextIndex % width,
             y: Math.floor(nextIndex / width),
         }, pixel = data.pixels[pixelPos.y][pixelPos.x], shouldCreateParticle = filter(pixel);
@@ -28,14 +32,14 @@ export function addParticlesFromCanvasPixels(container, data, position, scale, o
                 value: pixel.a,
             };
         }
-        container.particles.addParticle(pos, pOptions);
+        await container.particles.addParticle(pos, pOptions);
         selectedPixels++;
     }
 }
 export function getCanvasImageData(ctx, size, offset, clear = true) {
-    const imageData = ctx.getImageData(0, 0, size.width, size.height).data;
+    const imageData = ctx.getImageData(origin.x, origin.y, size.width, size.height).data;
     if (clear) {
-        ctx.clearRect(0, 0, size.width, size.height);
+        ctx.clearRect(origin.x, origin.y, size.width, size.height);
     }
     const pixels = [];
     for (let i = 0; i < imageData.length; i += offset) {
@@ -46,11 +50,17 @@ export function getCanvasImageData(ctx, size, offset, clear = true) {
         if (!pixels[pos.y]) {
             pixels[pos.y] = [];
         }
+        const indexesOffset = {
+            r: 0,
+            g: 1,
+            b: 2,
+            a: 3,
+        }, alphaFactor = 255;
         pixels[pos.y][pos.x] = {
-            r: imageData[i],
-            g: imageData[i + 1],
-            b: imageData[i + 2],
-            a: imageData[i + 3] / 255,
+            r: imageData[i + indexesOffset.r],
+            g: imageData[i + indexesOffset.g],
+            b: imageData[i + indexesOffset.b],
+            a: imageData[i + indexesOffset.a] / alphaFactor,
         };
     }
     return {
@@ -72,7 +82,7 @@ export function getImageData(src, offset) {
             if (!context) {
                 return reject(new Error(`${errorPrefix} Could not get canvas context`));
             }
-            context.drawImage(image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height);
+            context.drawImage(image, origin.x, origin.y, image.width, image.height, origin.x, origin.y, canvas.width, canvas.height);
             resolve(getCanvasImageData(context, canvas, offset));
         };
     });
@@ -87,14 +97,14 @@ export function getTextData(textOptions, offset) {
     const lines = text.split(linesOptions.separator), fontSize = isNumber(font.size) ? `${font.size}px` : font.size, linesData = [];
     let maxWidth = 0, totalHeight = 0;
     for (const line of lines) {
-        context.font = `${font.style || ""} ${font.variant || ""} ${font.weight || ""} ${fontSize} ${font.family}`;
+        context.font = `${font.style ?? ""} ${font.variant ?? ""} ${font.weight ?? ""} ${fontSize} ${font.family}`;
         const measure = context.measureText(line), lineData = {
             measure,
             text: line,
             height: measure.actualBoundingBoxAscent + measure.actualBoundingBoxDescent,
             width: measure.width,
         };
-        maxWidth = Math.max(maxWidth || 0, lineData.width);
+        maxWidth = Math.max(maxWidth || defaultWidth, lineData.width);
         totalHeight += lineData.height + linesOptions.spacing;
         linesData.push(lineData);
     }
@@ -102,15 +112,16 @@ export function getTextData(textOptions, offset) {
     canvas.height = totalHeight;
     let currentHeight = 0;
     for (const line of linesData) {
-        context.font = `${font.style || ""} ${font.variant || ""} ${font.weight || ""} ${fontSize} ${font.family}`;
+        context.font = `${font.style ?? ""} ${font.variant ?? ""} ${font.weight ?? ""} ${fontSize} ${font.family}`;
         context.fillStyle = color;
-        context.fillText(line.text, 0, currentHeight + line.measure.actualBoundingBoxAscent);
+        context.fillText(line.text, origin.x, currentHeight + line.measure.actualBoundingBoxAscent);
         currentHeight += line.height + linesOptions.spacing;
     }
     return getCanvasImageData(context, canvas, offset);
 }
 function shuffle(array) {
-    for (let currentIndex = array.length - 1; currentIndex >= 0; currentIndex--) {
+    const lengthOffset = 1, minIndex = 0;
+    for (let currentIndex = array.length - lengthOffset; currentIndex >= minIndex; currentIndex--) {
         const randomIndex = Math.floor(getRandom() * currentIndex);
         [array[currentIndex], array[randomIndex]] = [array[randomIndex], array[currentIndex]];
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsparticles/plugin-canvas-mask",
-  "version": "3.0.3",
+  "version": "3.2.0",
   "description": "tsParticles canvas mask plugin",
   "homepage": "https://particles.js.org",
   "repository": {
@@ -86,7 +86,7 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@tsparticles/engine": "^3.0.3"
+    "@tsparticles/engine": "^3.2.0"
   },
   "publishConfig": {
     "access": "public"

package/report.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
-    <title>@tsparticles/plugin-canvas-mask [26 Dec 2023 at 19:27]</title>
+    <title>@tsparticles/plugin-canvas-mask [31 Jan 2024 at 02:06]</title>
     <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
 
     <script>
@@ -31,8 +31,8 @@
   <body>
     <div id="app"></div>
     <script>
-      window.chartData = [{"label":"tsparticles.plugin.canvas-mask.js","isAsset":true,"statSize":10709,"parsedSize":14543,"gzipSize":3869,"groups":[{"label":"dist/browser","path":"./dist/browser","statSize":10667,"groups":[{"id":46,"label":"index.js + 9 modules (concatenated)","path":"./dist/browser/index.js + 9 modules (concatenated)","statSize":10667,"parsedSize":14543,"gzipSize":3869,"concatenated":true,"groups":[{"label":"dist/browser","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser","statSize":10667,"groups":[{"id":null,"label":"index.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/index.js","statSize":876,"parsedSize":1194,"gzipSize":317,"inaccurateSizes":true},{"id":null,"label":"CanvasMaskInstance.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/CanvasMaskInstance.js","statSize":1360,"parsedSize":1854,"gzipSize":493,"inaccurateSizes":true},{"label":"Options/Classes","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes","statSize":3868,"groups":[{"id":null,"label":"CanvasMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/CanvasMask.js","statSize":1346,"parsedSize":1835,"gzipSize":488,"inaccurateSizes":true},{"id":null,"label":"CanvasMaskOverride.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/CanvasMaskOverride.js","statSize":314,"parsedSize":428,"gzipSize":113,"inaccurateSizes":true},{"id":null,"label":"CanvasMaskPixels.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/CanvasMaskPixels.js","statSize":632,"parsedSize":861,"gzipSize":229,"inaccurateSizes":true},{"id":null,"label":"ImageMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/ImageMask.js","statSize":190,"parsedSize":259,"gzipSize":68,"inaccurateSizes":true},{"id":null,"label":"TextMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/TextMask.js","statSize":531,"parsedSize":723,"gzipSize":192,"inaccurateSizes":true},{"id":null,"label":"FontTextMask.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/FontTextMask.js","statSize":534,"parsedSize":728,"gzipSize":193,"inaccurateSizes":true},{"id":null,"label":"TextMaskLine.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/Options/Classes/TextMaskLine.js","statSize":321,"parsedSize":437,"gzipSize":116,"inaccurateSizes":true}],"parsedSize":5273,"gzipSize":1402,"inaccurateSizes":true},{"id":null,"label":"utils.js","path":"./dist/browser/index.js + 9 modules (concatenated)/dist/browser/utils.js","statSize":4563,"parsedSize":6221,"gzipSize":1655,"inaccurateSizes":true}],"parsedSize":14543,"gzipSize":3869,"inaccurateSizes":true}]}],"parsedSize":14543,"gzipSize":3869},{"label":"engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","statSize":42,"groups":[{"id":533,"label":"engine\",\"root\":\"window\"}","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles/engine\",\"root\":\"window\"}","statSize":42}],"parsedSize":0,"gzipSize":0}],"isInitialByEntrypoint":{"tsparticles.plugin.canvas-mask":true}}];
-      window.entrypoints = ["tsparticles.plugin.canvas-mask","tsparticles.plugin.canvas-mask.min"];
+      window.chartData = [];
+      window.entrypoints = ["tsparticles.plugin.canvas-mask.min"];
       window.defaultSizes = "parsed";
     </script>
   </body>