Merge branch 'develop' into newStartMobileScene

# Conflicts:
#	front/src/Phaser/Login/EnableCameraScene.ts
#	front/src/Phaser/Login/LoginScene.ts
#	front/src/Phaser/Login/SelectCharacterScene.ts
#	front/src/Phaser/Login/SelectCompanionScene.ts

front/src/Phaser/Login/EnableCameraScene.ts

@@ -9,6 +9,7 @@ import {SoundMeterSprite} from "../Components/SoundMeterSprite";
 import {HtmlUtils} from "../../WebRtc/HtmlUtils";
 import {touchScreenManager} from "../../Touch/TouchScreenManager";
 import {PinchManager} from "../UserInput/PinchManager";
+import Zone = Phaser.GameObjects.Zone;
 import { MenuScene } from "../Menu/MenuScene";
 
 export const EnableCameraSceneName = "EnableCameraScene";
@@ -38,11 +39,9 @@ export class EnableCameraScene extends Phaser.Scene {
     private microphoneNameField!: TextField;
     private repositionCallback!: (this: Window, ev: UIEvent) => void;
 
-    private mobileTapRectangle!: Rectangle;
-
-
     private enableCameraSceneElement!: Phaser.GameObjects.DOMElement;
 
+    private mobileTapZone!: Zone;
     constructor() {
         super({
             key: EnableCameraSceneName
@@ -82,15 +81,8 @@ export class EnableCameraScene extends Phaser.Scene {
         this.textField = new TextField(this, this.game.renderer.width / 2, 20, '');
 
         // For mobile purposes - we need a big enough touchable area.
-        this.mobileTapRectangle = this.add
+        this.mobileTapZone = this.add.zone(this.game.renderer.width / 2,this.game.renderer.height - 30,200,50)
-          .rectangle(
+          .setInteractive().on("pointerdown", () => {
-            this.game.renderer.width / 2,
-            this.game.renderer.height - 30,
-            200,
-            50,
-          )
-          .setInteractive()
-          .on("pointerdown", () => {
             this.login();
           });
 
@@ -230,7 +222,7 @@ export class EnableCameraScene extends Phaser.Scene {
         }
 
         this.textField.x = this.game.renderer.width / 2;
-        this.mobileTapRectangle.x = this.game.renderer.width / 2;
+        this.mobileTapZone.x = this.game.renderer.width / 2;
         this.cameraNameField.x = this.game.renderer.width / 2;
         this.microphoneNameField.x = this.game.renderer.width / 2;
 
@@ -293,7 +285,7 @@ export class EnableCameraScene extends Phaser.Scene {
     }
 
     private getMiddleX() : number{
-        return (this.game.renderer.width / 2) -  
+        return (this.game.renderer.width / 2) -
         (
             this.enableCameraSceneElement
             && this.enableCameraSceneElement.node

front/src/Phaser/Login/LoginScene.ts

@@ -12,6 +12,7 @@ export class LoginScene extends ResizableScene {
 
     private loginSceneElement!: Phaser.GameObjects.DOMElement;
     private name: string = '';
+    private mobileTapZone!: Phaser.GameObjects.Zone;
 
     constructor() {
         super({

front/src/Phaser/Login/SelectCharacterScene.ts

@@ -13,6 +13,7 @@ import {areCharacterLayersValid} from "../../Connexion/LocalUser";
 import {touchScreenManager} from "../../Touch/TouchScreenManager";
 import {PinchManager} from "../UserInput/PinchManager";
 import {MenuScene} from "../Menu/MenuScene";
+import Zone = Phaser.GameObjects.Zone;
 
 
 //todo: put this constants in a dedicated file
@@ -207,7 +208,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
         }
         return {playerX, playerY, playerScale, playserOpactity, playerVisible}
     }
-    
+
     private setUpPlayer(player: Phaser.Physics.Arcade.Sprite, numero: number){
 
         const {playerX, playerY, playerScale, playserOpactity, playerVisible} = this.defineSetupPlayer(numero);
@@ -262,7 +263,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
     }
 
     private getMiddleX() : number{
-        return (this.game.renderer.width / 2) -  
+        return (this.game.renderer.width / 2) -
         (
             this.selectCharacterSceneElement
             && this.selectCharacterSceneElement.node

front/src/Phaser/Login/SelectCompanionScene.ts

@@ -10,6 +10,7 @@ import { getAllCompanionResources } from "../Companion/CompanionTexturesLoadingM
 import {touchScreenManager} from "../../Touch/TouchScreenManager";
 import {PinchManager} from "../UserInput/PinchManager";
 import { MenuScene } from "../Menu/MenuScene";
+import Zone = Phaser.GameObjects.Zone;
 
 export const SelectCompanionSceneName = "SelectCompanionScene";
 
@@ -232,7 +233,7 @@ export class SelectCompanionScene extends ResizableScene {
             this.game.renderer.height / 3
         ];
     }
-    
+
     private setUpCompanion(companion: Phaser.Physics.Arcade.Sprite, numero: number){
 
         const {companionX, companionY, companionScale, companionOpactity, companionVisible} = this.defineSetupCompanion(numero);
@@ -246,7 +247,7 @@ export class SelectCompanionScene extends ResizableScene {
     }
 
     private getMiddleX() : number{
-        return (this.game.renderer.width / 2) -  
+        return (this.game.renderer.width / 2) -
         (
             this.selectCompanionSceneElement
             && this.selectCompanionSceneElement.node