From 43f2dd85c494179a94f1fe1d9d0dfeb5cf6cb650 Mon Sep 17 00:00:00 2001 From: LuckyLaszlo Date: Thu, 22 Dec 2022 17:40:14 +0100 Subject: [PATCH] init pong refactoring for spectator mode + pongSpectator.ts should be good + EventError wip, not tested --- .../game_back/src/server/wsServer.ts | 16 ++++--- .../game_back/src/shared_js/class/Event.ts | 9 +++- .../game_back/src/shared_js/enums.ts | 1 + .../api_front/src/pages/game/Game.svelte | 17 +++---- .../pages/game/client/class/InitOptions.ts | 10 ++++ .../api_front/src/pages/game/client/init.ts | 48 +++++++++++++++++++ .../src/pages/game/client/message.ts | 14 +++++- .../api_front/src/pages/game/client/pong.ts | 45 ++++------------- .../src/pages/game/client/pongSpectator.ts | 36 ++++++-------- .../api_front/src/pages/game/client/ws.ts | 10 ++++ .../src/pages/game/shared_js/class/Event.ts | 9 +++- .../src/pages/game/shared_js/enums.ts | 1 + 12 files changed, 136 insertions(+), 80 deletions(-) create mode 100644 srcs/requirements/svelte/api_front/src/pages/game/client/class/InitOptions.ts create mode 100644 srcs/requirements/svelte/api_front/src/pages/game/client/init.ts diff --git a/srcs/requirements/game_server/game_back/src/server/wsServer.ts b/srcs/requirements/game_server/game_back/src/server/wsServer.ts index ece2c0e3..d28fcff9 100644 --- a/srcs/requirements/game_server/game_back/src/server/wsServer.ts +++ b/srcs/requirements/game_server/game_back/src/server/wsServer.ts @@ -88,7 +88,7 @@ async function clientAnnounceListener(this: WebSocket, data: string) }); if (!response.ok) { - // send message to client ? or just gtfo ? + this.send(JSON.stringify( new ev.EventError((await response.json()).message))); clientTerminate(clientsMap.get(this.id)); return; } @@ -111,7 +111,7 @@ async function clientAnnounceListener(this: WebSocket, data: string) const announce: ev.ClientAnnounceSpectator = msg; const gameSession = gameSessionsMap.get(announce.gameSessionId); if (!gameSession) { - // WIP: send "invalid game session" + this.send(JSON.stringify( new ev.EventError("invalid gameSessionId"))); clientTerminate(clientsMap.get(this.id)); return; } @@ -187,13 +187,15 @@ function privateMatchmaking(player: ClientPlayer) }); createGameSession(compatiblePlayers, matchOptions); } - else { + else + { setTimeout(async function abortMatch() { if (!player.gameSession) { - // TODO: informe le back de l'invalidité du token d'invitation - player.socket.send(JSON.stringify( new ev.EventMatchAbort() )); - const responseTobakc = await fetch(c.addressBackEnd + "/game/gameserver/destroysession",{ + if (player.socket.OPEN) { + player.socket.send(JSON.stringify( new ev.EventMatchAbort() )); + } + const response = await fetch(c.addressBackEnd + "/game/gameserver/destroysession",{ method: "POST", headers : {"Content-Type": "application/json"}, body : JSON.stringify({ @@ -201,7 +203,7 @@ function privateMatchmaking(player: ClientPlayer) }) }) .then(x => x.json()) - .catch(error => console.log("ERROR : " + error)) + .catch(error => console.log("ERROR : " + error)); clientTerminate(player); } }, 60000); diff --git a/srcs/requirements/game_server/game_back/src/shared_js/class/Event.ts b/srcs/requirements/game_server/game_back/src/shared_js/class/Event.ts index 28b3576b..0147ead8 100644 --- a/srcs/requirements/game_server/game_back/src/shared_js/class/Event.ts +++ b/srcs/requirements/game_server/game_back/src/shared_js/class/Event.ts @@ -72,12 +72,19 @@ export class EventMatchEnd extends ServerEvent { } export class EventMatchAbort extends ServerEvent { - constructor() { super(en.EventTypes.matchAbort); } } +export class EventError extends ServerEvent { + message: string; + constructor(message: string) { + super(en.EventTypes.error); + this.message = message; + } +} + /* From Client */ export class ClientEvent { diff --git a/srcs/requirements/game_server/game_back/src/shared_js/enums.ts b/srcs/requirements/game_server/game_back/src/shared_js/enums.ts index 108f3a66..b86571e5 100644 --- a/srcs/requirements/game_server/game_back/src/shared_js/enums.ts +++ b/srcs/requirements/game_server/game_back/src/shared_js/enums.ts @@ -6,6 +6,7 @@ export enum EventTypes { matchEnd, assignId, matchmakingComplete, + error, // Generic matchmakingInProgress, diff --git a/srcs/requirements/svelte/api_front/src/pages/game/Game.svelte b/srcs/requirements/svelte/api_front/src/pages/game/Game.svelte index 7bbef38f..f689bea8 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/Game.svelte +++ b/srcs/requirements/svelte/api_front/src/pages/game/Game.svelte @@ -7,6 +7,8 @@ import * as enumeration from './shared_js/enums'; import * as pong from "./client/pong" import * as pongSpectator from "./client/pongSpectator" // TODO init spectator + + // Pour Chérif: variables indiquant l'état du match import { matchEnded, matchAbort } from "./client/ws"; //user's stuff @@ -43,7 +45,6 @@ }) onDestroy( async() => { - // TODO: destroy() in pong pong.destroy(); }) @@ -52,13 +53,8 @@ optionsAreNotSet = false; showWaitPage = true; - let matchOptions = enumeration.MatchOptions.noOption; - if (options.multi_balls === true) { - matchOptions |= enumeration.MatchOptions.multiBalls - } - if (options.moving_walls === true) { - matchOptions |= enumeration.MatchOptions.movingWalls - } + const matchOptions = pong.computeMatchOptions(options); + const responseWhenGrantToken = fetch("http://transcendance:8080/api/v2/game/ticket", { method : "POST", headers : {'Content-Type': 'application/json'}, @@ -72,7 +68,7 @@ const responseFromServer = await responseWhenGrantToken; const responseInjson = await responseFromServer.json(); const token : string = responseInjson.token; - showWaitPage = false + showWaitPage = false; if (!responseFromServer.ok) { errorMessageWhenAttemptingToGetATicket = responseInjson.message; @@ -82,8 +78,7 @@ showWaitPage = false optionsAreNotSet = true options.playerTwoUsername = ""; - matchOptions = enumeration.MatchOptions.noOption; - }, 5000) + }, 5000); } else if (token) { diff --git a/srcs/requirements/svelte/api_front/src/pages/game/client/class/InitOptions.ts b/srcs/requirements/svelte/api_front/src/pages/game/client/class/InitOptions.ts new file mode 100644 index 00000000..acefe9c8 --- /dev/null +++ b/srcs/requirements/svelte/api_front/src/pages/game/client/class/InitOptions.ts @@ -0,0 +1,10 @@ + +export class InitOptions { + sound = "off"; + multi_balls = false; + moving_walls = false; + isSomeoneIsInvited = false; + isInvitedPerson = false; + playerOneUsername = ""; + playerTwoUsername = ""; +} diff --git a/srcs/requirements/svelte/api_front/src/pages/game/client/init.ts b/srcs/requirements/svelte/api_front/src/pages/game/client/init.ts new file mode 100644 index 00000000..51427255 --- /dev/null +++ b/srcs/requirements/svelte/api_front/src/pages/game/client/init.ts @@ -0,0 +1,48 @@ + +import * as c from "./constants.js" +import * as en from "../shared_js/enums.js" +import { GameArea } from "./class/GameArea.js"; +import { GameComponentsClient } from "./class/GameComponentsClient.js"; +import { socket } from "./ws.js"; +import { initAudio } from "./audio.js"; +import type { InitOptions } from "./class/InitOptions.js"; + +import { pong } from "./global.js" +import { initPong, initGc, initMatchOptions } from "./global.js" + +export function computeMatchOptions(options: InitOptions) +{ + let matchOptions = en.MatchOptions.noOption; + + if (options.multi_balls === true) { + matchOptions |= en.MatchOptions.multiBalls + } + if (options.moving_walls === true) { + matchOptions |= en.MatchOptions.movingWalls + } + + return matchOptions; +} + +export function initBase(options: InitOptions, gameAreaId: string) +{ + const matchOptions = computeMatchOptions(options); + initMatchOptions(matchOptions); + initAudio(options.sound); + initPong(new GameArea(gameAreaId)); + initGc(new GameComponentsClient(matchOptions, pong.ctx)); +} + +export function destroyBase() +{ + if (pong) + { + clearInterval(pong.handleInputInterval); + clearInterval(pong.gameLoopInterval); + clearInterval(pong.drawLoopInterval); + initPong(null); + } + if (socket && socket.OPEN) { + socket.close(); + } +} diff --git a/srcs/requirements/svelte/api_front/src/pages/game/client/message.ts b/srcs/requirements/svelte/api_front/src/pages/game/client/message.ts index 5c1cdc15..c626543b 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/client/message.ts +++ b/srcs/requirements/svelte/api_front/src/pages/game/client/message.ts @@ -1,11 +1,23 @@ import * as c from "./constants.js" -import { gc } from "./global.js" +import { gc, pong } from "./global.js" import * as en from "../shared_js/enums.js" /* before game */ +export function error(message: string) +{ + console.log("msg.error()"); + pong.clear(); + const text = "error: " + message; + console.log(text); + gc.text2.clear(); + gc.text2.pos.assign(c.w*0.2, c.h*0.5); + gc.text2.text = text; + gc.text2.update(); +} + export function matchmaking() { const text = "searching..."; diff --git a/srcs/requirements/svelte/api_front/src/pages/game/client/pong.ts b/srcs/requirements/svelte/api_front/src/pages/game/client/pong.ts index 124b6b87..b2cb2b30 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/client/pong.ts +++ b/srcs/requirements/svelte/api_front/src/pages/game/client/pong.ts @@ -1,48 +1,26 @@ import * as c from "./constants.js" -import * as en from "../shared_js/enums.js" -import { GameArea } from "./class/GameArea.js"; -import { GameComponentsClient } from "./class/GameComponentsClient.js"; import { handleInput } from "./handleInput.js"; -// import { sendLoop } from "./handleInput.js"; import { gameLoop } from "./gameLoop.js" import { drawLoop } from "./draw.js"; import { countdown } from "./utils.js"; import { initWebSocket } from "./ws.js"; -import { initAudio } from "./audio.js"; - +import type { InitOptions } from "./class/InitOptions.js"; +export { InitOptions } from "./class/InitOptions.js"; +import { initBase, destroyBase, computeMatchOptions } from "./init.js"; +export { computeMatchOptions } from "./init.js"; /* TODO: A way to delay the init of variables, but still use "const" not "let" ? */ import { pong, gc } from "./global.js" -import { initPong, initGc, initMatchOptions, initStartFunction } from "./global.js" +import { initStartFunction } from "./global.js" -export class InitOptions { - sound = "off"; - multi_balls = false; - moving_walls = false; - isSomeoneIsInvited = false; - isInvitedPerson = false; - playerOneUsername = ""; - playerTwoUsername = ""; -} export function init(options: InitOptions, gameAreaId: string, token: string) { - let matchOptions = en.MatchOptions.noOption; - if (options.multi_balls === true) { - matchOptions |= en.MatchOptions.multiBalls - } - if (options.moving_walls === true) { - matchOptions |= en.MatchOptions.movingWalls - } + initBase(options, gameAreaId); - initMatchOptions(matchOptions); - initAudio(options.sound); - - initPong(new GameArea(gameAreaId)); - initGc(new GameComponentsClient(matchOptions, pong.ctx)); initStartFunction(start); - + const matchOptions = computeMatchOptions(options); if (options.isSomeoneIsInvited) { initWebSocket(matchOptions, token, options.playerOneUsername, true, options.playerTwoUsername, options.isInvitedPerson); } @@ -53,14 +31,7 @@ export function init(options: InitOptions, gameAreaId: string, token: string) export function destroy() { - // TODO - if (pong) - { - clearInterval(pong.handleInputInterval); - clearInterval(pong.gameLoopInterval); - clearInterval(pong.drawLoopInterval); - initPong(null); - } + destroyBase(); } function start() diff --git a/srcs/requirements/svelte/api_front/src/pages/game/client/pongSpectator.ts b/srcs/requirements/svelte/api_front/src/pages/game/client/pongSpectator.ts index 4efb9a19..9c4dcc34 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/client/pongSpectator.ts +++ b/srcs/requirements/svelte/api_front/src/pages/game/client/pongSpectator.ts @@ -1,37 +1,29 @@ -initSpectator(); -function initSpectator() { - // Wip - init(); -} - import * as c from "./constants.js" -import * as en from "../shared_js/enums.js" -import { GameArea } from "./class/GameArea.js"; -import { GameComponentsClient } from "./class/GameComponentsClient.js"; import { gameLoopSpectator } from "./gameLoop.js" import { drawLoop } from "./draw.js"; import { initWebSocketSpectator } from "./ws.js"; -import { initAudio } from "./audio.js"; - +import type { InitOptions } from "./class/InitOptions.js"; +export { InitOptions } from "./class/InitOptions.js"; +import { initBase, destroyBase, computeMatchOptions } from "./init.js"; +export { computeMatchOptions } from "./init.js"; /* TODO: A way to delay the init of variables, but still use "const" not "let" ? */ import { pong, gc } from "./global.js" -import { initPong, initGc, initMatchOptions, initStartFunction } from "./global.js" +import { initStartFunction } from "./global.js" -function init() + +export function init(options: InitOptions, gameAreaId: string, gameSessionId: string) { - initAudio(false); + initBase(options, gameAreaId); - // WIP matchOptions - let matchOptions: en.MatchOptions = en.MatchOptions.noOption; - initMatchOptions(matchOptions); - - - initPong(new GameArea()); - initGc(new GameComponentsClient(matchOptions, pong.ctx)); initStartFunction(start); - initWebSocketSpectator(c.gameSessionIdPLACEHOLDER); + initWebSocketSpectator(gameSessionId); +} + +export function destroy() +{ + destroyBase(); } function start() diff --git a/srcs/requirements/svelte/api_front/src/pages/game/client/ws.ts b/srcs/requirements/svelte/api_front/src/pages/game/client/ws.ts index 728778ff..fefb64d1 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/client/ws.ts +++ b/srcs/requirements/svelte/api_front/src/pages/game/client/ws.ts @@ -48,6 +48,7 @@ export function initWebSocket(options: en.MatchOptions, token: string, username: } }); // socket.addEventListener("message", logListener); // for testing purpose + socket.addEventListener("message", errorListener); socket.addEventListener("message", preMatchListener); } @@ -55,6 +56,15 @@ function logListener(this: WebSocket, event: MessageEvent) { console.log("%i: " + event.data, Date.now()); } +function errorListener(this: WebSocket, event: MessageEvent) { + console.log("errorListener"); + const data: ev.ServerEvent = JSON.parse(event.data); + if (data.type === en.EventTypes.error) { + console.log("actual Error"); + msg.error((data as ev.EventError).message); + } +} + function preMatchListener(this: WebSocket, event: MessageEvent) { const data: ev.ServerEvent = JSON.parse(event.data); diff --git a/srcs/requirements/svelte/api_front/src/pages/game/shared_js/class/Event.ts b/srcs/requirements/svelte/api_front/src/pages/game/shared_js/class/Event.ts index 28b3576b..0147ead8 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/shared_js/class/Event.ts +++ b/srcs/requirements/svelte/api_front/src/pages/game/shared_js/class/Event.ts @@ -72,12 +72,19 @@ export class EventMatchEnd extends ServerEvent { } export class EventMatchAbort extends ServerEvent { - constructor() { super(en.EventTypes.matchAbort); } } +export class EventError extends ServerEvent { + message: string; + constructor(message: string) { + super(en.EventTypes.error); + this.message = message; + } +} + /* From Client */ export class ClientEvent { diff --git a/srcs/requirements/svelte/api_front/src/pages/game/shared_js/enums.ts b/srcs/requirements/svelte/api_front/src/pages/game/shared_js/enums.ts index 108f3a66..b86571e5 100644 --- a/srcs/requirements/svelte/api_front/src/pages/game/shared_js/enums.ts +++ b/srcs/requirements/svelte/api_front/src/pages/game/shared_js/enums.ts @@ -6,6 +6,7 @@ export enum EventTypes { matchEnd, assignId, matchmakingComplete, + error, // Generic matchmakingInProgress,