game: advent to online

frontend/static/js/api/game/Ball.js

@@ -0,0 +1,14 @@
+
+
+class Ball
+{
+    constructor (position_x, position_y, velocity_x, velocity_y)
+    {
+        this.position_x = position_x;
+        this.position_y = position_y;
+        this.velocity_x = velocity_x;
+        this.velocity_y = velocity_y; 
+    }
+}
+
+export { Ball }

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

@@ -1,4 +1,6 @@
+import { Ball } from "./Ball.js";
 import { GameConfig } from "./GameConfig.js"
+import { Player } from "./Player.js";
 
 class Game
 {
@@ -37,16 +39,84 @@ class Game
         this.config = new GameConfig(this.client);
         
         let ret = await this.config.init();
-        if (ret)
+        if (ret !== 0)
             return ret;
 
-        this.players = response_data.players;
+        this.players = [];
+        response_data.players.forEach(player_data => {
+            let player = new Player(player_data.id, player_data.pos, player_data.nb_goal);
+            this.players.push(player);
+        });
 
-        this.ball_pos_x = this.config.ball_spawn_x;
-        this.ball_pos_y = this.config.ball_spawn_y;
+        this.ball = new Ball(response_data.ball_pos_x, response_data.ball_pos_y, response_data.ball_vel_x, response_data.ball_vel_y);
 
         return 0;
     }
+
+    _send(data)
+    {
+        this._socket.send(JSON.stringify(data));
+    }
+
+    _send_paddle()
+    {
+        this._send({"detail": "update_my_paddle_pos", "pos": this.players.find(player => player.id === this.client.me.id).pos});        
+    }
+
+    _update_paddles(data)
+    {
+        data.forEach(player_data => {
+            let player = this.players.find(player_data2 => player_data2.id === player_data)
+            
+            if (player === null)
+            {
+                console.error("error 1000: je ne comprends pas");
+                return;
+            }
+
+            player.pos = player_data.pos;
+        });
+    }
+
+    _update_ball(data)
+    {
+        this.ball.position_x = data.position_x;
+        this.ball.position_y = data.position_y;
+        this.ball.velocity_x = data.velocity_x;
+        this.ball.velocity_y = data.velocity_y; 
+    }
+
+    _update(data)
+    {
+        if (data.detail === "update_paddles")
+            this._update_paddles(data);
+        else if (data.detail === "update_ball")
+            this._
+    }
+
+    join()
+    {
+        if (this.started !== true || this.finished === true)
+        {
+            console.error("The Game is not currently ongoing.");
+            return;
+        }
+
+        let url = `${window.location.protocol[4] === 's' ? 'wss' : 'ws'}://${window.location.host}/ws/games/${this.id}`;
+
+        this._socket = WebSocket(url);
+
+        this._socket.onmessage = (event) => {
+			const data = JSON.parse(event.data);
+			this._update(data);
+		};
+    }
+
+    leave()
+    {
+        this._socket.close();
+        this._socket = undefined;
+    }
 }
 
 export { Game }

frontend/static/js/api/game/MyPlayer.js

@@ -0,0 +1,7 @@
+import { Player } from "./Player";
+
+
+class MyPlayer extends Player
+{
+    
+}

frontend/static/js/api/game/Player.js

@@ -0,0 +1,12 @@
+
+class Player
+{
+    constructor(id, pos, nb_goal)
+    {
+        this.id = id;
+        this.pos = pos;
+        this.nb_goal = nb_goal;
+    }
+}
+
+export { Player }