@tsparticles/plugin-polygon-mask 3.0.0-alpha.1 → 3.0.0-beta.0

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.
Files changed (41) hide show
  1. package/README.md +15 -11
  2. package/browser/Options/Classes/PolygonMask.js +2 -8
  3. package/browser/Options/Classes/PolygonMaskDraw.js +1 -18
  4. package/browser/Options/Classes/PolygonMaskDrawStroke.js +3 -4
  5. package/browser/PolygonMaskInstance.js +297 -305
  6. package/browser/index.js +7 -8
  7. package/browser/pathseg.js +1 -1
  8. package/browser/utils.js +3 -5
  9. package/cjs/Options/Classes/PolygonMask.js +2 -8
  10. package/cjs/Options/Classes/PolygonMaskDraw.js +1 -18
  11. package/cjs/Options/Classes/PolygonMaskDrawStroke.js +2 -3
  12. package/cjs/PolygonMaskInstance.js +309 -332
  13. package/cjs/index.js +7 -19
  14. package/cjs/pathseg.js +1 -1
  15. package/cjs/utils.js +4 -6
  16. package/esm/Options/Classes/PolygonMask.js +2 -8
  17. package/esm/Options/Classes/PolygonMaskDraw.js +1 -18
  18. package/esm/Options/Classes/PolygonMaskDrawStroke.js +3 -4
  19. package/esm/PolygonMaskInstance.js +297 -305
  20. package/esm/index.js +7 -8
  21. package/esm/pathseg.js +1 -1
  22. package/esm/utils.js +3 -5
  23. package/package.json +8 -5
  24. package/report.html +4 -4
  25. package/tsparticles.plugin.polygon-mask.js +336 -362
  26. package/tsparticles.plugin.polygon-mask.min.js +1 -1
  27. package/tsparticles.plugin.polygon-mask.min.js.LICENSE.txt +1 -8
  28. package/types/Options/Classes/PolygonMask.d.ts +1 -4
  29. package/types/Options/Classes/PolygonMaskDraw.d.ts +1 -6
  30. package/types/Options/Classes/PolygonMaskDrawStroke.d.ts +1 -2
  31. package/types/Options/Interfaces/IPolygonMaskDraw.d.ts +0 -3
  32. package/types/PolygonMaskInstance.d.ts +13 -15
  33. package/types/index.d.ts +1 -1
  34. package/types/utils.d.ts +1 -2
  35. package/umd/Options/Classes/PolygonMask.js +3 -9
  36. package/umd/Options/Classes/PolygonMaskDraw.js +2 -19
  37. package/umd/Options/Classes/PolygonMaskDrawStroke.js +2 -3
  38. package/umd/PolygonMaskInstance.js +298 -306
  39. package/umd/index.js +7 -8
  40. package/umd/pathseg.js +1 -1
  41. package/umd/utils.js +3 -5
package/cjs/index.js CHANGED
@@ -13,15 +13,6 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
13
13
  var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
14
  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
15
  };
16
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
17
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
18
- return new (P || (P = Promise))(function (resolve, reject) {
19
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
20
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
21
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
22
- step((generator = generator.apply(thisArg, _arguments || [])).next());
23
- });
24
- };
25
16
  Object.defineProperty(exports, "__esModule", { value: true });
26
17
  exports.loadPolygonMaskPlugin = void 0;
27
18
  require("./pathseg");
@@ -36,25 +27,22 @@ class PolygonMaskPlugin {
36
27
  return new PolygonMaskInstance_1.PolygonMaskInstance(container, this._engine);
37
28
  }
