rparodi/ft_transcendence
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

(tic-tac-toe): Erratum, it's the join/leave queue button

Browse source
This commit is contained in:
apetitco 2026-01-07 22:40:48 +01:00 • committed by Maix0
parent ca9b2a7320
commit 92eb73c508
5 changed files with 17 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/pages/ttt/socket.ts
View file

@ -28,8 +28,8 @@ export interface ClientToServer {
gameMove: (up: GameMove) => void; gameMove: (up: GameMove) => void;
keepalive: () => void; keepalive: () => void;
connectedToGame: (gameId: string) => void; connectedToGame: (gameId: string) => void;
// TODO // TODO:
requestNewGame: () => void; joinQueueButton: () => void;
}; };
export interface ServerToClient { export interface ServerToClient {

2
frontend/src/pages/ttt/ttt.html
View file

@ -1,6 +1,6 @@
<div class="displaybox"> <div class="displaybox">
<div id="mainbox" class="mainboxDisplay"> <div id="mainbox" class="mainboxDisplay">
<button id="NewGameBtn" class="btn-style absolute top-4 right-6">New Game</button> <button id="JoinQueueBtn" class="btn-style absolute top-4 right-6">New Game</button>
<h1 class="text-3xl font-bold text-gray-800"> <h1 class="text-3xl font-bold text-gray-800">
Tic-tac-toe Box<span id="t-username"></span> Tic-tac-toe Box<span id="t-username"></span>
</h1><br> </h1><br>

12
frontend/src/pages/ttt/ttt.ts
View file

@ -45,20 +45,20 @@ async function handleTTT(): Promise<RouteHandlerReturn> {
if (user === null) if (user === null)
return; return;
const newGameBtn = document.querySelector<HTMLButtonElement>("#NewGameBtn"); const joinQueueBtn = document.querySelector<HTMLButtonElement>("#JoinQueueBtn");
if (!newGameBtn) { if (!joinQueueBtn) {
return showError('fatal error'); return showError('fatal error');
} }
// TODO // TODO: Join queue button
// When clicking on this button, two scenarios: // When clicking on this button, two scenarios:
// not in a game -> Join queue // not in a game -> Join queue
// In a game -> user clicking on the button loses the game and joins the queue, board is cleaned // In a game -> user clicking on the button loses the game and joins the queue, board is cleaned
// Should I differentiate the scenarios here or inside the requestNewGame function ? // Should I differentiate the scenarios here or inside the requestNewGame function ?
newGameBtn.addEventListener("click", () => { joinQueueBtn.addEventListener("click", () => {
console.log('===== NEW GAME REQUESTED ====='); console.log('===== JOIN QUEUE BUTTON PRESSED =====');
socket.emit("requestNewGame"); socket.emit("joinQueueButton");
}); });
let curGame: CurrentGameInfo | null = null; let curGame: CurrentGameInfo | null = null;

3
src/tic-tac-toe/src/socket.ts
View file

@ -28,7 +28,8 @@ export interface ClientToServer {
gameMove: (up: GameMove) => void; gameMove: (up: GameMove) => void;
keepalive: () => void; keepalive: () => void;
connectedToGame: (gameId: string) => void; connectedToGame: (gameId: string) => void;
requestNewGame: () => void; // TODO:
joinQueueButton: () => void;
}; };
export interface ServerToClient { export interface ServerToClient {

12
src/tic-tac-toe/src/state.ts
View file

@ -48,8 +48,8 @@ export class StateI {
socket.on('enqueue', () => this.enqueueUser(socket)); socket.on('enqueue', () => this.enqueueUser(socket));
socket.on('dequeue', () => this.dequeueUser(socket)); socket.on('dequeue', () => this.dequeueUser(socket));
socket.on('debugInfo', () => this.debugSocket(socket)); socket.on('debugInfo', () => this.debugSocket(socket));
// TODO // TODO:
socket.on('requestNewGame', () => this.requestNewGame(socket)); socket.on('joinQueueButton', () => this.joinQueueButton(socket));
socket.on('gameMove', (e) => this.gameMove(socket, e)); socket.on('gameMove', (e) => this.gameMove(socket, e));
socket.on('keepalive', () => this.keepAlive(socket)); socket.on('keepalive', () => this.keepAlive(socket));
@ -205,11 +205,11 @@ export class StateI {
game?.makeMove(socket.authUser.id, update.index); game?.makeMove(socket.authUser.id, update.index);
} }
// TODO // TODO:
private requestNewGame(socket: SSocket) { private joinQueueButton(socket: SSocket) {
void socket; void socket;
// TODO // TODO:
this.fastify.log.info('===== NEW GAME REQUESTED ====='); this.fastify.log.info('===== JOIN QUEUE BUTTON PRESSED =====');
} }
} }