89 lines
1.9 KiB
JavaScript
89 lines
1.9 KiB
JavaScript
import {FullscreenEffect} from "./FullscreenEffect.js";
|
|
|
|
export class ThunderstormEffect extends FullscreenEffect
|
|
{
|
|
static NAME = 'thunderstorm';
|
|
|
|
constructor()
|
|
{
|
|
super();
|
|
|
|
this.currentAlpha = 0.0;
|
|
this.nextFlash = undefined;
|
|
this.duration = 150;
|
|
this.sounds = [
|
|
new Audio('js/effects/thunder01.mp3'),
|
|
new Audio('js/effects/thunder02.mp3'),
|
|
new Audio('js/effects/thunder03.mp3'),
|
|
new Audio('js/effects/thunder04.mp3'),
|
|
];
|
|
this.currentSound = 0;
|
|
}
|
|
|
|
shuffleSounds(iterations = 10)
|
|
{
|
|
const buffer = this.sounds.slice(0, this.sounds.length - 1);
|
|
|
|
for (let i = 0; i < iterations; i++) {
|
|
buffer.sort(
|
|
(a, b) => {
|
|
return 1 - Math.round(Math.random()) * 2
|
|
}
|
|
);
|
|
}
|
|
|
|
const index = 1 + Math.round(Math.random() * (buffer.length - 1));
|
|
|
|
this.sounds = buffer.slice(0, index)
|
|
.concat([this.sounds[this.sounds.length - 1]])
|
|
.concat(buffer.slice(index));
|
|
}
|
|
|
|
update(timestamp)
|
|
{
|
|
super.update(timestamp);
|
|
|
|
if (this.nextFlash > timestamp) {
|
|
this.currentAlpha = 0.0;
|
|
|
|
return;
|
|
}
|
|
|
|
if (timestamp < this.nextFlash + this.duration) {
|
|
const progress = (timestamp - this.nextFlash) / this.duration;
|
|
|
|
this.currentAlpha = Math.sin(Math.PI * progress) * 0.75;
|
|
} else {
|
|
const duration = 3000 + Math.round(Math.random() * 27000);
|
|
|
|
this.nextFlash = timestamp + duration;
|
|
|
|
setTimeout(
|
|
() => {
|
|
if (this.currentSound === 0) {
|
|
this.shuffleSounds();
|
|
}
|
|
|
|
this.sounds[this.currentSound].currentTime = 0;
|
|
this.sounds[this.currentSound].play();
|
|
|
|
this.currentSound = (this.currentSound + 1) % this.sounds.length;
|
|
},
|
|
duration + 1000
|
|
);
|
|
}
|
|
}
|
|
|
|
render(context, camera)
|
|
{
|
|
super.render(context, camera);
|
|
|
|
if (this.currentAlpha === 0.0) {
|
|
return;
|
|
}
|
|
|
|
context.fillStyle = 'rgba(255, 255, 255, ' + this.currentAlpha + ')';
|
|
context.fillRect(0, 0, context.canvas.width, context.canvas.height);
|
|
}
|
|
}
|