38
29
  loadOptions(options, source) {
39
- if (!this.needsPlugin(source)) {
30
+ if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
40
31
  return;
41
32
  }
42
33
  let polygonOptions = options.polygon;
43
- if ((polygonOptions === null || polygonOptions === void 0 ? void 0 : polygonOptions.load) === undefined) {
34
+ if (polygonOptions?.load === undefined) {
44
35
  options.polygon = polygonOptions = new PolygonMask_1.PolygonMask();
45
36
  }
46
- polygonOptions.load(source === null || source === void 0 ? void 0 : source.polygon);
37
+ polygonOptions.load(source?.polygon);
47
38
  }
48
39
  needsPlugin(options) {
49
- var _a, _b, _c;
50
- return ((_b = (_a = options === null || options === void 0 ? void 0 : options.polygon) === null || _a === void 0 ? void 0 : _a.enable) !== null && _b !== void 0 ? _b : (((_c = options === null || options === void 0 ? void 0 : options.polygon) === null || _c === void 0 ? void 0 : _c.type) !== undefined && options.polygon.type !== "none"));
40
+ return (options?.polygon?.enable ??
41
+ (options?.polygon?.type !== undefined && options.polygon.type !== "none"));
51
42
  }
52
43
  }
53
- function loadPolygonMaskPlugin(engine) {
54
- return __awaiter(this, void 0, void 0, function* () {
55
- const plugin = new PolygonMaskPlugin(engine);
56
- yield engine.addPlugin(plugin);
57
- });
44
+ async function loadPolygonMaskPlugin(engine, refresh = true) {
45
+ await engine.addPlugin(new PolygonMaskPlugin(engine), refresh);
58
46
  }
59
47
  exports.loadPolygonMaskPlugin = loadPolygonMaskPlugin;
60
48
  __exportStar(require("./Enums/PolygonMaskInlineArrangement"), exports);
package/cjs/pathseg.js CHANGED
@@ -1064,7 +1064,7 @@
1064
1064
  this._pathElement.setAttribute("d", window.SVGPathSegList._pathSegArrayAsString(this._list));
1065
1065
  this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
1066
1066
  };
