@@ -34,17 +41,19 @@
W
down:
S
-
- You are red. Your goal is to bounce the ball back to the
- adversary.
-
- local games keys for the left paddle:
+
+ You are red.
+
+ Your goal is to bounce the ball back to the adversary.
+
+ local games keys for the left paddle:
+
up:
O
down:
L
-
+
@@ -56,4 +65,4 @@
-
\ No newline at end of file
+
diff --git a/frontend/src/pages/pong/pong.ts b/frontend/src/pages/pong/pong.ts
index 99e31f4..60a9aab 100644
--- a/frontend/src/pages/pong/pong.ts
+++ b/frontend/src/pages/pong/pong.ts
@@ -42,6 +42,14 @@ enum TourBtnState {
AbeToProcreate = "He would be proud",
}
+enum TourInfoState {
+ Running = "🟢",
+ Owner = "👑",
+ Registered = "✅",
+ NotRegisted = "❌",
+ NoTournament = "⚪️",
+}
+
document.addEventListener("ft:pageChange", (newUrl) => {
if (
newUrl.detail.startsWith("/app/pong") ||
@@ -105,6 +113,8 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
document.querySelector("#pong-end-screen");
const tournamentBtn =
document.querySelector("#TourBtn");
+ const tour_infos =
+ document.querySelector("#tour-info");
let socket = getSocket();
@@ -126,7 +136,8 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
!LocalGameBtn ||
!rdy_btn ||
!end_scr ||
- !tournamentBtn
+ !tournamentBtn ||
+ !tour_infos
)
// sanity check
return showError("fatal error");
@@ -137,7 +148,7 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
switch (tournamentBtn.innerText) {
case TourBtnState.AbleToStart:
- //socket.emit('')
+ socket.emit('tourStart')
break;
case TourBtnState.AbleToJoin:
socket.emit("tourRegister");
@@ -152,8 +163,6 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
socket.emit("tourUnregister");
break;
case TourBtnState.Started:
- showInfo("tournament Started");
- //socket.emit("tourStart");
break;
}
});
@@ -264,6 +273,10 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
socket.on("gameUpdate", (state: GameUpdate) => {
render(state);
});
+
+ socket.on("tourEnding", (ending) => {
+ showInfo(ending);
+ })
// ---
// position logic (client) end
// ---
@@ -405,19 +418,23 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
if (s === null) {
tournamentBtn.innerText = TourBtnState.AbleToCreate;
// create tournament
+ tour_infos.innerText = `${TourInfoState.NoTournament} 0👤 0▮•▮`;
return;
}
let weIn = s.players.some((p) => p.id === user.id);
let imOwner = s.ownerId === user.id;
+ // TODO: fix this so the number of remaining games are correct
switch (s.state) {
case "ended":
tournamentBtn.innerText = TourBtnState.AbleToCreate;
break;
case "playing":
tournamentBtn.innerText = TourBtnState.Started;
+ tour_infos.innerText = `${TourInfoState.Running} ${s.players.length}👤 ?▮•▮`;
break;
case "prestart":
+ tour_infos.innerText = `${imOwner ? TourInfoState.Owner : (weIn ? TourInfoState.Registered : TourInfoState.NotRegisted)} ${s.players.length}👤 ?▮•▮`;
if (imOwner) {
tournamentBtn.innerText = TourBtnState.AbleToStart;
} else {
@@ -427,8 +444,6 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
}
break;
}
-
- console.log(s.players);
});
socket.on("tournamentRegister", ({ kind, msg }) => {
diff --git a/frontend/src/pages/pong/socket.ts b/frontend/src/pages/pong/socket.ts
index f0e1638..13dc8b6 100644
--- a/frontend/src/pages/pong/socket.ts
+++ b/frontend/src/pages/pong/socket.ts
@@ -32,7 +32,7 @@ export type GameMove = {
export type TourInfo = {
ownerId: string;
- state: 'prestart' | 'playing' | 'ended';
+ state: 'prestart' | 'playing' | 'ended' | 'canceled';
players: { id: string; name: string; score: number }[];
currentGameInfo: GameUpdate | null;
};
@@ -42,17 +42,19 @@ export interface ClientToServer {
dequeue: () => void;
readyUp: () => void;
readyDown: () => void;
- debugInfo: () => void;
gameMove: (up: GameMove) => void;
connectedToGame: (gameId: string) => void;
localGame: () => void;
+ hello: () => void;
+
// TOURNAMENT
tourRegister: () => void;
tourUnregister: () => void;
tourCreate: () => void;
+ tourStart: () => void;
}
export interface ServerToClient {
@@ -74,6 +76,8 @@ export interface ServerToClient {
msg?: string;
}) => void;
tournamentInfo: (info: TourInfo | null) => void;
+
+ tourEnding: (msg: string) => void;
}
export type SSocket = Socket;
diff --git a/src/pong/src/socket.ts b/src/pong/src/socket.ts
index be065b1..78cc1e9 100644
--- a/src/pong/src/socket.ts
+++ b/src/pong/src/socket.ts
@@ -32,7 +32,7 @@ export type GameMove = {
export type TourInfo = {
ownerId: string;
- state: 'prestart' | 'playing' | 'ended';
+ state: 'prestart' | 'playing' | 'ended' | 'canceled';
players: { id: string; name: string; score: number }[];
currentGameInfo: GameUpdate | null;
};
@@ -42,18 +42,19 @@ export interface ClientToServer {
dequeue: () => void;
readyUp: () => void;
readyDown: () => void;
- debugInfo: () => void;
gameMove: (up: GameMove) => void;
connectedToGame: (gameId: string) => void;
localGame: () => void;
+ hello: () => void;
+
// TOURNAMENT
tourRegister: () => void;
tourUnregister: () => void;
tourCreate: () => void;
- // tourStart: () => void;
+ tourStart: () => void;
}
export interface ServerToClient {
@@ -75,6 +76,8 @@ export interface ServerToClient {
msg?: string;
}) => void;
tournamentInfo: (info: TourInfo | null) => void;
+
+ tourEnding: (msg: string) => void;
}
export type SSocket = Socket;
diff --git a/src/pong/src/state.ts b/src/pong/src/state.ts
index feffdd7..64db4b5 100644
--- a/src/pong/src/state.ts
+++ b/src/pong/src/state.ts
@@ -13,22 +13,29 @@ type PUser = {
socket: SSocket,
windowId: string,
updateInterval: NodeJS.Timeout,
+ killSelfInterval: NodeJS.Timeout,
+ lastSeen: number,
};
type GameId = PongGameId;
class StateI {
public static readonly UPDATE_INTERVAL_FRAMES: number = 60;
+ public static readonly KEEP_ALIVE_MS: number = 30 * 1000;
+ public static readonly START_TIMER_TOURNAMENT: number = 60 * 2 * 1000;
private users: Map = new Map();
private queue: Set = new Set();
private queueInterval: NodeJS.Timeout;
+ private tournamentInterval: NodeJS.Timeout;
private games: Map = new Map();
private tournament: Tournament | null = null;
public constructor(private fastify: FastifyInstance) {
this.queueInterval = setInterval(() => this.queuerFunction());
+ this.tournamentInterval = setInterval(() => this.tournamentIntervalFunc());
void this.queueInterval;
+ void this.tournamentInterval;
}
private static getGameUpdateData(id: GameId, g: Pong): GameUpdate {
@@ -49,7 +56,7 @@ class StateI {
sock.emit('tournamentRegister', { kind: 'failure', msg: 'No tournament exists' });
return;
}
- if (this.tournament.started) {
+ if (this.tournament.state !== 'prestart') {
sock.emit('tournamentRegister', { kind: 'failure', msg: 'No tournament already started' });
return;
}
@@ -72,7 +79,7 @@ class StateI {
sock.emit('tournamentRegister', { kind: 'failure', msg: 'No tournament exists' });
return;
}
- if (this.tournament.started) {
+ if (this.tournament.state !== 'prestart') {
sock.emit('tournamentRegister', { kind: 'failure', msg: 'No tournament already started' });
return;
}
@@ -88,25 +95,36 @@ class StateI {
if (this.tournament !== null) {
sock.emit('tournamentCreateMsg', { kind: 'failure', msg: 'A tournament already exists' });
- return ;
+ return;
}
this.tournament = new Tournament(user.id);
this.registerForTournament(sock, null);
+ this.tournament.startTimeout = setTimeout(() => this.tournament?.start(), StateI.START_TIMER_TOURNAMENT);
}
- private tournamentStart(sock: SSocket) {
+ private cleanupTournament() {
+ if (this.tournament === null) return;
+ // we remove all the games we might have done for the tournament, and voila :D
+ this.tournament.games.keys().forEach((g) => this.games.delete(g));
+
+ this.tournament = null;
+ }
+
+ private startTournament(sock: SSocket) {
if (isNullish(this.tournament)) return;
const user = this.users.get(sock.authUser.id);
if (isNullish(user)) return;
+ if (user.id !== this.tournament.owner) return;
+ clearInterval(this.tournament.startTimeout);
this.tournament.start();
}
- public newPausedGame(suid1 : string, suid2 : string) : GameId | undefined {
+ public newPausedGame(suid1: string, suid2: string): GameId | undefined {
if (!this.users.has(suid1 as UserId) || !this.users.has(suid2 as UserId)) { return (undefined); }
- const uid1 : UserId = suid1 as UserId;
- const uid2 : UserId = suid2 as UserId;
+ const uid1: UserId = suid1 as UserId;
+ const uid2: UserId = suid2 as UserId;
const g = new Pong(uid1, uid2);
g.rdy_timer = -1;
const gameId = newUUID() as unknown as GameId;
@@ -114,8 +132,8 @@ class StateI {
this.games.set(gameId, g);
return (gameId);
}
- public startPausedGame(g_id: PongGameId) : boolean {
- let game : Pong | undefined;
+ public startPausedGame(g_id: PongGameId): boolean {
+ let game: Pong | undefined;
if (!this.games.has(g_id) || (game = this.games.get(g_id)) === undefined) { return (false); }
game.rdy_timer = Date.now();
@@ -143,11 +161,30 @@ class StateI {
this.gameUpdate(g_id, usr1.socket);
this.gameUpdate(g_id, usr2.socket);
}
- if (game.checkWinner() !== null) {this.cleanupGame(g_id, game); }
+ if (game.checkWinner() !== null) { this.cleanupGame(g_id, game); }
}, 1000 / StateI.UPDATE_INTERVAL_FRAMES);
return (true);
}
+ private tournamentIntervalFunc() {
+ const broadcastTourEnding = (msg: string) => {
+ this.users.forEach((u) => { u.socket.emit('tourEnding', msg); });
+ };
+ if (this.tournament) {
+ if (this.tournament.state === 'canceled') {
+ broadcastTourEnding('Tournament was canceled');
+ this.cleanupTournament();
+ }
+ else if (this.tournament.state === 'ended') {
+ broadcastTourEnding('Tournament is finished !');
+ this.cleanupTournament();
+ }
+ else if (this.tournament.state === 'playing') {
+ this.tournament.checkCurrentGame();
+ }
+ }
+ }
+
private queuerFunction(): void {
const values = Array.from(this.queue.values());
shuffle(values);
@@ -246,6 +283,15 @@ class StateI {
game.updateLastSeen(user.id);
}
+ public checkKillSelf(sock: SSocket) {
+ const user = this.users.get(sock.authUser.id);
+ if (isNullish(user)) return;
+
+ if (Date.now() - user.lastSeen < StateI.KEEP_ALIVE_MS) return;
+
+ this.cleanupUser(sock);
+ }
+
public registerUser(socket: SSocket): void {
this.fastify.log.info('Registering new user');
@@ -259,7 +305,9 @@ class StateI {
id: socket.authUser.id,
windowId: socket.id,
updateInterval: setInterval(() => this.updateClient(socket), 100),
+ killSelfInterval: setInterval(() => this.checkKillSelf(socket), 100),
currentGame: null,
+ lastSeen: Date.now(),
});
this.fastify.log.info('Registered new user');
@@ -278,6 +326,7 @@ class StateI {
socket.on('tourUnregister', () => this.unregisterForTournament(socket));
socket.on('tourCreate', () => this.createTournament(socket));
+ socket.on('tourStart', () => this.startTournament(socket));
}
private updateClient(socket: SSocket): void {
@@ -290,7 +339,7 @@ class StateI {
if (this.tournament !== null) {
tourInfo = {
ownerId: this.tournament.owner,
- state: this.tournament.started ? 'playing' : 'prestart',
+ state: this.tournament.state,
players: this.tournament.users.values().toArray(),
currentGameInfo: (() => {
if (this.tournament.currentGame === null) return null;
@@ -307,8 +356,15 @@ class StateI {
if (!this.users.has(socket.authUser.id)) return;
clearInterval(this.users.get(socket.authUser.id)?.updateInterval);
+ clearInterval(this.users.get(socket.authUser.id)?.killSelfInterval);
this.users.delete(socket.authUser.id);
this.queue.delete(socket.authUser.id);
+
+
+ // if the user is in the tournament, and the tournament owner isn't the owner => we remove the user from the tournament !
+ if (this.tournament?.users.has(socket.authUser.id) && this.tournament?.owner !== socket.authUser.id) {
+ this.tournament.removeUser(socket.authUser.id);
+ }
}
private async cleanupGame(gameId: GameId, game: Pong): Promise {
diff --git a/src/pong/src/tour.ts b/src/pong/src/tour.ts
index d2656f7..e63aa8a 100644
--- a/src/pong/src/tour.ts
+++ b/src/pong/src/tour.ts
@@ -10,27 +10,33 @@ type TourUser = {
name: string;
};
+type TournamentState = 'prestart' | 'playing' | 'ended' | 'canceled';
export class Tournament {
public users: Map = new Map();
public currentGame: PongGameId | null = null;
public games: Map = new Map();
- public started: boolean = false;
- public gameUpdate: NodeJS.Timeout | undefined;
+ public state: TournamentState = 'prestart';
+ public startTimeout: NodeJS.Timeout | undefined;
constructor(public owner: UserId) { }
public addUser(id: UserId, name: string) {
- if (this.started) return;
+ if (this.state !== 'prestart') return;
this.users.set(id, { id, name, score: 0 });
}
public removeUser(id: UserId) {
- if (this.started) return;
+ if (this.state !== 'prestart') return;
this.users.delete(id);
}
public start() {
- this.started = true;
+ if (this.state !== 'prestart') return;
+ if (this.users.size < 2) {
+ this.state = 'canceled';
+ return;
+ }
+ this.state = 'playing';
const users = Array.from(this.users.keys());
const comb: [UserId, UserId][] = [];
@@ -48,7 +54,12 @@ export class Tournament {
const g = new Pong(u1, u2);
this.games.set(gameId, g);
+
});
this.currentGame = this.games.keys().next().value ?? null;
}
+
+ public checkCurrentGame() {
+ void 0;
+ }
}