Fix ambient not playing

deployment

@@ -0,0 +1 @@
+Subproject commit 7c7991fddae5bbf06811dda6d5eddba1e1621c53

frontend/src/index.ts

@@ -108,7 +108,16 @@ const main = async () => {
     let game: Game;
 
     const firstClickListener = () => {
-      SoundHandler.initialize();
+      SoundHandler.initialize(
+        () => {
+          enableMusic.checked = true;
+          enableMusic.dispatchEvent(new Event('change'));
+        },
+        () => {
+          enableMusic.checked = false;
+          enableMusic.dispatchEvent(new Event('change'));
+        },
+      );
       document.removeEventListener('click', firstClickListener);
     };
     document.addEventListener('click', firstClickListener);

frontend/src/scripts/options-handler.ts

@@ -25,11 +25,11 @@ export abstract class OptionsHandler {
         ...this._options,
         ...stored,
       };
+    }
 
     if (this._options.musicEnabled) {
       SoundHandler.playAmbient();
     }
-    }
 
     for (const k in inputElements) {
       const element = inputElements[k as keyof Options];

frontend/src/scripts/sound-handler.ts

@@ -10,8 +10,6 @@ export enum Sounds {
   click = 'click',
 }
 
-const concurrencyScale = 5;
-
 export abstract class SoundHandler {
   private static sounds: { [key in Sounds]: HTMLAudioElement };
   private static isAmbientPlaying = false;
@@ -19,25 +17,29 @@ export abstract class SoundHandler {
   private static ambientSound = new Audio(ambientSound);
 
   private static initialized = false;
-  public static async initialize() {
+  public static async initialize(
+    onPlayKeypress: () => unknown = () => null,
+    onPauseKeypress: () => unknown = () => null,
+  ) {
     this.sounds = {
       [Sounds.hit]: await this.initializeSound(hitSound),
       [Sounds.shoot]: await this.initializeSound(shootSound),
       [Sounds.click]: await this.initializeSound(clickSound),
     };
 
-    this.ambientSound.play();
+    await this.ambientSound.play();
     this.ambientSound.muted = true;
     this.initialized = true;
+    this.ambientSound.onpause = onPauseKeypress;
+    this.ambientSound.onplay = onPlayKeypress;
 
-    setTimeout(() => {
     this.ambientSound.muted = false;
     this.ambientSound.volume = 0.5;
     this.ambientSound.loop = true;
+
     if (!this.isAmbientPlaying) {
       this.ambientSound.pause();
     }
-    }, 100);
   }
 
   private static async initializeSound(hitSound: string): Promise<HTMLAudioElement> {