Merge pull request #1056 from thecodingmachine/dirty_on_resize

Set a global dirty flag on resize

front/src/Phaser/Game/Game.ts

@@ -1,4 +1,7 @@
 import {SKIP_RENDER_OPTIMIZATIONS} from "../../Enum/EnvironmentVariable";
+import {coWebsiteManager} from "../../WebRtc/CoWebsiteManager";
+import {waScaleManager} from "../Services/WaScaleManager";
+import {ResizableScene} from "../Login/ResizableScene";
 
 const Events = Phaser.Core.Events;
 
@@ -7,8 +10,27 @@ const Events = Phaser.Core.Events;
  * It comes with an optimization to skip rendering.
  *
  * Beware, the "step" function might vary in future versions of Phaser.
+ *
+ * It also automatically calls "onResize" on any scenes extending ResizableScene.
  */
 export class Game extends Phaser.Game {
+
+    private _isDirty = false;
+
+
+    constructor(GameConfig: Phaser.Types.Core.GameConfig) {
+        super(GameConfig);
+
+        window.addEventListener('resize', (event) => {
+            // Let's trigger the onResize method of any active scene that is a ResizableScene
+            for (const scene of this.scene.getScenes(true)) {
+                if (scene instanceof ResizableScene) {
+                    scene.onResize(event);
+                }
+            }
+        });
+    }
+
     public step(time: number, delta: number)
     {
         // @ts-ignore
@@ -64,6 +86,11 @@ export class Game extends Phaser.Game {
     }
 
     private isDirty(): boolean {
+        if (this._isDirty) {
+            this._isDirty = false;
+            return true;
+        }
+
         //  Loop through the scenes in forward order
         for (let i = 0; i < this.scene.scenes.length; i++)
         {
@@ -87,4 +114,11 @@ export class Game extends Phaser.Game {
 
         return false;
     }
+
+    /**
+     * Marks the game as needing to be redrawn.
+     */
+    public markDirty(): void {
+        this._isDirty = true;
+    }
 }

front/src/Phaser/Services/WaScaleManager.ts

@@ -1,18 +1,21 @@
 import {HdpiManager} from "./HdpiManager";
 import ScaleManager = Phaser.Scale.ScaleManager;
 import {coWebsiteManager} from "../../WebRtc/CoWebsiteManager";
+import type {Game} from "../Game/Game";
 
 
 class WaScaleManager {
     private hdpiManager: HdpiManager;
     private scaleManager!: ScaleManager;
+    private game!: Game;
 
     public constructor(private minGamePixelsNumber: number, private absoluteMinPixelNumber: number) {
         this.hdpiManager = new HdpiManager(minGamePixelsNumber, absoluteMinPixelNumber);
     }
 
-    public setScaleManager(scaleManager: ScaleManager) {
-        this.scaleManager = scaleManager;
+    public setGame(game: Game): void {
+        this.scaleManager = game.scale;
+        this.game = game;
     }
 
     public applyNewSize() {
@@ -32,6 +35,8 @@ class WaScaleManager {
         const style = this.scaleManager.canvas.style;
         style.width = Math.ceil(realSize.width / devicePixelRatio) + 'px';
         style.height = Math.ceil(realSize.height / devicePixelRatio) + 'px';
+
+        this.game.markDirty();
     }
 
     public get zoomModifier(): number {
@@ -42,6 +47,7 @@ class WaScaleManager {
         this.hdpiManager.zoomModifier = zoomModifier;
         this.applyNewSize();
     }
+
 }
 
 export const waScaleManager = new WaScaleManager(640*480, 196*196);

front/src/index.ts

@@ -127,19 +127,12 @@ const config: GameConfig = {
 //const game = new Phaser.Game(config);
 const game = new Game(config);
 
-waScaleManager.setScaleManager(game.scale);
+waScaleManager.setGame(game);
 
 window.addEventListener('resize', function (event) {
     coWebsiteManager.resetStyle();
 
     waScaleManager.applyNewSize();
-
-    // Let's trigger the onResize method of any active scene that is a ResizableScene
-    for (const scene of game.scene.getScenes(true)) {
-        if (scene instanceof ResizableScene) {
-            scene.onResize(event);
-        }
-    }
 });
 
 coWebsiteManager.onResize.subscribe(() => {