Sound in Script Done

Fom script user can load, play and stop sound

front/src/Api/Events/LoadSoundEvent.ts

@@ -0,0 +1,11 @@
+import * as tg from "generic-type-guard";
+
+export const isLoadSoundEvent =
+    new tg.IsInterface().withProperties({
+        url: tg.isString,
+    }).get();
+
+/**
+ * A message sent from the iFrame to the game to add a message in the chat.
+ */
+export type LoadSoundEvent = tg.GuardedType<typeof isLoadSoundEvent>;

front/src/Api/Events/StopSoundEvent.ts

@@ -0,0 +1,11 @@
+import * as tg from "generic-type-guard";
+
+export const isStopSoundEvent =
+    new tg.IsInterface().withProperties({
+        url: tg.isString,
+    }).get();
+
+/**
+ * A message sent from the iFrame to the game to add a message in the chat.
+ */
+export type StopSoundEvent = tg.GuardedType<typeof isStopSoundEvent>;

front/src/Api/IframeListener.ts

@@ -13,6 +13,8 @@ import {scriptUtils} from "./ScriptUtils";
 import {GoToPageEvent, isGoToPageEvent} from "./Events/GoToPageEvent";
 import {isOpenCoWebsite, OpenCoWebSiteEvent} from "./Events/OpenCoWebSiteEvent";
 import {isPlaySoundEvent, PlaySoundEvent} from "./Events/PlaySoundEvent";
