Files
OpenFrontIO/src/client/sound/SoundManager.ts
T
Gabe Kauffman 5b36c02ff0 Implement a "ka-ching" sound effect on kill (#2097)
## Description:
Building off of [this
PR](https://github.com/openfrontio/OpenFrontIO/pull/2090) which
implemented music, I extend this functionality to add sound effects.
Diff will be reduced if and when that PR gets merged!

I think the game would benefit from more sound effects, and adding a
"ka-ching" sound effect on kill seems like an easy place to start.

The ka-ching sound effect was found
[here](https://freesound.org/people/AKkingStudio/sounds/684165/) and is
licensed under Creative Commons.

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

Demo video with sound:

https://github.com/user-attachments/assets/18c857a4-a741-492a-bbc1-68d4f3ba38da


## Please put your Discord username so you can be contacted if a bug or
regression is found:
basedgob

---------

Co-authored-by: icslucas <carolinacarazolli@gmail.com>
2025-10-02 16:27:06 -07:00

110 lines
2.8 KiB
TypeScript

import { Howl } from "howler";
import of4 from "../../../proprietary/sounds/music/of4.mp3";
import openfront from "../../../proprietary/sounds/music/openfront.mp3";
import war from "../../../proprietary/sounds/music/war.mp3";
import kaChingSound from "../../../resources/sounds/effects/ka-ching.mp3";
export enum SoundEffect {
KaChing = "ka-ching",
}
class SoundManager {
private backgroundMusic: Howl[] = [];
private currentTrack: number = 0;
private soundEffects: Map<SoundEffect, Howl> = new Map();
private soundEffectsVolume: number = 1;
private backgroundMusicVolume: number = 0;
constructor() {
this.backgroundMusic = [
new Howl({
src: [of4],
loop: false,
onend: this.playNext.bind(this),
volume: 0,
}),
new Howl({
src: [openfront],
loop: false,
onend: this.playNext.bind(this),
volume: 0,
}),
new Howl({
src: [war],
loop: false,
onend: this.playNext.bind(this),
volume: 0,
}),
];
this.loadSoundEffect(SoundEffect.KaChing, kaChingSound);
}
public playBackgroundMusic(): void {
if (
this.backgroundMusic.length > 0 &&
!this.backgroundMusic[this.currentTrack].playing()
) {
this.backgroundMusic[this.currentTrack].play();
}
}
public stopBackgroundMusic(): void {
if (this.backgroundMusic.length > 0) {
this.backgroundMusic[this.currentTrack].stop();
}
}
public setBackgroundMusicVolume(volume: number): void {
this.backgroundMusicVolume = Math.max(0, Math.min(1, volume));
this.backgroundMusic.forEach((track) => {
track.volume(this.backgroundMusicVolume);
});
}
private playNext(): void {
this.currentTrack = (this.currentTrack + 1) % this.backgroundMusic.length;
this.playBackgroundMusic();
}
public loadSoundEffect(name: SoundEffect, src: string): void {
if (!this.soundEffects.has(name)) {
const sound = new Howl({
src: [src],
volume: this.soundEffectsVolume,
});
this.soundEffects.set(name, sound);
}
}
public playSoundEffect(name: SoundEffect): void {
const sound = this.soundEffects.get(name);
if (sound) {
sound.play();
}
}
public setSoundEffectsVolume(volume: number): void {
this.soundEffectsVolume = Math.max(0, Math.min(1, volume));
this.soundEffects.forEach((sound) => {
sound.volume(this.soundEffectsVolume);
});
}
public stopSoundEffect(name: SoundEffect): void {
const sound = this.soundEffects.get(name);
if (sound) {
sound.stop();
}
}
public unloadSoundEffect(name: SoundEffect): void {
const sound = this.soundEffects.get(name);
if (sound) {
sound.unload();
this.soundEffects.delete(name);
}
}
}
export default new SoundManager();