thib8956/tic-tac-toe-ws
1
0
Fork 0
mirror of https://github.com/thib8956/tic-tac-toe-ws.git synced 2025-01-12 04:41:06 +00:00
Code

fix endgame condition

Browse Source
This commit is contained in:
Thibaud Gasser 2024-09-25 11:58:56 +02:00
parent 8333df9580
commit f56fc0a65c
3 changed files with 89 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
client.mts
View File

@ -22,11 +22,11 @@ interface Shape {
time: number; time: number;
} }
let grid = [0, 0, 0, 0, 0, 0, 0, 0, 0] let grid = [0, 0, 0, 0, 0, 0, 0, 0, 0];
let circle = true;
let pendingEvts: Point[] = []; let pendingEvts: Point[] = [];
let shapes: Shape[] = []; let shapes: Shape[] = [];
let myId: number | null = null; let myId: number | null = null;
let mySymbol: "x" | "o" | null = null;
let canvasMsg: string = "Offline"; let canvasMsg: string = "Offline";
function drawGridBackground(ctx: CanvasRenderingContext2D, origin: Point) { function drawGridBackground(ctx: CanvasRenderingContext2D, origin: Point) {
@ -105,18 +105,17 @@ function updateGridState(ctx: CanvasRenderingContext2D, gridOrigin: Point) {
for (let x = 0; x < 3; ++x) { for (let x = 0; x < 3; ++x) {
switch (grid[y*3+x]) { switch (grid[y*3+x]) {
case 0: break; case 0: break;
case 1: { case myId: {
const p = gridIndexToCoords(gridOrigin, x, y); const p = gridIndexToCoords(gridOrigin, x, y);
drawCircle(ctx, p); mySymbol == "o" ? drawCircle(ctx, p) : drawCross(ctx, p);
break; break;
} }
case 2: { default: {
const p = gridIndexToCoords(gridOrigin, x, y); const p = gridIndexToCoords(gridOrigin, x, y);
drawCross(ctx, p); mySymbol == "o" ? drawCross(ctx, p) : drawCircle(ctx, p);
break; break;
} }
default: throw new Error(`unhandled grid state ${grid[y*3+x]}`);
} }
} }
} }
@ -165,7 +164,8 @@ function init() {
switch (msg.kind) { switch (msg.kind) {
case "hello": { case "hello": {
myId = (msg.data as Hello).id; myId = (msg.data as Hello).id;
canvasMsg = `connected to server with id ${myId}`; mySymbol = (msg.data as Hello).symbol;
canvasMsg = `connected to server with id ${myId}, ${mySymbol}`;
console.log(canvasMsg); console.log(canvasMsg);
break; break;
} }

3
common.mts
View File

@ -15,7 +15,8 @@ export interface Response {
} }
export interface Hello { export interface Hello {
id: number id: number,
symbol: "x" | "o"
} }
export interface EndGame { export interface EndGame {

18
server.mts
View File

@ -1,5 +1,5 @@
import { Message, Response, Hello, EndGame } from "common.mjs" import { Message, Response, Hello, EndGame } from "common.mjs"
import { WebSocket, WebSocketServer } from "ws"; import { WebSocket, WebSocketServer, MessageEvent } from "ws";
const port = 1234 const port = 1234
const wss = new WebSocketServer({ port }); const wss = new WebSocketServer({ port });
@ -28,27 +28,31 @@ wss.on("connection", (ws) => {
} }
const symbol = clients.length == 0 ? "o" : "x"; const symbol = clients.length == 0 ? "o" : "x";
const helloMsg: Message = {
kind: "hello",
data: { id, symbol } as Hello
}
clients.push({id, ws, symbol}); clients.push({id, ws, symbol});
ws.send(JSON.stringify({kind: "hello", data: { id } as Hello})); ws.send(JSON.stringify(helloMsg));
console.log(`player #${id} connected`); console.log(`player #${id} connected`);
ws.addEventListener("message", (event: any) => { ws.addEventListener("message", (event: MessageEvent) => {
const message = JSON.parse(event.data); const message = JSON.parse(event.data as string);
const {x, y} = message; const {x, y} = message;
const player = clients.find(x => x.ws === ws); const player = clients.find(x => x.ws === ws);
console.assert(player !== undefined); if (!player) throw new Error("player not found");
console.log(message, player!.id, currentPlayer?.id); console.log(message, player!.id, currentPlayer?.id);
if (!currentPlayer) { if (!currentPlayer) {
currentPlayer = player; currentPlayer = player;
} }
if (clients.length < 2 || player!.id != currentPlayer?.id || endGame) { if (clients.length < 2 || player.id != currentPlayer?.id || endGame) {
return; return;
} }
if (grid[y*3+x] === 0) { if (grid[y*3+x] === 0) {
grid[y*3+x] = player!.symbol == "o" ? 1 : 2; grid[y*3+x] = player.id;
for (const c of clients) { for (const c of clients) {
const msg: Message = { const msg: Message = {
kind: "update", kind: "update",