Skip to content

Commit 610f660

Browse files
committed
Release v2.2.4
1 parent 8233b00 commit 610f660

File tree

5 files changed

+241
-183
lines changed

5 files changed

+241
-183
lines changed

CHANGES.MD

+8
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,12 @@
11

2+
## 2.2.4
3+
4+
* OOF, forgot to run build on the last 2 releases.
5+
6+
## 2.2.3
7+
8+
* fix the typings file (for reals this time)
9+
210
## 2.2.3
311

412
* fix the typings file (oops!)

fireworks.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11

22
export as namespace Fireworks;
33

4-
declare class Fireworks2 {
4+
declare class Fireworks {
55
constructor(container: HTMLElement, options?: Fireworks.FireworksOptions);
66
destroy(): void;
77
start(): () => void;
@@ -22,4 +22,4 @@ declare namespace Fireworks {
2222
}
2323
}
2424

25-
export default Fireworks
25+
export = Fireworks

fireworks.js

+229-32
Original file line numberDiff line numberDiff line change
@@ -91,58 +91,255 @@ return /******/ (function(modules) { // webpackBootstrap
9191
/******/
9292
/******/
9393
/******/ // Load entry module and return exports
94-
/******/ return __webpack_require__(__webpack_require__.s = "./ts/fireworks.ts");
94+
/******/ return __webpack_require__(__webpack_require__.s = 1);
9595
/******/ })
9696
/************************************************************************/
97-
/******/ ({
98-
99-
/***/ "./ts/fireworks.ts":
100-
/*!*************************!*\
101-
!*** ./ts/fireworks.ts ***!
102-
\*************************/
103-
/*! no static exports found */
97+
/******/ ([
98+
/* 0 */
10499
/***/ (function(module, exports, __webpack_require__) {
105100

106101
"use strict";
107-
eval("\nObject.defineProperty(exports, \"__esModule\", { value: true });\nconst things_1 = __webpack_require__(/*! ./things */ \"./ts/things.ts\");\nclass Fireworks {\n constructor(container, { rocketSpawnInterval = 150, maxRockets = 3, numParticles = 100, explosionMinHeight = 0.2, explosionMaxHeight = 0.9, explosionChance = 0.08 } = {}) {\n this.rocketSpawnInterval = rocketSpawnInterval;\n this.maxRockets = maxRockets;\n this.cw = container.clientWidth;\n this.ch = container.clientHeight;\n this.max_h = this.ch * (1 - explosionMaxHeight);\n this.min_h = this.ch * (1 - explosionMinHeight);\n this.chance = explosionChance;\n this.canvas = document.createElement('canvas');\n this.canvas.width = this.cw;\n this.canvas.height = this.ch;\n this.ctx = this.canvas.getContext('2d');\n container.appendChild(this.canvas);\n this.things = new things_1.default({\n maxRockets: this.maxRockets,\n numParticles,\n cw: this.cw,\n ch: this.ch\n });\n }\n destroy() {\n this.canvas.parentElement.removeChild(this.canvas);\n window.clearInterval(this.interval);\n window.cancelAnimationFrame(this.rafInterval);\n }\n start() {\n if (this.maxRockets > 0) {\n this.interval = setInterval(() => this.things.spawnRockets(), this.rocketSpawnInterval);\n this.rafInterval = window.requestAnimationFrame(() => this.update());\n }\n return () => this.stop();\n }\n stop() {\n window.clearInterval(this.interval);\n this.interval = null;\n }\n kill() {\n this.things.clear();\n this.stop();\n window.cancelAnimationFrame(this.rafInterval);\n this.rafInterval = null;\n this._clear(true);\n }\n fire() {\n this.things.spawnRocket();\n if (!this.rafInterval) {\n this.rafInterval = window.requestAnimationFrame(() => this.update());\n }\n }\n _clear(force = false) {\n this.ctx.globalCompositeOperation = 'destination-out';\n this.ctx.fillStyle = `rgba(0, 0, 0 ${force ? '' : ', 0.5'})`;\n this.ctx.fillRect(0, 0, this.cw, this.ch);\n this.ctx.globalCompositeOperation = 'lighter';\n }\n update() {\n this._clear();\n for (const particle of this.things) {\n particle.draw(this.ctx);\n particle.update();\n if (particle.shouldRemove(this.cw, this.ch)) {\n this.things.delete(particle);\n }\n else if (particle.shouldExplode(this.max_h, this.min_h, this.chance)) {\n this.things.explode(particle);\n }\n }\n if (this.interval || this.things.size > 0) {\n this.rafInterval = window.requestAnimationFrame(() => this.update());\n }\n else {\n this._clear(true);\n this.rafInterval = null;\n }\n }\n}\nexports.default = Fireworks;\n\n\n//# sourceURL=webpack://Fireworks/./ts/fireworks.ts?");
108102

109-
/***/ }),
103+
Object.defineProperty(exports, "__esModule", { value: true });
104+
function random(min, max) {
105+
return Math.random() * (max - min) + min;
106+
}
107+
exports.random = random;
108+
exports.TAU = Math.PI * 2;
110109

111-
/***/ "./ts/particle.ts":
112-
/*!************************!*\
113-
!*** ./ts/particle.ts ***!
114-
\************************/
115-
/*! no static exports found */
110+
111+
/***/ }),
112+
/* 1 */
116113
/***/ (function(module, exports, __webpack_require__) {
117114

118115
"use strict";
119-
eval("\nObject.defineProperty(exports, \"__esModule\", { value: true });\nconst util_1 = __webpack_require__(/*! ./util */ \"./ts/util.ts\");\nclass Particle {\n constructor({ isRocket = false, hue = util_1.random(1, 360), brightness = util_1.random(50, 60), position }) {\n this.isRocket = isRocket;\n this.position = position;\n this.positions = [\n this.position,\n this.position,\n this.position\n ];\n if (this.isRocket) {\n this.velocity = {\n x: util_1.random(-3, 3),\n y: util_1.random(-7, -3)\n };\n this.shrink = 0.999;\n this.resistance = 1;\n }\n else {\n const angle = util_1.random(0, util_1.TAU);\n const speed = Math.cos(util_1.random(0, util_1.TAU)) * 15;\n this.velocity = {\n x: Math.cos(angle) * speed,\n y: Math.sin(angle) * speed\n };\n this.shrink = util_1.random(0, 0.05) + 0.93;\n this.resistance = 0.92;\n }\n this.gravity = 0.01;\n this.size = 3;\n this.alpha = 1;\n this.fade = 0;\n this.hue = hue;\n this.brightness = brightness;\n }\n clone() {\n return new Particle({\n position: {\n x: this.position.x,\n y: this.position.y\n },\n hue: this.hue,\n brightness: this.brightness\n });\n }\n shouldRemove(cw, ch) {\n if (this.alpha <= 0.1 || this.size <= 1) {\n return true;\n }\n if (this.position.x > cw || this.position.x < 0) {\n return true;\n }\n if (this.position.y > ch || this.position.y < 0) {\n return true;\n }\n return false;\n }\n shouldExplode(maxHeight, minHeight, chance) {\n if (!this.isRocket) {\n return false;\n }\n if (this.position.y <= maxHeight) {\n return true;\n }\n if (this.position.y >= minHeight) {\n return false;\n }\n return util_1.random(0, 1) <= chance;\n }\n update() {\n this.positions.pop();\n this.positions.unshift({ x: this.position.x, y: this.position.y });\n this.velocity.x *= this.resistance;\n this.velocity.y *= this.resistance;\n this.velocity.y += this.gravity;\n this.position.x += this.velocity.x;\n this.position.y += this.velocity.y;\n this.size *= this.shrink;\n this.alpha -= this.fade;\n }\n draw(ctx) {\n const lastPosition = this.positions[this.positions.length - 1];\n ctx.beginPath();\n ctx.moveTo(lastPosition.x, lastPosition.y);\n ctx.lineTo(this.position.x, this.position.y);\n ctx.lineWidth = this.size;\n ctx.strokeStyle = `hsla(${this.hue}, 100%, ${this.brightness}%, ${this.alpha})`;\n ctx.stroke();\n }\n}\nexports.default = Particle;\n\n\n//# sourceURL=webpack://Fireworks/./ts/particle.ts?");
120116

121-
/***/ }),
117+
Object.defineProperty(exports, "__esModule", { value: true });
118+
const things_1 = __webpack_require__(2);
119+
class Fireworks {
120+
constructor(container, { rocketSpawnInterval = 150, maxRockets = 3, numParticles = 100, explosionMinHeight = 0.2, explosionMaxHeight = 0.9, explosionChance = 0.08 } = {}) {
121+
this.rocketSpawnInterval = rocketSpawnInterval;
122+
this.maxRockets = maxRockets;
123+
this.cw = container.clientWidth;
124+
this.ch = container.clientHeight;
125+
this.max_h = this.ch * (1 - explosionMaxHeight);
126+
this.min_h = this.ch * (1 - explosionMinHeight);
127+
this.chance = explosionChance;
128+
this.canvas = document.createElement('canvas');
129+
this.canvas.width = this.cw;
130+
this.canvas.height = this.ch;
131+
this.ctx = this.canvas.getContext('2d');
132+
container.appendChild(this.canvas);
133+
this.things = new things_1.default({
134+
maxRockets: this.maxRockets,
135+
numParticles,
136+
cw: this.cw,
137+
ch: this.ch
138+
});
139+
}
140+
destroy() {
141+
this.canvas.parentElement.removeChild(this.canvas);
142+
window.clearInterval(this.interval);
143+
window.cancelAnimationFrame(this.rafInterval);
144+
}
145+
start() {
146+
if (this.maxRockets > 0) {
147+
this.interval = setInterval(() => this.things.spawnRockets(), this.rocketSpawnInterval);
148+
this.rafInterval = window.requestAnimationFrame(() => this.update());
149+
}
150+
return () => this.stop();
151+
}
152+
stop() {
153+
window.clearInterval(this.interval);
154+
this.interval = null;
155+
}
156+
kill() {
157+
this.things.clear();
158+
this.stop();
159+
window.cancelAnimationFrame(this.rafInterval);
160+
this.rafInterval = null;
161+
this._clear(true);
162+
}
163+
fire() {
164+
this.things.spawnRocket();
165+
if (!this.rafInterval) {
166+
this.rafInterval = window.requestAnimationFrame(() => this.update());
167+
}
168+
}
169+
_clear(force = false) {
170+
this.ctx.globalCompositeOperation = 'destination-out';
171+
this.ctx.fillStyle = `rgba(0, 0, 0 ${force ? '' : ', 0.5'})`;
172+
this.ctx.fillRect(0, 0, this.cw, this.ch);
173+
this.ctx.globalCompositeOperation = 'lighter';
174+
}
175+
update() {
176+
this._clear();
177+
for (const particle of this.things) {
178+
particle.draw(this.ctx);
179+
particle.update();
180+
if (particle.shouldRemove(this.cw, this.ch)) {
181+
this.things.delete(particle);
182+
}
183+
else if (particle.shouldExplode(this.max_h, this.min_h, this.chance)) {
184+
this.things.explode(particle);
185+
}
186+
}
187+
if (this.interval || this.things.size > 0) {
188+
this.rafInterval = window.requestAnimationFrame(() => this.update());
189+
}
190+
else {
191+
this._clear(true);
192+
this.rafInterval = null;
193+
}
194+
}
195+
}
196+
exports.default = Fireworks;
197+
122198

123-
/***/ "./ts/things.ts":
124-
/*!**********************!*\
125-
!*** ./ts/things.ts ***!
126-
\**********************/
127-
/*! no static exports found */
199+
/***/ }),
200+
/* 2 */
128201
/***/ (function(module, exports, __webpack_require__) {
129202

130203
"use strict";
131-
eval("\nObject.defineProperty(exports, \"__esModule\", { value: true });\nconst particle_1 = __webpack_require__(/*! ./particle */ \"./ts/particle.ts\");\nconst util_1 = __webpack_require__(/*! ./util */ \"./ts/util.ts\");\nclass Things extends Set {\n constructor({ maxRockets, numParticles, cw, ch }) {\n super();\n this.rockets = 0;\n this.maxRockets = maxRockets;\n this.numParticles = numParticles;\n this.cw = cw;\n this.ch = ch;\n }\n explode(particle) {\n this.rockets--;\n for (let i = 0; i < this.numParticles; i += 1) {\n this.add(particle.clone());\n }\n this.delete(particle);\n }\n spawnRocket() {\n this.rockets++;\n this.add(new particle_1.default({\n isRocket: true,\n position: {\n x: util_1.random(0, this.cw),\n y: this.ch\n }\n }));\n }\n spawnRockets() {\n if (this.rockets < this.maxRockets) {\n this.spawnRocket();\n }\n }\n}\nexports.default = Things;\n\n\n//# sourceURL=webpack://Fireworks/./ts/things.ts?");
132204

133-
/***/ }),
205+
Object.defineProperty(exports, "__esModule", { value: true });
206+
const particle_1 = __webpack_require__(3);
207+
const util_1 = __webpack_require__(0);
208+
class Things extends Set {
209+
constructor({ maxRockets, numParticles, cw, ch }) {
210+
super();
211+
this.rockets = 0;
212+
this.maxRockets = maxRockets;
213+
this.numParticles = numParticles;
214+
this.cw = cw;
215+
this.ch = ch;
216+
}
217+
explode(particle) {
218+
this.rockets--;
219+
for (let i = 0; i < this.numParticles; i += 1) {
220+
this.add(particle.clone());
221+
}
222+
this.delete(particle);
223+
}
224+
spawnRocket() {
225+
this.rockets++;
226+
this.add(new particle_1.default({
227+
isRocket: true,
228+
position: {
229+
x: util_1.random(0, this.cw),
230+
y: this.ch
231+
}
232+
}));
233+
}
234+
spawnRockets() {
235+
if (this.rockets < this.maxRockets) {
236+
this.spawnRocket();
237+
}
238+
}
239+
}
240+
exports.default = Things;
241+
134242

135-
/***/ "./ts/util.ts":
136-
/*!********************!*\
137-
!*** ./ts/util.ts ***!
138-
\********************/
139-
/*! no static exports found */
243+
/***/ }),
244+
/* 3 */
140245
/***/ (function(module, exports, __webpack_require__) {
141246

142247
"use strict";
143-
eval("\nObject.defineProperty(exports, \"__esModule\", { value: true });\nfunction random(min, max) {\n return Math.random() * (max - min) + min;\n}\nexports.random = random;\nexports.TAU = Math.PI * 2;\n\n\n//# sourceURL=webpack://Fireworks/./ts/util.ts?");
144248

145-
/***/ })
249+
Object.defineProperty(exports, "__esModule", { value: true });
250+
const util_1 = __webpack_require__(0);
251+
class Particle {
252+
constructor({ isRocket = false, hue = util_1.random(1, 360), brightness = util_1.random(50, 60), position }) {
253+
this.isRocket = isRocket;
254+
this.position = position;
255+
this.positions = [
256+
this.position,
257+
this.position,
258+
this.position
259+
];
260+
if (this.isRocket) {
261+
this.velocity = {
262+
x: util_1.random(-3, 3),
263+
y: util_1.random(-7, -3)
264+
};
265+
this.shrink = 0.999;
266+
this.resistance = 1;
267+
}
268+
else {
269+
const angle = util_1.random(0, util_1.TAU);
270+
const speed = Math.cos(util_1.random(0, util_1.TAU)) * 15;
271+
this.velocity = {
272+
x: Math.cos(angle) * speed,
273+
y: Math.sin(angle) * speed
274+
};
275+
this.shrink = util_1.random(0, 0.05) + 0.93;
276+
this.resistance = 0.92;
277+
}
278+
this.gravity = 0.01;
279+
this.size = 3;
280+
this.alpha = 1;
281+
this.fade = 0;
282+
this.hue = hue;
283+
this.brightness = brightness;
284+
}
285+
clone() {
286+
return new Particle({
287+
position: {
288+
x: this.position.x,
289+
y: this.position.y
290+
},
291+
hue: this.hue,
292+
brightness: this.brightness
293+
});
294+
}
295+
shouldRemove(cw, ch) {
296+
if (this.alpha <= 0.1 || this.size <= 1) {
297+
return true;
298+
}
299+
if (this.position.x > cw || this.position.x < 0) {
300+
return true;
301+
}
302+
if (this.position.y > ch || this.position.y < 0) {
303+
return true;
304+
}
305+
return false;
306+
}
307+
shouldExplode(maxHeight, minHeight, chance) {
308+
if (!this.isRocket) {
309+
return false;
310+
}
311+
if (this.position.y <= maxHeight) {
312+
return true;
313+
}
314+
if (this.position.y >= minHeight) {
315+
return false;
316+
}
317+
return util_1.random(0, 1) <= chance;
318+
}
319+
update() {
320+
this.positions.pop();
321+
this.positions.unshift({ x: this.position.x, y: this.position.y });
322+
this.velocity.x *= this.resistance;
323+
this.velocity.y *= this.resistance;
324+
this.velocity.y += this.gravity;
325+
this.position.x += this.velocity.x;
326+
this.position.y += this.velocity.y;
327+
this.size *= this.shrink;
328+
this.alpha -= this.fade;
329+
}
330+
draw(ctx) {
331+
const lastPosition = this.positions[this.positions.length - 1];
332+
ctx.beginPath();
333+
ctx.moveTo(lastPosition.x, lastPosition.y);
334+
ctx.lineTo(this.position.x, this.position.y);
335+
ctx.lineWidth = this.size;
336+
ctx.strokeStyle = `hsla(${this.hue}, 100%, ${this.brightness}%, ${this.alpha})`;
337+
ctx.stroke();
338+
}
339+
}
340+
exports.default = Particle;
341+
146342

147-
/******/ })["default"];
343+
/***/ })
344+
/******/ ])["default"];
148345
});

0 commit comments

Comments
 (0)