diff --git a/back/src/Model/GameRoom.ts b/back/src/Model/GameRoom.ts index e907fcb7..5667146a 100644 --- a/back/src/Model/GameRoom.ts +++ b/back/src/Model/GameRoom.ts @@ -473,7 +473,22 @@ export class GameRoom { const variablesManager = new VariablesManager(this.roomUrl, null); return variablesManager.init(); } else { - throw e; + // An error occurred while loading the map + // Right now, let's bypass the error. In the future, we should make sure the user is aware of that + // and that he/she will act on it to fix the problem. + + // Note: we run this message inside a setTimeout so that the room listeners can have time to connect. + setTimeout(() => { + for (const roomListener of this.roomListeners) { + emitErrorOnRoomSocket( + roomListener, + "Your map does not seem accessible from the WorkAdventure servers. Is it behind a firewall or a proxy? Your map should be accessible from the WorkAdventure servers. If you use the scripting API in this map, please be aware that server-side checks and variable persistence is disabled." + ); + } + }, 1000); + + const variablesManager = new VariablesManager(this.roomUrl, null); + return variablesManager.init(); } }); } diff --git a/front/dist/resources/service-worker.html b/front/dist/resources/service-worker.html deleted file mode 100644 index 45615b1a..00000000 --- a/front/dist/resources/service-worker.html +++ /dev/null @@ -1,62 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - WorkAdventure PWA - - - - - WorkAdventure logo -

Charging your workspace ...

- - - \ No newline at end of file diff --git a/front/dist/resources/service-worker.js b/front/dist/service-worker.js similarity index 97% rename from front/dist/resources/service-worker.js rename to front/dist/service-worker.js index d9509b6f..2cda9379 100644 --- a/front/dist/resources/service-worker.js +++ b/front/dist/service-worker.js @@ -8,7 +8,6 @@ self.addEventListener('install', function(event) { event.waitUntil( caches.open(CACHE_NAME) .then(function(cache) { - console.log('Opened cache'); return cache.addAll(urlsToCache); }) ); diff --git a/front/dist/static/images/favicons/apple-icon-114x114.png b/front/dist/static/images/favicons/apple-icon-114x114.png index 6c994217..3de5f8c4 100644 Binary files a/front/dist/static/images/favicons/apple-icon-114x114.png and b/front/dist/static/images/favicons/apple-icon-114x114.png differ diff --git a/front/dist/static/images/favicons/apple-icon-120x120.png b/front/dist/static/images/favicons/apple-icon-120x120.png index b20bf1e2..90ff4b18 100644 Binary files a/front/dist/static/images/favicons/apple-icon-120x120.png and b/front/dist/static/images/favicons/apple-icon-120x120.png differ diff --git a/front/dist/static/images/favicons/apple-icon-144x144.png b/front/dist/static/images/favicons/apple-icon-144x144.png index 59a7c4ce..1fc655bb 100644 Binary files a/front/dist/static/images/favicons/apple-icon-144x144.png and b/front/dist/static/images/favicons/apple-icon-144x144.png differ diff --git a/front/dist/static/images/favicons/apple-icon-152x152.png b/front/dist/static/images/favicons/apple-icon-152x152.png index fc905367..ca3a85ba 100644 Binary files a/front/dist/static/images/favicons/apple-icon-152x152.png and b/front/dist/static/images/favicons/apple-icon-152x152.png differ diff --git a/front/dist/static/images/favicons/apple-icon-180x180.png b/front/dist/static/images/favicons/apple-icon-180x180.png index 8f18bd51..64190d74 100644 Binary files a/front/dist/static/images/favicons/apple-icon-180x180.png and b/front/dist/static/images/favicons/apple-icon-180x180.png differ diff --git a/front/dist/static/images/favicons/apple-icon-57x57.png b/front/dist/static/images/favicons/apple-icon-57x57.png index 62c8ab07..747c5c11 100644 Binary files a/front/dist/static/images/favicons/apple-icon-57x57.png and b/front/dist/static/images/favicons/apple-icon-57x57.png differ diff --git a/front/dist/static/images/favicons/apple-icon-60x60.png b/front/dist/static/images/favicons/apple-icon-60x60.png index 68c5b74b..61a9c874 100644 Binary files a/front/dist/static/images/favicons/apple-icon-60x60.png and b/front/dist/static/images/favicons/apple-icon-60x60.png differ diff --git a/front/dist/static/images/favicons/apple-icon-72x72.png b/front/dist/static/images/favicons/apple-icon-72x72.png index b04f1b25..da043d44 100644 Binary files a/front/dist/static/images/favicons/apple-icon-72x72.png and b/front/dist/static/images/favicons/apple-icon-72x72.png differ diff --git a/front/dist/static/images/favicons/apple-icon-76x76.png b/front/dist/static/images/favicons/apple-icon-76x76.png index a58cf3ed..5e51fe2b 100644 Binary files a/front/dist/static/images/favicons/apple-icon-76x76.png and b/front/dist/static/images/favicons/apple-icon-76x76.png differ diff --git a/front/dist/static/images/favicons/apple-icon.png b/front/dist/static/images/favicons/apple-icon.png index e1a4b3ed..69d255b1 100644 Binary files a/front/dist/static/images/favicons/apple-icon.png and b/front/dist/static/images/favicons/apple-icon.png differ diff --git a/front/dist/static/images/favicons/icon-512x512.png b/front/dist/static/images/favicons/icon-512x512.png index 86cb7477..41116386 100644 Binary files a/front/dist/static/images/favicons/icon-512x512.png and b/front/dist/static/images/favicons/icon-512x512.png differ diff --git a/front/dist/static/images/favicons/manifest.json b/front/dist/static/images/favicons/manifest.json index 9f9e9af1..1cf2a835 100644 --- a/front/dist/static/images/favicons/manifest.json +++ b/front/dist/static/images/favicons/manifest.json @@ -48,41 +48,10 @@ "type": "image\/png" }, { - "src": "/static/images/favicons/android-icon-36x36.png", - "sizes": "36x36", + "src": "/static/images/favicons/apple-icon.png", + "sizes": "192x192", "type": "image\/png", - "density": "0.75" - }, - { - "src": "/static/images/favicons/android-icon-48x48.png", - "sizes": "48x48", - "type": "image\/png", - "density": "1.0" - }, - { - "src": "/static/images/favicons/android-icon-72x72.png", - "sizes": "72x72", - "type": "image\/png", - "density": "1.5" - }, - - { - "src": "/static/images/favicons/favicon-16x16.png", - "sizes": "16x16", - "type": "image\/png", - "density": "1" - }, - { - "src": "/static/images/favicons/favicon-32x32.png", - "sizes": "32x32", - "type": "image\/png", - "density": "1.5" - }, - { - "src": "/static/images/favicons/favicon-96x96.png", - "sizes": "96x96", - "type": "image\/png", - "density": "2.0" + "purpose": "any" }, { @@ -122,18 +91,37 @@ "density": "4.0", "purpose": "any maskable" }, + + { + "src": "/static/images/favicons/favicon-16x16.png", + "sizes": "16x16", + "type": "image\/png", + "density": "1" + }, + { + "src": "/static/images/favicons/favicon-32x32.png", + "sizes": "32x32", + "type": "image\/png", + "density": "1.5" + }, + { + "src": "/static/images/favicons/favicon-96x96.png", + "sizes": "96x96", + "type": "image\/png", + "density": "2.0" + }, { "src": "/static/images/favicons/icon-512x512.png", "sizes": "512x512", "type": "image\/png" } ], - "start_url": "/resources/service-worker.html", + "start_url": "/", "background_color": "#000000", "display_override": ["window-control-overlay", "minimal-ui"], "display": "standalone", "orientation": "portrait-primary", - "scope": "/resources/", + "scope": "/", "lang": "en", "theme_color": "#000000", "shortcuts": [ diff --git a/front/src/Connexion/ConnectionManager.ts b/front/src/Connexion/ConnectionManager.ts index 11f03a9e..38272737 100644 --- a/front/src/Connexion/ConnectionManager.ts +++ b/front/src/Connexion/ConnectionManager.ts @@ -105,6 +105,15 @@ class ConnectionManager { let roomPath: string; if (connexionType === GameConnexionTypes.empty) { roomPath = window.location.protocol + "//" + window.location.host + START_ROOM_URL; + //get last room path from cache api + try { + const lastRoomUrl = await localUserStore.getLastRoomUrlCacheApi(); + if (lastRoomUrl != undefined) { + roomPath = lastRoomUrl; + } + } catch (err) { + console.error(err); + } } else { roomPath = window.location.protocol + diff --git a/front/src/Connexion/LocalUserStore.ts b/front/src/Connexion/LocalUserStore.ts index 07c2487e..25b673ac 100644 --- a/front/src/Connexion/LocalUserStore.ts +++ b/front/src/Connexion/LocalUserStore.ts @@ -17,6 +17,8 @@ const authToken = "authToken"; const state = "state"; const nonce = "nonce"; +const cacheAPIIndex = "workavdenture-cache-v1"; + class LocalUserStore { saveUser(localUser: LocalUser) { localStorage.setItem("localUser", JSON.stringify(localUser)); @@ -116,10 +118,23 @@ class LocalUserStore { setLastRoomUrl(roomUrl: string): void { localStorage.setItem(lastRoomUrl, roomUrl.toString()); + caches.open(cacheAPIIndex).then((cache) => { + const stringResponse = new Response(JSON.stringify({ roomUrl })); + cache.put(`/${lastRoomUrl}`, stringResponse); + }); } getLastRoomUrl(): string { return localStorage.getItem(lastRoomUrl) ?? ""; } + getLastRoomUrlCacheApi(): Promise { + return caches.open(cacheAPIIndex).then((cache) => { + return cache.match(`/${lastRoomUrl}`).then((res) => { + return res?.json().then((data) => { + return data.roomUrl; + }); + }); + }); + } setAuthToken(value: string | null) { value ? localStorage.setItem(authToken, value) : localStorage.removeItem(authToken); diff --git a/front/src/Network/ServiceWorker.ts b/front/src/Network/ServiceWorker.ts index 9bbcca85..59f913e2 100644 --- a/front/src/Network/ServiceWorker.ts +++ b/front/src/Network/ServiceWorker.ts @@ -6,15 +6,13 @@ export class _ServiceWorker { } init() { - window.addEventListener("load", () => { - navigator.serviceWorker - .register("/resources/service-worker.js") - .then((serviceWorker) => { - console.info("Service Worker registered: ", serviceWorker); - }) - .catch((error) => { - console.error("Error registering the Service Worker: ", error); - }); - }); + navigator.serviceWorker + .register("/service-worker.js") + .then((serviceWorker) => { + console.info("Service Worker registered: ", serviceWorker); + }) + .catch((error) => { + console.error("Error registering the Service Worker: ", error); + }); } } diff --git a/front/src/Phaser/Components/MobileJoystick.ts b/front/src/Phaser/Components/MobileJoystick.ts index b3fc021b..9c14cb8e 100644 --- a/front/src/Phaser/Components/MobileJoystick.ts +++ b/front/src/Phaser/Components/MobileJoystick.ts @@ -1,12 +1,12 @@ -import VirtualJoystick from 'phaser3-rex-plugins/plugins/virtualjoystick.js'; -import {waScaleManager} from "../Services/WaScaleManager"; -import {DEPTH_INGAME_TEXT_INDEX} from "../Game/DepthIndexes"; +import VirtualJoystick from "phaser3-rex-plugins/plugins/virtualjoystick.js"; +import { waScaleManager } from "../Services/WaScaleManager"; +import { DEPTH_INGAME_TEXT_INDEX } from "../Game/DepthIndexes"; //the assets were found here: https://hannemann.itch.io/virtual-joystick-pack-free -export const joystickBaseKey = 'joystickBase'; -export const joystickBaseImg = 'resources/objects/joystickSplitted.png'; -export const joystickThumbKey = 'joystickThumb'; -export const joystickThumbImg = 'resources/objects/smallHandleFilledGrey.png'; +export const joystickBaseKey = "joystickBase"; +export const joystickBaseImg = "resources/objects/joystickSplitted.png"; +export const joystickThumbKey = "joystickThumb"; +export const joystickThumbImg = "resources/objects/smallHandleFilledGrey.png"; const baseSize = 50; const thumbSize = 25; @@ -20,15 +20,27 @@ export class MobileJoystick extends VirtualJoystick { x: -1000, y: -1000, radius: radius * window.devicePixelRatio, - base: scene.add.image(0, 0, joystickBaseKey).setDisplaySize(baseSize * window.devicePixelRatio, baseSize * window.devicePixelRatio).setDepth(DEPTH_INGAME_TEXT_INDEX), - thumb: scene.add.image(0, 0, joystickThumbKey).setDisplaySize(thumbSize * window.devicePixelRatio, thumbSize * window.devicePixelRatio).setDepth(DEPTH_INGAME_TEXT_INDEX), + base: scene.add + .image(0, 0, joystickBaseKey) + .setDisplaySize( + (baseSize / waScaleManager.zoomModifier) * window.devicePixelRatio, + (baseSize / waScaleManager.zoomModifier) * window.devicePixelRatio + ) + .setDepth(DEPTH_INGAME_TEXT_INDEX), + thumb: scene.add + .image(0, 0, joystickThumbKey) + .setDisplaySize( + (thumbSize / waScaleManager.zoomModifier) * window.devicePixelRatio, + (thumbSize / waScaleManager.zoomModifier) * window.devicePixelRatio + ) + .setDepth(DEPTH_INGAME_TEXT_INDEX), enable: true, dir: "8dir", }); this.visible = false; this.enable = false; - this.scene.input.on('pointerdown', (pointer: Phaser.Input.Pointer) => { + this.scene.input.on("pointerdown", (pointer: Phaser.Input.Pointer) => { if (!pointer.wasTouch) { return; } @@ -44,7 +56,7 @@ export class MobileJoystick extends VirtualJoystick { this.enable = false; } }); - this.scene.input.on('pointerup', () => { + this.scene.input.on("pointerup", () => { this.visible = false; this.enable = false; }); @@ -52,10 +64,16 @@ export class MobileJoystick extends VirtualJoystick { this.scene.scale.on(Phaser.Scale.Events.RESIZE, this.resizeCallback); } - private resize() { - this.base.setDisplaySize(baseSize / waScaleManager.zoomModifier * window.devicePixelRatio, baseSize / waScaleManager.zoomModifier * window.devicePixelRatio); - this.thumb.setDisplaySize(thumbSize / waScaleManager.zoomModifier * window.devicePixelRatio, thumbSize / waScaleManager.zoomModifier * window.devicePixelRatio); - this.setRadius(radius / waScaleManager.zoomModifier * window.devicePixelRatio); + public resize() { + this.base.setDisplaySize(this.getDisplaySizeByElement(baseSize), this.getDisplaySizeByElement(baseSize)); + this.thumb.setDisplaySize(this.getDisplaySizeByElement(thumbSize), this.getDisplaySizeByElement(thumbSize)); + this.setRadius( + (radius / (waScaleManager.zoomModifier * waScaleManager.uiScalingFactor)) * window.devicePixelRatio + ); + } + + private getDisplaySizeByElement(element: integer): integer { + return (element / (waScaleManager.zoomModifier * waScaleManager.uiScalingFactor)) * window.devicePixelRatio; } public destroy() { diff --git a/front/src/WebRtc/CoWebsiteManager.ts b/front/src/WebRtc/CoWebsiteManager.ts index 1fb28487..f2de3580 100644 --- a/front/src/WebRtc/CoWebsiteManager.ts +++ b/front/src/WebRtc/CoWebsiteManager.ts @@ -1,7 +1,8 @@ -import {HtmlUtils} from "./HtmlUtils"; -import {Subject} from "rxjs"; -import {iframeListener} from "../Api/IframeListener"; -import {touchScreenManager} from "../Touch/TouchScreenManager"; +import { HtmlUtils } from "./HtmlUtils"; +import { Subject } from "rxjs"; +import { iframeListener } from "../Api/IframeListener"; +import { touchScreenManager } from "../Touch/TouchScreenManager"; +import { waScaleManager } from "../Phaser/Services/WaScaleManager"; enum iframeStates { closed = 1, @@ -9,13 +10,13 @@ enum iframeStates { opened, } -const cowebsiteDivId = 'cowebsite'; // the id of the whole container. -const cowebsiteMainDomId = 'cowebsite-main'; // the id of the parent div of the iframe. -const cowebsiteAsideDomId = 'cowebsite-aside'; // the id of the parent div of the iframe. -export const cowebsiteCloseButtonId = 'cowebsite-close'; -const cowebsiteFullScreenButtonId = 'cowebsite-fullscreen'; -const cowebsiteOpenFullScreenImageId = 'cowebsite-fullscreen-open'; -const cowebsiteCloseFullScreenImageId = 'cowebsite-fullscreen-close'; +const cowebsiteDivId = "cowebsite"; // the id of the whole container. +const cowebsiteMainDomId = "cowebsite-main"; // the id of the parent div of the iframe. +const cowebsiteAsideDomId = "cowebsite-aside"; // the id of the parent div of the iframe. +export const cowebsiteCloseButtonId = "cowebsite-close"; +const cowebsiteFullScreenButtonId = "cowebsite-fullscreen"; +const cowebsiteOpenFullScreenImageId = "cowebsite-fullscreen-open"; +const cowebsiteCloseFullScreenImageId = "cowebsite-fullscreen-close"; const animationTime = 500; //time used by the css transitions, in ms. interface TouchMoveCoordinates { @@ -24,7 +25,6 @@ interface TouchMoveCoordinates { } class CoWebsiteManager { - private opened: iframeStates = iframeStates.closed; private _onResize: Subject = new Subject(); @@ -38,14 +38,14 @@ class CoWebsiteManager { private resizing: boolean = false; private cowebsiteMainDom: HTMLDivElement; private cowebsiteAsideDom: HTMLDivElement; - private previousTouchMoveCoordinates: TouchMoveCoordinates|null = null; //only use on touchscreens to track touch movement + private previousTouchMoveCoordinates: TouchMoveCoordinates | null = null; //only use on touchscreens to track touch movement get width(): number { return this.cowebsiteDiv.clientWidth; } set width(width: number) { - this.cowebsiteDiv.style.width = width+'px'; + this.cowebsiteDiv.style.width = width + "px"; } get height(): number { @@ -53,7 +53,7 @@ class CoWebsiteManager { } set height(height: number) { - this.cowebsiteDiv.style.height = height+'px'; + this.cowebsiteDiv.style.height = height + "px"; } get verticalMode(): boolean { @@ -75,56 +75,55 @@ class CoWebsiteManager { this.initResizeListeners(false); const buttonCloseFrame = HtmlUtils.getElementByIdOrFail(cowebsiteCloseButtonId); - buttonCloseFrame.addEventListener('click', () => { + buttonCloseFrame.addEventListener("click", () => { buttonCloseFrame.blur(); this.closeCoWebsite(); }); const buttonFullScreenFrame = HtmlUtils.getElementByIdOrFail(cowebsiteFullScreenButtonId); - buttonFullScreenFrame.addEventListener('click', () => { + buttonFullScreenFrame.addEventListener("click", () => { buttonFullScreenFrame.blur(); this.fullscreen(); }); } - private initResizeListeners(touchMode:boolean) { - const movecallback = (event:MouseEvent|TouchEvent) => { + private initResizeListeners(touchMode: boolean) { + const movecallback = (event: MouseEvent | TouchEvent) => { let x, y; - if (event.type === 'mousemove') { + if (event.type === "mousemove") { x = (event as MouseEvent).movementX / this.getDevicePixelRatio(); y = (event as MouseEvent).movementY / this.getDevicePixelRatio(); } else { const touchEvent = (event as TouchEvent).touches[0]; - const last = {x: touchEvent.pageX, y: touchEvent.pageY}; + const last = { x: touchEvent.pageX, y: touchEvent.pageY }; const previous = this.previousTouchMoveCoordinates as TouchMoveCoordinates; this.previousTouchMoveCoordinates = last; x = last.x - previous.x; y = last.y - previous.y; } - - - this.verticalMode ? this.height += y : this.width -= x; - this.fire(); - } - this.cowebsiteAsideDom.addEventListener( touchMode ? 'touchstart' : 'mousedown', (event) => { + this.verticalMode ? (this.height += y) : (this.width -= x); + this.fire(); + }; + + this.cowebsiteAsideDom.addEventListener(touchMode ? "touchstart" : "mousedown", (event) => { this.resizing = true; - this.getIframeDom().style.display = 'none'; + this.getIframeDom().style.display = "none"; if (touchMode) { const touchEvent = (event as TouchEvent).touches[0]; - this.previousTouchMoveCoordinates = {x: touchEvent.pageX, y: touchEvent.pageY}; + this.previousTouchMoveCoordinates = { x: touchEvent.pageX, y: touchEvent.pageY }; } - document.addEventListener(touchMode ? 'touchmove' : 'mousemove', movecallback); + document.addEventListener(touchMode ? "touchmove" : "mousemove", movecallback); }); - document.addEventListener(touchMode ? 'touchend' : 'mouseup', (event) => { + document.addEventListener(touchMode ? "touchend" : "mouseup", (event) => { if (!this.resizing) return; if (touchMode) { this.previousTouchMoveCoordinates = null; } - document.removeEventListener(touchMode ? 'touchmove' : 'mousemove', movecallback); - this.getIframeDom().style.display = 'block'; + document.removeEventListener(touchMode ? "touchmove" : "mousemove", movecallback); + this.getIframeDom().style.display = "block"; this.resizing = false; }); } @@ -132,34 +131,34 @@ class CoWebsiteManager { private getDevicePixelRatio(): number { //on chrome engines, movementX and movementY return global screens coordinates while other browser return pixels //so on chrome-based browser we need to adjust using 'devicePixelRatio' - return window.navigator.userAgent.includes('Firefox') ? 1 : window.devicePixelRatio; + return window.navigator.userAgent.includes("Firefox") ? 1 : window.devicePixelRatio; } private close(): void { - this.cowebsiteDiv.classList.remove('loaded'); //edit the css class to trigger the transition - this.cowebsiteDiv.classList.add('hidden'); + this.cowebsiteDiv.classList.remove("loaded"); //edit the css class to trigger the transition + this.cowebsiteDiv.classList.add("hidden"); this.opened = iframeStates.closed; this.resetStyle(); } private load(): void { - this.cowebsiteDiv.classList.remove('hidden'); //edit the css class to trigger the transition - this.cowebsiteDiv.classList.add('loading'); + this.cowebsiteDiv.classList.remove("hidden"); //edit the css class to trigger the transition + this.cowebsiteDiv.classList.add("loading"); this.opened = iframeStates.loading; } private open(): void { - this.cowebsiteDiv.classList.remove('loading', 'hidden'); //edit the css class to trigger the transition + this.cowebsiteDiv.classList.remove("loading", "hidden"); //edit the css class to trigger the transition this.opened = iframeStates.opened; this.resetStyle(); } public resetStyle() { - this.cowebsiteDiv.style.width = ''; - this.cowebsiteDiv.style.height = ''; + this.cowebsiteDiv.style.width = ""; + this.cowebsiteDiv.style.height = ""; } private getIframeDom(): HTMLIFrameElement { - const iframe = HtmlUtils.getElementByIdOrFail(cowebsiteDivId).querySelector('iframe'); - if (!iframe) throw new Error('Could not find iframe!'); + const iframe = HtmlUtils.getElementByIdOrFail(cowebsiteDivId).querySelector("iframe"); + if (!iframe) throw new Error("Could not find iframe!"); return iframe; } @@ -167,9 +166,9 @@ class CoWebsiteManager { this.load(); this.cowebsiteMainDom.innerHTML = ``; - const iframe = document.createElement('iframe'); - iframe.id = 'cowebsite-iframe'; - iframe.src = (new URL(url, base)).toString(); + const iframe = document.createElement("iframe"); + iframe.id = "cowebsite-iframe"; + iframe.src = new URL(url, base).toString(); if (allowPolicy) { iframe.allow = allowPolicy; } @@ -183,15 +182,18 @@ class CoWebsiteManager { const onTimeoutPromise = new Promise((resolve) => { setTimeout(() => resolve(), 2000); }); - this.currentOperationPromise = this.currentOperationPromise.then(() =>Promise.race([onloadPromise, onTimeoutPromise])).then(() => { - this.open(); - setTimeout(() => { - this.fire(); - }, animationTime) - }).catch((err) => { - console.error('Error loadCoWebsite => ', err); - this.closeCoWebsite() - }); + this.currentOperationPromise = this.currentOperationPromise + .then(() => Promise.race([onloadPromise, onTimeoutPromise])) + .then(() => { + this.open(); + setTimeout(() => { + this.fire(); + }, animationTime); + }) + .catch((err) => { + console.error("Error loadCoWebsite => ", err); + this.closeCoWebsite(); + }); } /** @@ -200,56 +202,63 @@ class CoWebsiteManager { public insertCoWebsite(callback: (cowebsite: HTMLDivElement) => Promise): void { this.load(); this.cowebsiteMainDom.innerHTML = ``; - this.currentOperationPromise = this.currentOperationPromise.then(() => callback(this.cowebsiteMainDom)).then(() => { - this.open(); - setTimeout(() => { - this.fire(); - }, animationTime); - }).catch((err) => { - console.error('Error insertCoWebsite => ', err); - this.closeCoWebsite(); - }); + this.currentOperationPromise = this.currentOperationPromise + .then(() => callback(this.cowebsiteMainDom)) + .then(() => { + this.open(); + setTimeout(() => { + this.fire(); + }, animationTime); + }) + .catch((err) => { + console.error("Error insertCoWebsite => ", err); + this.closeCoWebsite(); + }); } public closeCoWebsite(): Promise { - this.currentOperationPromise = this.currentOperationPromise.then(() => new Promise((resolve, reject) => { - if(this.opened === iframeStates.closed) resolve(); //this method may be called twice, in case of iframe error for example - this.close(); - this.fire(); - const iframe = this.cowebsiteDiv.querySelector('iframe'); - if (iframe) { - iframeListener.unregisterIframe(iframe); - } - setTimeout(() => { - this.cowebsiteMainDom.innerHTML = ``; - resolve(); - }, animationTime) - })); + this.currentOperationPromise = this.currentOperationPromise.then( + () => + new Promise((resolve, reject) => { + if (this.opened === iframeStates.closed) resolve(); //this method may be called twice, in case of iframe error for example + this.close(); + this.fire(); + const iframe = this.cowebsiteDiv.querySelector("iframe"); + if (iframe) { + iframeListener.unregisterIframe(iframe); + } + setTimeout(() => { + this.cowebsiteMainDom.innerHTML = ``; + resolve(); + }, animationTime); + }) + ); return this.currentOperationPromise; } - public getGameSize(): {width: number, height: number} { + public getGameSize(): { width: number; height: number } { if (this.opened !== iframeStates.opened) { return { width: window.innerWidth, - height: window.innerHeight - } + height: window.innerHeight, + }; } if (!this.verticalMode) { return { width: window.innerWidth - this.width, - height: window.innerHeight - } + height: window.innerHeight, + }; } else { return { width: window.innerWidth, height: window.innerHeight - this.height, - } + }; } } private fire(): void { this._onResize.next(); + waScaleManager.applyNewSize(); } private fullscreen(): void { @@ -257,13 +266,13 @@ class CoWebsiteManager { this.resetStyle(); this.fire(); //we don't trigger a resize of the phaser game since it won't be visible anyway. - HtmlUtils.getElementByIdOrFail(cowebsiteOpenFullScreenImageId).style.display = 'inline'; - HtmlUtils.getElementByIdOrFail(cowebsiteCloseFullScreenImageId).style.display = 'none'; + HtmlUtils.getElementByIdOrFail(cowebsiteOpenFullScreenImageId).style.display = "inline"; + HtmlUtils.getElementByIdOrFail(cowebsiteCloseFullScreenImageId).style.display = "none"; } else { - this.verticalMode ? this.height = window.innerHeight : this.width = window.innerWidth; + this.verticalMode ? (this.height = window.innerHeight) : (this.width = window.innerWidth); //we don't trigger a resize of the phaser game since it won't be visible anyway. - HtmlUtils.getElementByIdOrFail(cowebsiteOpenFullScreenImageId).style.display = 'none'; - HtmlUtils.getElementByIdOrFail(cowebsiteCloseFullScreenImageId).style.display = 'inline'; + HtmlUtils.getElementByIdOrFail(cowebsiteOpenFullScreenImageId).style.display = "none"; + HtmlUtils.getElementByIdOrFail(cowebsiteCloseFullScreenImageId).style.display = "inline"; } } }