@tsparticles/plugin-emitters 3.0.0-alpha.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/LICENSE +21 -0
- package/README.md +70 -0
- package/browser/EmitterContainer.js +1 -0
- package/browser/EmitterInstance.js +257 -0
- package/browser/Emitters.js +119 -0
- package/browser/EmittersEngine.js +1 -0
- package/browser/Enums/EmitterClickMode.js +1 -0
- package/browser/Enums/EmitterShapeType.js +1 -0
- package/browser/IEmitterShape.js +1 -0
- package/browser/Options/Classes/Emitter.js +62 -0
- package/browser/Options/Classes/EmitterLife.js +22 -0
- package/browser/Options/Classes/EmitterRate.js +18 -0
- package/browser/Options/Classes/EmitterSize.js +21 -0
- package/browser/Options/Interfaces/IEmitter.js +1 -0
- package/browser/Options/Interfaces/IEmitterLife.js +1 -0
- package/browser/Options/Interfaces/IEmitterRate.js +1 -0
- package/browser/Options/Interfaces/IEmitterSize.js +1 -0
- package/browser/ShapeManager.js +17 -0
- package/browser/Shapes/Circle/CircleShape.js +24 -0
- package/browser/Shapes/Square/SquareShape.js +40 -0
- package/browser/index.js +113 -0
- package/browser/types.js +1 -0
- package/cjs/EmitterContainer.js +2 -0
- package/cjs/EmitterInstance.js +261 -0
- package/cjs/Emitters.js +134 -0
- package/cjs/EmittersEngine.js +2 -0
- package/cjs/Enums/EmitterClickMode.js +2 -0
- package/cjs/Enums/EmitterShapeType.js +2 -0
- package/cjs/IEmitterShape.js +2 -0
- package/cjs/Options/Classes/Emitter.js +66 -0
- package/cjs/Options/Classes/EmitterLife.js +26 -0
- package/cjs/Options/Classes/EmitterRate.js +22 -0
- package/cjs/Options/Classes/EmitterSize.js +25 -0
- package/cjs/Options/Interfaces/IEmitter.js +2 -0
- package/cjs/Options/Interfaces/IEmitterLife.js +2 -0
- package/cjs/Options/Interfaces/IEmitterRate.js +2 -0
- package/cjs/Options/Interfaces/IEmitterSize.js +2 -0
- package/cjs/ShapeManager.js +21 -0
- package/cjs/Shapes/Circle/CircleShape.js +28 -0
- package/cjs/Shapes/Square/SquareShape.js +44 -0
- package/cjs/index.js +142 -0
- package/cjs/types.js +2 -0
- package/esm/EmitterContainer.js +1 -0
- package/esm/EmitterInstance.js +257 -0
- package/esm/Emitters.js +119 -0
- package/esm/EmittersEngine.js +1 -0
- package/esm/Enums/EmitterClickMode.js +1 -0
- package/esm/Enums/EmitterShapeType.js +1 -0
- package/esm/IEmitterShape.js +1 -0
- package/esm/Options/Classes/Emitter.js +62 -0
- package/esm/Options/Classes/EmitterLife.js +22 -0
- package/esm/Options/Classes/EmitterRate.js +18 -0
- package/esm/Options/Classes/EmitterSize.js +21 -0
- package/esm/Options/Interfaces/IEmitter.js +1 -0
- package/esm/Options/Interfaces/IEmitterLife.js +1 -0
- package/esm/Options/Interfaces/IEmitterRate.js +1 -0
- package/esm/Options/Interfaces/IEmitterSize.js +1 -0
- package/esm/ShapeManager.js +17 -0
- package/esm/Shapes/Circle/CircleShape.js +24 -0
- package/esm/Shapes/Square/SquareShape.js +40 -0
- package/esm/index.js +113 -0
- package/esm/types.js +1 -0
- package/package.json +81 -0
- package/report.html +39 -0
- package/tsparticles.plugin.emitters.js +794 -0
- package/tsparticles.plugin.emitters.min.js +2 -0
- package/tsparticles.plugin.emitters.min.js.LICENSE.txt +8 -0
- package/types/EmitterContainer.d.ts +12 -0
- package/types/EmitterInstance.d.ts +46 -0
- package/types/Emitters.d.ts +24 -0
- package/types/EmittersEngine.d.ts +7 -0
- package/types/Enums/EmitterClickMode.d.ts +3 -0
- package/types/Enums/EmitterShapeType.d.ts +4 -0
- package/types/IEmitterShape.d.ts +4 -0
- package/types/Options/Classes/Emitter.d.ts +24 -0
- package/types/Options/Classes/EmitterLife.d.ts +10 -0
- package/types/Options/Classes/EmitterRate.d.ts +8 -0
- package/types/Options/Classes/EmitterSize.d.ts +10 -0
- package/types/Options/Interfaces/IEmitter.d.ts +20 -0
- package/types/Options/Interfaces/IEmitterLife.d.ts +6 -0
- package/types/Options/Interfaces/IEmitterRate.d.ts +5 -0
- package/types/Options/Interfaces/IEmitterSize.d.ts +4 -0
- package/types/ShapeManager.d.ts +9 -0
- package/types/Shapes/Circle/CircleShape.d.ts +5 -0
- package/types/Shapes/Square/SquareShape.d.ts +5 -0
- package/types/index.d.ts +6 -0
- package/types/types.d.ts +31 -0
- package/umd/EmitterContainer.js +12 -0
- package/umd/EmitterInstance.js +271 -0
- package/umd/Emitters.js +133 -0
- package/umd/EmittersEngine.js +12 -0
- package/umd/Enums/EmitterClickMode.js +12 -0
- package/umd/Enums/EmitterShapeType.js +12 -0
- package/umd/IEmitterShape.js +12 -0
- package/umd/Options/Classes/Emitter.js +76 -0
- package/umd/Options/Classes/EmitterLife.js +36 -0
- package/umd/Options/Classes/EmitterRate.js +32 -0
- package/umd/Options/Classes/EmitterSize.js +35 -0
- package/umd/Options/Interfaces/IEmitter.js +12 -0
- package/umd/Options/Interfaces/IEmitterLife.js +12 -0
- package/umd/Options/Interfaces/IEmitterRate.js +12 -0
- package/umd/Options/Interfaces/IEmitterSize.js +12 -0
- package/umd/ShapeManager.js +31 -0
- package/umd/Shapes/Circle/CircleShape.js +38 -0
- package/umd/Shapes/Square/SquareShape.js +54 -0
- package/umd/index.js +141 -0
- package/umd/types.js +12 -0
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { getRandom } from "@tsparticles/engine";
|
|
2
|
+
function randomSquareCoordinate(position, offset) {
|
|
3
|
+
return position + offset * (getRandom() - 0.5);
|
|
4
|
+
}
|
|
5
|
+
export class SquareShape {
|
|
6
|
+
randomPosition(position, size, fill) {
|
|
7
|
+
if (fill) {
|
|
8
|
+
return {
|
|
9
|
+
x: randomSquareCoordinate(position.x, size.width),
|
|
10
|
+
y: randomSquareCoordinate(position.y, size.height),
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
else {
|
|
14
|
+
const halfW = size.width / 2, halfH = size.height / 2, side = Math.floor(getRandom() * 4), v = (getRandom() - 0.5) * 2;
|
|
15
|
+
switch (side) {
|
|
16
|
+
case 0:
|
|
17
|
+
return {
|
|
18
|
+
x: position.x + v * halfW,
|
|
19
|
+
y: position.y - halfH,
|
|
20
|
+
};
|
|
21
|
+
case 1:
|
|
22
|
+
return {
|
|
23
|
+
x: position.x - halfW,
|
|
24
|
+
y: position.y + v * halfH,
|
|
25
|
+
};
|
|
26
|
+
case 2:
|
|
27
|
+
return {
|
|
28
|
+
x: position.x + v * halfW,
|
|
29
|
+
y: position.y + halfH,
|
|
30
|
+
};
|
|
31
|
+
case 3:
|
|
32
|
+
default:
|
|
33
|
+
return {
|
|
34
|
+
x: position.x + halfW,
|
|
35
|
+
y: position.y + v * halfH,
|
|
36
|
+
};
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
package/browser/index.js
ADDED
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import { executeOnSingleOrMultiple, isInArray } from "@tsparticles/engine";
|
|
2
|
+
import { CircleShape } from "./Shapes/Circle/CircleShape";
|
|
3
|
+
import { Emitter } from "./Options/Classes/Emitter";
|
|
4
|
+
import { Emitters } from "./Emitters";
|
|
5
|
+
import { ShapeManager } from "./ShapeManager";
|
|
6
|
+
import { SquareShape } from "./Shapes/Square/SquareShape";
|
|
7
|
+
class EmittersPlugin {
|
|
8
|
+
constructor(engine) {
|
|
9
|
+
this._engine = engine;
|
|
10
|
+
this.id = "emitters";
|
|
11
|
+
}
|
|
12
|
+
getPlugin(container) {
|
|
13
|
+
return new Emitters(this._engine, container);
|
|
14
|
+
}
|
|
15
|
+
loadOptions(options, source) {
|
|
16
|
+
var _a, _b, _c, _d, _e, _f;
|
|
17
|
+
if (!this.needsPlugin(options) && !this.needsPlugin(source)) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
if (source === null || source === void 0 ? void 0 : source.emitters) {
|
|
21
|
+
options.emitters = executeOnSingleOrMultiple(source.emitters, (emitter) => {
|
|
22
|
+
const tmp = new Emitter();
|
|
23
|
+
tmp.load(emitter);
|
|
24
|
+
return tmp;
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
const interactivityEmitters = (_b = (_a = source === null || source === void 0 ? void 0 : source.interactivity) === null || _a === void 0 ? void 0 : _a.modes) === null || _b === void 0 ? void 0 : _b.emitters;
|
|
28
|
+
if (interactivityEmitters) {
|
|
29
|
+
if (interactivityEmitters instanceof Array) {
|
|
30
|
+
options.interactivity.modes.emitters = {
|
|
31
|
+
random: {
|
|
32
|
+
count: 1,
|
|
33
|
+
enable: true,
|
|
34
|
+
},
|
|
35
|
+
value: interactivityEmitters.map((s) => {
|
|
36
|
+
const tmp = new Emitter();
|
|
37
|
+
tmp.load(s);
|
|
38
|
+
return tmp;
|
|
39
|
+
}),
|
|
40
|
+
};
|
|
41
|
+
}
|
|
42
|
+
else {
|
|
43
|
+
const emitterMode = interactivityEmitters;
|
|
44
|
+
if (emitterMode.value !== undefined) {
|
|
45
|
+
if (emitterMode.value instanceof Array) {
|
|
46
|
+
options.interactivity.modes.emitters = {
|
|
47
|
+
random: {
|
|
48
|
+
count: (_c = emitterMode.random.count) !== null && _c !== void 0 ? _c : 1,
|
|
49
|
+
enable: (_d = emitterMode.random.enable) !== null && _d !== void 0 ? _d : false,
|
|
50
|
+
},
|
|
51
|
+
value: emitterMode.value.map((s) => {
|
|
52
|
+
const tmp = new Emitter();
|
|
53
|
+
tmp.load(s);
|
|
54
|
+
return tmp;
|
|
55
|
+
}),
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
else {
|
|
59
|
+
const tmp = new Emitter();
|
|
60
|
+
tmp.load(emitterMode.value);
|
|
61
|
+
options.interactivity.modes.emitters = {
|
|
62
|
+
random: {
|
|
63
|
+
count: (_e = emitterMode.random.count) !== null && _e !== void 0 ? _e : 1,
|
|
64
|
+
enable: (_f = emitterMode.random.enable) !== null && _f !== void 0 ? _f : false,
|
|
65
|
+
},
|
|
66
|
+
value: tmp,
|
|
67
|
+
};
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
else {
|
|
71
|
+
const emitterOptions = (options.interactivity.modes.emitters = {
|
|
72
|
+
random: {
|
|
73
|
+
count: 1,
|
|
74
|
+
enable: false,
|
|
75
|
+
},
|
|
76
|
+
value: new Emitter(),
|
|
77
|
+
});
|
|
78
|
+
emitterOptions.value.load(interactivityEmitters);
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
needsPlugin(options) {
|
|
84
|
+
var _a, _b, _c;
|
|
85
|
+
if (!options) {
|
|
86
|
+
return false;
|
|
87
|
+
}
|
|
88
|
+
const emitters = options.emitters;
|
|
89
|
+
return ((emitters instanceof Array && !!emitters.length) ||
|
|
90
|
+
emitters !== undefined ||
|
|
91
|
+
(!!((_c = (_b = (_a = options.interactivity) === null || _a === void 0 ? void 0 : _a.events) === null || _b === void 0 ? void 0 : _b.onClick) === null || _c === void 0 ? void 0 : _c.mode) &&
|
|
92
|
+
isInArray("emitter", options.interactivity.events.onClick.mode)));
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
export async function loadEmittersPlugin(engine) {
|
|
96
|
+
if (!engine.emitterShapeManager) {
|
|
97
|
+
engine.emitterShapeManager = new ShapeManager(engine);
|
|
98
|
+
}
|
|
99
|
+
if (!engine.addEmitterShape) {
|
|
100
|
+
engine.addEmitterShape = (name, shape) => {
|
|
101
|
+
var _a;
|
|
102
|
+
(_a = engine.emitterShapeManager) === null || _a === void 0 ? void 0 : _a.addShape(name, shape);
|
|
103
|
+
};
|
|
104
|
+
}
|
|
105
|
+
const plugin = new EmittersPlugin(engine);
|
|
106
|
+
await engine.addPlugin(plugin);
|
|
107
|
+
engine.addEmitterShape("circle", new CircleShape());
|
|
108
|
+
engine.addEmitterShape("square", new SquareShape());
|
|
109
|
+
}
|
|
110
|
+
export * from "./EmitterContainer";
|
|
111
|
+
export * from "./EmittersEngine";
|
|
112
|
+
export * from "./Enums/EmitterClickMode";
|
|
113
|
+
export * from "./Enums/EmitterShapeType";
|
package/browser/types.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,261 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.EmitterInstance = void 0;
|
|
4
|
+
const engine_1 = require("@tsparticles/engine");
|
|
5
|
+
const Emitter_1 = require("./Options/Classes/Emitter");
|
|
6
|
+
const EmitterSize_1 = require("./Options/Classes/EmitterSize");
|
|
7
|
+
class EmitterInstance {
|
|
8
|
+
constructor(engine, emitters, container, options, position) {
|
|
9
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
10
|
+
var _h;
|
|
11
|
+
this.emitters = emitters;
|
|
12
|
+
this.container = container;
|
|
13
|
+
this._engine = engine;
|
|
14
|
+
this._currentDuration = 0;
|
|
15
|
+
this._currentEmitDelay = 0;
|
|
16
|
+
this._currentSpawnDelay = 0;
|
|
17
|
+
this._initialPosition = position;
|
|
18
|
+
if (options instanceof Emitter_1.Emitter) {
|
|
19
|
+
this.options = options;
|
|
20
|
+
}
|
|
21
|
+
else {
|
|
22
|
+
this.options = new Emitter_1.Emitter();
|
|
23
|
+
this.options.load(options);
|
|
24
|
+
}
|
|
25
|
+
this._spawnDelay = (((_a = this.options.life.delay) !== null && _a !== void 0 ? _a : 0) * 1000) / this.container.retina.reduceFactor;
|
|
26
|
+
this.position = (_b = this._initialPosition) !== null && _b !== void 0 ? _b : this.calcPosition();
|
|
27
|
+
this.name = this.options.name;
|
|
28
|
+
this._shape = (_c = this._engine.emitterShapeManager) === null || _c === void 0 ? void 0 : _c.getShape(this.options.shape);
|
|
29
|
+
this.fill = this.options.fill;
|
|
30
|
+
this._firstSpawn = !this.options.life.wait;
|
|
31
|
+
this._startParticlesAdded = false;
|
|
32
|
+
let particlesOptions = (0, engine_1.deepExtend)({}, this.options.particles);
|
|
33
|
+
particlesOptions !== null && particlesOptions !== void 0 ? particlesOptions : (particlesOptions = {});
|
|
34
|
+
(_d = particlesOptions.move) !== null && _d !== void 0 ? _d : (particlesOptions.move = {});
|
|
35
|
+
(_e = (_h = particlesOptions.move).direction) !== null && _e !== void 0 ? _e : (_h.direction = this.options.direction);
|
|
36
|
+
if (this.options.spawnColor) {
|
|
37
|
+
this.spawnColor = (0, engine_1.rangeColorToHsl)(this.options.spawnColor);
|
|
38
|
+
}
|
|
39
|
+
this._paused = !this.options.autoPlay;
|
|
40
|
+
this._particlesOptions = particlesOptions;
|
|
41
|
+
this.size =
|
|
42
|
+
(_f = this.options.size) !== null && _f !== void 0 ? _f : (() => {
|
|
43
|
+
const size = new EmitterSize_1.EmitterSize();
|
|
44
|
+
size.load({
|
|
45
|
+
height: 0,
|
|
46
|
+
mode: "percent",
|
|
47
|
+
width: 0,
|
|
48
|
+
});
|
|
49
|
+
return size;
|
|
50
|
+
})();
|
|
51
|
+
this._lifeCount = (_g = this.options.life.count) !== null && _g !== void 0 ? _g : -1;
|
|
52
|
+
this._immortal = this._lifeCount <= 0;
|
|
53
|
+
this._engine.dispatchEvent("emitterCreated", {
|
|
54
|
+
container,
|
|
55
|
+
data: {
|
|
56
|
+
emitter: this,
|
|
57
|
+
},
|
|
58
|
+
});
|
|
59
|
+
this.play();
|
|
60
|
+
}
|
|
61
|
+
externalPause() {
|
|
62
|
+
this._paused = true;
|
|
63
|
+
this.pause();
|
|
64
|
+
}
|
|
65
|
+
externalPlay() {
|
|
66
|
+
this._paused = false;
|
|
67
|
+
this.play();
|
|
68
|
+
}
|
|
69
|
+
getPosition() {
|
|
70
|
+
if (this.options.domId) {
|
|
71
|
+
const container = this.container, element = document.getElementById(this.options.domId);
|
|
72
|
+
if (element) {
|
|
73
|
+
const elRect = element.getBoundingClientRect();
|
|
74
|
+
return {
|
|
75
|
+
x: (elRect.x + elRect.width / 2) * container.retina.pixelRatio,
|
|
76
|
+
y: (elRect.y + elRect.height / 2) * container.retina.pixelRatio,
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
return this.position;
|
|
81
|
+
}
|
|
82
|
+
getSize() {
|
|
83
|
+
const container = this.container;
|
|
84
|
+
if (this.options.domId) {
|
|
85
|
+
const element = document.getElementById(this.options.domId);
|
|
86
|
+
if (element) {
|
|
87
|
+
const elRect = element.getBoundingClientRect();
|
|
88
|
+
return {
|
|
89
|
+
width: elRect.width * container.retina.pixelRatio,
|
|
90
|
+
height: elRect.height * container.retina.pixelRatio,
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
return {
|
|
95
|
+
width: this.size.mode === "percent"
|
|
96
|
+
? (container.canvas.size.width * this.size.width) / 100
|
|
97
|
+
: this.size.width,
|
|
98
|
+
height: this.size.mode === "percent"
|
|
99
|
+
? (container.canvas.size.height * this.size.height) / 100
|
|
100
|
+
: this.size.height,
|
|
101
|
+
};
|
|
102
|
+
}
|
|
103
|
+
pause() {
|
|
104
|
+
if (this._paused) {
|
|
105
|
+
return;
|
|
106
|
+
}
|
|
107
|
+
delete this._emitDelay;
|
|
108
|
+
}
|
|
109
|
+
play() {
|
|
110
|
+
var _a;
|
|
111
|
+
if (this._paused) {
|
|
112
|
+
return;
|
|
113
|
+
}
|
|
114
|
+
if (!(this.container.retina.reduceFactor &&
|
|
115
|
+
(this._lifeCount > 0 || this._immortal || !this.options.life.count) &&
|
|
116
|
+
(this._firstSpawn || this._currentSpawnDelay >= ((_a = this._spawnDelay) !== null && _a !== void 0 ? _a : 0)))) {
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
if (this._emitDelay === undefined) {
|
|
120
|
+
const delay = (0, engine_1.getRangeValue)(this.options.rate.delay);
|
|
121
|
+
this._emitDelay = (1000 * delay) / this.container.retina.reduceFactor;
|
|
122
|
+
}
|
|
123
|
+
if (this._lifeCount > 0 || this._immortal) {
|
|
124
|
+
this.prepareToDie();
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
resize() {
|
|
128
|
+
const initialPosition = this._initialPosition;
|
|
129
|
+
this.position =
|
|
130
|
+
initialPosition && (0, engine_1.isPointInside)(initialPosition, this.container.canvas.size, engine_1.Vector.origin)
|
|
131
|
+
? initialPosition
|
|
132
|
+
: this.calcPosition();
|
|
133
|
+
}
|
|
134
|
+
update(delta) {
|
|
135
|
+
var _a, _b, _c;
|
|
136
|
+
if (this._paused) {
|
|
137
|
+
return;
|
|
138
|
+
}
|
|
139
|
+
if (this._firstSpawn) {
|
|
140
|
+
this._firstSpawn = false;
|
|
141
|
+
this._currentSpawnDelay = (_a = this._spawnDelay) !== null && _a !== void 0 ? _a : 0;
|
|
142
|
+
this._currentEmitDelay = (_b = this._emitDelay) !== null && _b !== void 0 ? _b : 0;
|
|
143
|
+
}
|
|
144
|
+
if (!this._startParticlesAdded) {
|
|
145
|
+
this._startParticlesAdded = true;
|
|
146
|
+
this.emitParticles(this.options.startCount);
|
|
147
|
+
}
|
|
148
|
+
if (this._duration !== undefined) {
|
|
149
|
+
this._currentDuration += delta.value;
|
|
150
|
+
if (this._currentDuration >= this._duration) {
|
|
151
|
+
this.pause();
|
|
152
|
+
if (this._spawnDelay !== undefined) {
|
|
153
|
+
delete this._spawnDelay;
|
|
154
|
+
}
|
|
155
|
+
if (!this._immortal) {
|
|
156
|
+
this._lifeCount--;
|
|
157
|
+
}
|
|
158
|
+
if (this._lifeCount > 0 || this._immortal) {
|
|
159
|
+
this.position = this.calcPosition();
|
|
160
|
+
this._spawnDelay = (((_c = this.options.life.delay) !== null && _c !== void 0 ? _c : 0) * 1000) / this.container.retina.reduceFactor;
|
|
161
|
+
}
|
|
162
|
+
else {
|
|
163
|
+
this.destroy();
|
|
164
|
+
}
|
|
165
|
+
this._currentDuration -= this._duration;
|
|
166
|
+
delete this._duration;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
if (this._spawnDelay !== undefined) {
|
|
170
|
+
this._currentSpawnDelay += delta.value;
|
|
171
|
+
if (this._currentSpawnDelay >= this._spawnDelay) {
|
|
172
|
+
this._engine.dispatchEvent("emitterPlay", {
|
|
173
|
+
container: this.container,
|
|
174
|
+
});
|
|
175
|
+
this.play();
|
|
176
|
+
this._currentSpawnDelay -= this._currentSpawnDelay;
|
|
177
|
+
delete this._spawnDelay;
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
if (this._emitDelay !== undefined) {
|
|
181
|
+
this._currentEmitDelay += delta.value;
|
|
182
|
+
if (this._currentEmitDelay >= this._emitDelay) {
|
|
183
|
+
this.emit();
|
|
184
|
+
this._currentEmitDelay -= this._emitDelay;
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
calcPosition() {
|
|
189
|
+
return (0, engine_1.calcPositionOrRandomFromSizeRanged)({
|
|
190
|
+
size: this.container.canvas.size,
|
|
191
|
+
position: this.options.position,
|
|
192
|
+
});
|
|
193
|
+
}
|
|
194
|
+
destroy() {
|
|
195
|
+
this.emitters.removeEmitter(this);
|
|
196
|
+
this._engine.dispatchEvent("emitterDestroyed", {
|
|
197
|
+
container: this.container,
|
|
198
|
+
data: {
|
|
199
|
+
emitter: this,
|
|
200
|
+
},
|
|
201
|
+
});
|
|
202
|
+
}
|
|
203
|
+
emit() {
|
|
204
|
+
if (this._paused) {
|
|
205
|
+
return;
|
|
206
|
+
}
|
|
207
|
+
const quantity = (0, engine_1.getRangeValue)(this.options.rate.quantity);
|
|
208
|
+
this.emitParticles(quantity);
|
|
209
|
+
}
|
|
210
|
+
emitParticles(quantity) {
|
|
211
|
+
var _a, _b, _c;
|
|
212
|
+
const position = this.getPosition(), size = this.getSize(), singleParticlesOptions = (0, engine_1.itemFromSingleOrMultiple)(this._particlesOptions);
|
|
213
|
+
for (let i = 0; i < quantity; i++) {
|
|
214
|
+
const particlesOptions = (0, engine_1.deepExtend)({}, singleParticlesOptions);
|
|
215
|
+
if (this.spawnColor) {
|
|
216
|
+
const hslAnimation = (_a = this.options.spawnColor) === null || _a === void 0 ? void 0 : _a.animation;
|
|
217
|
+
if (hslAnimation) {
|
|
218
|
+
this.spawnColor.h = this.setColorAnimation(hslAnimation.h, this.spawnColor.h, 360);
|
|
219
|
+
this.spawnColor.s = this.setColorAnimation(hslAnimation.s, this.spawnColor.s, 100);
|
|
220
|
+
this.spawnColor.l = this.setColorAnimation(hslAnimation.l, this.spawnColor.l, 100);
|
|
221
|
+
}
|
|
222
|
+
if (!particlesOptions.color) {
|
|
223
|
+
particlesOptions.color = {
|
|
224
|
+
value: this.spawnColor,
|
|
225
|
+
};
|
|
226
|
+
}
|
|
227
|
+
else {
|
|
228
|
+
particlesOptions.color.value = this.spawnColor;
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
if (!position) {
|
|
232
|
+
return;
|
|
233
|
+
}
|
|
234
|
+
const pPosition = (_c = (_b = this._shape) === null || _b === void 0 ? void 0 : _b.randomPosition(position, size, this.fill)) !== null && _c !== void 0 ? _c : position;
|
|
235
|
+
this.container.particles.addParticle(pPosition, particlesOptions);
|
|
236
|
+
}
|
|
237
|
+
}
|
|
238
|
+
prepareToDie() {
|
|
239
|
+
var _a;
|
|
240
|
+
if (this._paused) {
|
|
241
|
+
return;
|
|
242
|
+
}
|
|
243
|
+
const duration = (_a = this.options.life) === null || _a === void 0 ? void 0 : _a.duration;
|
|
244
|
+
if (this.container.retina.reduceFactor &&
|
|
245
|
+
(this._lifeCount > 0 || this._immortal) &&
|
|
246
|
+
duration !== undefined &&
|
|
247
|
+
duration > 0) {
|
|
248
|
+
this._duration = duration * 1000;
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
setColorAnimation(animation, initValue, maxValue) {
|
|
252
|
+
var _a;
|
|
253
|
+
const container = this.container;
|
|
254
|
+
if (!animation.enable) {
|
|
255
|
+
return initValue;
|
|
256
|
+
}
|
|
257
|
+
const colorOffset = (0, engine_1.randomInRange)(animation.offset), delay = (0, engine_1.getRangeValue)(this.options.rate.delay), emitFactor = (1000 * delay) / container.retina.reduceFactor, colorSpeed = (0, engine_1.getRangeValue)((_a = animation.speed) !== null && _a !== void 0 ? _a : 0);
|
|
258
|
+
return (initValue + (colorSpeed * container.fpsLimit) / emitFactor + colorOffset * 3.6) % maxValue;
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
exports.EmitterInstance = EmitterInstance;
|
package/cjs/Emitters.js
ADDED
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
+
});
|
|
10
|
+
};
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
exports.Emitters = void 0;
|
|
13
|
+
const engine_1 = require("@tsparticles/engine");
|
|
14
|
+
const Emitter_1 = require("./Options/Classes/Emitter");
|
|
15
|
+
const EmitterInstance_1 = require("./EmitterInstance");
|
|
16
|
+
class Emitters {
|
|
17
|
+
constructor(engine, container) {
|
|
18
|
+
this.container = container;
|
|
19
|
+
this._engine = engine;
|
|
20
|
+
this.array = [];
|
|
21
|
+
this.emitters = [];
|
|
22
|
+
this.interactivityEmitters = {
|
|
23
|
+
random: {
|
|
24
|
+
count: 1,
|
|
25
|
+
enable: false,
|
|
26
|
+
},
|
|
27
|
+
value: [],
|
|
28
|
+
};
|
|
29
|
+
container.getEmitter = (idxOrName) => idxOrName === undefined || typeof idxOrName === "number"
|
|
30
|
+
? this.array[idxOrName || 0]
|
|
31
|
+
: this.array.find((t) => t.name === idxOrName);
|
|
32
|
+
container.addEmitter = (options, position) => this.addEmitter(options, position);
|
|
33
|
+
container.removeEmitter = (idxOrName) => {
|
|
34
|
+
const emitter = container.getEmitter(idxOrName);
|
|
35
|
+
if (emitter) {
|
|
36
|
+
this.removeEmitter(emitter);
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
container.playEmitter = (idxOrName) => {
|
|
40
|
+
const emitter = container.getEmitter(idxOrName);
|
|
41
|
+
if (emitter) {
|
|
42
|
+
emitter.externalPlay();
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
container.pauseEmitter = (idxOrName) => {
|
|
46
|
+
const emitter = container.getEmitter(idxOrName);
|
|
47
|
+
if (emitter) {
|
|
48
|
+
emitter.externalPause();
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
addEmitter(options, position) {
|
|
53
|
+
const emitterOptions = new Emitter_1.Emitter();
|
|
54
|
+
emitterOptions.load(options);
|
|
55
|
+
const emitter = new EmitterInstance_1.EmitterInstance(this._engine, this, this.container, emitterOptions, position);
|
|
56
|
+
this.array.push(emitter);
|
|
57
|
+
return emitter;
|
|
58
|
+
}
|
|
59
|
+
handleClickMode(mode) {
|
|
60
|
+
const emitterOptions = this.emitters, modeEmitters = this.interactivityEmitters;
|
|
61
|
+
if (mode === "emitter") {
|
|
62
|
+
let emittersModeOptions;
|
|
63
|
+
if (modeEmitters && modeEmitters.value instanceof Array) {
|
|
64
|
+
if (modeEmitters.value.length > 0 && modeEmitters.random.enable) {
|
|
65
|
+
emittersModeOptions = [];
|
|
66
|
+
const usedIndexes = [];
|
|
67
|
+
for (let i = 0; i < modeEmitters.random.count; i++) {
|
|
68
|
+
const idx = (0, engine_1.arrayRandomIndex)(modeEmitters.value);
|
|
69
|
+
if (usedIndexes.includes(idx) && usedIndexes.length < modeEmitters.value.length) {
|
|
70
|
+
i--;
|
|
71
|
+
continue;
|
|
72
|
+
}
|
|
73
|
+
usedIndexes.push(idx);
|
|
74
|
+
emittersModeOptions.push((0, engine_1.itemFromArray)(modeEmitters.value, idx));
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
else {
|
|
78
|
+
emittersModeOptions = modeEmitters.value;
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
else {
|
|
82
|
+
emittersModeOptions = modeEmitters === null || modeEmitters === void 0 ? void 0 : modeEmitters.value;
|
|
83
|
+
}
|
|
84
|
+
const emittersOptions = emittersModeOptions !== null && emittersModeOptions !== void 0 ? emittersModeOptions : emitterOptions, ePosition = this.container.interactivity.mouse.clickPosition;
|
|
85
|
+
(0, engine_1.executeOnSingleOrMultiple)(emittersOptions, (emitter) => {
|
|
86
|
+
this.addEmitter(emitter, ePosition);
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
init() {
|
|
91
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
92
|
+
this.emitters = this.container.actualOptions.emitters;
|
|
93
|
+
this.interactivityEmitters = this.container.actualOptions.interactivity.modes.emitters;
|
|
94
|
+
if (this.emitters instanceof Array) {
|
|
95
|
+
for (const emitterOptions of this.emitters) {
|
|
96
|
+
this.addEmitter(emitterOptions);
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
else {
|
|
100
|
+
this.addEmitter(this.emitters);
|
|
101
|
+
}
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
pause() {
|
|
105
|
+
for (const emitter of this.array) {
|
|
106
|
+
emitter.pause();
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
play() {
|
|
110
|
+
for (const emitter of this.array) {
|
|
111
|
+
emitter.play();
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
removeEmitter(emitter) {
|
|
115
|
+
const index = this.array.indexOf(emitter);
|
|
116
|
+
if (index >= 0) {
|
|
117
|
+
this.array.splice(index, 1);
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
resize() {
|
|
121
|
+
for (const emitter of this.array) {
|
|
122
|
+
emitter.resize();
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
stop() {
|
|
126
|
+
this.array = [];
|
|
127
|
+
}
|
|
128
|
+
update(delta) {
|
|
129
|
+
for (const emitter of this.array) {
|
|
130
|
+
emitter.update(delta);
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
exports.Emitters = Emitters;
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Emitter = void 0;
|
|
4
|
+
const engine_1 = require("@tsparticles/engine");
|
|
5
|
+
const EmitterLife_1 = require("./EmitterLife");
|
|
6
|
+
const EmitterRate_1 = require("./EmitterRate");
|
|
7
|
+
const EmitterSize_1 = require("./EmitterSize");
|
|
8
|
+
class Emitter {
|
|
9
|
+
constructor() {
|
|
10
|
+
this.autoPlay = true;
|
|
11
|
+
this.fill = true;
|
|
12
|
+
this.life = new EmitterLife_1.EmitterLife();
|
|
13
|
+
this.rate = new EmitterRate_1.EmitterRate();
|
|
14
|
+
this.shape = "square";
|
|
15
|
+
this.startCount = 0;
|
|
16
|
+
}
|
|
17
|
+
load(data) {
|
|
18
|
+
if (data === undefined) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
if (data.autoPlay !== undefined) {
|
|
22
|
+
this.autoPlay = data.autoPlay;
|
|
23
|
+
}
|
|
24
|
+
if (data.size !== undefined) {
|
|
25
|
+
if (this.size === undefined) {
|
|
26
|
+
this.size = new EmitterSize_1.EmitterSize();
|
|
27
|
+
}
|
|
28
|
+
this.size.load(data.size);
|
|
29
|
+
}
|
|
30
|
+
if (data.direction !== undefined) {
|
|
31
|
+
this.direction = data.direction;
|
|
32
|
+
}
|
|
33
|
+
this.domId = data.domId;
|
|
34
|
+
if (data.fill !== undefined) {
|
|
35
|
+
this.fill = data.fill;
|
|
36
|
+
}
|
|
37
|
+
this.life.load(data.life);
|
|
38
|
+
this.name = data.name;
|
|
39
|
+
this.particles = (0, engine_1.executeOnSingleOrMultiple)(data.particles, (particles) => {
|
|
40
|
+
return (0, engine_1.deepExtend)({}, particles);
|
|
41
|
+
});
|
|
42
|
+
this.rate.load(data.rate);
|
|
43
|
+
if (data.shape !== undefined) {
|
|
44
|
+
this.shape = data.shape;
|
|
45
|
+
}
|
|
46
|
+
if (data.position !== undefined) {
|
|
47
|
+
this.position = {};
|
|
48
|
+
if (data.position.x !== undefined) {
|
|
49
|
+
this.position.x = (0, engine_1.setRangeValue)(data.position.x);
|
|
50
|
+
}
|
|
51
|
+
if (data.position.y !== undefined) {
|
|
52
|
+
this.position.y = (0, engine_1.setRangeValue)(data.position.y);
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
if (data.spawnColor !== undefined) {
|
|
56
|
+
if (this.spawnColor === undefined) {
|
|
57
|
+
this.spawnColor = new engine_1.AnimatableColor();
|
|
58
|
+
}
|
|
59
|
+
this.spawnColor.load(data.spawnColor);
|
|
60
|
+
}
|
|
61
|
+
if (data.startCount !== undefined) {
|
|
62
|
+
this.startCount = data.startCount;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
exports.Emitter = Emitter;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.EmitterLife = void 0;
|
|
4
|
+
class EmitterLife {
|
|
5
|
+
constructor() {
|
|
6
|
+
this.wait = false;
|
|
7
|
+
}
|
|
8
|
+
load(data) {
|
|
9
|
+
if (data === undefined) {
|
|
10
|
+
return;
|
|
11
|
+
}
|
|
12
|
+
if (data.count !== undefined) {
|
|
13
|
+
this.count = data.count;
|
|
14
|
+
}
|
|
15
|
+
if (data.delay !== undefined) {
|
|
16
|
+
this.delay = data.delay;
|
|
17
|
+
}
|
|
18
|
+
if (data.duration !== undefined) {
|
|
19
|
+
this.duration = data.duration;
|
|
20
|
+
}
|
|
21
|
+
if (data.wait !== undefined) {
|
|
22
|
+
this.wait = data.wait;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
exports.EmitterLife = EmitterLife;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.EmitterRate = void 0;
|
|
4
|
+
const engine_1 = require("@tsparticles/engine");
|
|
5
|
+
class EmitterRate {
|
|
6
|
+
constructor() {
|
|
7
|
+
this.quantity = 1;
|
|
8
|
+
this.delay = 0.1;
|
|
9
|
+
}
|
|
10
|
+
load(data) {
|
|
11
|
+
if (data === undefined) {
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
if (data.quantity !== undefined) {
|
|
15
|
+
this.quantity = (0, engine_1.setRangeValue)(data.quantity);
|
|
16
|
+
}
|
|
17
|
+
if (data.delay !== undefined) {
|
|
18
|
+
this.delay = (0, engine_1.setRangeValue)(data.delay);
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
exports.EmitterRate = EmitterRate;
|