changed canvas globalCompositeOperation value and removed probability
parent
4a73402b21
commit
2a2c805031
|
@ -26,7 +26,6 @@ export type FireworksOptions = {
|
||||||
* gravity value that firework adds to shift from it's start position
|
* gravity value that firework adds to shift from it's start position
|
||||||
*/
|
*/
|
||||||
gravity: number,
|
gravity: number,
|
||||||
probability: number,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
type FireworksParticle = {
|
type FireworksParticle = {
|
||||||
|
@ -58,7 +57,6 @@ type FireworksParticle = {
|
||||||
export const DefaultOptions: FireworksOptions = {
|
export const DefaultOptions: FireworksOptions = {
|
||||||
maxCount: 500,
|
maxCount: 500,
|
||||||
gravity: 0.05,
|
gravity: 0.05,
|
||||||
probability: 0.04,
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export default class Fireworks implements ICanvasEffect {
|
export default class Fireworks implements ICanvasEffect {
|
||||||
|
@ -95,7 +93,7 @@ export default class Fireworks implements ICanvasEffect {
|
||||||
this.supportsAnimationFrame.call(window, this.updateWorld);
|
this.supportsAnimationFrame.call(window, this.updateWorld);
|
||||||
}
|
}
|
||||||
private update = () => {
|
private update = () => {
|
||||||
if (this.particles.length < this.options.maxCount && Math.random() < this.options.probability) {
|
if (this.particles.length < this.options.maxCount) {
|
||||||
this.createFirework();
|
this.createFirework();
|
||||||
}
|
}
|
||||||
const alive = [];
|
const alive = [];
|
||||||
|
@ -109,9 +107,8 @@ export default class Fireworks implements ICanvasEffect {
|
||||||
|
|
||||||
private paint = () => {
|
private paint = () => {
|
||||||
if (!this.context || !this.context.canvas) return;
|
if (!this.context || !this.context.canvas) return;
|
||||||
this.context.globalCompositeOperation = 'source-over';
|
this.context.globalCompositeOperation = 'destination-out';
|
||||||
this.context.fillStyle = "rgba(0,0,0,0.2)";
|
this.context.fillStyle = "rgba(0,0,0,0.5)";
|
||||||
this.context.canvas.style.opacity = "0.8";
|
|
||||||
this.context.fillRect(0, 0, this.context.canvas.width, this.context.canvas.height);
|
this.context.fillRect(0, 0, this.context.canvas.width, this.context.canvas.height);
|
||||||
this.context.globalCompositeOperation = 'lighter';
|
this.context.globalCompositeOperation = 'lighter';
|
||||||
for (let i=0; i<this.particles.length; i++) {
|
for (let i=0; i<this.particles.length; i++) {
|
||||||
|
|
|
@ -74,7 +74,6 @@ type FireworksOptions = {
|
||||||
* gravity value that firework adds to shift from it's start position
|
* gravity value that firework adds to shift from it's start position
|
||||||
*/
|
*/
|
||||||
gravity: number,
|
gravity: number,
|
||||||
probability: number,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -104,7 +103,6 @@ export const CHAT_EFFECTS: Array<Effect<{ [key: string]: any }>> = [
|
||||||
options: {
|
options: {
|
||||||
maxCount: 500,
|
maxCount: 500,
|
||||||
gravity: 0.05,
|
gravity: 0.05,
|
||||||
probability: 0.04,
|
|
||||||
},
|
},
|
||||||
} as Effect<FireworksOptions>,
|
} as Effect<FireworksOptions>,
|
||||||
];
|
];
|
||||||
|
|
Loading…
Reference in New Issue