@tsparticles/plugin-absorbers 4.0.0-alpha.5 → 4.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 (77) hide show
  1. package/162.min.js +1 -0
  2. package/166.min.js +1 -0
  3. package/49.min.js +1 -0
  4. package/497.min.js +1 -0
  5. package/598.min.js +1 -0
  6. package/README.md +5 -0
  7. package/browser/AbsorberInstance.js +126 -53
  8. package/browser/AbsorbersInstancesManager.js +2 -0
  9. package/browser/AbsorbersInteractor.js +11 -6
  10. package/browser/AbsorbersPlugin.js +2 -1
  11. package/browser/AbsorbersPluginInstance.js +2 -0
  12. package/browser/Options/Classes/Absorber.js +14 -0
  13. package/browser/Options/Classes/AbsorberLife.js +27 -0
  14. package/browser/Options/Classes/AbsorberSize.js +2 -0
  15. package/browser/Options/Classes/AbsorberSizeLimit.js +2 -0
  16. package/browser/Options/Interfaces/IAbsorberLife.js +1 -0
  17. package/browser/index.js +7 -3
  18. package/cjs/AbsorberInstance.js +126 -53
  19. package/cjs/AbsorbersInstancesManager.js +2 -0
  20. package/cjs/AbsorbersInteractor.js +11 -6
  21. package/cjs/AbsorbersPlugin.js +2 -1
  22. package/cjs/AbsorbersPluginInstance.js +2 -0
  23. package/cjs/Options/Classes/Absorber.js +14 -0
  24. package/cjs/Options/Classes/AbsorberLife.js +27 -0
  25. package/cjs/Options/Classes/AbsorberSize.js +2 -0
  26. package/cjs/Options/Classes/AbsorberSizeLimit.js +2 -0
  27. package/cjs/Options/Interfaces/IAbsorberLife.js +1 -0
  28. package/cjs/index.js +7 -3
  29. package/dist_browser_AbsorberInstance_js.js +15 -5
  30. package/dist_browser_AbsorbersInstancesManager_js.js +2 -2
  31. package/dist_browser_AbsorbersInteractor_js.js +15 -5
  32. package/dist_browser_AbsorbersPluginInstance_js.js +2 -2
  33. package/dist_browser_AbsorbersPlugin_js.js +15 -5
  34. package/esm/AbsorberInstance.js +126 -53
  35. package/esm/AbsorbersInstancesManager.js +2 -0
  36. package/esm/AbsorbersInteractor.js +11 -6
  37. package/esm/AbsorbersPlugin.js +2 -1
  38. package/esm/AbsorbersPluginInstance.js +2 -0
  39. package/esm/Options/Classes/Absorber.js +14 -0
  40. package/esm/Options/Classes/AbsorberLife.js +27 -0
  41. package/esm/Options/Classes/AbsorberSize.js +2 -0
  42. package/esm/Options/Classes/AbsorberSizeLimit.js +2 -0
  43. package/esm/Options/Interfaces/IAbsorberLife.js +1 -0
  44. package/esm/index.js +7 -3
  45. package/package.json +3 -3
  46. package/report.html +3 -3
  47. package/tsparticles.plugin.absorbers.js +31 -19
  48. package/tsparticles.plugin.absorbers.min.js +2 -2
  49. package/types/AbsorberInstance.d.ts +10 -0
  50. package/types/AbsorbersInteractor.d.ts +3 -2
  51. package/types/AbsorbersPlugin.d.ts +1 -1
  52. package/types/Options/Classes/Absorber.d.ts +2 -0
  53. package/types/Options/Classes/AbsorberLife.d.ts +10 -0
  54. package/types/Options/Interfaces/IAbsorber.d.ts +2 -0
  55. package/types/Options/Interfaces/IAbsorberLife.d.ts +7 -0
  56. package/umd/AbsorberInstance.js +125 -52
  57. package/umd/AbsorbersInstancesManager.js +2 -0
  58. package/umd/AbsorbersInteractor.js +11 -6
  59. package/umd/AbsorbersPlugin.js +2 -1
  60. package/umd/AbsorbersPluginInstance.js +2 -0
  61. package/umd/Options/Classes/Absorber.js +15 -1
  62. package/umd/Options/Classes/AbsorberLife.js +41 -0
  63. package/umd/Options/Classes/AbsorberSize.js +2 -0
  64. package/umd/Options/Classes/AbsorberSizeLimit.js +2 -0
  65. package/umd/Options/Interfaces/IAbsorberLife.js +12 -0
  66. package/umd/index.js +7 -3
  67. package/215.min.js +0 -2
  68. package/215.min.js.LICENSE.txt +0 -1
  69. package/384.min.js +0 -2
  70. package/384.min.js.LICENSE.txt +0 -1
  71. package/688.min.js +0 -2
  72. package/688.min.js.LICENSE.txt +0 -1
  73. package/903.min.js +0 -2
  74. package/903.min.js.LICENSE.txt +0 -1
  75. package/980.min.js +0 -2
  76. package/980.min.js.LICENSE.txt +0 -1
  77. package/tsparticles.plugin.absorbers.min.js.LICENSE.txt +0 -1
