@tsparticles/plugin-canvas-mask 4.0.0-beta.0 → 4.0.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/201.min.js +1 -0
- package/{597.min.js → 556.min.js} +2 -2
- package/browser/CanvasMaskPluginInstance.js +3 -3
- package/browser/index.js +3 -3
- package/cjs/CanvasMaskPluginInstance.js +3 -3
- package/cjs/index.js +3 -3
- package/dist_browser_CanvasMaskPluginInstance_js.js +2 -2
- package/dist_browser_CanvasMaskPlugin_js.js +1 -1
- package/esm/CanvasMaskPluginInstance.js +3 -3
- package/esm/index.js +3 -3
- package/package.json +3 -3
- package/report.html +84 -29
- package/tsparticles.plugin.canvas-mask.js +2 -2
- package/tsparticles.plugin.canvas-mask.min.js +2 -2
- package/umd/CanvasMaskPluginInstance.js +3 -3
- package/umd/index.js +3 -3
- package/565.min.js +0 -1
package/201.min.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(this.webpackChunk_tsparticles_plugin_canvas_mask=this.webpackChunk_tsparticles_plugin_canvas_mask||[]).push([[201],{201(e,t,a){a.d(t,{CanvasMaskPluginInstance:()=>l});var n=a(425),i=a(303);class l{_container;constructor(e){this._container=e}async init(){let e=this._container,t=e.actualOptions.canvasMask;if(!t?.enable)return;let a={pixels:[],height:0,width:0},l=t.pixels.offset;if(t.image){let i=t.image.src;if(!i)return;a=await (0,n.getImageData)(i,l,e.canvas.render.settings)}else if(t.text){let s=t.text,r=(0,n.getTextData)(s,l,s.fill,e.canvas.render.settings);if((0,i.isNull)(r))return;a=r}else if(t.element??t.selector){let s=t.element??(t.selector&&(0,i.safeDocument)().querySelector(t.selector));if(!s)return;let r=s.getContext("2d",e.canvas.render.settings);if(!r)return;a=(0,n.getCanvasImageData)(r,s,l)}!function(e,t,a,n,l,s){let{height:r,width:c}=t,o=r*c,u=function(e){for(let t=e.length-1;t>=0;t--){let a=Math.floor((0,i.getRandom)()*t),n=e[t],l=e[a];l!==n&&void 0!==l&&void 0!==n&&(e[t]=l,e[a]=n)}return e}([...Array(o).keys()]),f=Math.min(o,e.actualOptions.particles.number.value),p=e.canvas.size,h=0,g={x:p.width*a.x/i.percentDenominator-c*n*i.half,y:p.height*a.y/i.percentDenominator-r*n*i.half};for(;h<f&&u.length;){let a=u.pop()??0,i={x:a%c,y:Math.floor(a/c)},r=t.pixels[i.y];if(!r)continue;let o=r[i.x];if(!o||!s(o))continue;let f={x:i.x*n+g.x,y:i.y*n+g.y},p={};l.color&&(p.fill={color:{value:o},enable:!0}),l.opacity&&(p.opacity={value:o.a}),e.particles.addParticle(f,p),h++}}(e,a,t.position,t.scale,t.override,t.pixels.filter)}}}}]);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";(this.webpackChunk_tsparticles_plugin_canvas_mask=this.webpackChunk_tsparticles_plugin_canvas_mask||[]).push([[
|
|
2
|
-
`,this.spacing=10}load(i){(0,e.isNull)(i)||(void 0!==i.separator&&(this.separator=i.separator),void 0!==i.spacing&&(this.spacing=i.spacing))}}class c{color;fill;font;lines;text;constructor(){this.color="#000000",this.fill=!0,this.font=new n,this.lines=new r,this.text=""}load(i){(0,e.isNull)(i)||(void 0!==i.color&&(this.color=i.color),void 0!==i.fill&&(this.fill=i.fill),this.font.load(i.font),this.lines.load(i.lines),void 0!==i.text&&(this.text=i.text))}}class h{element;enable;image;override;pixels;position;scale;selector;text;constructor(){this.enable=!1,this.override=new l,this.pixels=new o,this.position={x:50,y:50},this.scale=1}load(i){!(0,e.isNull)(i)&&(void 0!==i.element&&i.element instanceof HTMLCanvasElement&&(this.element=i.element),void 0!==i.enable&&(this.enable=i.enable),i.image&&(this.image??=new a,this.image.load(i.image)),this.pixels.load(i.pixels),i.position&&(this.position={x:i.position.x??this.position.x,y:i.position.y??this.position.y}),this.override.load(i.override),void 0!==i.scale&&(this.scale=i.scale),void 0!==i.selector&&(this.selector=i.selector),i.text&&(this.text??=new c,this.text.load(i.text)))}}class d{id="canvas-mask";async getPlugin(i){let{CanvasMaskPluginInstance:s}=await t.e(
|
|
1
|
+
"use strict";(this.webpackChunk_tsparticles_plugin_canvas_mask=this.webpackChunk_tsparticles_plugin_canvas_mask||[]).push([[556],{556(i,s,t){t.d(s,{CanvasMaskPlugin:()=>d});var e=t(303);class l{color;opacity;constructor(){this.color=!0,this.opacity=!1}load(i){(0,e.isNull)(i)||(void 0!==i.color&&(this.color=i.color),void 0!==i.opacity&&(this.opacity=i.opacity))}}class o{filter;offset;constructor(){this.filter=i=>i.a>0,this.offset=4}load(i){if(!(0,e.isNull)(i)){if(void 0!==i.filter)if((0,e.isString)(i.filter)){if(i.filter in globalThis){let s=globalThis[i.filter];(0,e.isFunction)(s)&&(this.filter=s)}}else this.filter=i.filter;void 0!==i.offset&&(this.offset=i.offset)}}}class a{src;constructor(){this.src=""}load(i){(0,e.isNull)(i)||void 0!==i.src&&(this.src=i.src)}}class n{family;size;style;variant;weight;constructor(){this.family="sans-serif",this.size=100,this.style="",this.variant="",this.weight=""}load(i){(0,e.isNull)(i)||(void 0!==i.family&&(this.family=i.family),void 0!==i.size&&(this.size=i.size),void 0!==i.style&&(this.style=i.style),void 0!==i.variant&&(this.variant=i.variant),void 0!==i.weight&&(this.weight=i.weight))}}class r{separator;spacing;constructor(){this.separator=`
|
|
2
|
+
`,this.spacing=10}load(i){(0,e.isNull)(i)||(void 0!==i.separator&&(this.separator=i.separator),void 0!==i.spacing&&(this.spacing=i.spacing))}}class c{color;fill;font;lines;text;constructor(){this.color="#000000",this.fill=!0,this.font=new n,this.lines=new r,this.text=""}load(i){(0,e.isNull)(i)||(void 0!==i.color&&(this.color=i.color),void 0!==i.fill&&(this.fill=i.fill),this.font.load(i.font),this.lines.load(i.lines),void 0!==i.text&&(this.text=i.text))}}class h{element;enable;image;override;pixels;position;scale;selector;text;constructor(){this.enable=!1,this.override=new l,this.pixels=new o,this.position={x:50,y:50},this.scale=1}load(i){!(0,e.isNull)(i)&&(void 0!==i.element&&i.element instanceof HTMLCanvasElement&&(this.element=i.element),void 0!==i.enable&&(this.enable=i.enable),i.image&&(this.image??=new a,this.image.load(i.image)),this.pixels.load(i.pixels),i.position&&(this.position={x:i.position.x??this.position.x,y:i.position.y??this.position.y}),this.override.load(i.override),void 0!==i.scale&&(this.scale=i.scale),void 0!==i.selector&&(this.selector=i.selector),i.text&&(this.text??=new c,this.text.load(i.text)))}}class d{id="canvas-mask";async getPlugin(i){let{CanvasMaskPluginInstance:s}=await t.e(201).then(t.bind(t,201));return new s(i)}loadOptions(i,s,t){if(!this.needsPlugin(s)&&!this.needsPlugin(t))return;let e=s.canvasMask;e?.load===void 0&&(s.canvasMask=e=new h),e.load(t?.canvasMask)}needsPlugin(i){return i?.canvasMask?.enable??!1}}}}]);
|
|
@@ -22,10 +22,10 @@ export class CanvasMaskPluginInstance {
|
|
|
22
22
|
if (!url) {
|
|
23
23
|
return;
|
|
24
24
|
}
|
|
25
|
-
pixelData = await getImageData(url, offset, container.canvas.settings);
|
|
25
|
+
pixelData = await getImageData(url, offset, container.canvas.render.settings);
|
|
26
26
|
}
|
|
27
27
|
else if (options.text) {
|
|
28
|
-
const textOptions = options.text, data = getTextData(textOptions, offset, textOptions.fill, container.canvas.settings);
|
|
28
|
+
const textOptions = options.text, data = getTextData(textOptions, offset, textOptions.fill, container.canvas.render.settings);
|
|
29
29
|
if (isNull(data)) {
|
|
30
30
|
return;
|
|
31
31
|
}
|
|
@@ -36,7 +36,7 @@ export class CanvasMaskPluginInstance {
|
|
|
36
36
|
if (!canvas) {
|
|
37
37
|
return;
|
|
38
38
|
}
|
|
39
|
-
const context = canvas.getContext("2d", container.canvas.settings);
|
|
39
|
+
const context = canvas.getContext("2d", container.canvas.render.settings);
|
|
40
40
|
if (!context) {
|
|
41
41
|
return;
|
|
42
42
|
}
|
package/browser/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export async function loadCanvasMaskPlugin(engine) {
|
|
2
|
-
engine.checkVersion("4.0.0-beta.
|
|
3
|
-
await engine.register(async (e) => {
|
|
2
|
+
engine.checkVersion("4.0.0-beta.1");
|
|
3
|
+
await engine.pluginManager.register(async (e) => {
|
|
4
4
|
const { CanvasMaskPlugin } = await import("./CanvasMaskPlugin.js");
|
|
5
|
-
e.addPlugin(new CanvasMaskPlugin());
|
|
5
|
+
e.pluginManager.addPlugin(new CanvasMaskPlugin());
|
|
6
6
|
});
|
|
7
7
|
}
|
|
@@ -22,10 +22,10 @@ export class CanvasMaskPluginInstance {
|
|
|
22
22
|
if (!url) {
|
|
23
23
|
return;
|
|
24
24
|
}
|
|
25
|
-
pixelData = await getImageData(url, offset, container.canvas.settings);
|
|
25
|
+
pixelData = await getImageData(url, offset, container.canvas.render.settings);
|
|
26
26
|
}
|
|
27
27
|
else if (options.text) {
|
|
28
|
-
const textOptions = options.text, data = getTextData(textOptions, offset, textOptions.fill, container.canvas.settings);
|
|
28
|
+
const textOptions = options.text, data = getTextData(textOptions, offset, textOptions.fill, container.canvas.render.settings);
|
|
29
29
|
if (isNull(data)) {
|
|
30
30
|
return;
|
|
31
31
|
}
|
|
@@ -36,7 +36,7 @@ export class CanvasMaskPluginInstance {
|
|
|
36
36
|
if (!canvas) {
|
|
37
37
|
return;
|
|
38
38
|
}
|
|
39
|
-
const context = canvas.getContext("2d", container.canvas.settings);
|
|
39
|
+
const context = canvas.getContext("2d", container.canvas.render.settings);
|
|
40
40
|
if (!context) {
|
|
41
41
|
return;
|
|
42
42
|
}
|
package/cjs/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export async function loadCanvasMaskPlugin(engine) {
|
|
2
|
-
engine.checkVersion("4.0.0-beta.
|
|
3
|
-
await engine.register(async (e) => {
|
|
2
|
+
engine.checkVersion("4.0.0-beta.1");
|
|
3
|
+
await engine.pluginManager.register(async (e) => {
|
|
4
4
|
const { CanvasMaskPlugin } = await import("./CanvasMaskPlugin.js");
|
|
5
|
-
e.addPlugin(new CanvasMaskPlugin());
|
|
5
|
+
e.pluginManager.addPlugin(new CanvasMaskPlugin());
|
|
6
6
|
});
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* Demo / Generator : https://particles.js.org/
|
|
5
5
|
* GitHub : https://www.github.com/matteobruni/tsparticles
|
|
6
6
|
* How to use? : Check the GitHub README
|
|
7
|
-
* v4.0.0-beta.
|
|
7
|
+
* v4.0.0-beta.1
|
|
8
8
|
*/
|
|
9
9
|
"use strict";
|
|
10
10
|
/*
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
\**************************************************/
|
|
24
24
|
(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
|
|
25
25
|
|
|
26
|
-
eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ CanvasMaskPluginInstance: () => (/* binding */ CanvasMaskPluginInstance)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/canvas-utils */ \"@tsparticles/canvas-utils\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils.js */ \"./dist/browser/utils.js\");\n\n\n\nclass CanvasMaskPluginInstance {\n _container;\n constructor(container){\n this._container = container;\n }\n async init() {\n const container = this._container, options = container.actualOptions.canvasMask;\n if (!options?.enable) {\n return;\n }\n let pixelData = {\n pixels: [],\n height: 0,\n width: 0\n };\n const offset = options.pixels.offset;\n if (options.image) {\n const url = options.image.src;\n if (!url) {\n return;\n }\n pixelData = await (0,_tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__.getImageData)(url, offset, container.canvas.settings);\n } else if (options.text) {\n const textOptions = options.text, data = (0,_tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__.getTextData)(textOptions, offset, textOptions.fill, container.canvas.settings);\n if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isNull)(data)) {\n return;\n }\n pixelData = data;\n } else if (options.element ?? options.selector) {\n const canvas = options.element ?? (options.selector && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.safeDocument)().querySelector(options.selector));\n if (!canvas) {\n return;\n }\n const context = canvas.getContext(\"2d\", container.canvas.settings);\n if (!context) {\n return;\n }\n pixelData = (0,_tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__.getCanvasImageData)(context, canvas, offset);\n }\n (0,_utils_js__WEBPACK_IMPORTED_MODULE_2__.addParticlesFromCanvasPixels)(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/CanvasMaskPluginInstance.js?\n}");
|
|
26
|
+
eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ CanvasMaskPluginInstance: () => (/* binding */ CanvasMaskPluginInstance)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/canvas-utils */ \"@tsparticles/canvas-utils\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils.js */ \"./dist/browser/utils.js\");\n\n\n\nclass CanvasMaskPluginInstance {\n _container;\n constructor(container){\n this._container = container;\n }\n async init() {\n const container = this._container, options = container.actualOptions.canvasMask;\n if (!options?.enable) {\n return;\n }\n let pixelData = {\n pixels: [],\n height: 0,\n width: 0\n };\n const offset = options.pixels.offset;\n if (options.image) {\n const url = options.image.src;\n if (!url) {\n return;\n }\n pixelData = await (0,_tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__.getImageData)(url, offset, container.canvas.render.settings);\n } else if (options.text) {\n const textOptions = options.text, data = (0,_tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__.getTextData)(textOptions, offset, textOptions.fill, container.canvas.render.settings);\n if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.isNull)(data)) {\n return;\n }\n pixelData = data;\n } else if (options.element ?? options.selector) {\n const canvas = options.element ?? (options.selector && (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_1__.safeDocument)().querySelector(options.selector));\n if (!canvas) {\n return;\n }\n const context = canvas.getContext(\"2d\", container.canvas.render.settings);\n if (!context) {\n return;\n }\n pixelData = (0,_tsparticles_canvas_utils__WEBPACK_IMPORTED_MODULE_0__.getCanvasImageData)(context, canvas, offset);\n }\n (0,_utils_js__WEBPACK_IMPORTED_MODULE_2__.addParticlesFromCanvasPixels)(container, pixelData, options.position, options.scale, options.override, options.pixels.filter);\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/plugin-canvas-mask/./dist/browser/CanvasMaskPluginInstance.js?\n}");
|
|
27
27
|
|
|
28
28
|
/***/ },
|
|
29
29
|
|
|
@@ -22,10 +22,10 @@ export class CanvasMaskPluginInstance {
|
|
|
22
22
|
if (!url) {
|
|
23
23
|
return;
|
|
24
24
|
}
|
|
25
|
-
pixelData = await getImageData(url, offset, container.canvas.settings);
|
|
25
|
+
pixelData = await getImageData(url, offset, container.canvas.render.settings);
|
|
26
26
|
}
|
|
27
27
|
else if (options.text) {
|
|
28
|
-
const textOptions = options.text, data = getTextData(textOptions, offset, textOptions.fill, container.canvas.settings);
|
|
28
|
+
const textOptions = options.text, data = getTextData(textOptions, offset, textOptions.fill, container.canvas.render.settings);
|
|
29
29
|
if (isNull(data)) {
|
|
30
30
|
return;
|
|
31
31
|
}
|
|
@@ -36,7 +36,7 @@ export class CanvasMaskPluginInstance {
|
|
|
36
36
|
if (!canvas) {
|
|
37
37
|
return;
|
|
38
38
|
}
|
|
39
|
-
const context = canvas.getContext("2d", container.canvas.settings);
|
|
39
|
+
const context = canvas.getContext("2d", container.canvas.render.settings);
|
|
40
40
|
if (!context) {
|
|
41
41
|
return;
|
|
42
42
|
}
|
package/esm/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export async function loadCanvasMaskPlugin(engine) {
|
|
2
|
-
engine.checkVersion("4.0.0-beta.
|
|
3
|
-
await engine.register(async (e) => {
|
|
2
|
+
engine.checkVersion("4.0.0-beta.1");
|
|
3
|
+
await engine.pluginManager.register(async (e) => {
|
|
4
4
|
const { CanvasMaskPlugin } = await import("./CanvasMaskPlugin.js");
|
|
5
|
-
e.addPlugin(new CanvasMaskPlugin());
|
|
5
|
+
e.pluginManager.addPlugin(new CanvasMaskPlugin());
|
|
6
6
|
});
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tsparticles/plugin-canvas-mask",
|
|
3
|
-
"version": "4.0.0-beta.
|
|
3
|
+
"version": "4.0.0-beta.1",
|
|
4
4
|
"description": "tsParticles canvas mask plugin",
|
|
5
5
|
"homepage": "https://particles.js.org",
|
|
6
6
|
"repository": {
|
|
@@ -86,8 +86,8 @@
|
|
|
86
86
|
"./package.json": "./package.json"
|
|
87
87
|
},
|
|
88
88
|
"dependencies": {
|
|
89
|
-
"@tsparticles/canvas-utils": "4.0.0-beta.
|
|
90
|
-
"@tsparticles/engine": "4.0.0-beta.
|
|
89
|
+
"@tsparticles/canvas-utils": "4.0.0-beta.1",
|
|
90
|
+
"@tsparticles/engine": "4.0.0-beta.1"
|
|
91
91
|
},
|
|
92
92
|
"publishConfig": {
|
|
93
93
|
"access": "public"
|