fix(client-electron): prefetch audio files

fixes #190

src/electron/common/common.ts

@@ -8,6 +8,7 @@ import {
 import { Accelerator, ipcRenderer as ipc, IpcRendererEvent } from 'electron';
 import { ScreenshotDisplayOutput } from 'screenshot-desktop';
 import { v4 as uuidv4 } from 'uuid';
+import { SoundPlayerConfig } from '../worker/sound-player';
 
 export enum WorkerStatus {
   Disconnected,
@@ -45,13 +46,11 @@ export interface HistoryEntry {
 
 export interface AppSettings
   extends RobotSettings,
-    Required<SharpImageContainerConfig> {
+    Required<SharpImageContainerConfig>,
+    SoundPlayerConfig {
   keyBind: Accelerator;
   historySize: number;
   preserveSourceOnSuccess: boolean;
-  soundEnabled: boolean;
-  errorSoundPath: string;
-  startSoundPath: string;
   checkForUpdates: boolean;
   autoUpdate: boolean;
   minimizeToTray: boolean;

src/electron/worker/autosolver.ts

@@ -23,6 +23,7 @@ import {
 import { remove } from 'fs-extra';
 import sharp from 'sharp';
 import { v4 as uuidv4 } from 'uuid';
+import { BreachProtocolSoundPlayer } from './sound-player';
 
 export class BreachProtocolAutosolver {
   private readonly uuid = uuidv4();
@@ -41,11 +42,12 @@ export class BreachProtocolAutosolver {
 
   constructor(
     private readonly settings: AppSettings,
-    private readonly robot: BreachProtocolRobot
+    private readonly robot: BreachProtocolRobot,
+    private readonly player: BreachProtocolSoundPlayer
   ) {}
 
   async solve() {
-    this.notifyUser('start');
+    await this.player.play('start');
 
     this.fileName = await this.robot.captureScreen();
     this.recognitionResult = await this.recognize();
@@ -129,8 +131,8 @@ export class BreachProtocolAutosolver {
     };
   }
 
-  private reject() {
-    this.notifyUser('error');
+  private async reject() {
+    await this.player.play('error');
 
     return this.finishWithStatus(BreachProtocolStatus.Rejected);
   }
@@ -150,19 +152,6 @@ export class BreachProtocolAutosolver {
     return this.toJSON();
   }
 
-  private notifyUser(type: 'start' | 'error') {
-    if (this.settings.soundEnabled) {
-      const source =
-        type === 'start'
-          ? this.settings.startSoundPath
-          : this.settings.errorSoundPath;
-
-      if (source) {
-        new Audio(source).play();
-      }
-    }
-  }
-
   private removeSourceImage() {
     remove(this.fileName);
     this.fileName = null;

src/electron/worker/sound-player.ts

@@ -0,0 +1,50 @@
+export interface SoundPlayerConfig {
+  soundEnabled: boolean;
+  errorSoundPath: string;
+  startSoundPath: string;
+}
+
+interface SoundPlayer {
+  play(id: string): Promise<void>;
+}
+
+type TrackId = 'start' | 'error';
+
+export class BreachProtocolSoundPlayer implements SoundPlayer {
+  private readonly library = new Map<TrackId, HTMLAudioElement>([
+    ['start', this.initAudio(this.config.startSoundPath)],
+    ['error', this.initAudio(this.config.errorSoundPath)],
+  ]);
+
+  constructor(private config: SoundPlayerConfig) {}
+
+  update({ startSoundPath, errorSoundPath, soundEnabled }: SoundPlayerConfig) {
+    if (this.config.startSoundPath !== startSoundPath) {
+      this.library.set('start', this.initAudio(startSoundPath));
+      this.config.startSoundPath = startSoundPath;
+    }
+
+    if (this.config.errorSoundPath !== errorSoundPath) {
+      this.library.set('error', this.initAudio(errorSoundPath));
+      this.config.errorSoundPath = errorSoundPath;
+    }
+
+    if (this.config.soundEnabled !== soundEnabled) {
+      this.config.soundEnabled = soundEnabled;
+    }
+  }
+
+  play(id: TrackId) {
+    if (!this.config.soundEnabled) return;
+
+    const audio = this.library.get(id);
+
+    if (!audio) return;
+
+    return audio.play();
+  }
+
+  private initAudio(path: string) {
+    return path ? new Audio(path) : null;
+  }
+}

src/electron/worker/worker.ts

@@ -32,6 +32,7 @@ import { listDisplays, ScreenshotDisplayOutput } from 'screenshot-desktop';
 import sharp from 'sharp';
 import { NativeDialog } from '../common';
 import { BreachProtocolAutosolver } from './autosolver';
+import { BreachProtocolSoundPlayer } from './sound-player';
 
 export class BreachProtocolWorker {
   private disposeAsyncRequestListener: () => void = null;
@@ -46,6 +47,8 @@ export class BreachProtocolWorker {
 
   private settings: AppSettings = ipc.sendSync('get-state').settings;
 
+  private readonly player = new BreachProtocolSoundPlayer(this.settings);
+
   private status: WorkerStatus = WorkerStatus.Bootstrap;
 
   private async loadAndSetActiveDisplay() {
@@ -149,7 +152,7 @@ export class BreachProtocolWorker {
     this.updateStatus(WorkerStatus.Working);
 
     const robot = this.getRobot();
-    const bpa = new BreachProtocolAutosolver(this.settings, robot);
+    const bpa = new BreachProtocolAutosolver(this.settings, robot, this.player);
     const entry = await bpa.solve();
 
     this.dispatch(new AddHistoryEntryAction(entry));
@@ -162,6 +165,8 @@ export class BreachProtocolWorker {
   ) {
     if (type === ActionTypes.UPDATE_SETTINGS) {
       this.settings = payload.settings;
+
+      this.player.update(this.settings);
     }
 
     if (type === ActionTypes.SET_STATUS) {