This commit is contained in:
sepia 2025-07-20 17:44:21 -05:00
parent 2aa8ee78a9
commit 7cbeef6482
6 changed files with 114 additions and 78 deletions

View file

@ -24,13 +24,14 @@ export function renderGameBoardHtml(
const intersectionId = `intersection-${row}-${col}`;
let stoneHtml = '';
if (stone) {
const colorClass = stone === 'black' ? 'stone-black-heart' : 'stone-white-heart';
const colorClass =
stone === 'black' ? 'stone-black-heart' : 'stone-white-heart';
stoneHtml = `<div class="${colorClass}"></div>`;
}
// Calculate top and left for absolute positioning, offset by half the intersection div size
const top = (row * 30);
const left = (col * 30);
const top = row * 30;
const left = col * 30;
// HTMX attributes for making a move
const wsAttrs = isPlayersTurn && !stone ? `ws-send="click"` : '';

View file

@ -1,8 +1,6 @@
import { ElysiaWS } from 'elysia/dist/ws';
import { GameInstance } from './game/game-instance';
import {
renderGameBoardHtml,
} from './view/board-renderer';
import { renderGameBoardHtml } from './view/board-renderer';
interface MakeMoveMessage {
gameId: string;
@ -108,7 +106,9 @@ export class WebSocketHandler {
}
this.connections.set(
gameId,
connectionsInGame.filter((conn) => conn.data.query.playerId !== ws.data.query.playerId),
connectionsInGame.filter(
(conn) => conn.data.query.playerId !== ws.data.query.playerId,
),
);
if (this.connections.get(gameId)?.length === 0) {
this.connections.delete(gameId);
@ -186,35 +186,43 @@ export class WebSocketHandler {
private sendTitleBox(targetWs: WS, message: string): void {
targetWs.send('<div id="title-box">' + message + '</div>');
}
private sendTitleBoxesForGame(gameId: string): void {
const game = this.games.get(gameId);
if (!game) {
console.error(`Tried to send title boxes for game ${gameId}, but it doesn't exist!`)
console.error(
`Tried to send title boxes for game ${gameId}, but it doesn't exist!`,
);
return;
}
const connections = this.connections.get(gameId);
if (!connections) {
console.log(`Attempted to send title boxes for game ${gameId}, but no players are connected.`)
console.log(
`Attempted to send title boxes for game ${gameId}, but no players are connected.`,
);
return;
}
var message = "";
var message = '';
switch (game.status) {
case 'waiting': {
message = "Waiting for players...";
message = 'Waiting for players...';
break;
}
case 'playing': {
const blackTag = game.players.black ? this.playerTag(gameId, game.players.black) : 'Unknown';
const whiteTag = game.players.white ? this.playerTag(gameId, game.players.white) : 'Unknown';
const blackTag = game.players.black
? this.playerTag(gameId, game.players.black)
: 'Unknown';
const whiteTag = game.players.white
? this.playerTag(gameId, game.players.white)
: 'Unknown';
message = `${blackTag} vs ${whiteTag}`;
break;
}
case 'finished': {
switch (game.winner) {
case 'draw': {
message = "Game ended in draw.";
message = 'Game ended in draw.';
break;
}
case 'black': {
@ -229,12 +237,14 @@ export class WebSocketHandler {
break;
}
}
connections.forEach((connection) => {this.sendTitleBox(connection, message)});
connections.forEach((connection) => {
this.sendTitleBox(connection, message);
});
}
private playerTag(gameId: string, playerId: string) {
var connectionIcon = `<img src="/icons/disconnected.svg" alt="Disconnected" class="icon" />`
var connectionIcon = `<img src="/icons/disconnected.svg" alt="Disconnected" class="icon" />`;
const connections = this.connections.get(gameId);
if (connections) {
connections.forEach((ws) => {
@ -244,7 +254,7 @@ export class WebSocketHandler {
}
});
}
return `<span>${playerId}${connectionIcon}</span>`
return `<span>${playerId}${connectionIcon}</span>`;
}
public getGame(gameId: string): GameInstance | undefined {