@tsparticles/engine 3.4.0 → 3.6.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.
- package/README.md +0 -2
- package/browser/Core/Canvas.js +4 -6
- package/browser/Core/Container.js +15 -15
- package/browser/Core/Engine.js +1 -1
- package/browser/Core/Particle.js +4 -4
- package/browser/Core/Particles.js +9 -8
- package/browser/Core/Utils/EventListeners.js +1 -1
- package/browser/Utils/CanvasUtils.js +2 -2
- package/browser/Utils/ColorUtils.js +3 -3
- package/browser/Utils/NumberUtils.js +17 -4
- package/cjs/Core/Canvas.js +4 -6
- package/cjs/Core/Container.js +15 -15
- package/cjs/Core/Engine.js +1 -1
- package/cjs/Core/Particle.js +4 -4
- package/cjs/Core/Particles.js +9 -8
- package/cjs/Core/Utils/EventListeners.js +1 -1
- package/cjs/Utils/CanvasUtils.js +13 -14
- package/cjs/Utils/ColorUtils.js +23 -24
- package/cjs/Utils/NumberUtils.js +43 -28
- package/cjs/Utils/OptionsUtils.js +2 -3
- package/cjs/Utils/TypeUtils.js +6 -7
- package/cjs/Utils/Utils.js +29 -30
- package/cjs/init.js +1 -2
- package/esm/Core/Canvas.js +4 -6
- package/esm/Core/Container.js +15 -15
- package/esm/Core/Engine.js +1 -1
- package/esm/Core/Particle.js +4 -4
- package/esm/Core/Particles.js +9 -8
- package/esm/Core/Utils/EventListeners.js +1 -1
- package/esm/Utils/CanvasUtils.js +2 -2
- package/esm/Utils/ColorUtils.js +3 -3
- package/esm/Utils/NumberUtils.js +17 -4
- package/package.json +1 -1
- package/report.html +1 -1
- package/tsparticles.engine.js +12 -12
- package/tsparticles.engine.min.js +1 -1
- package/tsparticles.engine.min.js.LICENSE.txt +1 -1
- package/types/Utils/NumberUtils.d.ts +3 -0
- package/umd/Core/Canvas.js +4 -6
- package/umd/Core/Container.js +16 -16
- package/umd/Core/Engine.js +1 -1
- package/umd/Core/Particle.js +4 -4
- package/umd/Core/Particles.js +9 -8
- package/umd/Core/Utils/EventListeners.js +1 -1
- package/umd/Utils/CanvasUtils.js +13 -14
- package/umd/Utils/ColorUtils.js +23 -24
- package/umd/Utils/NumberUtils.js +43 -28
- package/umd/Utils/OptionsUtils.js +2 -3
- package/umd/Utils/TypeUtils.js +6 -7
- package/umd/Utils/Utils.js +29 -30
- package/umd/init.js +1 -2
package/umd/Core/Particle.js
CHANGED
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
constructor(engine, container) {
|
|
61
61
|
this.container = container;
|
|
62
62
|
this._calcPosition = (container, position, zIndex, tryCount = defaultRetryCount) => {
|
|
63
|
-
for (const
|
|
63
|
+
for (const plugin of container.plugins.values()) {
|
|
64
64
|
const pluginPos = plugin.particlePosition !== undefined ? plugin.particlePosition(position, this) : undefined;
|
|
65
65
|
if (pluginPos) {
|
|
66
66
|
return Vectors_js_1.Vector3d.create(pluginPos.x, pluginPos.y, zIndex);
|
|
@@ -178,7 +178,7 @@
|
|
|
178
178
|
this.slow.inRange = false;
|
|
179
179
|
const container = this.container, pathGenerator = this.pathGenerator, shapeDrawer = container.shapeDrawers.get(this.shape);
|
|
180
180
|
shapeDrawer?.particleDestroy?.(this);
|
|
181
|
-
for (const
|
|
181
|
+
for (const plugin of container.plugins.values()) {
|
|
182
182
|
plugin.particleDestroyed?.(this, override);
|
|
183
183
|
}
|
|
184
184
|
for (const updater of container.particles.updaters) {
|
|
@@ -194,7 +194,7 @@
|
|
|
194
194
|
}
|
|
195
195
|
draw(delta) {
|
|
196
196
|
const container = this.container, canvas = container.canvas;
|
|
197
|
-
for (const
|
|
197
|
+
for (const plugin of container.plugins.values()) {
|
|
198
198
|
canvas.drawParticlePlugin(plugin, this, delta);
|
|
199
199
|
}
|
|
200
200
|
canvas.drawParticle(this, delta);
|
|
@@ -346,7 +346,7 @@
|
|
|
346
346
|
}
|
|
347
347
|
effectDrawer?.particleInit?.(container, this);
|
|
348
348
|
shapeDrawer?.particleInit?.(container, this);
|
|
349
|
-
for (const
|
|
349
|
+
for (const plugin of container.plugins.values()) {
|
|
350
350
|
plugin.particleCreated?.(this);
|
|
351
351
|
}
|
|
352
352
|
}
|
package/umd/Core/Particles.js
CHANGED
|
@@ -134,7 +134,7 @@
|
|
|
134
134
|
options.manualParticles.forEach(p => this.addParticle(p.position ? (0, Utils_js_1.getPosition)(p.position, container.canvas.size) : undefined, p.options));
|
|
135
135
|
}
|
|
136
136
|
addParticle(position, overrideOptions, group, initializer) {
|
|
137
|
-
const limitMode = this._container.actualOptions.particles.number.limit.mode, limit = group === undefined ? this._limit : this._groupLimits.get(group) ?? this._limit, currentCount = this.count, minLimit = 0;
|
|
137
|
+
const limitMode = this._container.actualOptions.particles.number.limit.mode, limit = group === undefined ? this._limit : (this._groupLimits.get(group) ?? this._limit), currentCount = this.count, minLimit = 0;
|
|
138
138
|
if (limit > minLimit) {
|
|
139
139
|
switch (limitMode) {
|
|
140
140
|
case LimitMode_js_1.LimitMode.delete: {
|
|
@@ -168,7 +168,7 @@
|
|
|
168
168
|
const container = this._container, canvas = container.canvas;
|
|
169
169
|
canvas.clear();
|
|
170
170
|
this.update(delta);
|
|
171
|
-
for (const
|
|
171
|
+
for (const plugin of container.plugins.values()) {
|
|
172
172
|
canvas.drawPlugin(plugin, delta);
|
|
173
173
|
}
|
|
174
174
|
for (const p of this._zArray) {
|
|
@@ -193,7 +193,7 @@
|
|
|
193
193
|
this._needsSort = false;
|
|
194
194
|
await this.initPlugins();
|
|
195
195
|
let handled = false;
|
|
196
|
-
for (const
|
|
196
|
+
for (const plugin of container.plugins.values()) {
|
|
197
197
|
handled = plugin.particlesInitialization?.() ?? handled;
|
|
198
198
|
if (handled) {
|
|
199
199
|
break;
|
|
@@ -221,7 +221,7 @@
|
|
|
221
221
|
this.movers = await this._engine.getMovers(container, true);
|
|
222
222
|
this.updaters = await this._engine.getUpdaters(container, true);
|
|
223
223
|
await this._interactionManager.init();
|
|
224
|
-
for (const
|
|
224
|
+
for (const pathGenerator of container.pathGenerators.values()) {
|
|
225
225
|
pathGenerator.init(container);
|
|
226
226
|
}
|
|
227
227
|
}
|
|
@@ -245,7 +245,8 @@
|
|
|
245
245
|
}
|
|
246
246
|
let deleted = 0;
|
|
247
247
|
for (let i = index; deleted < quantity && i < this.count; i++) {
|
|
248
|
-
if (this._removeParticle(i
|
|
248
|
+
if (this._removeParticle(i, group, override)) {
|
|
249
|
+
i--;
|
|
249
250
|
deleted++;
|
|
250
251
|
}
|
|
251
252
|
}
|
|
@@ -271,10 +272,10 @@
|
|
|
271
272
|
update(delta) {
|
|
272
273
|
const container = this._container, particlesToDelete = new Set();
|
|
273
274
|
this.quadTree = new QuadTree_js_1.QuadTree(qTreeRectangle(container.canvas.size), qTreeCapacity);
|
|
274
|
-
for (const
|
|
275
|
+
for (const pathGenerator of container.pathGenerators.values()) {
|
|
275
276
|
pathGenerator.update();
|
|
276
277
|
}
|
|
277
|
-
for (const
|
|
278
|
+
for (const plugin of container.plugins.values()) {
|
|
278
279
|
plugin.update?.(delta);
|
|
279
280
|
}
|
|
280
281
|
const resizeFactor = this._resizeFactor;
|
|
@@ -287,7 +288,7 @@
|
|
|
287
288
|
}
|
|
288
289
|
particle.ignoresResizeRatio = false;
|
|
289
290
|
this._interactionManager.reset(particle);
|
|
290
|
-
for (const
|
|
291
|
+
for (const plugin of this._container.plugins.values()) {
|
|
291
292
|
if (particle.destroyed) {
|
|
292
293
|
break;
|
|
293
294
|
}
|
|
@@ -199,7 +199,7 @@
|
|
|
199
199
|
if (!mousePosition || !options.interactivity.events.onClick.enable) {
|
|
200
200
|
return;
|
|
201
201
|
}
|
|
202
|
-
for (const
|
|
202
|
+
for (const plugin of container.plugins.values()) {
|
|
203
203
|
if (!plugin.clickPositionValid) {
|
|
204
204
|
continue;
|
|
205
205
|
}
|
package/umd/Utils/CanvasUtils.js
CHANGED
|
@@ -9,7 +9,17 @@
|
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.
|
|
12
|
+
exports.drawLine = drawLine;
|
|
13
|
+
exports.paintBase = paintBase;
|
|
14
|
+
exports.paintImage = paintImage;
|
|
15
|
+
exports.clear = clear;
|
|
16
|
+
exports.drawParticle = drawParticle;
|
|
17
|
+
exports.drawEffect = drawEffect;
|
|
18
|
+
exports.drawShape = drawShape;
|
|
19
|
+
exports.drawShapeAfterDraw = drawShapeAfterDraw;
|
|
20
|
+
exports.drawPlugin = drawPlugin;
|
|
21
|
+
exports.drawParticlePlugin = drawParticlePlugin;
|
|
22
|
+
exports.alterHsl = alterHsl;
|
|
13
23
|
const AlterType_js_1 = require("../Enums/Types/AlterType.js");
|
|
14
24
|
const ColorUtils_js_1 = require("./ColorUtils.js");
|
|
15
25
|
const origin = { x: 0, y: 0 }, defaultTransform = {
|
|
@@ -24,12 +34,10 @@
|
|
|
24
34
|
context.lineTo(end.x, end.y);
|
|
25
35
|
context.closePath();
|
|
26
36
|
}
|
|
27
|
-
exports.drawLine = drawLine;
|
|
28
37
|
function paintBase(context, dimension, baseColor) {
|
|
29
38
|
context.fillStyle = baseColor ?? "rgba(0,0,0,0)";
|
|
30
39
|
context.fillRect(origin.x, origin.y, dimension.width, dimension.height);
|
|
31
40
|
}
|
|
32
|
-
exports.paintBase = paintBase;
|
|
33
41
|
function paintImage(context, dimension, image, opacity) {
|
|
34
42
|
if (!image) {
|
|
35
43
|
return;
|
|
@@ -38,19 +46,17 @@
|
|
|
38
46
|
context.drawImage(image, origin.x, origin.y, dimension.width, dimension.height);
|
|
39
47
|
context.globalAlpha = 1;
|
|
40
48
|
}
|
|
41
|
-
exports.paintImage = paintImage;
|
|
42
49
|
function clear(context, dimension) {
|
|
43
50
|
context.clearRect(origin.x, origin.y, dimension.width, dimension.height);
|
|
44
51
|
}
|
|
45
|
-
exports.clear = clear;
|
|
46
52
|
function drawParticle(data) {
|
|
47
53
|
const { container, context, particle, delta, colorStyles, backgroundMask, composite, radius, opacity, shadow, transform, } = data, pos = particle.getPosition(), defaultAngle = 0, angle = particle.rotation + (particle.pathRotation ? particle.velocity.angle : defaultAngle), rotateData = {
|
|
48
54
|
sin: Math.sin(angle),
|
|
49
55
|
cos: Math.cos(angle),
|
|
50
56
|
}, rotating = !!angle, identity = 1, transformData = {
|
|
51
57
|
a: rotateData.cos * (transform.a ?? defaultTransform.a),
|
|
52
|
-
b: rotating ? rotateData.sin * (transform.b ?? identity) : transform.b ?? defaultTransform.b,
|
|
53
|
-
c: rotating ? -rotateData.sin * (transform.c ?? identity) : transform.c ?? defaultTransform.c,
|
|
58
|
+
b: rotating ? rotateData.sin * (transform.b ?? identity) : (transform.b ?? defaultTransform.b),
|
|
59
|
+
c: rotating ? -rotateData.sin * (transform.c ?? identity) : (transform.c ?? defaultTransform.c),
|
|
54
60
|
d: rotateData.cos * (transform.d ?? defaultTransform.d),
|
|
55
61
|
};
|
|
56
62
|
context.setTransform(transformData.a, transformData.b, transformData.c, transformData.d, pos.x, pos.y);
|
|
@@ -88,7 +94,6 @@
|
|
|
88
94
|
context.globalCompositeOperation = "source-over";
|
|
89
95
|
context.resetTransform();
|
|
90
96
|
}
|
|
91
|
-
exports.drawParticle = drawParticle;
|
|
92
97
|
function drawEffect(data) {
|
|
93
98
|
const { container, context, particle, radius, opacity, delta, transformData } = data;
|
|
94
99
|
if (!particle.effect) {
|
|
@@ -108,7 +113,6 @@
|
|
|
108
113
|
transformData: { ...transformData },
|
|
109
114
|
});
|
|
110
115
|
}
|
|
111
|
-
exports.drawEffect = drawEffect;
|
|
112
116
|
function drawShape(data) {
|
|
113
117
|
const { container, context, particle, radius, opacity, delta, strokeWidth, transformData } = data, minStrokeWidth = 0;
|
|
114
118
|
if (!particle.shape) {
|
|
@@ -138,7 +142,6 @@
|
|
|
138
142
|
context.fill();
|
|
139
143
|
}
|
|
140
144
|
}
|
|
141
|
-
exports.drawShape = drawShape;
|
|
142
145
|
function drawShapeAfterDraw(data) {
|
|
143
146
|
const { container, context, particle, radius, opacity, delta, transformData } = data;
|
|
144
147
|
if (!particle.shape) {
|
|
@@ -158,21 +161,18 @@
|
|
|
158
161
|
transformData: { ...transformData },
|
|
159
162
|
});
|
|
160
163
|
}
|
|
161
|
-
exports.drawShapeAfterDraw = drawShapeAfterDraw;
|
|
162
164
|
function drawPlugin(context, plugin, delta) {
|
|
163
165
|
if (!plugin.draw) {
|
|
164
166
|
return;
|
|
165
167
|
}
|
|
166
168
|
plugin.draw(context, delta);
|
|
167
169
|
}
|
|
168
|
-
exports.drawPlugin = drawPlugin;
|
|
169
170
|
function drawParticlePlugin(context, plugin, particle, delta) {
|
|
170
171
|
if (!plugin.drawParticle) {
|
|
171
172
|
return;
|
|
172
173
|
}
|
|
173
174
|
plugin.drawParticle(context, particle, delta);
|
|
174
175
|
}
|
|
175
|
-
exports.drawParticlePlugin = drawParticlePlugin;
|
|
176
176
|
function alterHsl(color, type, value) {
|
|
177
177
|
const lFactor = 1;
|
|
178
178
|
return {
|
|
@@ -181,5 +181,4 @@
|
|
|
181
181
|
l: color.l + (type === AlterType_js_1.AlterType.darken ? -lFactor : lFactor) * value,
|
|
182
182
|
};
|
|
183
183
|
}
|
|
184
|
-
exports.alterHsl = alterHsl;
|
|
185
184
|
});
|
package/umd/Utils/ColorUtils.js
CHANGED
|
@@ -9,7 +9,26 @@
|
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.
|
|
12
|
+
exports.addColorManager = addColorManager;
|
|
13
|
+
exports.rangeColorToRgb = rangeColorToRgb;
|
|
14
|
+
exports.colorToRgb = colorToRgb;
|
|
15
|
+
exports.colorToHsl = colorToHsl;
|
|
16
|
+
exports.rangeColorToHsl = rangeColorToHsl;
|
|
17
|
+
exports.rgbToHsl = rgbToHsl;
|
|
18
|
+
exports.stringToAlpha = stringToAlpha;
|
|
19
|
+
exports.stringToRgb = stringToRgb;
|
|
20
|
+
exports.hslToRgb = hslToRgb;
|
|
21
|
+
exports.hslaToRgba = hslaToRgba;
|
|
22
|
+
exports.getRandomRgbColor = getRandomRgbColor;
|
|
23
|
+
exports.getStyleFromRgb = getStyleFromRgb;
|
|
24
|
+
exports.getStyleFromHsl = getStyleFromHsl;
|
|
25
|
+
exports.colorMix = colorMix;
|
|
26
|
+
exports.getLinkColor = getLinkColor;
|
|
27
|
+
exports.getLinkRandomColor = getLinkRandomColor;
|
|
28
|
+
exports.getHslFromAnimation = getHslFromAnimation;
|
|
29
|
+
exports.getHslAnimationFromHsl = getHslAnimationFromHsl;
|
|
30
|
+
exports.updateColorValue = updateColorValue;
|
|
31
|
+
exports.updateColor = updateColor;
|
|
13
32
|
const NumberUtils_js_1 = require("./NumberUtils.js");
|
|
14
33
|
const TypeUtils_js_1 = require("./TypeUtils.js");
|
|
15
34
|
const Constants_js_1 = require("../Core/Utils/Constants.js");
|
|
@@ -26,9 +45,8 @@
|
|
|
26
45
|
function addColorManager(manager) {
|
|
27
46
|
colorManagers.set(manager.key, manager);
|
|
28
47
|
}
|
|
29
|
-
exports.addColorManager = addColorManager;
|
|
30
48
|
function stringToRgba(input) {
|
|
31
|
-
for (const
|
|
49
|
+
for (const manager of colorManagers.values()) {
|
|
32
50
|
if (input.startsWith(manager.stringPrefix)) {
|
|
33
51
|
return manager.parseString(input);
|
|
34
52
|
}
|
|
@@ -60,14 +78,13 @@
|
|
|
60
78
|
value: (0, Utils_js_1.itemFromArray)(color.value, index, useIndex),
|
|
61
79
|
});
|
|
62
80
|
}
|
|
63
|
-
for (const
|
|
81
|
+
for (const manager of colorManagers.values()) {
|
|
64
82
|
const res = manager.handleRangeColor(color);
|
|
65
83
|
if (res) {
|
|
66
84
|
return res;
|
|
67
85
|
}
|
|
68
86
|
}
|
|
69
87
|
}
|
|
70
|
-
exports.rangeColorToRgb = rangeColorToRgb;
|
|
71
88
|
function colorToRgb(input, index, useIndex = true) {
|
|
72
89
|
if (!input) {
|
|
73
90
|
return;
|
|
@@ -81,24 +98,21 @@
|
|
|
81
98
|
value: (0, Utils_js_1.itemFromArray)(color.value, index, useIndex),
|
|
82
99
|
});
|
|
83
100
|
}
|
|
84
|
-
for (const
|
|
101
|
+
for (const manager of colorManagers.values()) {
|
|
85
102
|
const res = manager.handleColor(color);
|
|
86
103
|
if (res) {
|
|
87
104
|
return res;
|
|
88
105
|
}
|
|
89
106
|
}
|
|
90
107
|
}
|
|
91
|
-
exports.colorToRgb = colorToRgb;
|
|
92
108
|
function colorToHsl(color, index, useIndex = true) {
|
|
93
109
|
const rgb = colorToRgb(color, index, useIndex);
|
|
94
110
|
return rgb ? rgbToHsl(rgb) : undefined;
|
|
95
111
|
}
|
|
96
|
-
exports.colorToHsl = colorToHsl;
|
|
97
112
|
function rangeColorToHsl(color, index, useIndex = true) {
|
|
98
113
|
const rgb = rangeColorToRgb(color, index, useIndex);
|
|
99
114
|
return rgb ? rgbToHsl(rgb) : undefined;
|
|
100
115
|
}
|
|
101
|
-
exports.rangeColorToHsl = rangeColorToHsl;
|
|
102
116
|
function rgbToHsl(color) {
|
|
103
117
|
const rgbMax = 255, hMax = 360, sMax = 100, lMax = 100, hMin = 0, sMin = 0, hPhase = 60, half = 0.5, double = 2, r1 = color.r / rgbMax, g1 = color.g / rgbMax, b1 = color.b / rgbMax, max = Math.max(r1, g1, b1), min = Math.min(r1, g1, b1), res = {
|
|
104
118
|
h: hMin,
|
|
@@ -123,15 +137,12 @@
|
|
|
123
137
|
}
|
|
124
138
|
return res;
|
|
125
139
|
}
|
|
126
|
-
exports.rgbToHsl = rgbToHsl;
|
|
127
140
|
function stringToAlpha(input) {
|
|
128
141
|
return stringToRgba(input)?.a;
|
|
129
142
|
}
|
|
130
|
-
exports.stringToAlpha = stringToAlpha;
|
|
131
143
|
function stringToRgb(input) {
|
|
132
144
|
return stringToRgba(input);
|
|
133
145
|
}
|
|
134
|
-
exports.stringToRgb = stringToRgb;
|
|
135
146
|
function hslToRgb(hsl) {
|
|
136
147
|
const hMax = 360, sMax = 100, lMax = 100, sMin = 0, lMin = 0, h = ((hsl.h % hMax) + hMax) % hMax, s = Math.max(sMin, Math.min(sMax, hsl.s)), l = Math.max(lMin, Math.min(lMax, hsl.l)), hNormalized = h / hMax, sNormalized = s / sMax, lNormalized = l / lMax, rgbFactor = 255, triple = 3;
|
|
137
148
|
if (s === sMin) {
|
|
@@ -162,7 +173,6 @@
|
|
|
162
173
|
: lNormalized + sNormalized - lNormalized * sNormalized, temp2 = double * lNormalized - temp1, phaseNumerator = 1, phaseThird = phaseNumerator / triple, red = Math.min(rgbFactor, rgbFactor * channel(temp2, temp1, hNormalized + phaseThird)), green = Math.min(rgbFactor, rgbFactor * channel(temp2, temp1, hNormalized)), blue = Math.min(rgbFactor, rgbFactor * channel(temp2, temp1, hNormalized - phaseThird));
|
|
163
174
|
return { r: Math.round(red), g: Math.round(green), b: Math.round(blue) };
|
|
164
175
|
}
|
|
165
|
-
exports.hslToRgb = hslToRgb;
|
|
166
176
|
function hslaToRgba(hsla) {
|
|
167
177
|
const rgbResult = hslToRgb(hsla);
|
|
168
178
|
return {
|
|
@@ -172,7 +182,6 @@
|
|
|
172
182
|
r: rgbResult.r,
|
|
173
183
|
};
|
|
174
184
|
}
|
|
175
|
-
exports.hslaToRgba = hslaToRgba;
|
|
176
185
|
function getRandomRgbColor(min) {
|
|
177
186
|
const defaultMin = 0, fixedMin = min ?? defaultMin, rgbMax = 256;
|
|
178
187
|
return {
|
|
@@ -181,17 +190,14 @@
|
|
|
181
190
|
r: Math.floor((0, NumberUtils_js_1.randomInRange)((0, NumberUtils_js_1.setRangeValue)(fixedMin, rgbMax))),
|
|
182
191
|
};
|
|
183
192
|
}
|
|
184
|
-
exports.getRandomRgbColor = getRandomRgbColor;
|
|
185
193
|
function getStyleFromRgb(color, opacity) {
|
|
186
194
|
const defaultOpacity = 1;
|
|
187
195
|
return `rgba(${color.r}, ${color.g}, ${color.b}, ${opacity ?? defaultOpacity})`;
|
|
188
196
|
}
|
|
189
|
-
exports.getStyleFromRgb = getStyleFromRgb;
|
|
190
197
|
function getStyleFromHsl(color, opacity) {
|
|
191
198
|
const defaultOpacity = 1;
|
|
192
199
|
return `hsla(${color.h}, ${color.s}%, ${color.l}%, ${opacity ?? defaultOpacity})`;
|
|
193
200
|
}
|
|
194
|
-
exports.getStyleFromHsl = getStyleFromHsl;
|
|
195
201
|
function colorMix(color1, color2, size1, size2) {
|
|
196
202
|
let rgb1 = color1, rgb2 = color2;
|
|
197
203
|
if (rgb1.r === undefined) {
|
|
@@ -206,7 +212,6 @@
|
|
|
206
212
|
r: (0, NumberUtils_js_1.mix)(rgb1.r, rgb2.r, size1, size2),
|
|
207
213
|
};
|
|
208
214
|
}
|
|
209
|
-
exports.colorMix = colorMix;
|
|
210
215
|
function getLinkColor(p1, p2, linkColor) {
|
|
211
216
|
if (linkColor === randomColorValue) {
|
|
212
217
|
return getRandomRgbColor();
|
|
@@ -227,7 +232,6 @@
|
|
|
227
232
|
return linkColor;
|
|
228
233
|
}
|
|
229
234
|
}
|
|
230
|
-
exports.getLinkColor = getLinkColor;
|
|
231
235
|
function getLinkRandomColor(optColor, blink, consent) {
|
|
232
236
|
const color = (0, TypeUtils_js_1.isString)(optColor) ? optColor : optColor.value;
|
|
233
237
|
if (color === randomColorValue) {
|
|
@@ -250,7 +254,6 @@
|
|
|
250
254
|
});
|
|
251
255
|
}
|
|
252
256
|
}
|
|
253
|
-
exports.getLinkRandomColor = getLinkRandomColor;
|
|
254
257
|
function getHslFromAnimation(animation) {
|
|
255
258
|
return animation !== undefined
|
|
256
259
|
? {
|
|
@@ -260,7 +263,6 @@
|
|
|
260
263
|
}
|
|
261
264
|
: undefined;
|
|
262
265
|
}
|
|
263
|
-
exports.getHslFromAnimation = getHslFromAnimation;
|
|
264
266
|
function getHslAnimationFromHsl(hsl, animationOptions, reduceFactor) {
|
|
265
267
|
const resColor = {
|
|
266
268
|
h: {
|
|
@@ -283,7 +285,6 @@
|
|
|
283
285
|
}
|
|
284
286
|
return resColor;
|
|
285
287
|
}
|
|
286
|
-
exports.getHslAnimationFromHsl = getHslAnimationFromHsl;
|
|
287
288
|
function setColorAnimation(colorValue, colorAnimation, reduceFactor) {
|
|
288
289
|
colorValue.enable = colorAnimation.enable;
|
|
289
290
|
const defaultVelocity = 0, decayOffset = 1, defaultLoops = 0, defaultTime = 0;
|
|
@@ -354,7 +355,6 @@
|
|
|
354
355
|
}
|
|
355
356
|
data.value = (0, NumberUtils_js_1.clamp)(data.value, min, max);
|
|
356
357
|
}
|
|
357
|
-
exports.updateColorValue = updateColorValue;
|
|
358
358
|
function updateColor(color, delta) {
|
|
359
359
|
if (!color) {
|
|
360
360
|
return;
|
|
@@ -375,5 +375,4 @@
|
|
|
375
375
|
updateColorValue(l, ranges.l, true, delta);
|
|
376
376
|
}
|
|
377
377
|
}
|
|
378
|
-
exports.updateColor = updateColor;
|
|
379
378
|
});
|
package/umd/Utils/NumberUtils.js
CHANGED
|
@@ -9,41 +9,73 @@
|
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.
|
|
12
|
+
exports.addEasing = addEasing;
|
|
13
|
+
exports.getEasing = getEasing;
|
|
14
|
+
exports.setRandom = setRandom;
|
|
15
|
+
exports.getRandom = getRandom;
|
|
16
|
+
exports.setAnimationFunctions = setAnimationFunctions;
|
|
17
|
+
exports.animate = animate;
|
|
18
|
+
exports.cancelAnimation = cancelAnimation;
|
|
19
|
+
exports.clamp = clamp;
|
|
20
|
+
exports.mix = mix;
|
|
21
|
+
exports.randomInRange = randomInRange;
|
|
22
|
+
exports.getRangeValue = getRangeValue;
|
|
23
|
+
exports.getRangeMin = getRangeMin;
|
|
24
|
+
exports.getRangeMax = getRangeMax;
|
|
25
|
+
exports.setRangeValue = setRangeValue;
|
|
26
|
+
exports.getDistances = getDistances;
|
|
27
|
+
exports.getDistance = getDistance;
|
|
28
|
+
exports.degToRad = degToRad;
|
|
29
|
+
exports.getParticleDirectionAngle = getParticleDirectionAngle;
|
|
30
|
+
exports.getParticleBaseVelocity = getParticleBaseVelocity;
|
|
31
|
+
exports.collisionVelocity = collisionVelocity;
|
|
32
|
+
exports.calcPositionFromSize = calcPositionFromSize;
|
|
33
|
+
exports.calcPositionOrRandomFromSize = calcPositionOrRandomFromSize;
|
|
34
|
+
exports.calcPositionOrRandomFromSizeRanged = calcPositionOrRandomFromSizeRanged;
|
|
35
|
+
exports.calcExactPositionOrRandomFromSize = calcExactPositionOrRandomFromSize;
|
|
36
|
+
exports.calcExactPositionOrRandomFromSizeRanged = calcExactPositionOrRandomFromSizeRanged;
|
|
37
|
+
exports.parseAlpha = parseAlpha;
|
|
13
38
|
const MoveDirection_js_1 = require("../Enums/Directions/MoveDirection.js");
|
|
14
39
|
const Vectors_js_1 = require("../Core/Utils/Vectors.js");
|
|
15
40
|
const TypeUtils_js_1 = require("./TypeUtils.js");
|
|
16
41
|
const Constants_js_1 = require("../Core/Utils/Constants.js");
|
|
17
42
|
let _random = Math.random;
|
|
18
|
-
const
|
|
43
|
+
const _animationLoop = {
|
|
44
|
+
nextFrame: (cb) => requestAnimationFrame(cb),
|
|
45
|
+
cancel: (idx) => cancelAnimationFrame(idx),
|
|
46
|
+
}, easingFunctions = new Map(), double = 2, doublePI = Math.PI * double;
|
|
19
47
|
function addEasing(name, easing) {
|
|
20
|
-
if (
|
|
48
|
+
if (easingFunctions.get(name)) {
|
|
21
49
|
return;
|
|
22
50
|
}
|
|
23
|
-
|
|
51
|
+
easingFunctions.set(name, easing);
|
|
24
52
|
}
|
|
25
|
-
exports.addEasing = addEasing;
|
|
26
53
|
function getEasing(name) {
|
|
27
|
-
return
|
|
54
|
+
return easingFunctions.get(name) ?? ((value) => value);
|
|
28
55
|
}
|
|
29
|
-
exports.getEasing = getEasing;
|
|
30
56
|
function setRandom(rnd = Math.random) {
|
|
31
57
|
_random = rnd;
|
|
32
58
|
}
|
|
33
|
-
exports.setRandom = setRandom;
|
|
34
59
|
function getRandom() {
|
|
35
60
|
const min = 0, max = 1;
|
|
36
61
|
return clamp(_random(), min, max - Number.EPSILON);
|
|
37
62
|
}
|
|
38
|
-
|
|
63
|
+
function setAnimationFunctions(nextFrame, cancel) {
|
|
64
|
+
_animationLoop.nextFrame = (callback) => nextFrame(callback);
|
|
65
|
+
_animationLoop.cancel = (handle) => cancel(handle);
|
|
66
|
+
}
|
|
67
|
+
function animate(fn) {
|
|
68
|
+
return _animationLoop.nextFrame(fn);
|
|
69
|
+
}
|
|
70
|
+
function cancelAnimation(handle) {
|
|
71
|
+
_animationLoop.cancel(handle);
|
|
72
|
+
}
|
|
39
73
|
function clamp(num, min, max) {
|
|
40
74
|
return Math.min(Math.max(num, min), max);
|
|
41
75
|
}
|
|
42
|
-
exports.clamp = clamp;
|
|
43
76
|
function mix(comp1, comp2, weight1, weight2) {
|
|
44
77
|
return Math.floor((comp1 * weight1 + comp2 * weight2) / (weight1 + weight2));
|
|
45
78
|
}
|
|
46
|
-
exports.mix = mix;
|
|
47
79
|
function randomInRange(r) {
|
|
48
80
|
const max = getRangeMax(r), minOffset = 0;
|
|
49
81
|
let min = getRangeMin(r);
|
|
@@ -52,19 +84,15 @@
|
|
|
52
84
|
}
|
|
53
85
|
return getRandom() * (max - min) + min;
|
|
54
86
|
}
|
|
55
|
-
exports.randomInRange = randomInRange;
|
|
56
87
|
function getRangeValue(value) {
|
|
57
88
|
return (0, TypeUtils_js_1.isNumber)(value) ? value : randomInRange(value);
|
|
58
89
|
}
|
|
59
|
-
exports.getRangeValue = getRangeValue;
|
|
60
90
|
function getRangeMin(value) {
|
|
61
91
|
return (0, TypeUtils_js_1.isNumber)(value) ? value : value.min;
|
|
62
92
|
}
|
|
63
|
-
exports.getRangeMin = getRangeMin;
|
|
64
93
|
function getRangeMax(value) {
|
|
65
94
|
return (0, TypeUtils_js_1.isNumber)(value) ? value : value.max;
|
|
66
95
|
}
|
|
67
|
-
exports.getRangeMax = getRangeMax;
|
|
68
96
|
function setRangeValue(source, value) {
|
|
69
97
|
if (source === value || (value === undefined && (0, TypeUtils_js_1.isNumber)(source))) {
|
|
70
98
|
return source;
|
|
@@ -77,21 +105,17 @@
|
|
|
77
105
|
}
|
|
78
106
|
: setRangeValue(min, max);
|
|
79
107
|
}
|
|
80
|
-
exports.setRangeValue = setRangeValue;
|
|
81
108
|
function getDistances(pointA, pointB) {
|
|
82
109
|
const dx = pointA.x - pointB.x, dy = pointA.y - pointB.y, squareExp = 2;
|
|
83
110
|
return { dx: dx, dy: dy, distance: Math.sqrt(dx ** squareExp + dy ** squareExp) };
|
|
84
111
|
}
|
|
85
|
-
exports.getDistances = getDistances;
|
|
86
112
|
function getDistance(pointA, pointB) {
|
|
87
113
|
return getDistances(pointA, pointB).distance;
|
|
88
114
|
}
|
|
89
|
-
exports.getDistance = getDistance;
|
|
90
115
|
function degToRad(degrees) {
|
|
91
116
|
const PIDeg = 180;
|
|
92
117
|
return (degrees * Math.PI) / PIDeg;
|
|
93
118
|
}
|
|
94
|
-
exports.degToRad = degToRad;
|
|
95
119
|
function getParticleDirectionAngle(direction, position, center) {
|
|
96
120
|
if ((0, TypeUtils_js_1.isNumber)(direction)) {
|
|
97
121
|
return degToRad(direction);
|
|
@@ -122,19 +146,16 @@
|
|
|
122
146
|
return getRandom() * doublePI;
|
|
123
147
|
}
|
|
124
148
|
}
|
|
125
|
-
exports.getParticleDirectionAngle = getParticleDirectionAngle;
|
|
126
149
|
function getParticleBaseVelocity(direction) {
|
|
127
150
|
const baseVelocity = Vectors_js_1.Vector.origin;
|
|
128
151
|
baseVelocity.length = 1;
|
|
129
152
|
baseVelocity.angle = direction;
|
|
130
153
|
return baseVelocity;
|
|
131
154
|
}
|
|
132
|
-
exports.getParticleBaseVelocity = getParticleBaseVelocity;
|
|
133
155
|
function collisionVelocity(v1, v2, m1, m2) {
|
|
134
156
|
const double = 2;
|
|
135
157
|
return Vectors_js_1.Vector.create((v1.x * (m1 - m2)) / (m1 + m2) + (v2.x * double * m2) / (m1 + m2), v1.y);
|
|
136
158
|
}
|
|
137
|
-
exports.collisionVelocity = collisionVelocity;
|
|
138
159
|
function calcPositionFromSize(data) {
|
|
139
160
|
return data.position?.x !== undefined && data.position.y !== undefined
|
|
140
161
|
? {
|
|
@@ -143,14 +164,12 @@
|
|
|
143
164
|
}
|
|
144
165
|
: undefined;
|
|
145
166
|
}
|
|
146
|
-
exports.calcPositionFromSize = calcPositionFromSize;
|
|
147
167
|
function calcPositionOrRandomFromSize(data) {
|
|
148
168
|
return {
|
|
149
169
|
x: ((data.position?.x ?? getRandom() * Constants_js_1.percentDenominator) * data.size.width) / Constants_js_1.percentDenominator,
|
|
150
170
|
y: ((data.position?.y ?? getRandom() * Constants_js_1.percentDenominator) * data.size.height) / Constants_js_1.percentDenominator,
|
|
151
171
|
};
|
|
152
172
|
}
|
|
153
|
-
exports.calcPositionOrRandomFromSize = calcPositionOrRandomFromSize;
|
|
154
173
|
function calcPositionOrRandomFromSizeRanged(data) {
|
|
155
174
|
const position = {
|
|
156
175
|
x: data.position?.x !== undefined ? getRangeValue(data.position.x) : undefined,
|
|
@@ -158,14 +177,12 @@
|
|
|
158
177
|
};
|
|
159
178
|
return calcPositionOrRandomFromSize({ size: data.size, position });
|
|
160
179
|
}
|
|
161
|
-
exports.calcPositionOrRandomFromSizeRanged = calcPositionOrRandomFromSizeRanged;
|
|
162
180
|
function calcExactPositionOrRandomFromSize(data) {
|
|
163
181
|
return {
|
|
164
182
|
x: data.position?.x ?? getRandom() * data.size.width,
|
|
165
183
|
y: data.position?.y ?? getRandom() * data.size.height,
|
|
166
184
|
};
|
|
167
185
|
}
|
|
168
|
-
exports.calcExactPositionOrRandomFromSize = calcExactPositionOrRandomFromSize;
|
|
169
186
|
function calcExactPositionOrRandomFromSizeRanged(data) {
|
|
170
187
|
const position = {
|
|
171
188
|
x: data.position?.x !== undefined ? getRangeValue(data.position.x) : undefined,
|
|
@@ -173,7 +190,6 @@
|
|
|
173
190
|
};
|
|
174
191
|
return calcExactPositionOrRandomFromSize({ size: data.size, position });
|
|
175
192
|
}
|
|
176
|
-
exports.calcExactPositionOrRandomFromSizeRanged = calcExactPositionOrRandomFromSizeRanged;
|
|
177
193
|
function parseAlpha(input) {
|
|
178
194
|
const defaultAlpha = 1;
|
|
179
195
|
if (!input) {
|
|
@@ -181,5 +197,4 @@
|
|
|
181
197
|
}
|
|
182
198
|
return input.endsWith("%") ? parseFloat(input) / Constants_js_1.percentDenominator : parseFloat(input);
|
|
183
199
|
}
|
|
184
|
-
exports.parseAlpha = parseAlpha;
|
|
185
200
|
});
|
|
@@ -9,18 +9,17 @@
|
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.
|
|
12
|
+
exports.loadOptions = loadOptions;
|
|
13
|
+
exports.loadParticlesOptions = loadParticlesOptions;
|
|
13
14
|
const ParticlesOptions_js_1 = require("../Options/Classes/Particles/ParticlesOptions.js");
|
|
14
15
|
function loadOptions(options, ...sourceOptionsArr) {
|
|
15
16
|
for (const sourceOptions of sourceOptionsArr) {
|
|
16
17
|
options.load(sourceOptions);
|
|
17
18
|
}
|
|
18
19
|
}
|
|
19
|
-
exports.loadOptions = loadOptions;
|
|
20
20
|
function loadParticlesOptions(engine, container, ...sourceOptionsArr) {
|
|
21
21
|
const options = new ParticlesOptions_js_1.ParticlesOptions(engine, container);
|
|
22
22
|
loadOptions(options, ...sourceOptionsArr);
|
|
23
23
|
return options;
|
|
24
24
|
}
|
|
25
|
-
exports.loadParticlesOptions = loadParticlesOptions;
|
|
26
25
|
});
|
package/umd/Utils/TypeUtils.js
CHANGED
|
@@ -9,29 +9,28 @@
|
|
|
9
9
|
})(function (require, exports) {
|
|
10
10
|
"use strict";
|
|
11
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.
|
|
12
|
+
exports.isBoolean = isBoolean;
|
|
13
|
+
exports.isString = isString;
|
|
14
|
+
exports.isNumber = isNumber;
|
|
15
|
+
exports.isFunction = isFunction;
|
|
16
|
+
exports.isObject = isObject;
|
|
17
|
+
exports.isArray = isArray;
|
|
13
18
|
function isBoolean(arg) {
|
|
14
19
|
return typeof arg === "boolean";
|
|
15
20
|
}
|
|
16
|
-
exports.isBoolean = isBoolean;
|
|
17
21
|
function isString(arg) {
|
|
18
22
|
return typeof arg === "string";
|
|
19
23
|
}
|
|
20
|
-
exports.isString = isString;
|
|
21
24
|
function isNumber(arg) {
|
|
22
25
|
return typeof arg === "number";
|
|
23
26
|
}
|
|
24
|
-
exports.isNumber = isNumber;
|
|
25
27
|
function isFunction(arg) {
|
|
26
28
|
return typeof arg === "function";
|
|
27
29
|
}
|
|
28
|
-
exports.isFunction = isFunction;
|
|
29
30
|
function isObject(arg) {
|
|
30
31
|
return typeof arg === "object" && arg !== null;
|
|
31
32
|
}
|
|
32
|
-
exports.isObject = isObject;
|
|
33
33
|
function isArray(arg) {
|
|
34
34
|
return Array.isArray(arg);
|
|
35
35
|
}
|
|
36
|
-
exports.isArray = isArray;
|
|
37
36
|
});
|