Création de CategoryBar dans le but de gérer les barres de façon groupé - Création des barres par paire (on a 5 "jetons" par paire de barre). Les barres sont paires avec celle au dessus ou en dessous d'elle - Modification des stats de base pour équilibrer un petit peu chaque catégorie - Modifcation des robots ennemy pour les adapter comme un robot équilibré

Code/package.json

@@ -9,7 +9,7 @@
   "author": "Clément Maisonhaute",
   "license": "ISC",
   "dependencies": {
-    "grunt": "^1.1.0",
+    "grunt": "^1.2.0",
     "jquery": "^3.5.1",
     "phaser": "^3.23.0"
   },

Code/src/js/level2/Bar.js

@@ -1,16 +1,18 @@
 class Bar extends HealthBar {
-    constructor(scene, width, height, x, y, startValue, valueMax, color) {
-        super(scene, width, height, x, y, valueMax, color, color);
+    constructor(scene, width, height, x, y, color, categoryBar = new CategoryBar(), value = 1) {
+        super(scene, width, height, x, y, categoryBar.valueMax, color, color);
         this.scene = scene;
         this.scene.input.on('pointerdown', this.doDrag, this);
         let style = {font: height.toString() + 'px stencil', fill: "#e2e2e2"};
         this.text = this.scene.add.text(this.bar.x + this.width + 10, this.bar.y, this.value.toString(), style).setOrigin(0, 0);
-        this.setValue(startValue);
+        this.categoryBar = categoryBar;
+        this.setValue(0);
+        this.categoryBar.setValueOf(this, value);
     }
 
     doDrag() {
         let pointer = this.scene.input;
-        if (pointer.x >= this.bar.x && pointer.x <= this.bar.x + this.width && pointer.y >= this.bar.y && pointer.y <= this.bar.y + this.height) {
+        if (pointer.x >= this.bar.x - 10 && pointer.x <= this.bar.x + this.width + 10 && pointer.y >= this.bar.y && pointer.y <= this.bar.y + this.height) {
             this.scene.pauseScene();
             this.clickOn();
         }
@@ -32,7 +34,7 @@ class Bar extends HealthBar {
     }
 
     setValWithX(posX) {
-        this.setValue(Math.round((posX - this.bar.x) / this.width * this.valueMax));
+        this.categoryBar.setValueOf(this, Math.round((posX - this.bar.x) / this.width * this.valueMax));
     }
 
     draw() {
@@ -41,7 +43,7 @@ class Bar extends HealthBar {
         this.bar.fillStyle(0x969696);
         this.bar.fillRect(posX, 0, 10, this.height);
         if (this.text !== undefined) {
-            this.text.setText(this.value.toString());
+            this.text.setText(this.value);
         }
     }
 }

Code/src/js/level2/BonusSpeed.js

@@ -20,8 +20,8 @@ class BonusSpeed extends Bonus {
     }
 
     useOn(robot) {
-        robot.increaseSpeed(this.value);
-        this.scene.time.addEvent({delay: this.time, callback: () => robot.decreaseSpeed(this.value)});
+        robot.increaseSpeedBonus(this.value);
+        this.scene.time.addEvent({delay: this.time, callback: () => robot.decreaseSpeedBonus(this.value)});
         this.destroy();
     }
 }

Code/src/js/level2/CategoryBar.js

@@ -0,0 +1,31 @@
+class CategoryBar {
+    constructor(startValue = 1, valueMax = VALUE_MAX_BAR) {
+        this.startValue = startValue;
+        this.valueMax = valueMax;
+        this.point = this.valueMax;
+    }
+
+    addPoint(point) {
+        this.point += point;
+        if (this.point < 0) {
+            let send = this.point;
+            this.point = 0;
+            return send;
+        }
+        if (this.point > this.valueMax) {
+            this.point = this.valueMax;
+        }
+        return 0;
+    }
+
+    setValueOf(bar, newValue) {
+        let diff = newValue - bar.value;
+        let oldValue = bar.value;
+        if (this.point >= diff) {
+            bar.setValue(newValue);
+        } else {
+            bar.setValue(bar.value + this.point);
+        }
+        this.addPoint(oldValue - bar.value);
+    }
+}

Code/src/js/level2/Game.js

@@ -18,11 +18,12 @@ class Game extends ManageLang {
 
         this.selected = null;
 
-
-        this.damageRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4, OFFY_MAP / 2, DAMAGE_BEGIN, 5, COLOR_ATTACK);
-        this.speedReloadRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4, 0, SPEED_RELOAD_BEGIN, 5, COLOR_SPEED_RELOAD);
-        this.speedRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4 * 3, 0, SPEED, 5, COLOR_MOVE);
-        this.rangeRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4 * 3, OFFY_MAP / 2, RANGE_BEGIN, 5, COLOR_RANGE);
+        let c1 = new CategoryBar();
+        this.damageRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4, OFFY_MAP / 2, COLOR_ATTACK, c1, DAMAGE_BEGIN);
+        this.speedReloadRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4, 0, COLOR_SPEED_RELOAD, c1, SPEED_RELOAD_BEGIN);
+        let c2 = new CategoryBar();
+        this.speedRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4 * 3, 0, COLOR_MOVE, c2, SPEED_BEGIN);
+        this.rangeRobot = new Bar(this, 200, 30, OFFX_MAP + WIDTH_MAP / 4 * 3, OFFY_MAP / 2, COLOR_RANGE, c2, RANGE_BEGIN);
 
         this.createButton();
 

