authoritative server OK

+ TODO actual matchmaking

src/client/ws.ts

@@ -1,9 +1,10 @@
 
 import {pong, gc} from "./global.js"
 import * as ev from "../shared_js/class/Event.js"
-import {matchmaking, matchmakingComplete} from "./pong.js";
+import {matchmaking, matchmakingComplete, startGame} from "./pong.js";
 import * as en from "../shared_js/enums.js"
 import { Racket } from "../shared_js/class/Rectangle.js";
+import { sleep } from "./utils.js";
 
 const wsPort = 8042;
 const wsUrl = "ws://" + document.location.hostname + ":" + wsPort + "/pong";
@@ -45,11 +46,14 @@ function preMatchListener(this: WebSocket, event: MessageEvent) {
 			else if (clientInfo.side === en.PlayerSide.right) {
 				clientInfo.racket = gc.playerRight;
 			}
-			socket.removeEventListener("message", preMatchListener);
-			socket.addEventListener("message", inGameListener);
 			socket.send(JSON.stringify( new ev.ClientEvent(en.EventTypes.clientPlayerReady) ));
 			matchmakingComplete();
 			break;
+		case en.EventTypes.matchStart:
+			socket.removeEventListener("message", preMatchListener);
+			socket.addEventListener("message", inGameListener);
+			startGame();
+			break;
 	}
 }
 
@@ -59,23 +63,43 @@ function inGameListener(event: MessageEvent)
 	switch (data.type) {
 		case en.EventTypes.gameUpdate:
 			console.log("gameUpdate");
-			serverGameUpdate(data as ev.EventGameUpdate);
+			gameUpdate(data as ev.EventGameUpdate);
 			break;
-		case en.EventTypes.matchNewRound:
-			console.log("matchNewRound//WIP");
+		case en.EventTypes.scoreUpdate:
+			console.log("scoreUpdate");
+			scoreUpdate(data as ev.EventScoreUpdate);
+			break;
+		case en.EventTypes.matchEnd:
+			console.log("matchEnd");
+			matchEnd(data as ev.EventMatchEnd);
 			break;
 	}
 }
 
-function serverGameUpdate(data: ev.EventGameUpdate)
+async function gameUpdate(data: ev.EventGameUpdate)
 {
-	gc.playerLeft.clear();
+	// await sleep(1000); // artificial latency for testing purpose
 	gc.playerLeft.pos.y = Math.floor(data.playerLeft.y);
-	gc.playerLeft.update();
-	
-	gc.playerRight.clear();
 	gc.playerRight.pos.y = Math.floor(data.playerRight.y);
-	gc.playerRight.update();
+	gc.ball.pos.x = Math.floor(data.ball.x);
+	gc.ball.pos.y = Math.floor(data.ball.y);
+	gc.ball.speed = Math.floor(data.ball.speed);
+}
+
+function scoreUpdate(data: ev.EventScoreUpdate)
+{
+	gc.scoreLeft.value = data.scoreLeft;
+	gc.scoreRight.value = data.scoreRight;
+}
+
+function matchEnd(data: ev.EventMatchEnd)
+{
+	if (data.winner === clientInfo.side) {
+		alert("WIN"); // placeholder TODO draw
+	}
+	else {
+		alert("LOSE"); // placeholder TODO draw
+	}
 }
 
 export {socket}