Merge branch 'develop' of github.com:thecodingmachine/workadventure into main

front/src/Phaser/Game/GameScene.ts

@@ -10,7 +10,14 @@ import {
     RoomJoinedMessageInterface
 } from "../../Connexion/ConnexionModels";
 import {CurrentGamerInterface, hasMovedEventName, Player} from "../Player/Player";
-import {DEBUG_MODE, JITSI_PRIVATE_MODE, POSITION_DELAY, RESOLUTION, ZOOM_LEVEL} from "../../Enum/EnvironmentVariable";
+import {
+    DEBUG_MODE,
+    JITSI_PRIVATE_MODE,
+    MAX_PER_GROUP,
+    POSITION_DELAY,
+    RESOLUTION,
+    ZOOM_LEVEL
+} from "../../Enum/EnvironmentVariable";
 import {ITiledMap, ITiledMapLayer, ITiledMapLayerProperty, ITiledMapObject, ITiledTileSet} from "../Map/ITiledMap";
 import {AddPlayerInterface} from "./AddPlayerInterface";
 import {PlayerAnimationDirections} from "../Player/Animation";
@@ -138,7 +145,7 @@ export class GameScene extends ResizableScene implements CenterListener {
     // A promise that will resolve when the "create" method is called (signaling loading is ended)
     private createPromise: Promise<void>;
     private createPromiseResolve!: (value?: void | PromiseLike<void>) => void;
-
+    private iframeSubscriptionList! : Array<Subscription>;
     MapUrlFile: string;
     RoomId: string;
     instance: string;
@@ -468,9 +475,10 @@ export class GameScene extends ResizableScene implements CenterListener {
         this.openChatIcon = new OpenChatIcon(this, 2, this.game.renderer.height - 2)
 
         // FIXME: change this to use the UserInputManager class for input
-        this.input.keyboard.on('keyup-M', () => {
+        // FIXME: Comment this feature because when user write M key in report input, the layout change.
+        /*this.input.keyboard.on('keyup-M', () => {
             this.switchLayoutMode();
-        });
+        });*/
 
         this.reposition();
 
@@ -764,7 +772,8 @@ export class GameScene extends ResizableScene implements CenterListener {
     }
 
     private listenToIframeEvents(): void {
-        iframeListener.openPopupStream.subscribe((openPopupEvent) => {
+            this.iframeSubscriptionList = [];
+            this.iframeSubscriptionList.push(iframeListener.openPopupStream.subscribe((openPopupEvent) => {
 
             let  objectLayerSquare : ITiledMapObject;
             const targetObjectData = this.getObjectLayerData(openPopupEvent.targetObject);
@@ -808,7 +817,6 @@ ${escapedMessage}
                 }
                 id++;
             }
-
             this.tweens.add({
                 targets     : domElement ,
                 scale       : 1,
@@ -817,9 +825,9 @@ ${escapedMessage}
             });
 
             this.popUpElements.set(openPopupEvent.popupId, domElement);
-        });
+        }));
 
-        iframeListener.closePopupStream.subscribe((closePopupEvent) => {
+       this.iframeSubscriptionList.push(iframeListener.closePopupStream.subscribe((closePopupEvent) => {
             const popUpElement = this.popUpElements.get(closePopupEvent.popupId);
             if (popUpElement === undefined) {
                 console.error('Could not close popup with ID ', closePopupEvent.popupId,'. Maybe it has already been closed?');
@@ -835,23 +843,25 @@ ${escapedMessage}
                     this.popUpElements.delete(closePopupEvent.popupId);
                 },
             });
-        });
+        }));
 
-        iframeListener.disablePlayerControlStream.subscribe(()=>{
+       this.iframeSubscriptionList.push(iframeListener.disablePlayerControlStream.subscribe(()=>{
             this.userInputManager.disableControls();
-        })
-        iframeListener.enablePlayerControlStream.subscribe(()=>{
+        }));
+
+       this.iframeSubscriptionList.push(iframeListener.enablePlayerControlStream.subscribe(()=>{
             this.userInputManager.restoreControls();
-        })
+        }));
         let scriptedBubbleSprite : Sprite;
-        iframeListener.displayBubbleStream.subscribe(()=>{
+       this.iframeSubscriptionList.push(iframeListener.displayBubbleStream.subscribe(()=>{
             scriptedBubbleSprite = new Sprite(this,this.CurrentPlayer.x + 25,this.CurrentPlayer.y,'circleSprite-white');
             scriptedBubbleSprite.setDisplayOrigin(48, 48);
             this.add.existing(scriptedBubbleSprite);
-        })
-        iframeListener.removeBubbleStream.subscribe(()=>{
+        }));
+
+       this.iframeSubscriptionList.push(iframeListener.removeBubbleStream.subscribe(()=>{
             scriptedBubbleSprite.destroy();
-        })
+        }));
 
     }
 
@@ -896,6 +906,10 @@ ${escapedMessage}
         this.simplePeer.closeAllConnections();
         this.simplePeer?.unregister();
         this.messageSubscription?.unsubscribe();
+
+        for(const iframeEvents of this.iframeSubscriptionList){
+            iframeEvents.unsubscribe();
+        }
     }
 
     private removeAllRemotePlayers(): void {
@@ -1344,7 +1358,7 @@ ${escapedMessage}
             this,
             Math.round(groupPositionMessage.position.x),
             Math.round(groupPositionMessage.position.y),
-            groupPositionMessage.groupSize === 4 ? 'circleSprite-red' : 'circleSprite-white'
+            groupPositionMessage.groupSize === MAX_PER_GROUP ? 'circleSprite-red' : 'circleSprite-white'
         );
         sprite.setDisplayOrigin(48, 48);
         this.add.existing(sprite);

front/src/Phaser/Menu/MenuScene.ts

@@ -105,7 +105,12 @@ export class MenuScene extends Phaser.Scene {
     }
 
     public revealMenuIcon(): void {
-        (this.menuButton.getChildByID('menuIcon') as HTMLElement).hidden = false
+        //TODO fix me: add try catch because at the same time, 'this.menuButton' variable doesn't exist and there is error on 'getChildByID' function
+        try {
+            (this.menuButton.getChildByID('menuIcon') as HTMLElement).hidden = false;
+        } catch (err) {
+            console.error(err);
+        }
     }
 
     openSideMenu() {
@@ -322,7 +327,9 @@ export class MenuScene extends Phaser.Scene {
     }
 
     private gotToCreateMapPage() {
-        const sparkHost = 'https://'+window.location.host.replace('play.', '')+'/choose-map.html';
+        //const sparkHost = 'https://'+window.location.host.replace('play.', '')+'/choose-map.html';
+        //TODO fix me: this button can to send us on WorkAdventure BO.
+        const sparkHost = 'https://workadventu.re/getting-started';
         window.open(sparkHost, '_blank');
     }
 

front/src/Phaser/Menu/ReportMenu.ts

@@ -72,8 +72,8 @@ export class ReportMenu extends Phaser.GameObjects.DOMElement {
     }
 
     public close(): void {
+        gameManager.getCurrentGameScene(this.scene).userInputManager.restoreControls();
         this.opened = false;
-        gameManager.getCurrentGameScene(this.scene).userInputManager.initKeyBoardEvent();
         const mainEl = this.getChildByID('gameReport') as HTMLElement;
         this.scene.tweens.add({
             targets: this,