@@ -1,61 +1,30 @@
1
- import { RotateDirection, Vector, calcPositionOrRandomFromSize, calcPositionOrRandomFromSizeRanged, doublePI, getDistance, getDistances, getRandom, getRangeValue, getStyleFromRgb, isPointInside, originPoint, percentDenominator, rangeColorToRgb, } from "@tsparticles/engine";
1
+ import { RotateDirection, Vector, calcPositionOrRandomFromSize, calcPositionOrRandomFromSizeRanged, doublePI, getDistance, getDistances, getRandom, getRangeValue, getStyleFromRgb, isPointInside, millisecondsToSeconds, originPoint, percentDenominator, rangeColorToRgb, } from "@tsparticles/engine";
2
2
  import { Absorber } from "./Options/Classes/Absorber.js";
3
- const squareExp = 2, absorbFactor = 0.033, minOrbitLength = 0, minRadius = 0, minMass = 0, minAngle = 0, maxAngle = doublePI, minVelocity = 0;
3
+ const squareExp = 2, absorbFactor = 0.033, minOrbitLength = 0, minRadius = 0, minMass = 0, minAngle = 0, maxAngle = doublePI, minVelocity = 0, defaultLifeDelay = 0, minLifeCount = 0, defaultSpawnDelay = 0, defaultLifeCount = -1;
4
4
  export class AbsorberInstance {
5
+ color;
6
+ limit;
7
+ mass;
8
+ name;
9
+ opacity;
10
+ options;
11
+ position;
12
+ size;
13
+ _container;
14
+ _currentDuration;
15
+ _currentSpawnDelay;
16
+ _duration;
17
+ _engine;
18
+ _firstSpawn;
19
+ _immortal;
20
+ _lifeCount;
21
+ _spawnDelay;
22
+ initialPosition;
5
23
  constructor(engine, container, options, position) {
6
- this._calcPosition = () => {
7
- const exactPosition = calcPositionOrRandomFromSizeRanged({
8
- size: this._container.canvas.size,
9
- position: this.options.position,
10
- });
11
- return Vector.create(exactPosition.x, exactPosition.y);
12
- };
13
- this._updateParticlePosition = (particle, v) => {
14
- if (particle.destroyed) {
15
- return;
16
- }
17
- const container = this._container, canvasSize = container.canvas.size;
18
- if (particle.needsNewPosition) {
19
- const newPosition = calcPositionOrRandomFromSize({ size: canvasSize });
20
- particle.position.setTo(newPosition);
21
- particle.velocity.setTo(particle.initialVelocity);
22
- particle.absorberOrbit = undefined;
23
- particle.needsNewPosition = false;
24
- }
25
- if (this.options.orbits) {
26
- if (particle.absorberOrbit === undefined) {
27
- particle.absorberOrbit = Vector.origin;
28
- particle.absorberOrbit.length = getDistance(particle.getPosition(), this.position);
29
- particle.absorberOrbit.angle = getRandom() * maxAngle;
30
- }
31
- if (particle.absorberOrbit.length <= this.size && !this.options.destroy) {
32
- const minSize = Math.min(canvasSize.width, canvasSize.height), offset = 1, randomOffset = 0.1, randomFactor = 0.2;
33
- particle.absorberOrbit.length = minSize * (offset + (getRandom() * randomFactor - randomOffset));
34
- }
35
- particle.absorberOrbitDirection ??=
36
- particle.velocity.x >= minVelocity ? RotateDirection.clockwise : RotateDirection.counterClockwise;
37
- const orbitRadius = particle.absorberOrbit.length, orbitAngle = particle.absorberOrbit.angle, orbitDirection = particle.absorberOrbitDirection;
38
- particle.velocity.setTo(Vector.origin);
39
- const updateFunc = {
40
- x: orbitDirection === RotateDirection.clockwise ? Math.cos : Math.sin,
41
- y: orbitDirection === RotateDirection.clockwise ? Math.sin : Math.cos,
42
- };
43
- particle.position.x = this.position.x + orbitRadius * updateFunc.x(orbitAngle);
44
- particle.position.y = this.position.y + orbitRadius * updateFunc.y(orbitAngle);
45
- particle.absorberOrbit.length -= v.length;
46
- particle.absorberOrbit.angle +=
47
- (((particle.retina.moveSpeed ?? minVelocity) * container.retina.pixelRatio) / percentDenominator) *
48
- container.retina.reduceFactor;
49
- }
50
- else {
51
- const addV = Vector.origin;
52
- addV.length = v.length;
53
- addV.angle = v.angle;
54
- particle.velocity.addTo(addV);
55
- }
56
- };
57
24
  this._container = container;
58
25
  this._engine = engine;
26
+ this._currentDuration = 0;
27
+ this._currentSpawnDelay = 0;
59
28
  this.initialPosition = position ? Vector.create(position.x, position.y) : undefined;
60
29
  if (options instanceof Absorber) {
61
30
  this.options = options;
@@ -79,6 +48,13 @@ export class AbsorberInstance {
79
48
  r: 0,
80
49
  };
81
50
  this.position = this.initialPosition?.copy() ?? this._calcPosition();
51
+ this._firstSpawn = !this.options.life.wait;
52
+ this._lifeCount = this.options.life.count ?? defaultLifeCount;
53
+ this._immortal = this._lifeCount <= minLifeCount;
54
+ this._spawnDelay = container.retina.reduceFactor
55
+ ? (getRangeValue(this.options.life.delay ?? defaultLifeDelay) * millisecondsToSeconds) /
56
+ container.retina.reduceFactor
57
+ : Infinity;
82
58
  }
83
59
  attract(particle, delta) {
84
60
  const container = this._container, options = this.options, pos = particle.getPosition(), { dx, dy, distance } = getDistances(this.position, pos), v = Vector.create(dx, dy);
@@ -127,4 +103,101 @@ export class AbsorberInstance {
127
103
  ? initialPosition
128
104
  : this._calcPosition();
129
105
  }
106
+ update(delta) {
107
+ if (this._firstSpawn) {
108
+ this._firstSpawn = false;
109
+ this._currentSpawnDelay = this._spawnDelay ?? defaultSpawnDelay;
110
+ }
111
+ if (this._duration !== undefined) {
112
+ this._currentDuration += delta.value;
113
+ if (this._currentDuration >= this._duration) {
114
+ if (!this._immortal) {
115
+ this._lifeCount--;
116
+ }
117
+ if (this._lifeCount > minLifeCount || this._immortal) {
118
+ this.position = this._calcPosition();
119
+ this._spawnDelay = this._container.retina.reduceFactor
120
+ ? (getRangeValue(this.options.life.delay ?? defaultLifeDelay) * millisecondsToSeconds) /
121
+ this._container.retina.reduceFactor
122
+ : Infinity;
123
+ }
124
+ this._currentDuration -= this._duration;
125
+ delete this._duration;
126
+ }
127
+ }
128
+ if (this._spawnDelay !== undefined) {
129
+ this._currentSpawnDelay += delta.value;
130
+ if (this._currentSpawnDelay >= this._spawnDelay) {
131
+ this.play();
132
+ this._currentSpawnDelay -= this._spawnDelay;
133
+ delete this._spawnDelay;
134
+ }
135
+ }
136
+ }
137
+ _calcPosition = () => {
138
+ const exactPosition = calcPositionOrRandomFromSizeRanged({
139
+ size: this._container.canvas.size,
140
+ position: this.options.position,
141
+ });
142
+ return Vector.create(exactPosition.x, exactPosition.y);
143
+ };
144
+ _prepareToDie = () => {
145
+ const duration = this.options.life.duration !== undefined ? getRangeValue(this.options.life.duration) : undefined, minDuration = 0;
146
+ if ((this._lifeCount > minLifeCount || this._immortal) && duration !== undefined && duration > minDuration) {
147
+ this._duration = duration * millisecondsToSeconds;
148
+ }
149
+ };
150
+ _updateParticlePosition = (particle, v) => {
151
+ if (particle.destroyed) {
152
+ return;
153
+ }
154
+ const container = this._container, canvasSize = container.canvas.size;
155
+ if (particle.needsNewPosition) {
156
+ const newPosition = calcPositionOrRandomFromSize({ size: canvasSize });
157
+ particle.position.setTo(newPosition);
158
+ particle.velocity.setTo(particle.initialVelocity);
159
+ particle.absorberOrbit = undefined;
160
+ particle.needsNewPosition = false;
161
+ }
162
+ if (this.options.orbits) {
163
+ if (particle.absorberOrbit === undefined) {
164
+ particle.absorberOrbit = Vector.origin;
165
+ particle.absorberOrbit.length = getDistance(particle.getPosition(), this.position);
166
+ particle.absorberOrbit.angle = getRandom() * maxAngle;
167
+ }
168
+ if (particle.absorberOrbit.length <= this.size && !this.options.destroy) {
169
+ const minSize = Math.min(canvasSize.width, canvasSize.height), offset = 1, randomOffset = 0.1, randomFactor = 0.2;
170
+ particle.absorberOrbit.length = minSize * (offset + (getRandom() * randomFactor - randomOffset));
171
+ }
172
+ particle.absorberOrbitDirection ??=
173
+ particle.velocity.x >= minVelocity ? RotateDirection.clockwise : RotateDirection.counterClockwise;
174
+ const orbitRadius = particle.absorberOrbit.length, orbitAngle = particle.absorberOrbit.angle, orbitDirection = particle.absorberOrbitDirection;
175
+ particle.velocity.setTo(Vector.origin);
176
+ const updateFunc = {
177
+ x: orbitDirection === RotateDirection.clockwise ? Math.cos : Math.sin,
178
+ y: orbitDirection === RotateDirection.clockwise ? Math.sin : Math.cos,
179
+ };
180
+ particle.position.x = this.position.x + orbitRadius * updateFunc.x(orbitAngle);
181
+ particle.position.y = this.position.y + orbitRadius * updateFunc.y(orbitAngle);
182
+ particle.absorberOrbit.length -= v.length;
183
+ particle.absorberOrbit.angle +=
184
+ (((particle.retina.moveSpeed ?? minVelocity) * container.retina.pixelRatio) / percentDenominator) *
185
+ container.retina.reduceFactor;
186
+ }
187
+ else {
188
+ const addV = Vector.origin;
189
+ addV.length = v.length;
190
+ addV.angle = v.angle;
191
+ particle.velocity.addTo(addV);
192
+ }
193
+ };
194
+ play = () => {
195
+ if (!((this._lifeCount > minLifeCount || this._immortal || !this.options.life.count) &&
196
+ (this._firstSpawn || this._currentSpawnDelay >= (this._spawnDelay ?? defaultSpawnDelay)))) {
197
+ return;
198
+ }
199
+ if (this._lifeCount > minLifeCount || this._immortal) {
200
+ this._prepareToDie();
201
+ }
202
+ };
130
203
  }
@@ -1,6 +1,8 @@
1
1
  import { isNumber } from "@tsparticles/engine";
2
2
  const defaultIndex = 0;
3
3
  export class AbsorbersInstancesManager {
4
+ _containerArrays;
5
+ _engine;
4
6
  constructor(engine) {
5
7
  this._containerArrays = new Map();
6
8
  this._engine = engine;
@@ -3,9 +3,14 @@ import { getDistance, isArray, isInArray, itemFromArray, } from "@tsparticles/en
3
3
  import { Absorber } from "./Options/Classes/Absorber.js";
4
4
  const absorbersMode = "absorbers";
5
5
  export class AbsorbersInteractor extends ExternalInteractorBase {
6
+ handleClickMode;
7
+ maxDistance;
8
+ _dragging = false;
9
+ _draggingAbsorber;
10
+ _instancesManager;
6
11
  constructor(container, instancesManager) {
7
12
  super(container);
8
- this.dragging = false;
13
+ this.maxDistance = 0;
9
14
  this._instancesManager = instancesManager;
10
15
  this._instancesManager.initContainer(container);
11
16
  this.handleClickMode = (mode, interactivityData) => {
@@ -38,15 +43,15 @@ export class AbsorbersInteractor extends ExternalInteractorBase {
38
43
  if (mouse.clicking && mouse.downPosition) {
39
44
  const mouseDist = getDistance(absorber.position, mouse.downPosition);
40
45
  if (mouseDist <= absorber.size) {
41
- this.dragging = true;
42
- this.draggingAbsorber = absorber;
46
+ this._dragging = true;
47
+ this._draggingAbsorber = absorber;
43
48
  }
44
49
  }
45
50
  else {
46
- this.dragging = false;
47
- this.draggingAbsorber = undefined;
51
+ this._dragging = false;
52
+ this._draggingAbsorber = undefined;
48
53
  }
49
- if (this.dragging && this.draggingAbsorber == absorber && mouse.position) {
54
+ if (this._dragging && this._draggingAbsorber == absorber && mouse.position) {
50
55
  absorber.position.x = mouse.position.x;
51
56
  absorber.position.y = mouse.position.y;
52
57
  }
@@ -1,8 +1,9 @@
1
1
  import { executeOnSingleOrMultiple, isArray, } from "@tsparticles/engine";
2
2
  import { Absorber } from "./Options/Classes/Absorber.js";
3
3
  export class AbsorbersPlugin {
4
+ id = "absorbers";
5
+ _instancesManager;
4
6
  constructor(instancesManager) {
5
- this.id = "absorbers";
6
7
  this._instancesManager = instancesManager;
7
8
  }
8
9
  async getPlugin(container) {
@@ -1,5 +1,7 @@
1
1
  import { executeOnSingleOrMultiple, isArray, } from "@tsparticles/engine";
2
2
  export class AbsorbersPluginInstance {
3
+ _container;
4
+ _instancesManager;
3
5
  constructor(container, instancesManager) {
4
6
  this._container = container;
5
7
  this._instancesManager = instancesManager;
@@ -1,6 +1,16 @@
1
1
  import { OptionsColor, isNull, setRangeValue, } from "@tsparticles/engine";
2
+ import { AbsorberLife } from "./AbsorberLife.js";
2
3
  import { AbsorberSize } from "./AbsorberSize.js";
3
4
  export class Absorber {
5
+ color;
6
+ destroy;
7
+ draggable;
8
+ life;
9
+ name;
10
+ opacity;
11
+ orbits;
12
+ position;
13
+ size;
4
14
  constructor() {
5
15
  this.color = new OptionsColor();
6
16
  this.color.value = "#000000";
@@ -8,6 +18,7 @@ export class Absorber {
8
18
  this.opacity = 1;
9
19
  this.destroy = true;
10
20
  this.orbits = false;
21
+ this.life = new AbsorberLife();
11
22
  this.size = new AbsorberSize();
12
23
  }
13
24
  load(data) {
@@ -20,6 +31,9 @@ export class Absorber {
20
31
  if (data.draggable !== undefined) {
21
32
  this.draggable = data.draggable;
22
33
  }
34
+ if (data.life !== undefined) {
35
+ this.life.load(data.life);
36
+ }
23
37
  this.name = data.name;
24
38
  if (data.opacity !== undefined) {
25
39
  this.opacity = data.opacity;
@@ -0,0 +1,27 @@
1
+ import { isNull, setRangeValue } from "@tsparticles/engine";
2
+ export class AbsorberLife {
3
+ count;
4
+ delay;
5
+ duration;
6
+ wait;
7
+ constructor() {
8
+ this.wait = false;
9
+ }
10
+ load(data) {
11
+ if (isNull(data)) {
12
+ return;
13
+ }
14
+ if (data.count !== undefined) {
15
+ this.count = data.count;
16
+ }
17
+ if (data.delay !== undefined) {
18
+ this.delay = setRangeValue(data.delay);
19
+ }
20
+ if (data.duration !== undefined) {
21
+ this.duration = setRangeValue(data.duration);
22
+ }
23
+ if (data.wait !== undefined) {
24
+ this.wait = data.wait;
25
+ }
26
+ }
27
+ }
@@ -1,6 +1,8 @@
1
1
  import { ValueWithRandom, isNull, isNumber } from "@tsparticles/engine";
2
2
  import { AbsorberSizeLimit } from "./AbsorberSizeLimit.js";
3
3
  export class AbsorberSize extends ValueWithRandom {
4
+ density;
5
+ limit;
4
6
  constructor() {
5
7
  super();
6
8
  this.density = 5;
@@ -1,5 +1,7 @@
1
1
  import { isNull } from "@tsparticles/engine";
2
2
  export class AbsorberSizeLimit {
3
+ mass;
4
+ radius;
3
5
  constructor() {
4
6
  this.radius = 0;
5
7
  this.mass = 0;
@@ -0,0 +1 @@
1
+ export {};
package/esm/index.js CHANGED
@@ -1,8 +1,12 @@
1
1
  export async function loadAbsorbersPlugin(engine) {
2
- engine.checkVersion("4.0.0-alpha.5");
2
+ engine.checkVersion("4.0.0-beta.0");
3
3
  await engine.register(async (e) => {
4
- const { loadInteractivityPlugin } = await import("@tsparticles/plugin-interactivity"), { AbsorbersInstancesManager } = await import("./AbsorbersInstancesManager.js"), { AbsorbersPlugin } = await import("./AbsorbersPlugin.js"), instancesManager = new AbsorbersInstancesManager(e);
5
- await loadInteractivityPlugin(e);
4
+ const [{ ensureInteractivityPluginLoaded }, { AbsorbersInstancesManager }, { AbsorbersPlugin },] = await Promise.all([
5
+ import("@tsparticles/plugin-interactivity"),
6
+ import("./AbsorbersInstancesManager.js"),
7
+ import("./AbsorbersPlugin.js"),
8
+ ]), instancesManager = new AbsorbersInstancesManager(e);
9
+ ensureInteractivityPluginLoaded(e);
6
10
  e.addPlugin(new AbsorbersPlugin(instancesManager));
7
11
  e.addInteractor?.("externalAbsorbers", async (container) => {
8
12
  const { AbsorbersInteractor } = await import("./AbsorbersInteractor.js");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tsparticles/plugin-absorbers",
3
- "version": "4.0.0-alpha.5",
3
+ "version": "4.0.0-beta.0",
4
4
  "description": "tsParticles absorbers 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/engine": "4.0.0-alpha.5",
90
- "@tsparticles/plugin-interactivity": "4.0.0-alpha.5"
89
+ "@tsparticles/engine": "4.0.0-beta.0",
90
+ "@tsparticles/plugin-interactivity": "4.0.0-beta.0"
91
91
  },
92
92
  "publishConfig": {
93
93
  "access": "public"