From fdbcd98a9acc7b89e225c8294a881b00b4892d23 Mon Sep 17 00:00:00 2001
From: PizZaKatZe <pizzakatze@chaos-siegen.de>
Date: Thu, 11 Mar 2021 22:34:49 +0100
Subject: [PATCH] Implement audio volume and loop properties

---
 front/src/Phaser/Game/GameScene.ts | 10 +++++++---
 front/src/WebRtc/AudioManager.ts   |  8 ++++----
 front/src/WebRtc/LayoutManager.ts  |  3 +++
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts
index 512319c6..4a8712ae 100644
--- a/front/src/Phaser/Game/GameScene.ts
+++ b/front/src/Phaser/Game/GameScene.ts
@@ -29,7 +29,9 @@ import {
     ON_ACTION_TRIGGER_BUTTON,
     TRIGGER_JITSI_PROPERTIES,
     TRIGGER_WEBSITE_PROPERTIES,
-    WEBSITE_MESSAGE_PROPERTIES
+    WEBSITE_MESSAGE_PROPERTIES,
+    AUDIO_VOLUME_PROPERTY,
+    AUDIO_LOOP_PROPERTY
 } from "../../WebRtc/LayoutManager";
 import {GameMap} from "./GameMap";
 import {coWebsiteManager} from "../../WebRtc/CoWebsiteManager";
@@ -661,8 +663,10 @@ export class GameScene extends ResizableScene implements CenterListener {
                 this.connection.setSilent(true);
             }
         });
-        this.gameMap.onPropertyChange('playAudio', (newValue, oldValue) => {
-            newValue === undefined ? audioManager.unloadAudio() : audioManager.playAudio(newValue, this.getMapDirUrl());
+        this.gameMap.onPropertyChange('playAudio', (newValue, oldValue, allProps) => {
+            const volume = allProps.get(AUDIO_VOLUME_PROPERTY) as number|undefined;
+            const loop = allProps.get(AUDIO_LOOP_PROPERTY) as boolean|undefined;
+            newValue === undefined ? audioManager.unloadAudio() : audioManager.playAudio(newValue, this.getMapDirUrl(), volume, loop);
         });
 
         this.gameMap.onPropertyChange('playAudioLoop', (newValue, oldValue) => {
diff --git a/front/src/WebRtc/AudioManager.ts b/front/src/WebRtc/AudioManager.ts
index 01d978fe..924f1fac 100644
--- a/front/src/WebRtc/AudioManager.ts
+++ b/front/src/WebRtc/AudioManager.ts
@@ -41,7 +41,7 @@ class AudioManager {
         this.audioPlayerVol.value = '' + this.volume;
     }
 
-    public playAudio(url: string|number|boolean, mapDirUrl: string, loop=false): void {
+    public playAudio(url: string|number|boolean, mapDirUrl: string, volume: number|undefined, loop=false): void {
         const audioPath = url as string;
         let realAudioPath = '';
 
@@ -53,7 +53,7 @@ class AudioManager {
             realAudioPath = mapDirUrl + '/' + url;
         }
 
-        this.loadAudio(realAudioPath);
+        this.loadAudio(realAudioPath, volume);
 
         if (loop) {
             this.loop();
@@ -100,8 +100,7 @@ class AudioManager {
         localStorage.setItem('volume', '' + volume);
     }
 
-
-    private loadAudio(url: string): void {
+    private loadAudio(url: string, volume: number|undefined): void {
         this.load();
 
         /* Solution 1, remove whole audio player */
@@ -119,6 +118,7 @@ class AudioManager {
         this.audioPlayerElem.append(srcElem);
 
         this.audioPlayerDiv.append(this.audioPlayerElem);
+        this.volume = volume ? Math.min(volume, this.volume) : this.volume;
         this.changeVolume();
         this.audioPlayerElem.play();
 
diff --git a/front/src/WebRtc/LayoutManager.ts b/front/src/WebRtc/LayoutManager.ts
index 91d78798..233b5327 100644
--- a/front/src/WebRtc/LayoutManager.ts
+++ b/front/src/WebRtc/LayoutManager.ts
@@ -31,6 +31,9 @@ export const TRIGGER_JITSI_PROPERTIES = 'jitsiTrigger';
 export const WEBSITE_MESSAGE_PROPERTIES = 'openWebsiteTriggerMessage';
 export const JITSI_MESSAGE_PROPERTIES = 'jitsiTriggerMessage';
 
+export const AUDIO_VOLUME_PROPERTY = 'audioVolume';
+export const AUDIO_LOOP_PROPERTY = 'audioLoop';
+
 /**
  * This class is in charge of the video-conference layout.
  * It receives positioning requests for videos and does its best to place them on the screen depending on the active layout mode.