1067
- window.SVGPathSegList.prototype.segmentChanged = function (pathSeg) {
1067
+ window.SVGPathSegList.prototype.segmentChanged = function () {
1068
1068
  this._writeListToPath();
1069
1069
  };
1070
1070
  window.SVGPathSegList.prototype.clear = function () {
package/cjs/utils.js CHANGED
@@ -31,17 +31,15 @@ function drawPolygonMaskPath(context, path, stroke, position) {
31
31
  }
32
32
  exports.drawPolygonMaskPath = drawPolygonMaskPath;
33
33
  function parsePaths(paths, scale, offset) {
34
- var _a;
35
34
  const res = [];
36
35
  for (const path of paths) {
37
- const segments = path.element.pathSegList, len = (_a = segments === null || segments === void 0 ? void 0 : segments.numberOfItems) !== null && _a !== void 0 ? _a : 0, p = {
36
+ const segments = path.element.pathSegList, len = segments?.numberOfItems ?? 0, p = {
38
37
  x: 0,
39
38
  y: 0,
40
39
  };
41
40
  for (let i = 0; i < len; i++) {
42
- const segment = segments === null || segments === void 0 ? void 0 : segments.getItem(i);
43
- const svgPathSeg = window.SVGPathSeg;
44
- switch (segment === null || segment === void 0 ? void 0 : segment.pathSegType) {
41
+ const segment = segments?.getItem(i), svgPathSeg = window.SVGPathSeg;
42
+ switch (segment?.pathSegType) {
45
43
  case svgPathSeg.PATHSEG_MOVETO_ABS:
46
44
  case svgPathSeg.PATHSEG_LINETO_ABS:
47
45
  case svgPathSeg.PATHSEG_CURVETO_CUBIC_ABS:
@@ -92,7 +90,7 @@ function parsePaths(paths, scale, offset) {
92
90
  }
93
91
  exports.parsePaths = parsePaths;
94
92
  function calcClosestPtOnSegment(s1, s2, pos) {
95
- const { dx: dx1, dy: dy1 } = (0, engine_1.getDistances)(pos, s1), { dx: dx2, dy: dy2 } = (0, engine_1.getDistances)(s2, s1), t = (dx1 * dx2 + dy1 * dy2) / (Math.pow(dx2, 2) + Math.pow(dy2, 2)), res = {
93
+ const { dx: dx1, dy: dy1 } = (0, engine_1.getDistances)(pos, s1), { dx: dx2, dy: dy2 } = (0, engine_1.getDistances)(s2, s1), t = (dx1 * dx2 + dy1 * dy2) / (dx2 ** 2 + dy2 ** 2), res = {
96
94
  x: s1.x + dx2 * t,
97
95
  y: s1.y + dy2 * t,
98
96
  isOnSegment: t >= 0 && t <= 1,
@@ -1,8 +1,8 @@
1
+ import { deepExtend, isString, } from "@tsparticles/engine";
1
2
  import { PolygonMaskDraw } from "./PolygonMaskDraw";
2
3
  import { PolygonMaskInline } from "./PolygonMaskInline";
3
4
  import { PolygonMaskLocalSvg } from "./PolygonMaskLocalSvg";
4
5
  import { PolygonMaskMove } from "./PolygonMaskMove";
5
- import { deepExtend } from "@tsparticles/engine";
6
6
  export class PolygonMask {
7
7
  constructor() {
8
8
  this.draw = new PolygonMaskDraw();
@@ -12,12 +12,6 @@ export class PolygonMask {
12
12
  this.scale = 1;
13
13
  this.type = "none";
14
14
  }
15
- get inlineArrangement() {
16
- return this.inline.arrangement;
17
- }
18
- set inlineArrangement(value) {
19
- this.inline.arrangement = value;
20
- }
21
15
  load(data) {
22
16
  if (!data) {
23
17
  return;
@@ -41,7 +35,7 @@ export class PolygonMask {
41
35
  this.url = data.url;
42
36
  }
43
37
  if (data.data !== undefined) {
44
- if (typeof data.data === "string") {
38
+ if (isString(data.data)) {
45
39
  this.data = data.data;
46
40
  }
47
41
  else {
@@ -1,34 +1,17 @@
1
- import { OptionsColor } from "@tsparticles/engine";
2
1
  import { PolygonMaskDrawStroke } from "./PolygonMaskDrawStroke";
3
2
  export class PolygonMaskDraw {
4
3
  constructor() {
5
4
  this.enable = false;
6
5
  this.stroke = new PolygonMaskDrawStroke();
7
6
  }
8
- get lineColor() {
9
- return this.stroke.color;
10
- }
11
- set lineColor(value) {
12
- this.stroke.color = OptionsColor.create(this.stroke.color, value);
13
- }
14
- get lineWidth() {
15
- return this.stroke.width;
16
- }
17
- set lineWidth(value) {
18
- this.stroke.width = value;
19
- }
20
7
  load(data) {
21
- var _a;
22
8
  if (!data) {
23
9
  return;
24
10
  }
25
11
  if (data.enable !== undefined) {
26
12
  this.enable = data.enable;
27
13
  }
28
- const stroke = (_a = data.stroke) !== null && _a !== void 0 ? _a : {
29
- color: data.lineColor,
30
- width: data.lineWidth,
31
- };
14
+ const stroke = data.stroke;
32
15
  this.stroke.load(stroke);
33
16
  }
34
17
  }
@@ -1,4 +1,4 @@
1
- import { OptionsColor, stringToAlpha } from "@tsparticles/engine";
1
+ import { OptionsColor, isString, stringToAlpha } from "@tsparticles/engine";
2
2
  export class PolygonMaskDrawStroke {
3
3
  constructor() {
4
4
  this.color = new OptionsColor();
@@ -6,13 +6,12 @@ export class PolygonMaskDrawStroke {
6
6
  this.opacity = 1;
7
7
  }
8
8
  load(data) {
9
- var _a;
10
9
  if (!data) {
11
10
  return;
12
11
  }
13
12
  this.color = OptionsColor.create(this.color, data.color);
14
- if (typeof this.color.value === "string") {
15
- this.opacity = (_a = stringToAlpha(this.color.value)) !== null && _a !== void 0 ? _a : this.opacity;
13
+ if (isString(this.color.value)) {
14
+ this.opacity = stringToAlpha(this.color.value) ?? this.opacity;
16
15
  }
17
16
  if (data.opacity !== undefined) {
18
17
  this.opacity = data.opacity;