Switching customizeScene and gameScene to new ResizableScene

front/src/Phaser/Game/GameScene.ts

@@ -45,6 +45,7 @@ import {connectionManager} from "../../Connexion/ConnectionManager";
 import {RoomConnection} from "../../Connexion/RoomConnection";
 import {GlobalMessageManager} from "../../Administration/GlobalMessageManager";
 import {ConsoleGlobalMessageManager} from "../../Administration/ConsoleGlobalMessageManager";
+import {ResizableScene} from "../Login/ResizableScene";
 
 
 export enum Textures {
@@ -86,7 +87,7 @@ interface DeleteGroupEventInterface {
     groupId: number
 }
 
-export class GameScene extends Phaser.Scene implements CenterListener {
+export class GameScene extends ResizableScene implements CenterListener {
     GameManager : GameManager;
     Terrains : Array<Phaser.Tilemaps.Tileset>;
     CurrentPlayer!: CurrentGamerInterface;
@@ -132,7 +133,6 @@ export class GameScene extends Phaser.Scene implements CenterListener {
     private startLayerName: string|undefined;
     private presentationModeSprite!: Sprite;
     private chatModeSprite!: Sprite;
-    private onResizeCallback!: (this: Window, ev: UIEvent) => void;
     private gameMap!: GameMap;
     private actionableItems: Map<number, ActionableItem> = new Map<number, ActionableItem>();
     // The item that can be selected by pressing the space key.
@@ -271,7 +271,6 @@ export class GameScene extends Phaser.Scene implements CenterListener {
 
                 this.scene.stop(this.scene.key);
                 this.scene.remove(this.scene.key);
-                window.removeEventListener('resize', this.onResizeCallback);
             })
 
             connection.onActionableEvent((message => {
@@ -565,8 +564,6 @@ export class GameScene extends Phaser.Scene implements CenterListener {
             this.switchLayoutMode();
         });
 
-        this.onResizeCallback = this.onResize.bind(this);
-        window.addEventListener('resize', this.onResizeCallback);
         this.reposition();
 
         // From now, this game scene will be notified of reposition events
@@ -957,7 +954,6 @@ export class GameScene extends Phaser.Scene implements CenterListener {
             this.simplePeer.unregister();
             this.scene.stop();
             this.scene.remove(this.scene.key);
-            window.removeEventListener('resize', this.onResizeCallback);
             this.scene.start(nextSceneKey.key, {
                 startLayerName: nextSceneKey.hash
             });
@@ -1156,7 +1152,7 @@ export class GameScene extends Phaser.Scene implements CenterListener {
         this.connection.emitActionableEvent(itemId, eventName, state, parameters);
     }
 
-    private onResize(): void {
+    public onResize(): void {
         this.reposition();
 
         // Send new viewport to server

front/src/Phaser/Login/CustomizeScene.ts

@@ -6,6 +6,7 @@ import {LAYERS, loadAllLayers} from "../Entity/body_character";
 import Sprite = Phaser.GameObjects.Sprite;
 import Container = Phaser.GameObjects.Container;
 import {gameManager} from "../Game/GameManager";
+import {ResizableScene} from "./ResizableScene";
 
 export const CustomizeSceneName = "CustomizeScene";
 
@@ -16,7 +17,7 @@ enum CustomizeTextures{
     arrowUp = "arrow_up",
 }
 
-export class CustomizeScene extends Phaser.Scene {
+export class CustomizeScene extends ResizableScene {
 
     private textField!: TextField;
     private enterField!: TextField;
@@ -35,8 +36,6 @@ export class CustomizeScene extends Phaser.Scene {
     private containersRow: Array<Array<Container>> = new Array<Array<Container>>();
     private activeRow = 0;
 
-    private repositionCallback!: (this: Window, ev: UIEvent) => void;
-
     constructor() {
         super({
             key: CustomizeSceneName
@@ -144,10 +143,6 @@ export class CustomizeScene extends Phaser.Scene {
                 this.moveLayers();
             }
         });
-
-        this.repositionCallback = this.reposition.bind(this);
-        window.addEventListener('resize', this.repositionCallback);
-
     }
     update(time: number, delta: number): void {
         super.update(time, delta);
@@ -249,7 +244,7 @@ export class CustomizeScene extends Phaser.Scene {
         }
      }
 
-     private reposition() {
+     public onResize(): void {
         this.moveLayers();
 
         this.Rectangle.x = this.cameras.main.worldView.x + this.cameras.main.width / 2;

front/src/Phaser/Login/SelectCharacterScene.ts

@@ -250,6 +250,7 @@ export class SelectCharacterScene extends ResizableScene {
         this.logo.x = this.game.renderer.width - 30;
         this.logo.y = this.game.renderer.height - 20;
         this.customizeButton.x = this.game.renderer.width / 2;
+        this.customizeButtonSelected.x = this.game.renderer.width / 2;
 
         for (let i = 0; i <PLAYER_RESOURCES.length; i++) {
             const player = this.players[i];