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

front/src/Api/IframeListener.ts

@@ -297,7 +297,8 @@ class IframeListener {
         this.iframes.delete(iframe);
     }
 
-    registerScript(scriptUrl: string): void {
+    registerScript(scriptUrl: string): Promise<void> {
+        return new Promise<void>((resolve, reject) => {
             console.log("Loading map related script at ", scriptUrl);
 
             if (!process.env.NODE_ENV || process.env.NODE_ENV === "development") {
@@ -308,9 +309,12 @@ class IframeListener {
                 iframe.src = "/iframe.html?script=" + encodeURIComponent(scriptUrl);
 
                 // We are putting a sandbox on this script because it will run in the same domain as the main website.
-            iframe.sandbox.add('allow-scripts');
+                iframe.sandbox.add("allow-scripts");
-            iframe.sandbox.add('allow-top-navigation-by-user-activation');
+                iframe.sandbox.add("allow-top-navigation-by-user-activation");
-            iframe.sandbox.add('allow-same-origin');
+
+                iframe.addEventListener("load", () => {
+                    resolve();
+                });
 
                 document.body.prepend(iframe);
 
@@ -344,11 +348,16 @@ class IframeListener {
                     "</head>\n" +
                     "</html>\n";
 
+                iframe.addEventListener("load", () => {
+                    resolve();
+                });
+
                 document.body.prepend(iframe);
 
                 this.scripts.set(scriptUrl, iframe);
                 this.registerIframe(iframe);
             }
+        });
     }
 
     private getBaseUrl(src: string, source: MessageEventSource | null): string {

front/src/Phaser/Game/GameManager.ts

@@ -114,7 +114,7 @@ export class GameManager {
         if (this.currentGameSceneName === null) throw "No current scene id set!";
         const gameScene: GameScene = this.scenePlugin.get(this.currentGameSceneName) as GameScene;
         gameScene.cleanupClosingScene();
-        this.scenePlugin.stop(this.currentGameSceneName);
+        gameScene.createSuccessorGameScene(false, false);
         this.scenePlugin.sleep(MenuSceneName);
         if (!this.scenePlugin.get(targetSceneName)) {
             this.scenePlugin.add(targetSceneName, sceneClass, false);

front/src/Phaser/Game/GameScene.ts

@@ -92,9 +92,7 @@ import { PropertyUtils } from "../Map/PropertyUtils";
 import Tileset = Phaser.Tilemaps.Tileset;
 import { userIsAdminStore } from "../../Stores/GameStore";
 import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore";
-import { get } from "svelte/store";
 import { EmbeddedWebsiteManager } from "./EmbeddedWebsiteManager";
-import { helpCameraSettingsVisibleStore } from "../../Stores/HelpCameraSettingsStore";
 
 export interface GameSceneInitInterface {
     initPosition: PointInterface | null;
@@ -405,12 +403,6 @@ export class GameScene extends DirtyScene {
                 });
             });
         }
-
-        // Now, let's load the script, if any
-        const scripts = this.getScriptUrls(this.mapFile);
-        for (const script of scripts) {
-            iframeListener.registerScript(script);
-        }
     }
 
     //hook initialisation
@@ -569,6 +561,12 @@ export class GameScene extends DirtyScene {
         }
 
         this.createPromiseResolve();
+        // Now, let's load the script, if any
+        const scripts = this.getScriptUrls(this.mapFile);
+        const scriptPromises = [];
+        for (const script of scripts) {
+            scriptPromises.push(iframeListener.registerScript(script));
+        }
 
         this.userInputManager.spaceEvent(() => {
             this.outlinedItem?.activate();
@@ -586,6 +584,7 @@ export class GameScene extends DirtyScene {
         this.triggerOnMapLayerPropertyChange();
 
         if (!this.room.isDisconnected()) {
+            this.scene.sleep();
             this.connect();
         }
 
@@ -609,6 +608,10 @@ export class GameScene extends DirtyScene {
         this.chatVisibilityUnsubscribe = chatVisibilityStore.subscribe((v) => {
             this.openChatIcon.setVisible(!v);
         });
+
+        Promise.all([this.connectionAnswerPromise as Promise<unknown>, ...scriptPromises]).then(() => {
+            this.scene.wake();
+        });
     }
 
     /**
@@ -686,19 +689,7 @@ export class GameScene extends DirtyScene {
                 this.connection.onServerDisconnected(() => {
                     console.log("Player disconnected from server. Reloading scene.");
                     this.cleanupClosingScene();
-
+                    this.createSuccessorGameScene(true, true);
-                    const gameSceneKey = "somekey" + Math.round(Math.random() * 10000);
-                    const game: Phaser.Scene = new GameScene(this.room, this.MapUrlFile, gameSceneKey);
-                    this.scene.add(gameSceneKey, game, true, {
-                        initPosition: {
-                            x: this.CurrentPlayer.x,
-                            y: this.CurrentPlayer.y,
-                        },
-                        reconnecting: true,
-                    });
-
-                    this.scene.stop(this.scene.key);
-                    this.scene.remove(this.scene.key);
                 });
 
                 this.connection.onActionableEvent((message) => {
@@ -760,8 +751,9 @@ export class GameScene extends DirtyScene {
                 this.connectionAnswerPromiseResolve(onConnect.room);
                 // Analyze tags to find if we are admin. If yes, show console.
 
-                this.scene.wake();
+                if (this.scene.isSleeping()) {
                     this.scene.stop(ReconnectingSceneName);
+                }
 
                 //init user position and play trigger to check layers properties
                 this.gameMap.setPosition(this.CurrentPlayer.x, this.CurrentPlayer.y);
@@ -1994,4 +1986,24 @@ export class GameScene extends DirtyScene {
         waScaleManager.zoomModifier *= zoomFactor;
         biggestAvailableAreaStore.recompute();
     }
+
+    public createSuccessorGameScene(autostart: boolean, reconnecting: boolean) {
+        const gameSceneKey = "somekey" + Math.round(Math.random() * 10000);
+        const game = new GameScene(this.room, this.MapUrlFile, gameSceneKey);
+        this.scene.add(gameSceneKey, game, autostart, {
+            initPosition: {
+                x: this.CurrentPlayer.x,
+                y: this.CurrentPlayer.y,
+            },
+            reconnecting: reconnecting,
+        });
+
+        //If new gameScene doesn't start automatically then we change the gameScene in gameManager so that it can start the new gameScene
+        if (!autostart) {
+            gameManager.gameSceneIsCreated(game);
+        }
+
+        this.scene.stop(this.scene.key);
+        this.scene.remove(this.scene.key);
+    }
 }