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

This commit is contained in:
_Bastler 2021-08-23 19:31:49 +02:00
commit 2ce9451f2f
3 changed files with 89 additions and 68 deletions

View File

@ -297,58 +297,67 @@ class IframeListener {
this.iframes.delete(iframe); this.iframes.delete(iframe);
} }
registerScript(scriptUrl: string): void { registerScript(scriptUrl: string): Promise<void> {
console.log("Loading map related script at ", scriptUrl); return new Promise<void>((resolve, reject) => {
console.log("Loading map related script at ", scriptUrl);
if (!process.env.NODE_ENV || process.env.NODE_ENV === "development") { if (!process.env.NODE_ENV || process.env.NODE_ENV === "development") {
// Using external iframe mode ( // Using external iframe mode (
const iframe = document.createElement("iframe"); const iframe = document.createElement("iframe");
iframe.id = IframeListener.getIFrameId(scriptUrl); iframe.id = IframeListener.getIFrameId(scriptUrl);
iframe.style.display = "none"; iframe.style.display = "none";
iframe.src = "/iframe.html?script=" + encodeURIComponent(scriptUrl); 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. // 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');
document.body.prepend(iframe); iframe.addEventListener("load", () => {
resolve();
});
this.scripts.set(scriptUrl, iframe); document.body.prepend(iframe);
this.registerIframe(iframe);
} else {
// production code
const iframe = document.createElement("iframe");
iframe.id = IframeListener.getIFrameId(scriptUrl);
iframe.style.display = "none";
// We are putting a sandbox on this script because it will run in the same domain as the main website. this.scripts.set(scriptUrl, iframe);
iframe.sandbox.add("allow-scripts"); this.registerIframe(iframe);
iframe.sandbox.add("allow-top-navigation-by-user-activation"); } else {
// production code
const iframe = document.createElement("iframe");
iframe.id = IframeListener.getIFrameId(scriptUrl);
iframe.style.display = "none";
//iframe.src = "data:text/html;charset=utf-8," + escape(html); // We are putting a sandbox on this script because it will run in the same domain as the main website.
iframe.srcdoc = iframe.sandbox.add("allow-scripts");
"<!doctype html>\n" + iframe.sandbox.add("allow-top-navigation-by-user-activation");
"\n" +
'<html lang="en">\n' +
"<head>\n" +
'<script src="' +
window.location.protocol +
"//" +
window.location.host +
'/iframe_api.js" ></script>\n' +
'<script type="module" src="' +
scriptUrl +
'" ></script>\n' +
"<title></title>\n" +
"</head>\n" +
"</html>\n";
document.body.prepend(iframe); //iframe.src = "data:text/html;charset=utf-8," + escape(html);
iframe.srcdoc =
"<!doctype html>\n" +
"\n" +
'<html lang="en">\n' +
"<head>\n" +
'<script src="' +
window.location.protocol +
"//" +
window.location.host +
'/iframe_api.js" ></script>\n' +
'<script type="module" src="' +
scriptUrl +
'" ></script>\n' +
"<title></title>\n" +
"</head>\n" +
"</html>\n";
this.scripts.set(scriptUrl, iframe); iframe.addEventListener("load", () => {
this.registerIframe(iframe); resolve();
} });
document.body.prepend(iframe);
this.scripts.set(scriptUrl, iframe);
this.registerIframe(iframe);
}
});
} }
private getBaseUrl(src: string, source: MessageEventSource | null): string { private getBaseUrl(src: string, source: MessageEventSource | null): string {

View File

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

View File

@ -92,9 +92,7 @@ import { PropertyUtils } from "../Map/PropertyUtils";
import Tileset = Phaser.Tilemaps.Tileset; import Tileset = Phaser.Tilemaps.Tileset;
import { userIsAdminStore } from "../../Stores/GameStore"; import { userIsAdminStore } from "../../Stores/GameStore";
import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore"; import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore";
import { get } from "svelte/store";
import { EmbeddedWebsiteManager } from "./EmbeddedWebsiteManager"; import { EmbeddedWebsiteManager } from "./EmbeddedWebsiteManager";
import { helpCameraSettingsVisibleStore } from "../../Stores/HelpCameraSettingsStore";
export interface GameSceneInitInterface { export interface GameSceneInitInterface {
initPosition: PointInterface | null; 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 //hook initialisation
@ -569,6 +561,12 @@ export class GameScene extends DirtyScene {
} }
this.createPromiseResolve(); 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.userInputManager.spaceEvent(() => {
this.outlinedItem?.activate(); this.outlinedItem?.activate();
@ -586,6 +584,7 @@ export class GameScene extends DirtyScene {
this.triggerOnMapLayerPropertyChange(); this.triggerOnMapLayerPropertyChange();
if (!this.room.isDisconnected()) { if (!this.room.isDisconnected()) {
this.scene.sleep();
this.connect(); this.connect();
} }
@ -609,6 +608,10 @@ export class GameScene extends DirtyScene {
this.chatVisibilityUnsubscribe = chatVisibilityStore.subscribe((v) => { this.chatVisibilityUnsubscribe = chatVisibilityStore.subscribe((v) => {
this.openChatIcon.setVisible(!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(() => { this.connection.onServerDisconnected(() => {
console.log("Player disconnected from server. Reloading scene."); console.log("Player disconnected from server. Reloading scene.");
this.cleanupClosingScene(); 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) => { this.connection.onActionableEvent((message) => {
@ -760,8 +751,9 @@ export class GameScene extends DirtyScene {
this.connectionAnswerPromiseResolve(onConnect.room); this.connectionAnswerPromiseResolve(onConnect.room);
// Analyze tags to find if we are admin. If yes, show console. // Analyze tags to find if we are admin. If yes, show console.
this.scene.wake(); if (this.scene.isSleeping()) {
this.scene.stop(ReconnectingSceneName); this.scene.stop(ReconnectingSceneName);
}
//init user position and play trigger to check layers properties //init user position and play trigger to check layers properties
this.gameMap.setPosition(this.CurrentPlayer.x, this.CurrentPlayer.y); this.gameMap.setPosition(this.CurrentPlayer.x, this.CurrentPlayer.y);
@ -1994,4 +1986,24 @@ export class GameScene extends DirtyScene {
waScaleManager.zoomModifier *= zoomFactor; waScaleManager.zoomModifier *= zoomFactor;
biggestAvailableAreaStore.recompute(); 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);
}
} }