Finition de l'ajustement des constantes pour adapter à plusieurs écrans => Normalement, toutes les scènes sont dorénavant utilisable sur smartphone ou tablette

Code/src/js/level2/AddMove.js

@@ -11,15 +11,23 @@ class AddMove extends AddNode {
         console.log("MOVE");
         super.create();
         super.addTitle(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 16, selectWord("ADD NODE : MOVE", "AJOUTER ACTION : DEPLACEMENT"));
-        super.addTitle(WIDTH_WINDOW / 4, HEIGHT_WINDOW / (16 / 3), selectWord("FLEE OR MOVE ?", "RECULER OU AVANCER ?"));
+        let title = super.addTitle(WIDTH_WINDOW / 4, HEIGHT_WINDOW / (16 / 3), selectWord("FLEE OR MOVE ?", "RECULER OU AVANCER ?"));
+        if (title.displayWidth > WIDTH_WINDOW / 2) {
+            title.displayWidth = WIDTH_WINDOW / 2;
+            title.scaleY = title.scaleX;
+        }
         let c1 = super.newCategory('direction', true, true);
         super.addButton(WIDTH_WINDOW / 6, HEIGHT_WINDOW / (16 / 5), 'fleeFrom', c1, false);
         super.addButton(WIDTH_WINDOW / 3, HEIGHT_WINDOW / (16 / 5), 'moveToward', c1, true);
-        super.addTitle(WIDTH_WINDOW / 4 * 3, HEIGHT_WINDOW / (16 / 3), selectWord("WHO ?", "QUI ?"));
+        title = super.addTitle(WIDTH_WINDOW / 4 * 3, HEIGHT_WINDOW / (16 / 3), selectWord("WHO ?", "QUI ?"));
+        if (title.displayWidth > WIDTH_WINDOW / 2) {
+            title.displayWidth = WIDTH_WINDOW / 2;
+            title.scaleY = title.scaleX;
+        }
         let c2 = super.newCategory('target', true, true);
         super.addButton(WIDTH_WINDOW / 6 * 4, HEIGHT_WINDOW / (16 / 5), 'enemyBot', c2, true);
         let btn = super.addButton(WIDTH_WINDOW / 6 * 5, HEIGHT_WINDOW / (16 / 5), 'bonus', c2, false);
-        let title = super.addTitle(WIDTH_WINDOW / 2, HEIGHT_WINDOW / (16 / 7), selectWord("WHAT BONUS ? (OPTIONAL)", "QUEL BONUS ? (FACULTATIF)"));
+        title = super.addTitle(WIDTH_WINDOW / 2, HEIGHT_WINDOW / (16 / 7), selectWord("WHAT BONUS ? (OPTIONAL)", "QUEL BONUS ? (FACULTATIF)"));
         let c3 = super.newCategory('target', true, false);
         let speed = super.addButton(WIDTH_WINDOW / 3, HEIGHT_WINDOW / (16 / 9), 'bonusSpeed', c3, "speed");
         let attack = super.addButton(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / (16 / 9), 'bonusAttack', c3, "attack");

Code/src/js/level2/PlusNode.js

@@ -20,28 +20,31 @@ class PlusNode extends Phaser.Scene {
         let diffY = HEIGHT_WINDOW / 10;
         let sizeText = diffY / 1.5;
 
-        let style = {font: sizeText.toString() + 'px stencil', fill: "#e2e2e2"};
+        if (ORIENTATION_VERTICAL) {
+            sizeText = sizeText / 1.5;
+        }
 
-        this.add.text(x - diffX, y - diffY, selectWord("ATTACK", "ATTAQUE"), style).setOrigin(0.5, 0.5);
+        this.createBtn(x - diffX, y, 'attack', selectWord("ATTACK", "ATTAQUE"), diffX, diffY, () => this.click('attack'));
-        this.add.text(x, y - diffY, selectWord("MOVE", "DEPLACEMENT"), style).setOrigin(0.5, 0.5);
-        this.add.text(x + diffX, y - diffY, selectWord("CONDITION", "CONDITION"), style).setOrigin(0.5, 0.5);
 
-        let btn = this.add.sprite(x - diffX, y + diffY, 'attack').setOrigin(0.5, 0.5).setInteractive()
+        this.createBtn(x, y, 'move', selectWord("MOVE", "DEPLACEMENT"), diffX, diffY, () => this.click('move'));
-            .on('pointerdown', () => this.click('attack'));
-        btn.displayHeight = diffY * 2;
-        btn.scaleX = btn.scaleY;
 
-        btn = this.add.sprite(x, y + diffY, 'move').setOrigin(0.5, 0.5).setInteractive()
+        this.createBtn(x + diffX, y, 'condition', selectWord("CONDITION", "CONDITION"), diffX, diffY, () => this.click('condition'));
-            .on('pointerdown', () => this.click('move'));
+    }
-        btn.displayHeight = diffY * 2;
-        btn.scaleX = btn.scaleY;
 
-        btn = this.add.sprite(x + diffX, y + diffY, 'condition').setOrigin(0.5, 0.5).setInteractive()
+    createBtn(x, y, texture, title, diffX, diffY, fn) {
-            .on('pointerdown', () => this.click('condition'));
+        let btn = this.add.sprite(x, y + diffY, texture).setOrigin(0.5, 0.5).setInteractive()
+            .on('pointerdown', fn);
         btn.displayHeight = diffY * 2;
         btn.scaleX = btn.scaleY;
-
+        if (btn.displayWidth > diffX) {
-
+            btn.displayWidth = diffX / 1.1;
+            btn.scaleY = btn.scaleX;
+        }
+        let style = {font: HEIGHT_TITLE.toString() + 'px stencil', fill: "#e2e2e2"};
+        let t = this.add.text(x, y - diffY, title, style).setOrigin(0.5, 0.5);
+        t.displayWidth = btn.displayWidth;
+        t.scaleY = t.scaleX;
+        return btn
     }
 
     click(action) {

Code/src/js/level2/Variable.js

@@ -29,6 +29,7 @@ var CENTERX_TREE;
 var HEIGHT_TITLE;
 var HEIGHT_NODE;
 var HEIGHT_BUTTON_TEXT;
+var ORIENTATION_VERTICAL = true;
 if (WIDTH_WINDOW < HEIGHT_WINDOW) {
     WIDTH_MAP = WIDTH_WINDOW * 0.65;
     OFFY_MAP = OFFX_MAP * 2;
@@ -42,6 +43,7 @@ if (WIDTH_WINDOW < HEIGHT_WINDOW) {
     HEIGHT_TITLE = WIDTH_WINDOW / 5;
     HEIGHT_NODE = (HEIGHT_WINDOW - WIDTH_MAP) / 6;
 } else {
+    ORIENTATION_VERTICAL = false;
     WIDTH_MAP = HEIGHT_WINDOW * 0.8;
     HEIGHT_NODE = HEIGHT_WINDOW / 7;
     HEIGHT_BUTTON_TEXT = HEIGHT_WINDOW / 9;

Code/src/js/level3/AddNode.js

@@ -7,7 +7,6 @@ class AddNode extends Phaser.Scene {
         this.lCategory = [];
         let sizeText = HEIGHT_WINDOW / 14;
         this.style = {font: sizeText.toString() + 'px stencil', fill: "#e2e2e2"};
-        this.heightButton = HEIGHT_WINDOW / 8;
         this.lastCategory = null;
         if (option === undefined) {
             option = [];
@@ -39,7 +38,7 @@ class AddNode extends Phaser.Scene {
         return btn;
     }
 
-    createButton(x, y, texture, height = this.heightButton, width = null) {
+    createButton(x, y, texture, height = HEIGHT_BUTTON_TEXT * 1.3, width = null) {
         let btn = this.add.image(x, y, texture).setOrigin(0.5, 0.5).setInteractive();
         btn.on('pointerover', () => btn.setFrame(1));
         btn.on('pointerout', () => btn.setFrame(0));
@@ -68,21 +67,26 @@ class AddNode extends Phaser.Scene {
     }
 
     addTitle(x, y, title) {
-        return this.add.text(x, y, title, this.style).setOrigin(0.5, 0.5);
+        let t = this.add.text(x, y, title, this.style).setOrigin(0.5, 0.5);
+        if (t.displayWidth > WIDTH_WINDOW) {
+            t.displayWidth = WIDTH_WINDOW;
+            t.scaleY = t.scaleX;
+        }
+        return t;
     }
 
     createButtonCancel() {
-        this.createButton(WIDTH_WINDOW / 3, HEIGHT_WINDOW / (16 / 15), 'cancel', HEIGHT_WINDOW / 9)
+        this.createButton(WIDTH_WINDOW / 3, HEIGHT_WINDOW / (16 / 15), 'cancel', HEIGHT_BUTTON_TEXT)
             .on('pointerdown', () => this.cancel());
     }
 
     createButtonAdd() {
-        this.createButton(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / (16 / 15), 'add', HEIGHT_WINDOW / 9)
+        this.createButton(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / (16 / 15), 'add', HEIGHT_BUTTON_TEXT)
             .on('pointerdown', () => this.addNode());
     }
 
     createButtonModify() {
-        this.createButton(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / (16 / 15), 'modify', HEIGHT_WINDOW / 9)
+        this.createButton(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / (16 / 15), 'modify', HEIGHT_BUTTON_TEXT)
             .on('pointerdown', () => this.modifyNode());
     }
 

Code/src/js/level3/Finish.js

@@ -15,6 +15,10 @@ class Finish extends Phaser.Scene {
         let sizeText = HEIGHT_TITLE / 1.5;
         let style = {font: sizeText.toString() + 'px stencil', fill: "#e2e2e2"};
         let text = this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 2, title, style).setOrigin(0.5, 1);
+        if (text.displayWidth > WIDTH_WINDOW) {
+            text.displayWidth = WIDTH_WINDOW;
+            text.scaleY = text.scaleX;
+        }
         style = {font: (sizeText / 2).toString() + 'px stencil', fill: "#e2e2e2"};
         this.add.text(WIDTH_WINDOW / 2, text.y + text.displayHeight, "SCORE : " + this.score.toString(), style).setOrigin(0.5, 0.5);
     }