Code/src/js/level2/GamingBoard.js

@@ -14,8 +14,7 @@ class GamingBoard extends Phaser.Scene {
     }
 
     create() {
-
-        listBonus.push(new BonusSpeed('Balle Argent', this, WIDTH_MAP / 2, WIDTH_MAP / 2, 3, 2000));
+        listBonus.push(new BonusSpeed('Fusée', this, WIDTH_MAP / 2, WIDTH_MAP / 2, 5, 2000));
 
         this.add.image(0, 0, 'background').alpha = 0.1;
 
@@ -31,6 +30,7 @@ class GamingBoard extends Phaser.Scene {
 
     update(time, delta) {
         super.update(time, delta);
+        console.log(delta);
         this.listRobot.forEach(function (robot) {
             robot.read();
         })

Code/src/js/level2/Robot.js

@@ -1,16 +1,16 @@
 class Robot {
-    constructor(height, width, posX, posY, color, scene, name = 'enemy', speed = 1) {
-        this.speed = speed;
-        this.speedReload = SPEED_RELOAD_BEGIN;
-        this.timeReload = TIME_RELOAD;
+    constructor(height, width, posX, posY, color, scene, name = 'enemy') {
+        this.speed = SPEED_BASE + SPEED_BEGIN;
+        this.speedReload = SPEED_RELOAD_BASE + SPEED_RELOAD_BEGIN;
+        this.range = RANGE_BASE + RANGE_BEGIN;
+        this.damage = DAMAGE_BASE + DAMAGE_BEGIN;
+        this.speedBonus = 1;
         this.name = name;
         this.height = height;
         this.width = width;
         this.x = posX;
         this.y = posY;
         this.color = color;
-        this.range = RANGE_BEGIN;
-        this.damage = DAMAGE_BEGIN;
         this.life = new HealthBar(scene, this.width * 2, this.width / 3, this.x, this.y - this.width, LIFE, 0x008000);
         this.shield = new HealthBar(scene, this.width * 2, this.width / 3, this.x, this.y - this.width * 1.5, SHIELD, 0x0000FF);
         this.circleRange = null;
@@ -82,28 +82,29 @@ class Robot {
     }
 
     setDamage(damage = this.damage) {
-        this.damage = damage;
+        this.damage = damage + DAMAGE_BASE;
     }
 
     setRange(range = this.range) {
-        this.range = range;
+        this.range = range + RANGE_BASE;
         this.drawCircleRange();
     }
 
     setSpeed(speed = this.speed) {
-        this.speed = speed;
+        this.speed = speed + SPEED_BASE;
     }
 
     setSpeedReload(speedReload = this.speedReload) {
-        this.speedReload = speedReload;
+        this.speedReload = speedReload + SPEED_RELOAD_BASE;
     }
 
-    increaseSpeed(amount) {
-        this.speed += amount;
+    increaseSpeedBonus(amount) {
+        this.speedBonus += amount;
     }
 
-    decreaseSpeed(amount) {
-        this.speed -= amount;
+    decreaseSpeedBonus(amount) {
+        this.speedBonus -= amount;
+        console.log(this.speed);
     }
 
     advanceToTarget() {
@@ -168,19 +169,19 @@ class Robot {
         let velocity = [];
         let diffX = target.x - this.x;
         let diffY = target.y - this.y;
+        if (diffX === 0 && diffY === 0) {
+
+        }
         let hypot = Math.hypot(diffX, diffY);
-        velocity[0] = diffX / hypot * WIDTH_MAP / 1000 * SPEED * this.speed * SPEED_GAME;
-        velocity[1] = diffY / hypot * WIDTH_MAP / 1000 * SPEED * this.speed * SPEED_GAME;
+        velocity[0] = diffX / hypot * SPEED * this.speed * this.speedBonus * SPEED_GAME; // Velocity X
+        velocity[1] = diffY / hypot * SPEED * this.speed * this.speedBonus * SPEED_GAME; // Velocity Y
         if (calcul) {
-            if (this.x + this.width / 2 + velocity[0] > WIDTH_MAP || this.x - this.width / 2 + velocity[0] < 0) {
-                console.log(velocity);
+            if (this.x + this.width / 2 + velocity[0] > WIDTH_MAP || this.x - this.width / 2 - velocity[0] < 0) {
                 velocity[1] += velocity[0] * Math.sign(velocity[1]);
                 velocity[0] = 0;
-                console.log(velocity);
             } else {
-                if (this.y + this.width / 2 + velocity[1] > WIDTH_MAP || this.y - this.width / 2 + velocity[1] < 0) {
-                    console.log(velocity);
-                    velocity[0] += velocity[1] * Math.sign(velocity[0]);
+                if (this.y + this.width / 2 - velocity[1] > WIDTH_MAP || this.y - this.width / 2 + velocity[1] < 0) {
+                    velocity[0] += velocity[1] * Math.sign(-velocity[0]);
                     velocity[1] = 0;
                 }
             }
@@ -231,7 +232,7 @@ class Robot {
         });
 
         this.scene.time.addEvent({
-            delay: TIME_RELOAD / this.speedReload / SPEED_GAME,
+            delay: SPEED_RELOAD / this.speedReload / SPEED_GAME,
             callback: this.reload,
             callbackScope: this
         });

Code/src/js/level2/Variable.js

@@ -16,15 +16,28 @@ const HEIGHT_WINDOW = $(document).height() - 20;
 const WIDTH_MAP = WIDTH_WINDOW < HEIGHT_WINDOW ? WIDTH_WINDOW * 0.8 : HEIGHT_WINDOW * 0.8;
 const OFFX_MAP = WIDTH_WINDOW / 20;
 const OFFY_MAP = WIDTH_WINDOW / 20;
-const SPEED = 2;
+
 const LIFE = 100;
-const DAMAGE = 10;
-const DAMAGE_BEGIN = 3;
 const SHIELD = 100;
+
+const VALUE_MAX_BAR = 5;
+
+const SPEED = WIDTH_MAP / 1000;
+const SPEED_BASE = 1;
+const SPEED_BEGIN = 3;
+
+const RANGE = WIDTH_MAP / 16;
+const RANGE_BASE = 3;
 const RANGE_BEGIN = 2;
-const RANGE = WIDTH_MAP / 4;
+
+const SPEED_RELOAD = 4000;
+const SPEED_RELOAD_BASE = 2;
+const SPEED_RELOAD_BEGIN = 3;
+
+const DAMAGE = 3;
+const DAMAGE_BASE = 10;
+const DAMAGE_BEGIN = 2;
+
 const HEIGHT_BONUS = WIDTH_MAP / 10;
 const HEIGHT_DAMAGE = WIDTH_MAP / 20;
 const DURATION_DAMAGE = 700;
-const TIME_RELOAD = 4000;
-const SPEED_RELOAD_BEGIN = 2;