game: core: use draw method instead draw_CLASSNAME

frontend/static/js/api/game/Game.js

@@ -45,15 +45,60 @@ class Game
 
         this.players = [];
         response_data.players_id.forEach(player_id => {
-            let player = new Player(player_id, 0.5, 0, this);
+            let player = new Player(player_id, 0.5, 0, this, 0, 0, 0, 0);
             this.players.push(player);
         });
 
-        this.ball = new Ball(response_data.ball_pos_x, response_data.ball_pos_y, response_data.ball_vel_x, response_data.ball_vel_y);
+        this.ball = new Ball(this);
 
         return 0;
     }
 
+    draw_wall(ctx, stop_x, stop_y)
+    {
+        ctx.lineTo(stop_x, stop_y);
+    }
+
+    draw_sides(ctx, nb_sides)
+    {
+        let start_x,
+            start_y,
+            stop_x,
+            stop_y;
+        
+        let radius = Math.min(this.config.size_x, this.config.size_y) / 2 - 10; 
+
+        for (let i = 0; i <= nb_sides; i++)
+        {
+            let angle = (i * 2 * Math.PI / nb_sides) + (Math.PI * 3 / 4);
+
+            stop_x = this.config.center_x + radius * Math.cos(angle);
+            stop_y = this.config.center_y + radius * Math.sin(angle);
+
+            if (i == 0)
+                ctx.moveTo(stop_x, start_y);
+            if (i % 2 == 0)
+                this.draw_wall(ctx, stop_x, stop_y);
+            else
+                this.players[(i - 1) / 2].draw(ctx);
+            start_x = stop_x;
+            start_y = stop_y;
+        }
+    }
+
+    draw(ctx)
+    {
+        ctx.beginPath()
+
+        ctx.clearRect(0, 0, this.config.size_x, this.config.size_y);
+        this.draw_sides(ctx, (this.players_id.length) * 2);
+        this.ball.draw(ctx);
+
+        ctx.strokeStyle = "#000000";
+        ctx.lineWidth = 10;
+        ctx.stroke();
+    }
+
     _send(data)
     {
         if (this._socket === undefined)