Adding a new property to prevent script from being loaded in "modules" mode

Scripts in module mode need to be abide by the Same Origin Policy (CORS headers are used to load them)
This can cause issues on some setups.

This commit adds a new "scriptDisableModuleSupport" that can be used to disable the "modules" mode.

Closes #1721

front/dist/iframe.html

@@ -11,7 +11,10 @@
         const scriptUrl = urlParams.get('script');
         const script = document.createElement('script');
         script.src = scriptUrl;
-        script.type = "module";
+
+        if (urlParams.get('moduleMode') === 'true') {
+            script.type = "module";
+        }
         document.head.append(script);
     </script>
     </head>

front/src/Api/IframeListener.ts

@@ -274,7 +274,7 @@ class IframeListener {
         this.iframes.delete(iframe);
     }
 
-    registerScript(scriptUrl: string): Promise<void> {
+    registerScript(scriptUrl: string, enableModuleMode: boolean = true): Promise<void> {
         return new Promise<void>((resolve, reject) => {
             console.info("Loading map related script at ", scriptUrl);
 
@@ -283,7 +283,11 @@ class IframeListener {
                 const iframe = document.createElement("iframe");
                 iframe.id = IframeListener.getIFrameId(scriptUrl);
                 iframe.style.display = "none";
-                iframe.src = "/iframe.html?script=" + encodeURIComponent(scriptUrl);
+                iframe.src =
+                    "/iframe.html?script=" +
+                    encodeURIComponent(scriptUrl) +
+                    "&moduleMode=" +
+                    (enableModuleMode ? "true" : "false");
 
                 // 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");
@@ -318,7 +322,9 @@ class IframeListener {
                     "//" +
                     window.location.host +
                     '/iframe_api.js" ></script>\n' +
-                    '<script type="module" src="' +
+                    "<script " +
+                    (enableModuleMode ? 'type="module" ' : "") +
+                    'src="' +
                     scriptUrl +
                     '" ></script>\n' +
                     "<title></title>\n" +

front/src/Phaser/Game/GameMapProperties.ts

@@ -28,6 +28,7 @@ export enum GameMapProperties {
     PLAY_AUDIO_LOOP = "playAudioLoop",
     READABLE_BY = "readableBy",
     SCRIPT = "script",
+    SCRIPT_DISABLE_MODULE_SUPPORT = "scriptDisableModuleSupport",
     SILENT = "silent",
     START = "start",
     START_LAYER = "startLayer",

front/src/Phaser/Game/GameScene.ts

@@ -597,9 +597,12 @@ export class GameScene extends DirtyScene {
         this.createPromiseResolve();
         // Now, let's load the script, if any
         const scripts = this.getScriptUrls(this.mapFile);
+        const disableModuleMode = this.getProperty(this.mapFile, GameMapProperties.SCRIPT_DISABLE_MODULE_SUPPORT) as
+            | boolean
+            | undefined;
         const scriptPromises = [];
         for (const script of scripts) {
-            scriptPromises.push(iframeListener.registerScript(script));
+            scriptPromises.push(iframeListener.registerScript(script, !disableModuleMode));
         }
 
         this.userInputManager.spaceEvent(() => {