@tsparticles/engine 3.2.1 → 3.3.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.
- package/174.min.js +2 -0
- package/174.min.js.LICENSE.txt +1 -0
- package/browser/Core/Canvas.js +9 -9
- package/browser/Core/Container.js +7 -7
- package/browser/Core/Engine.js +1 -1
- package/browser/Core/Particle.js +12 -13
- package/browser/Core/Particles.js +30 -30
- package/browser/Core/Utils/EventListeners.js +4 -3
- package/browser/Core/Utils/InteractionManager.js +4 -4
- package/browser/Core/Utils/QuadTree.js +4 -5
- package/browser/Core/Utils/Ranges.js +55 -0
- package/browser/Core/Utils/{Vector3d.js → Vectors.js} +15 -1
- package/browser/Options/Classes/AnimatableColor.js +1 -1
- package/browser/Options/Classes/BackgroundMask/BackgroundMask.js +1 -1
- package/browser/Options/Classes/Options.js +2 -1
- package/browser/Options/Classes/OptionsColor.js +1 -1
- package/browser/Options/Classes/Particles/Move/Move.js +1 -1
- package/browser/Types/RangeType.js +1 -0
- package/browser/Utils/CanvasUtils.js +14 -14
- package/browser/Utils/ColorUtils.js +2 -1
- package/browser/Utils/NumberUtils.js +2 -2
- package/browser/Utils/TypeUtils.js +18 -0
- package/browser/Utils/Utils.js +2 -19
- package/browser/exports.js +3 -5
- package/cjs/Core/Canvas.js +9 -9
- package/cjs/Core/Container.js +7 -7
- package/cjs/Core/Engine.js +2 -25
- package/cjs/Core/Particle.js +15 -16
- package/cjs/Core/Particles.js +32 -55
- package/cjs/Core/Utils/EventListeners.js +4 -3
- package/cjs/Core/Utils/InteractionManager.js +4 -4
- package/cjs/Core/Utils/QuadTree.js +7 -8
- package/cjs/Core/Utils/Ranges.js +61 -0
- package/cjs/Core/Utils/{Vector3d.js → Vectors.js} +18 -3
- package/cjs/Options/Classes/AnimatableColor.js +2 -2
- package/cjs/Options/Classes/BackgroundMask/BackgroundMask.js +2 -2
- package/cjs/Options/Classes/Options.js +2 -1
- package/cjs/Options/Classes/OptionsColor.js +2 -2
- package/cjs/Options/Classes/Particles/Move/Move.js +4 -4
- package/cjs/Types/RangeType.js +2 -0
- package/cjs/Utils/CanvasUtils.js +14 -14
- package/cjs/Utils/ColorUtils.js +9 -8
- package/cjs/Utils/NumberUtils.js +9 -9
- package/cjs/Utils/TypeUtils.js +27 -0
- package/cjs/Utils/Utils.js +13 -36
- package/cjs/exports.js +3 -5
- package/dist_browser_Core_Container_js.js +17 -7
- package/esm/Core/Canvas.js +9 -9
- package/esm/Core/Container.js +7 -7
- package/esm/Core/Engine.js +1 -1
- package/esm/Core/Particle.js +12 -13
- package/esm/Core/Particles.js +30 -30
- package/esm/Core/Utils/EventListeners.js +4 -3
- package/esm/Core/Utils/InteractionManager.js +4 -4
- package/esm/Core/Utils/QuadTree.js +4 -5
- package/esm/Core/Utils/Ranges.js +55 -0
- package/esm/Core/Utils/{Vector3d.js → Vectors.js} +15 -1
- package/esm/Options/Classes/AnimatableColor.js +1 -1
- package/esm/Options/Classes/BackgroundMask/BackgroundMask.js +1 -1
- package/esm/Options/Classes/Options.js +2 -1
- package/esm/Options/Classes/OptionsColor.js +1 -1
- package/esm/Options/Classes/Particles/Move/Move.js +1 -1
- package/esm/Types/RangeType.js +1 -0
- package/esm/Utils/CanvasUtils.js +14 -14
- package/esm/Utils/ColorUtils.js +2 -1
- package/esm/Utils/NumberUtils.js +2 -2
- package/esm/Utils/TypeUtils.js +18 -0
- package/esm/Utils/Utils.js +2 -19
- package/esm/exports.js +3 -5
- package/package.json +1 -1
- package/report.html +1 -1
- package/tsparticles.engine.js +32 -52
- package/tsparticles.engine.min.js +1 -1
- package/tsparticles.engine.min.js.LICENSE.txt +1 -1
- package/types/Core/Canvas.d.ts +4 -4
- package/types/Core/Interfaces/ICircleBouncer.d.ts +1 -1
- package/types/Core/Interfaces/IContainerPlugin.d.ts +4 -4
- package/types/Core/Interfaces/IEffectDrawer.d.ts +3 -3
- package/types/Core/Interfaces/IExternalInteractor.d.ts +1 -1
- package/types/Core/Interfaces/IMovePathGenerator.d.ts +3 -3
- package/types/Core/Interfaces/IParticleMover.d.ts +2 -2
- package/types/Core/Interfaces/IParticleUpdater.d.ts +2 -2
- package/types/Core/Interfaces/IParticlesInteractor.d.ts +1 -1
- package/types/Core/Interfaces/IShapeDrawer.d.ts +4 -4
- package/types/Core/Particle.d.ts +3 -4
- package/types/Core/Particles.d.ts +7 -7
- package/types/Core/Utils/ExternalInteractorBase.d.ts +1 -1
- package/types/Core/Utils/InteractionManager.d.ts +2 -2
- package/types/Core/Utils/ParticlesInteractorBase.d.ts +1 -1
- package/types/Core/Utils/QuadTree.d.ts +2 -3
- package/types/Core/Utils/Ranges.d.ts +21 -0
- package/types/Core/Utils/{Vector3d.d.ts → Vectors.d.ts} +6 -0
- package/types/Types/RangeType.d.ts +4 -0
- package/types/Utils/CanvasUtils.d.ts +6 -6
- package/types/Utils/NumberUtils.d.ts +1 -1
- package/types/Utils/TypeUtils.d.ts +6 -0
- package/types/Utils/Utils.d.ts +0 -6
- package/types/exports.d.ts +3 -5
- package/umd/Core/Canvas.js +9 -9
- package/umd/Core/Container.js +7 -7
- package/umd/Core/Engine.js +1 -1
- package/umd/Core/Particle.js +16 -17
- package/umd/Core/Particles.js +33 -57
- package/umd/Core/Utils/EventListeners.js +5 -4
- package/umd/Core/Utils/InteractionManager.js +4 -4
- package/umd/Core/Utils/QuadTree.js +8 -9
- package/umd/Core/Utils/Ranges.js +71 -0
- package/umd/Core/Utils/{Vector3d.js → Vectors.js} +19 -4
- package/umd/Options/Classes/AnimatableColor.js +3 -3
- package/umd/Options/Classes/BackgroundMask/BackgroundMask.js +3 -3
- package/umd/Options/Classes/Options.js +3 -2
- package/umd/Options/Classes/OptionsColor.js +3 -3
- package/umd/Options/Classes/Particles/Move/Move.js +5 -5
- package/umd/{Core/Utils/Range.js → Types/RangeType.js} +0 -10
- package/umd/Utils/CanvasUtils.js +14 -14
- package/umd/Utils/ColorUtils.js +10 -9
- package/umd/Utils/NumberUtils.js +10 -10
- package/umd/Utils/TypeUtils.js +37 -0
- package/umd/Utils/Utils.js +14 -37
- package/umd/exports.js +4 -6
- package/373.min.js +0 -2
- package/373.min.js.LICENSE.txt +0 -1
- package/438.min.js +0 -2
- package/438.min.js.LICENSE.txt +0 -1
- package/browser/Core/Utils/Circle.js +0 -28
- package/browser/Core/Utils/Range.js +0 -8
- package/browser/Core/Utils/Rectangle.js +0 -22
- package/browser/Core/Utils/Vector.js +0 -20
- package/cjs/Core/Utils/Circle.js +0 -32
- package/cjs/Core/Utils/Range.js +0 -12
- package/cjs/Core/Utils/Rectangle.js +0 -26
- package/cjs/Core/Utils/Vector.js +0 -24
- package/dist_browser_Core_Particle_js.js +0 -32
- package/esm/Core/Utils/Circle.js +0 -28
- package/esm/Core/Utils/Range.js +0 -8
- package/esm/Core/Utils/Rectangle.js +0 -22
- package/esm/Core/Utils/Vector.js +0 -20
- package/types/Core/Utils/Circle.d.ts +0 -8
- package/types/Core/Utils/Range.d.ts +0 -7
- package/types/Core/Utils/Rectangle.d.ts +0 -9
- package/types/Core/Utils/Vector.d.ts +0 -8
- package/umd/Core/Utils/Circle.js +0 -42
- package/umd/Core/Utils/Rectangle.js +0 -36
- package/umd/Core/Utils/Vector.js +0 -34
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare function isBoolean(arg: unknown): arg is boolean;
|
|
2
|
+
export declare function isString(arg: unknown): arg is string;
|
|
3
|
+
export declare function isNumber(arg: unknown): arg is number;
|
|
4
|
+
export declare function isFunction(arg: unknown): arg is Function;
|
|
5
|
+
export declare function isObject<T extends object>(arg: unknown): arg is T;
|
|
6
|
+
export declare function isArray<T>(arg: unknown): arg is T[];
|
package/types/Utils/Utils.d.ts
CHANGED
|
@@ -47,11 +47,5 @@ export declare function findItemFromSingleOrMultiple<T>(obj: SingleOrMultiple<T>
|
|
|
47
47
|
export declare function initParticleNumericAnimationValue(options: RangedAnimationValueWithRandom, pxRatio: number): IParticleNumericValueAnimation;
|
|
48
48
|
export declare function getPosition(position: ICoordinatesWithMode, canvasSize: IDimension): ICoordinates;
|
|
49
49
|
export declare function getSize(size: IDimensionWithMode, canvasSize: IDimension): IDimension;
|
|
50
|
-
export declare function isBoolean(arg: unknown): arg is boolean;
|
|
51
|
-
export declare function isString(arg: unknown): arg is string;
|
|
52
|
-
export declare function isNumber(arg: unknown): arg is number;
|
|
53
|
-
export declare function isFunction(arg: unknown): arg is Function;
|
|
54
|
-
export declare function isObject<T extends object>(arg: unknown): arg is T;
|
|
55
|
-
export declare function isArray<T>(arg: unknown): arg is T[];
|
|
56
50
|
export declare function updateAnimation(particle: Particle, data: IParticleNumericValueAnimation, changeDirection: boolean, destroyType: DestroyType | keyof typeof DestroyType, delta: IDelta): void;
|
|
57
51
|
export {};
|
package/types/exports.d.ts
CHANGED
|
@@ -1,12 +1,9 @@
|
|
|
1
|
-
export * from "./Core/Utils/Circle.js";
|
|
2
1
|
export * from "./Core/Utils/Constants.js";
|
|
3
2
|
export * from "./Core/Utils/ExternalInteractorBase.js";
|
|
4
3
|
export * from "./Core/Utils/ParticlesInteractorBase.js";
|
|
5
4
|
export * from "./Core/Utils/Point.js";
|
|
6
|
-
export * from "./Core/Utils/
|
|
7
|
-
export * from "./Core/Utils/
|
|
8
|
-
export * from "./Core/Utils/Vector.js";
|
|
9
|
-
export * from "./Core/Utils/Vector3d.js";
|
|
5
|
+
export * from "./Core/Utils/Ranges.js";
|
|
6
|
+
export * from "./Core/Utils/Vectors.js";
|
|
10
7
|
export * from "./Enums/Directions/MoveDirection.js";
|
|
11
8
|
export * from "./Enums/Directions/RotateDirection.js";
|
|
12
9
|
export * from "./Enums/Directions/OutModeDirection.js";
|
|
@@ -86,3 +83,4 @@ export * from "./Utils/NumberUtils.js";
|
|
|
86
83
|
export * from "./Utils/OptionsUtils.js";
|
|
87
84
|
export * from "./Utils/RgbColorManager.js";
|
|
88
85
|
export * from "./Utils/Utils.js";
|
|
86
|
+
export * from "./Utils/TypeUtils.js";
|
package/umd/Core/Canvas.js
CHANGED
|
@@ -282,11 +282,11 @@
|
|
|
282
282
|
drawAsync(cb) {
|
|
283
283
|
const ctx = this._context;
|
|
284
284
|
if (!ctx) {
|
|
285
|
-
return
|
|
285
|
+
return undefined;
|
|
286
286
|
}
|
|
287
287
|
return cb(ctx);
|
|
288
288
|
}
|
|
289
|
-
|
|
289
|
+
drawParticle(particle, delta) {
|
|
290
290
|
if (particle.spawning || particle.destroyed) {
|
|
291
291
|
return;
|
|
292
292
|
}
|
|
@@ -305,13 +305,13 @@
|
|
|
305
305
|
if (!fColor && !sColor) {
|
|
306
306
|
return;
|
|
307
307
|
}
|
|
308
|
-
|
|
308
|
+
this.draw((ctx) => {
|
|
309
309
|
const container = this.container, options = container.actualOptions, zIndexOptions = particle.options.zIndex, zIndexFactorOffset = 1, zIndexFactor = zIndexFactorOffset - particle.zIndexFactor, zOpacityFactor = zIndexFactor ** zIndexOptions.opacityRate, defaultOpacity = 1, opacity = particle.bubble.opacity ?? particle.opacity?.value ?? defaultOpacity, strokeOpacity = particle.strokeOpacity ?? opacity, zOpacity = opacity * zOpacityFactor, zStrokeOpacity = strokeOpacity * zOpacityFactor, transform = {}, colorStyles = {
|
|
310
310
|
fill: fColor ? (0, ColorUtils_js_1.getStyleFromHsl)(fColor, zOpacity) : undefined,
|
|
311
311
|
};
|
|
312
312
|
colorStyles.stroke = sColor ? (0, ColorUtils_js_1.getStyleFromHsl)(sColor, zStrokeOpacity) : colorStyles.fill;
|
|
313
313
|
this._applyPreDrawUpdaters(ctx, particle, radius, zOpacity, colorStyles, transform);
|
|
314
|
-
|
|
314
|
+
(0, CanvasUtils_js_1.drawParticle)({
|
|
315
315
|
container,
|
|
316
316
|
context: ctx,
|
|
317
317
|
particle,
|
|
@@ -327,11 +327,11 @@
|
|
|
327
327
|
this._applyPostDrawUpdaters(particle);
|
|
328
328
|
});
|
|
329
329
|
}
|
|
330
|
-
|
|
331
|
-
|
|
330
|
+
drawParticlePlugin(plugin, particle, delta) {
|
|
331
|
+
this.draw((ctx) => (0, CanvasUtils_js_1.drawParticlePlugin)(ctx, plugin, particle, delta));
|
|
332
332
|
}
|
|
333
|
-
|
|
334
|
-
|
|
333
|
+
drawPlugin(plugin, delta) {
|
|
334
|
+
this.draw((ctx) => (0, CanvasUtils_js_1.drawPlugin)(ctx, plugin, delta));
|
|
335
335
|
}
|
|
336
336
|
async init() {
|
|
337
337
|
this._safeMutationObserver((obs) => obs.disconnect());
|
|
@@ -484,7 +484,7 @@
|
|
|
484
484
|
return;
|
|
485
485
|
}
|
|
486
486
|
const container = this.container, needsRefresh = container.updateActualOptions();
|
|
487
|
-
|
|
487
|
+
container.particles.setDensity();
|
|
488
488
|
this._applyResizePlugins();
|
|
489
489
|
if (needsRefresh) {
|
|
490
490
|
await container.refresh();
|
package/umd/Core/Container.js
CHANGED
|
@@ -45,14 +45,14 @@
|
|
|
45
45
|
continue;
|
|
46
46
|
}
|
|
47
47
|
if (entry.isIntersecting) {
|
|
48
|
-
this.play();
|
|
48
|
+
void this.play();
|
|
49
49
|
}
|
|
50
50
|
else {
|
|
51
51
|
this.pause();
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
54
|
};
|
|
55
|
-
this._nextFrame =
|
|
55
|
+
this._nextFrame = (timestamp) => {
|
|
56
56
|
try {
|
|
57
57
|
if (!this._smooth &&
|
|
58
58
|
this._lastFrameTime !== undefined &&
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
this.draw(false);
|
|
69
69
|
return;
|
|
70
70
|
}
|
|
71
|
-
|
|
71
|
+
this.particles.draw(delta);
|
|
72
72
|
if (!this.alive()) {
|
|
73
73
|
this.destroy();
|
|
74
74
|
return;
|
|
@@ -249,14 +249,14 @@
|
|
|
249
249
|
return;
|
|
250
250
|
}
|
|
251
251
|
let refreshTime = force;
|
|
252
|
-
const frame =
|
|
252
|
+
const frame = (timestamp) => {
|
|
253
253
|
if (refreshTime) {
|
|
254
254
|
this._lastFrameTime = undefined;
|
|
255
255
|
refreshTime = false;
|
|
256
256
|
}
|
|
257
|
-
|
|
257
|
+
this._nextFrame(timestamp);
|
|
258
258
|
};
|
|
259
|
-
this._drawAnimationFrame = requestAnimationFrame((timestamp) =>
|
|
259
|
+
this._drawAnimationFrame = requestAnimationFrame((timestamp) => frame(timestamp));
|
|
260
260
|
}
|
|
261
261
|
async export(type, options = {}) {
|
|
262
262
|
for (const [, plugin] of this.plugins) {
|
|
@@ -328,7 +328,7 @@
|
|
|
328
328
|
}
|
|
329
329
|
this._engine.dispatchEvent("containerInit", { container: this });
|
|
330
330
|
await this.particles.init();
|
|
331
|
-
|
|
331
|
+
this.particles.setDensity();
|
|
332
332
|
for (const [, plugin] of this.plugins) {
|
|
333
333
|
plugin.particlesSetup?.();
|
|
334
334
|
}
|
package/umd/Core/Engine.js
CHANGED
package/umd/Core/Particle.js
CHANGED
|
@@ -4,19 +4,18 @@
|
|
|
4
4
|
if (v !== undefined) module.exports = v;
|
|
5
5
|
}
|
|
6
6
|
else if (typeof define === "function" && define.amd) {
|
|
7
|
-
define(["require", "exports", "../Utils/NumberUtils.js", "../Utils/Utils.js", "./Utils/Constants.js", "../Utils/ColorUtils.js", "../Options/Classes/Interactivity/Interactivity.js", "
|
|
7
|
+
define(["require", "exports", "./Utils/Vectors.js", "../Utils/NumberUtils.js", "../Utils/Utils.js", "./Utils/Constants.js", "../Utils/ColorUtils.js", "../Options/Classes/Interactivity/Interactivity.js", "../Utils/CanvasUtils.js", "../Utils/OptionsUtils.js"], factory);
|
|
8
8
|
}
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
12
|
exports.Particle = void 0;
|
|
13
|
+
const Vectors_js_1 = require("./Utils/Vectors.js");
|
|
13
14
|
const NumberUtils_js_1 = require("../Utils/NumberUtils.js");
|
|
14
15
|
const Utils_js_1 = require("../Utils/Utils.js");
|
|
15
16
|
const Constants_js_1 = require("./Utils/Constants.js");
|
|
16
17
|
const ColorUtils_js_1 = require("../Utils/ColorUtils.js");
|
|
17
18
|
const Interactivity_js_1 = require("../Options/Classes/Interactivity/Interactivity.js");
|
|
18
|
-
const Vector_js_1 = require("./Utils/Vector.js");
|
|
19
|
-
const Vector3d_js_1 = require("./Utils/Vector3d.js");
|
|
20
19
|
const CanvasUtils_js_1 = require("../Utils/CanvasUtils.js");
|
|
21
20
|
const OptionsUtils_js_1 = require("../Utils/OptionsUtils.js");
|
|
22
21
|
const defaultRetryCount = 0, double = 2, half = 0.5, squareExp = 2;
|
|
@@ -59,13 +58,13 @@
|
|
|
59
58
|
for (const [, plugin] of container.plugins) {
|
|
60
59
|
const pluginPos = plugin.particlePosition !== undefined ? plugin.particlePosition(position, this) : undefined;
|
|
61
60
|
if (pluginPos) {
|
|
62
|
-
return
|
|
61
|
+
return Vectors_js_1.Vector3d.create(pluginPos.x, pluginPos.y, zIndex);
|
|
63
62
|
}
|
|
64
63
|
}
|
|
65
64
|
const canvasSize = container.canvas.size, exactPosition = (0, NumberUtils_js_1.calcExactPositionOrRandomFromSize)({
|
|
66
65
|
size: canvasSize,
|
|
67
66
|
position: position,
|
|
68
|
-
}), pos =
|
|
67
|
+
}), pos = Vectors_js_1.Vector3d.create(exactPosition.x, exactPosition.y, zIndex), radius = this.getRadius(), outModes = this.options.move.outModes, fixHorizontal = (outMode) => {
|
|
69
68
|
fixOutMode({
|
|
70
69
|
outMode,
|
|
71
70
|
checkModes: ["bounce"],
|
|
@@ -161,7 +160,7 @@
|
|
|
161
160
|
this.outType = "outside";
|
|
162
161
|
break;
|
|
163
162
|
}
|
|
164
|
-
this.offset =
|
|
163
|
+
this.offset = Vectors_js_1.Vector.origin;
|
|
165
164
|
};
|
|
166
165
|
this._engine = engine;
|
|
167
166
|
}
|
|
@@ -188,12 +187,12 @@
|
|
|
188
187
|
},
|
|
189
188
|
});
|
|
190
189
|
}
|
|
191
|
-
|
|
190
|
+
draw(delta) {
|
|
192
191
|
const container = this.container, canvas = container.canvas;
|
|
193
192
|
for (const [, plugin] of container.plugins) {
|
|
194
|
-
|
|
193
|
+
canvas.drawParticlePlugin(plugin, this, delta);
|
|
195
194
|
}
|
|
196
|
-
|
|
195
|
+
canvas.drawParticle(this, delta);
|
|
197
196
|
}
|
|
198
197
|
getFillColor() {
|
|
199
198
|
return this._getRollColor(this.bubble.color ?? (0, ColorUtils_js_1.getHslFromAnimation)(this.color));
|
|
@@ -214,7 +213,7 @@
|
|
|
214
213
|
getStrokeColor() {
|
|
215
214
|
return this._getRollColor(this.bubble.color ?? (0, ColorUtils_js_1.getHslFromAnimation)(this.strokeColor));
|
|
216
215
|
}
|
|
217
|
-
|
|
216
|
+
init(id, position, overrideOptions, group) {
|
|
218
217
|
const container = this.container, engine = this._engine;
|
|
219
218
|
this.id = id;
|
|
220
219
|
this.group = group;
|
|
@@ -278,7 +277,7 @@
|
|
|
278
277
|
if (pathOptions.generator) {
|
|
279
278
|
this.pathGenerator = this._engine.getPathGenerator(pathOptions.generator);
|
|
280
279
|
if (this.pathGenerator && container.addPath(pathOptions.generator, this.pathGenerator)) {
|
|
281
|
-
|
|
280
|
+
this.pathGenerator.init(container);
|
|
282
281
|
}
|
|
283
282
|
}
|
|
284
283
|
container.retina.initParticle(this);
|
|
@@ -307,7 +306,7 @@
|
|
|
307
306
|
}
|
|
308
307
|
}
|
|
309
308
|
if (effectDrawer?.loadEffect) {
|
|
310
|
-
|
|
309
|
+
effectDrawer.loadEffect(this);
|
|
311
310
|
}
|
|
312
311
|
let shapeDrawer = container.shapeDrawers.get(this.shape);
|
|
313
312
|
if (!shapeDrawer) {
|
|
@@ -317,7 +316,7 @@
|
|
|
317
316
|
}
|
|
318
317
|
}
|
|
319
318
|
if (shapeDrawer?.loadShape) {
|
|
320
|
-
|
|
319
|
+
shapeDrawer.loadShape(this);
|
|
321
320
|
}
|
|
322
321
|
const sideCountFunc = shapeDrawer?.getSidesCount;
|
|
323
322
|
if (sideCountFunc) {
|
|
@@ -326,13 +325,13 @@
|
|
|
326
325
|
this.spawning = false;
|
|
327
326
|
this.shadowColor = (0, ColorUtils_js_1.rangeColorToRgb)(this.options.shadow.color);
|
|
328
327
|
for (const updater of particles.updaters) {
|
|
329
|
-
|
|
328
|
+
updater.init(this);
|
|
330
329
|
}
|
|
331
330
|
for (const mover of particles.movers) {
|
|
332
|
-
|
|
331
|
+
mover.init?.(this);
|
|
333
332
|
}
|
|
334
|
-
|
|
335
|
-
|
|
333
|
+
effectDrawer?.particleInit?.(container, this);
|
|
334
|
+
shapeDrawer?.particleInit?.(container, this);
|
|
336
335
|
for (const [, plugin] of container.plugins) {
|
|
337
336
|
plugin.particleCreated?.(this);
|
|
338
337
|
}
|
package/umd/Core/Particles.js
CHANGED
|
@@ -1,49 +1,26 @@
|
|
|
1
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
2
|
-
if (k2 === undefined) k2 = k;
|
|
3
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
4
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
5
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
6
|
-
}
|
|
7
|
-
Object.defineProperty(o, k2, desc);
|
|
8
|
-
}) : (function(o, m, k, k2) {
|
|
9
|
-
if (k2 === undefined) k2 = k;
|
|
10
|
-
o[k2] = m[k];
|
|
11
|
-
}));
|
|
12
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
13
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
14
|
-
}) : function(o, v) {
|
|
15
|
-
o["default"] = v;
|
|
16
|
-
});
|
|
17
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
18
|
-
if (mod && mod.__esModule) return mod;
|
|
19
|
-
var result = {};
|
|
20
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
21
|
-
__setModuleDefault(result, mod);
|
|
22
|
-
return result;
|
|
23
|
-
};
|
|
24
1
|
(function (factory) {
|
|
25
2
|
if (typeof module === "object" && typeof module.exports === "object") {
|
|
26
3
|
var v = factory(require, exports);
|
|
27
4
|
if (v !== undefined) module.exports = v;
|
|
28
5
|
}
|
|
29
6
|
else if (typeof define === "function" && define.amd) {
|
|
30
|
-
define(["require", "exports", "../Utils/Utils.js", "./Utils/InteractionManager.js", "./Utils/Point.js", "./Utils/QuadTree.js", "./Utils/
|
|
7
|
+
define(["require", "exports", "../Utils/Utils.js", "./Utils/InteractionManager.js", "./Particle.js", "./Utils/Point.js", "./Utils/QuadTree.js", "./Utils/Ranges.js", "./Utils/Constants.js"], factory);
|
|
31
8
|
}
|
|
32
9
|
})(function (require, exports) {
|
|
33
10
|
"use strict";
|
|
34
|
-
var __syncRequire = typeof module === "object" && typeof module.exports === "object";
|
|
35
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
12
|
exports.Particles = void 0;
|
|
37
13
|
const Utils_js_1 = require("../Utils/Utils.js");
|
|
38
14
|
const InteractionManager_js_1 = require("./Utils/InteractionManager.js");
|
|
15
|
+
const Particle_js_1 = require("./Particle.js");
|
|
39
16
|
const Point_js_1 = require("./Utils/Point.js");
|
|
40
17
|
const QuadTree_js_1 = require("./Utils/QuadTree.js");
|
|
41
|
-
const
|
|
18
|
+
const Ranges_js_1 = require("./Utils/Ranges.js");
|
|
42
19
|
const Constants_js_1 = require("./Utils/Constants.js");
|
|
43
20
|
const qTreeCapacity = 4, squareExp = 2, defaultRemoveQuantity = 1;
|
|
44
21
|
const qTreeRectangle = (canvasSize) => {
|
|
45
22
|
const { height, width } = canvasSize, posOffset = -0.25, sizeFactor = 1.5;
|
|
46
|
-
return new
|
|
23
|
+
return new Ranges_js_1.Rectangle(posOffset * width, posOffset * height, sizeFactor * width, sizeFactor * height);
|
|
47
24
|
};
|
|
48
25
|
class Particles {
|
|
49
26
|
constructor(engine, container) {
|
|
@@ -52,7 +29,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
52
29
|
this._pool.push(particle);
|
|
53
30
|
}
|
|
54
31
|
};
|
|
55
|
-
this._applyDensity =
|
|
32
|
+
this._applyDensity = (options, manualCount, group) => {
|
|
56
33
|
const numberOptions = options.number;
|
|
57
34
|
if (!options.number.density?.enable) {
|
|
58
35
|
if (group === undefined) {
|
|
@@ -71,7 +48,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
71
48
|
this._groupLimits.set(group, numberOptions.limit.value * densityFactor);
|
|
72
49
|
}
|
|
73
50
|
if (particlesCount < particlesNumber) {
|
|
74
|
-
|
|
51
|
+
this.push(Math.abs(particlesNumber - particlesCount), undefined, options, group);
|
|
75
52
|
}
|
|
76
53
|
else if (particlesCount > particlesNumber) {
|
|
77
54
|
this.removeQuantity(particlesCount - particlesNumber, group);
|
|
@@ -85,14 +62,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
85
62
|
const canvas = container.canvas.element, pxRatio = container.retina.pixelRatio;
|
|
86
63
|
return (canvas.width * canvas.height) / (densityOptions.height * densityOptions.width * pxRatio ** squareExp);
|
|
87
64
|
};
|
|
88
|
-
this._pushParticle =
|
|
65
|
+
this._pushParticle = (position, overrideOptions, group, initializer) => {
|
|
89
66
|
try {
|
|
90
67
|
let particle = this._pool.pop();
|
|
91
68
|
if (!particle) {
|
|
92
|
-
|
|
93
|
-
particle = new Particle(this._engine, this._container);
|
|
69
|
+
particle = new Particle_js_1.Particle(this._engine, this._container);
|
|
94
70
|
}
|
|
95
|
-
|
|
71
|
+
particle.init(this._nextId, position, overrideOptions, group);
|
|
96
72
|
let canAdd = true;
|
|
97
73
|
if (initializer) {
|
|
98
74
|
canAdd = initializer(particle);
|
|
@@ -153,13 +129,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
153
129
|
get count() {
|
|
154
130
|
return this._array.length;
|
|
155
131
|
}
|
|
156
|
-
|
|
132
|
+
addManualParticles() {
|
|
157
133
|
const container = this._container, options = container.actualOptions;
|
|
158
134
|
for (const particle of options.manualParticles) {
|
|
159
|
-
|
|
135
|
+
this.addParticle(particle.position ? (0, Utils_js_1.getPosition)(particle.position, container.canvas.size) : undefined, particle.options);
|
|
160
136
|
}
|
|
161
137
|
}
|
|
162
|
-
|
|
138
|
+
addParticle(position, overrideOptions, group, initializer) {
|
|
163
139
|
const limitOptions = this._container.actualOptions.particles.number.limit, limit = group === undefined ? this._limit : this._groupLimits.get(group) ?? this._limit, currentCount = this.count, minLimit = 0;
|
|
164
140
|
if (limit > minLimit) {
|
|
165
141
|
if (limitOptions.mode === "delete") {
|
|
@@ -174,7 +150,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
174
150
|
}
|
|
175
151
|
}
|
|
176
152
|
}
|
|
177
|
-
return
|
|
153
|
+
return this._pushParticle(position, overrideOptions, group, initializer);
|
|
178
154
|
}
|
|
179
155
|
clear() {
|
|
180
156
|
this._array = [];
|
|
@@ -187,15 +163,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
187
163
|
this.movers = [];
|
|
188
164
|
this.updaters = [];
|
|
189
165
|
}
|
|
190
|
-
|
|
166
|
+
draw(delta) {
|
|
191
167
|
const container = this._container, canvas = container.canvas;
|
|
192
168
|
canvas.clear();
|
|
193
|
-
|
|
169
|
+
this.update(delta);
|
|
194
170
|
for (const [, plugin] of container.plugins) {
|
|
195
|
-
|
|
171
|
+
canvas.drawPlugin(plugin, delta);
|
|
196
172
|
}
|
|
197
173
|
for (const p of this._zArray) {
|
|
198
|
-
|
|
174
|
+
p.draw(delta);
|
|
199
175
|
}
|
|
200
176
|
}
|
|
201
177
|
filter(condition) {
|
|
@@ -224,17 +200,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
224
200
|
break;
|
|
225
201
|
}
|
|
226
202
|
}
|
|
227
|
-
|
|
203
|
+
this.addManualParticles();
|
|
228
204
|
if (!handled) {
|
|
229
205
|
const particlesOptions = options.particles, groups = particlesOptions.groups;
|
|
230
206
|
for (const group in groups) {
|
|
231
207
|
const groupOptions = groups[group];
|
|
232
208
|
for (let i = this.count, j = 0; j < groupOptions.number?.value && i < particlesOptions.number.value; i++, j++) {
|
|
233
|
-
|
|
209
|
+
this.addParticle(undefined, groupOptions, group);
|
|
234
210
|
}
|
|
235
211
|
}
|
|
236
212
|
for (let i = this.count; i < particlesOptions.number.value; i++) {
|
|
237
|
-
|
|
213
|
+
this.addParticle();
|
|
238
214
|
}
|
|
239
215
|
}
|
|
240
216
|
}
|
|
@@ -247,18 +223,18 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
247
223
|
this.updaters = await this._engine.getUpdaters(container, true);
|
|
248
224
|
await this._interactionManager.init();
|
|
249
225
|
for (const [, pathGenerator] of container.pathGenerators) {
|
|
250
|
-
|
|
226
|
+
pathGenerator.init(container);
|
|
251
227
|
}
|
|
252
228
|
}
|
|
253
|
-
|
|
229
|
+
push(nb, mouse, overrideOptions, group) {
|
|
254
230
|
for (let i = 0; i < nb; i++) {
|
|
255
|
-
|
|
231
|
+
this.addParticle(mouse?.position, overrideOptions, group);
|
|
256
232
|
}
|
|
257
233
|
}
|
|
258
234
|
async redraw() {
|
|
259
235
|
this.clear();
|
|
260
236
|
await this.init();
|
|
261
|
-
|
|
237
|
+
this.draw({ value: 0, factor: 0 });
|
|
262
238
|
}
|
|
263
239
|
remove(particle, group, override) {
|
|
264
240
|
this.removeAt(this._array.indexOf(particle), undefined, group, override);
|
|
@@ -279,12 +255,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
279
255
|
const defaultIndex = 0;
|
|
280
256
|
this.removeAt(defaultIndex, quantity, group);
|
|
281
257
|
}
|
|
282
|
-
|
|
258
|
+
setDensity() {
|
|
283
259
|
const options = this._container.actualOptions, groups = options.particles.groups, manualCount = 0;
|
|
284
260
|
for (const group in groups) {
|
|
285
|
-
|
|
261
|
+
this._applyDensity(groups[group], manualCount, group);
|
|
286
262
|
}
|
|
287
|
-
|
|
263
|
+
this._applyDensity(options.particles, options.manualParticles.length);
|
|
288
264
|
}
|
|
289
265
|
setLastZIndex(zIndex) {
|
|
290
266
|
this._lastZIndex = zIndex;
|
|
@@ -293,14 +269,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
293
269
|
setResizeFactor(factor) {
|
|
294
270
|
this._resizeFactor = factor;
|
|
295
271
|
}
|
|
296
|
-
|
|
272
|
+
update(delta) {
|
|
297
273
|
const container = this._container, particlesToDelete = new Set();
|
|
298
274
|
this.quadTree = new QuadTree_js_1.QuadTree(qTreeRectangle(container.canvas.size), qTreeCapacity);
|
|
299
275
|
for (const [, pathGenerator] of container.pathGenerators) {
|
|
300
276
|
pathGenerator.update();
|
|
301
277
|
}
|
|
302
278
|
for (const [, plugin] of container.plugins) {
|
|
303
|
-
|
|
279
|
+
plugin.update?.(delta);
|
|
304
280
|
}
|
|
305
281
|
const resizeFactor = this._resizeFactor;
|
|
306
282
|
for (const particle of this._array) {
|
|
@@ -320,7 +296,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
320
296
|
}
|
|
321
297
|
for (const mover of this.movers) {
|
|
322
298
|
if (mover.isEnabled(particle)) {
|
|
323
|
-
|
|
299
|
+
mover.move(particle, delta);
|
|
324
300
|
}
|
|
325
301
|
}
|
|
326
302
|
if (particle.destroyed) {
|
|
@@ -343,13 +319,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
343
319
|
}
|
|
344
320
|
this._addToPool(...particlesToDelete);
|
|
345
321
|
}
|
|
346
|
-
|
|
322
|
+
this._interactionManager.externalInteract(delta);
|
|
347
323
|
for (const particle of this._array) {
|
|
348
324
|
for (const updater of this.updaters) {
|
|
349
|
-
|
|
325
|
+
updater.update(particle, delta);
|
|
350
326
|
}
|
|
351
327
|
if (!particle.destroyed && !particle.spawning) {
|
|
352
|
-
|
|
328
|
+
this._interactionManager.particlesInteract(particle, delta);
|
|
353
329
|
}
|
|
354
330
|
}
|
|
355
331
|
delete this._resizeFactor;
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
if (v !== undefined) module.exports = v;
|
|
5
5
|
}
|
|
6
6
|
else if (typeof define === "function" && define.amd) {
|
|
7
|
-
define(["require", "exports", "../../Utils/Utils.js", "./Constants.js"], factory);
|
|
7
|
+
define(["require", "exports", "../../Utils/Utils.js", "./Constants.js", "../../Utils/TypeUtils.js"], factory);
|
|
8
8
|
}
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
@@ -12,11 +12,12 @@
|
|
|
12
12
|
exports.EventListeners = void 0;
|
|
13
13
|
const Utils_js_1 = require("../../Utils/Utils.js");
|
|
14
14
|
const Constants_js_1 = require("./Constants.js");
|
|
15
|
+
const TypeUtils_js_1 = require("../../Utils/TypeUtils.js");
|
|
15
16
|
const double = 2;
|
|
16
17
|
function manageListener(element, event, handler, add, options) {
|
|
17
18
|
if (add) {
|
|
18
19
|
let addOptions = { passive: true };
|
|
19
|
-
if ((0,
|
|
20
|
+
if ((0, TypeUtils_js_1.isBoolean)(options)) {
|
|
20
21
|
addOptions.capture = options;
|
|
21
22
|
}
|
|
22
23
|
else if (options !== undefined) {
|
|
@@ -68,10 +69,10 @@
|
|
|
68
69
|
else {
|
|
69
70
|
container.pageHidden = false;
|
|
70
71
|
if (container.animationStatus) {
|
|
71
|
-
container.play(true);
|
|
72
|
+
void container.play(true);
|
|
72
73
|
}
|
|
73
74
|
else {
|
|
74
|
-
container.draw(true);
|
|
75
|
+
void container.draw(true);
|
|
75
76
|
}
|
|
76
77
|
}
|
|
77
78
|
};
|
|
@@ -18,10 +18,10 @@
|
|
|
18
18
|
this._externalInteractors = [];
|
|
19
19
|
this._particleInteractors = [];
|
|
20
20
|
}
|
|
21
|
-
|
|
21
|
+
externalInteract(delta) {
|
|
22
22
|
for (const interactor of this._externalInteractors) {
|
|
23
23
|
if (interactor.isEnabled()) {
|
|
24
|
-
|
|
24
|
+
interactor.interact(delta);
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
}
|
|
@@ -46,13 +46,13 @@
|
|
|
46
46
|
interactor.init();
|
|
47
47
|
}
|
|
48
48
|
}
|
|
49
|
-
|
|
49
|
+
particlesInteract(particle, delta) {
|
|
50
50
|
for (const interactor of this._externalInteractors) {
|
|
51
51
|
interactor.clear(particle, delta);
|
|
52
52
|
}
|
|
53
53
|
for (const interactor of this._particleInteractors) {
|
|
54
54
|
if (interactor.isEnabled(particle)) {
|
|
55
|
-
|
|
55
|
+
interactor.interact(particle, delta);
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
}
|
|
@@ -4,14 +4,13 @@
|
|
|
4
4
|
if (v !== undefined) module.exports = v;
|
|
5
5
|
}
|
|
6
6
|
else if (typeof define === "function" && define.amd) {
|
|
7
|
-
define(["require", "exports", "./
|
|
7
|
+
define(["require", "exports", "./Ranges.js", "../../Utils/NumberUtils.js"], factory);
|
|
8
8
|
}
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
12
|
exports.QuadTree = void 0;
|
|
13
|
-
const
|
|
14
|
-
const Rectangle_js_1 = require("./Rectangle.js");
|
|
13
|
+
const Ranges_js_1 = require("./Ranges.js");
|
|
15
14
|
const NumberUtils_js_1 = require("../../Utils/NumberUtils.js");
|
|
16
15
|
const half = 0.5, double = 2, subdivideCount = 4;
|
|
17
16
|
class QuadTree {
|
|
@@ -22,7 +21,7 @@
|
|
|
22
21
|
const { x, y } = this.rectangle.position, { width, height } = this.rectangle.size, { capacity } = this;
|
|
23
22
|
for (let i = 0; i < subdivideCount; i++) {
|
|
24
23
|
const fixedIndex = i % double;
|
|
25
|
-
this._subs.push(new QuadTree(new
|
|
24
|
+
this._subs.push(new QuadTree(new Ranges_js_1.Rectangle(x + width * half * fixedIndex, y + height * half * (Math.round(i * half) - fixedIndex), width * half, height * half), capacity));
|
|
26
25
|
}
|
|
27
26
|
this._divided = true;
|
|
28
27
|
};
|
|
@@ -43,8 +42,8 @@
|
|
|
43
42
|
}
|
|
44
43
|
return this._subs.some((sub) => sub.insert(point));
|
|
45
44
|
}
|
|
46
|
-
query(range, check
|
|
47
|
-
const res =
|
|
45
|
+
query(range, check) {
|
|
46
|
+
const res = [];
|
|
48
47
|
if (!range.intersects(this.rectangle)) {
|
|
49
48
|
return [];
|
|
50
49
|
}
|
|
@@ -58,16 +57,16 @@
|
|
|
58
57
|
}
|
|
59
58
|
if (this._divided) {
|
|
60
59
|
for (const sub of this._subs) {
|
|
61
|
-
sub.query(range, check
|
|
60
|
+
res.push(...sub.query(range, check));
|
|
62
61
|
}
|
|
63
62
|
}
|
|
64
63
|
return res;
|
|
65
64
|
}
|
|
66
65
|
queryCircle(position, radius, check) {
|
|
67
|
-
return this.query(new
|
|
66
|
+
return this.query(new Ranges_js_1.Circle(position.x, position.y, radius), check);
|
|
68
67
|
}
|
|
69
68
|
queryRectangle(position, size, check) {
|
|
70
|
-
return this.query(new
|
|
69
|
+
return this.query(new Ranges_js_1.Rectangle(position.x, position.y, size.width, size.height), check);
|
|
71
70
|
}
|
|
72
71
|
}
|
|
73
72
|
exports.QuadTree = QuadTree;
|