+import {isStopSoundEvent, StopSoundEvent} from "./Events/StopSoundEvent";
+import {isLoadSoundEvent, LoadSoundEvent} from "./Events/LoadSoundEvent";
 
 
 /**
@@ -56,6 +58,12 @@ class IframeListener {
     private readonly _playSoundStream: Subject<PlaySoundEvent> = new Subject();
     public readonly playSoundStream = this._playSoundStream.asObservable();
 
+    private readonly _stopSoundStream: Subject<StopSoundEvent> = new Subject();
+    public readonly stopSoundStream = this._stopSoundStream.asObservable();
+
+    private readonly _loadSoundStream: Subject<LoadSoundEvent> = new Subject();
+    public readonly loadSoundStream = this._loadSoundStream.asObservable();
+
     private readonly iframes = new Set<HTMLIFrameElement>();
     private readonly scripts = new Map<string, HTMLIFrameElement>();
 
@@ -96,6 +104,12 @@ class IframeListener {
                 else if(payload.type === 'playSound' && isPlaySoundEvent(payload.data)) {
                     this._playSoundStream.next(payload.data);
                 }
+                else if(payload.type === 'stopSound' && isStopSoundEvent(payload.data)) {
+                    this._stopSoundStream.next(payload.data);
+                }
+                else if(payload.type === 'loadSound' && isLoadSoundEvent(payload.data)) {
+                    this._loadSoundStream.next(payload.data);
+                }
                 else if(payload.type === 'closeCoWebSite') {
                     scriptUtils.closeCoWebSite();
                 }

front/src/Phaser/Game/GameScene.ts

@@ -796,12 +796,26 @@ ${escapedMessage}
 
        this.iframeSubscriptionList.push(iframeListener.playSoundStream.subscribe((playSoundEvent)=>
        {
-           soundManager.playSound(this.load,this.sound,playSoundEvent.url,playSoundEvent.config);
+           const url = new URL(playSoundEvent.url, this.MapUrlFile);
+           soundManager.playSound(this.load,this.sound,url.toString(),playSoundEvent.config);
        }))
 
+        this.iframeSubscriptionList.push(iframeListener.stopSoundStream.subscribe((stopSoundEvent)=>
+        {
+            const url = new URL(stopSoundEvent.url, this.MapUrlFile);
+            soundManager.stopSound(this.sound,url.toString());
+        }))
+
+        this.iframeSubscriptionList.push(iframeListener.loadSoundStream.subscribe((loadSoundEvent)=>
+        {
+            const url = new URL(loadSoundEvent.url, this.MapUrlFile);
+            soundManager.loadSound(this.load,this.sound,url.toString());
+        }))
+
        this.iframeSubscriptionList.push(iframeListener.enablePlayerControlStream.subscribe(()=>{
             this.userInputManager.restoreControls();
         }));
+
         let scriptedBubbleSprite : Sprite;
        this.iframeSubscriptionList.push(iframeListener.displayBubbleStream.subscribe(()=>{
             scriptedBubbleSprite = new Sprite(this,this.CurrentPlayer.x + 25,this.CurrentPlayer.y,'circleSprite-white');

front/src/Phaser/Game/SoundManager.ts

@@ -1,14 +1,17 @@
 import LoaderPlugin = Phaser.Loader.LoaderPlugin;
 import BaseSoundManager = Phaser.Sound.BaseSoundManager;
 import BaseSound = Phaser.Sound.BaseSound;
-import Config = Phaser.Core.Config;
 import SoundConfig = Phaser.Types.Sound.SoundConfig;
 
-
 class SoundManager {
-
+    private soundPromises : Map<string,Promise<BaseSound>> = new Map<string, Promise<Phaser.Sound.BaseSound>>();
     public  loadSound (loadPlugin: LoaderPlugin, soundManager : BaseSoundManager, soundUrl: string) : Promise<BaseSound> {
-        return new Promise<BaseSound>((res) => {
+        let soundPromise =  this.soundPromises.get(soundUrl);
+        if (soundPromise !== undefined) {
+            return soundPromise;
+        }
+        soundPromise =  new Promise<BaseSound>((res) => {
+
             let sound = soundManager.get(soundUrl);
             if (sound !== null) {
                 return res(sound);
@@ -17,14 +20,20 @@ class SoundManager {
             loadPlugin.once('filecomplete-audio-' + soundUrl, () => res(soundManager.add(soundUrl)));
             loadPlugin.start();
         });
+        this.soundPromises.set(soundUrl,soundPromise);
+        return soundPromise;
     }
 
     public async playSound(loadPlugin: LoaderPlugin, soundManager : BaseSoundManager, soundUrl: string, config: SoundConfig) : Promise<void> {
-        console.log("play sound");
         const sound = await this.loadSound(loadPlugin,soundManager,soundUrl);
-
         sound.play(config);
-        console.log("j'ai joué le son");
+
+
+    }
+
+    public stopSound(soundManager : BaseSoundManager,soundUrl : string){
+        console.log("stop "+ soundManager.get(soundUrl).key);
+        soundManager.get(soundUrl).stop();
     }
 }
 export const soundManager = new SoundManager();

front/src/iframe_api.ts

@@ -10,6 +10,8 @@ import {OpenTabEvent} from "./Api/Events/OpenTabEvent";
 import {GoToPageEvent} from "./Api/Events/GoToPageEvent";
 import {OpenCoWebSiteEvent} from "./Api/Events/OpenCoWebSiteEvent";
 import {PlaySoundEvent} from "./Api/Events/PlaySoundEvent";
+import {StopSoundEvent} from "./Api/Events/StopSoundEvent";
+import {LoadSoundEvent} from "./Api/Events/LoadSoundEvent";
 import SoundConfig = Phaser.Types.Sound.SoundConfig;
 
 interface WorkAdventureApi {
@@ -26,7 +28,7 @@ interface WorkAdventureApi {
     restorePlayerControl() : void;
     displayBubble() : void;
     removeBubble() : void;
-    playSound(url : string, config : SoundConfig): void;
+    loadSound(url : string): Sound;
 }
 
 declare global {
@@ -77,6 +79,42 @@ class Popup {
     }
 }
 
+class Sound {
+    constructor(private url: string) {
+        // TODO: send a "loadSound" event
+        window.parent.postMessage({
+            "type" : 'loadSound',
+            "data": {
+                url: this.url,
+            } as LoadSoundEvent
+
+        },'*');
+    }
+
+    public play(config : SoundConfig) {
+        window.parent.postMessage({
+            "type" : 'playSound',
+            "data": {
+                url: this.url,
+                config
+            } as PlaySoundEvent
+
+        },'*');
+        return this.url;
+    }
+    public stop() {
+        window.parent.postMessage({
+            "type" : 'stopSound',
+            "data": {
+                url: this.url,
+            } as StopSoundEvent
+
+        },'*');
+        return this.url;
+    }
+
+}
+
 window.WA = {
     /**
      * Send a message in the chat.
@@ -116,7 +154,7 @@ window.WA = {
             },'*');
     },
 
-    playSound(url: string, config : SoundConfig) : string{
+    /*playSound(url: string, config : SoundConfig) : string{
         window.parent.postMessage({
             "type" : 'playSound',
             "data": {
@@ -126,6 +164,10 @@ window.WA = {
 
         },'*');
         return url;
+    },*/
+
+    loadSound(url: string) : Sound {
+        return new Sound(url);
     },
 
     goToPage(url : string) : void{