WIP token identification

This commit is contained in:
LuckyLaszlo
2022-12-19 21:48:16 +01:00
parent 674eff0d6d
commit c29db6d5f3
7 changed files with 58 additions and 142 deletions

View File

@@ -244,7 +244,6 @@ export class GameSession {
id: this.id, id: this.id,
scoreLeft: gc.scoreLeft, scoreLeft: gc.scoreLeft,
scoreRight: gc.scoreRight, scoreRight: gc.scoreRight,
isPrivateMatch: this.isPrivateMatch,
}) })
}); */ }); */

View File

@@ -19,7 +19,7 @@ import { gameSessionIdPLACEHOLDER } from "./constants.js";
const wsPort = 8042; const wsPort = 8042;
export const wsServer = new WebSocketServer<WebSocket>({host: "0.0.0.0", port: wsPort, path: "/pong"}); export const wsServer = new WebSocketServer<WebSocket>({host: "0.0.0.0", port: wsPort, path: "/pong"});
const clientsMap: Map<string, Client> = new Map; // socket.id/Client const clientsMap: Map<string, Client> = new Map; // socket.id/Client
const matchmakingPlayersMap: Map<string, ClientPlayer> = new Map; // socket.id/ClientPlayer (duplicates with clientsMap) // TODO: rename in matchmakingMap const matchmakingMap: Map<string, ClientPlayer> = new Map; // socket.id/ClientPlayer (duplicates with clientsMap)
const privateMatchmakingMap: Map<string, ClientPlayer> = new Map; // socket.id/ClientPlayer (duplicates with clientsMap) const privateMatchmakingMap: Map<string, ClientPlayer> = new Map; // socket.id/ClientPlayer (duplicates with clientsMap)
const gameSessionsMap: Map<string, GameSession> = new Map; // GameSession.id(url)/GameSession const gameSessionsMap: Map<string, GameSession> = new Map; // GameSession.id(url)/GameSession
@@ -67,36 +67,38 @@ async function clientAnnounceListener(this: WebSocket, data: string)
{ {
const announce: ev.ClientAnnouncePlayer = <ev.ClientAnnouncePlayer>msg; const announce: ev.ClientAnnouncePlayer = <ev.ClientAnnouncePlayer>msg;
/* // WIP nest, fetch token validation // WIP nest, fetch token validation
const body = {
playerOneUsername: announce.username,
playerTwoUsername: "",
gameOptions: announce.matchOptions,
isGameIsWithInvitation: announce.privateMatch,
token: announce.token,
};
if (announce.privateMatch) {
body.playerTwoUsername = announce.playerTwoUsername;
}
const response = await fetch(c.addressBackEnd + "/game/validateToken", const response = await fetch(c.addressBackEnd + "/game/validateToken",
{ {
method: "POST", method: "POST",
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
}, },
body: JSON.stringify({ body: JSON.stringify(body)
token: announce.token,
username: announce.username,
})
}); });
switch (response.status) if (!response.ok)
{ {
case 200: // send message to client ? or just gtfo ?
case 204: clientTerminate(clientsMap.get(this.id));
break; return;
case 403: }
default:
// send message to client ? or just gtfo ?
clientTerminate(clientsMap.get(this.id));
return;
} */
const player = clientsMap.get(this.id) as ClientPlayer; const player = clientsMap.get(this.id) as ClientPlayer;
player.matchOptions = announce.matchOptions; player.matchOptions = announce.matchOptions;
player.token = announce.token; player.token = announce.token;
player.username = announce.username; player.username = announce.username;
this.send(JSON.stringify( new ev.EventAssignId(this.id) )); this.send(JSON.stringify( new ev.EventAssignId(this.id) )); // unused
this.send(JSON.stringify( new ev.ServerEvent(en.EventTypes.matchmakingInProgress) )); this.send(JSON.stringify( new ev.ServerEvent(en.EventTypes.matchmakingInProgress) ));
if (announce.privateMatch) { if (announce.privateMatch) {
privateMatchmaking(player); privateMatchmaking(player);
@@ -136,11 +138,11 @@ function publicMatchmaking(player: ClientPlayer)
{ {
const minPlayersNumber = 2; const minPlayersNumber = 2;
const maxPlayersNumber = 2; const maxPlayersNumber = 2;
matchmakingPlayersMap.set(player.id, player); matchmakingMap.set(player.id, player);
const matchOptions = player.matchOptions; const matchOptions = player.matchOptions;
const compatiblePlayers: ClientPlayer[] = []; const compatiblePlayers: ClientPlayer[] = [];
for (const [id, client] of matchmakingPlayersMap) for (const [id, client] of matchmakingMap)
{ {
if (client.matchOptions === matchOptions) if (client.matchOptions === matchOptions)
{ {
@@ -153,7 +155,7 @@ function publicMatchmaking(player: ClientPlayer)
if (compatiblePlayers.length >= minPlayersNumber) { if (compatiblePlayers.length >= minPlayersNumber) {
compatiblePlayers.forEach((client) => { compatiblePlayers.forEach((client) => {
matchmakingPlayersMap.delete(client.id); matchmakingMap.delete(client.id);
}); });
createGameSession(compatiblePlayers, matchOptions); createGameSession(compatiblePlayers, matchOptions);
} }
@@ -309,7 +311,8 @@ const pingInterval = setInterval( () => {
} }
console.log("gameSessionMap size: " + gameSessionsMap.size); console.log("gameSessionMap size: " + gameSessionsMap.size);
console.log("clientsMap size: " + clientsMap.size); console.log("clientsMap size: " + clientsMap.size);
console.log("matchmakingPlayersMap size: " + matchmakingPlayersMap.size); console.log("matchmakingMap size: " + matchmakingMap.size);
console.log("privateMatchmakingMap size: " + privateMatchmakingMap.size);
console.log(""); console.log("");
}, 4200); }, 4200);
@@ -329,8 +332,8 @@ function clientTerminate(client: Client)
} }
} }
clientsMap.delete(client.id); clientsMap.delete(client.id);
if (matchmakingPlayersMap.has(client.id)) { if (matchmakingMap.has(client.id)) {
matchmakingPlayersMap.delete(client.id); matchmakingMap.delete(client.id);
} }
else if (privateMatchmakingMap.has(client.id)) { else if (privateMatchmakingMap.has(client.id)) {
privateMatchmakingMap.delete(client.id); privateMatchmakingMap.delete(client.id);

View File

@@ -94,12 +94,16 @@ export class ClientAnnouncePlayer extends ClientAnnounce {
token: string; token: string;
username: string; username: string;
privateMatch: boolean; privateMatch: boolean;
constructor(matchOptions: en.MatchOptions, token: string, username: string, privateMatch: boolean = false) { playerTwoUsername?: string;
constructor(matchOptions: en.MatchOptions, token: string, username: string, privateMatch: boolean = false, playerTwoUsername?: string) {
super(en.ClientRole.player); super(en.ClientRole.player);
this.matchOptions = matchOptions; this.matchOptions = matchOptions;
this.token = token; this.token = token;
this.username = username; this.username = username;
this.privateMatch = privateMatch; this.privateMatch = privateMatch;
if (playerTwoUsername) {
this.playerTwoUsername = playerTwoUsername;
}
} }
} }

View File

@@ -1,106 +0,0 @@
<script lang="ts">
// import { initDom } from "../game/client/pong.js";
import {onMount} from 'svelte';
onMount(() => {
// initDom();
})
</script>
<body>
<div id="div_game_options">
<fieldset>
<legend>game options</legend>
<div>
<input type="checkbox" id="multi_balls" name="multi_balls">
<label for="multi_balls">multiples balls</label>
</div>
<div>
<input type="checkbox" id="moving_walls" name="moving_walls">
<label for="moving_walls">moving walls</label>
</div>
<div>
<label>sound :</label>
<input type="radio" id="sound_on" name="sound_selector" checked>
<label for="sound_on">on</label>
<input type="radio" id="sound_off" name="sound_selector">
<label for="sound_off">off</label>
</div>
<div>
<button id="play_pong_button">PLAY</button>
</div>
</fieldset>
</div>
<div id="div_game_instructions">
<h2>--- keys ---</h2>
<p>move up: 'w' or 'up arrow'</p>
<p>move down: 's' OR 'down arrow'</p>
<p>grid on/off: 'g'</p>
</div>
<div id="canvas_container">
<!-- <p> =) </p> -->
</div>
<!-- <script src="http://localhost:8080/js/pong.js" type="module" defer></script> -->
</body>
<style>
@font-face {
font-family: "Bit5x3";
src: url("/fonts/Bit5x3.woff2") format("woff2"),
url("/fonts/Bit5x3.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}
body {
margin: 0;
background-color: #222425;
}
#canvas_container {
margin-top: 20px;
text-align: center;
/* border: dashed rgb(245, 245, 245) 5px; */
/* max-height: 80vh; */
/* overflow: hidden; */
}
#div_game_instructions {
text-align: center;
font-family: "Bit5x3";
color: rgb(245, 245, 245);
font-size: large;
}
#div_game_options {
margin-top: 20px;
text-align: center;
font-family: "Bit5x3";
color: rgb(245, 245, 245);
font-size: x-large;
}
#div_game_options fieldset {
max-width: 50vw;
width: auto;
margin: 0 auto;
}
#div_game_options fieldset div {
padding: 10px;
}
#play_pong_button {
font-family: "Bit5x3";
color: rgb(245, 245, 245);
background-color: #333333;
font-size: x-large;
padding: 10px;
}
canvas {
background-color: #333333;
max-width: 75vw;
/* max-height: 100vh; */
width: 80%;
}
</style>

View File

@@ -20,16 +20,18 @@
let moving_walls = false; let moving_walls = false;
let matchOptions : enumeration.MatchOptions = enumeration.MatchOptions.noOption; let matchOptions : enumeration.MatchOptions = enumeration.MatchOptions.noOption;
// En async au cas où pour la suite mais apriori inutile, les check se feront sûrement au onMount
const init = async() => { const init = async() => {
// WIP nest, fetch token generation
const address = "http://transcendance:8080";
const responsePromise = fetch(address + "/token");
if (sound === "off") { if (sound === "off") {
initAudio(true); initAudio(true);
} }
else if (sound === "on") { else if (sound === "on") {
initAudio(false); initAudio(false);
} }
console.log(sound); console.log(sound); //debug
if (multi_balls === true) { if (multi_balls === true) {
matchOptions |= enumeration.MatchOptions.multiBalls; matchOptions |= enumeration.MatchOptions.multiBalls;
@@ -43,7 +45,15 @@
initPong(new GameArea()); initPong(new GameArea());
initGc(new GameComponentsClient(matchOptions, pong.ctx)); initGc(new GameComponentsClient(matchOptions, pong.ctx));
initStartFunction(start); initStartFunction(start);
initWebSocket(matchOptions);
const response = await responsePromise;
if (!response.ok) {
console.log("Token retrieve failed"); // TODO: error message
return;
}
const responseJson = await response.json();
initWebSocket(matchOptions, responseJson.token, "usernamePLACEHOLDER");
// ou est stocké le username dans le front svelte ?
} }
function start() : void { function start() : void {

View File

@@ -31,14 +31,16 @@ export const clientInfo = new ClientInfo();
export const clientInfoSpectator = new ClientInfoSpectator(); // WIP, could refactor this export const clientInfoSpectator = new ClientInfoSpectator(); // WIP, could refactor this
const tokenPLACEHOLDER = ""; export function initWebSocket(options: en.MatchOptions, token: string, username: string, privateMatch = false, playerTwoUsername?: string)
const usernamePLACEHOLDER = "";
const privateMatchPLACEHOLDER = false;
export function initWebSocket(options: en.MatchOptions)
{ {
socket = new WebSocket(wsUrl, "json"); socket = new WebSocket(wsUrl, "json");
socket.addEventListener("open", (event) => { socket.addEventListener("open", (event) => {
socket.send(JSON.stringify( new ev.ClientAnnouncePlayer(options, tokenPLACEHOLDER, usernamePLACEHOLDER, privateMatchPLACEHOLDER) )); if (privateMatch) {
socket.send(JSON.stringify( new ev.ClientAnnouncePlayer(options, token, username, privateMatch, playerTwoUsername) ));
}
else {
socket.send(JSON.stringify( new ev.ClientAnnouncePlayer(options, token, username) ));
}
}); });
// socket.addEventListener("message", logListener); // for testing purpose // socket.addEventListener("message", logListener); // for testing purpose
socket.addEventListener("message", preMatchListener); socket.addEventListener("message", preMatchListener);

View File

@@ -94,12 +94,16 @@ export class ClientAnnouncePlayer extends ClientAnnounce {
token: string; token: string;
username: string; username: string;
privateMatch: boolean; privateMatch: boolean;
constructor(matchOptions: en.MatchOptions, token: string, username: string, privateMatch: boolean = false) { playerTwoUsername?: string;
constructor(matchOptions: en.MatchOptions, token: string, username: string, privateMatch: boolean = false, playerTwoUsername?: string) {
super(en.ClientRole.player); super(en.ClientRole.player);
this.matchOptions = matchOptions; this.matchOptions = matchOptions;
this.token = token; this.token = token;
this.username = username; this.username = username;
this.privateMatch = privateMatch; this.privateMatch = privateMatch;
if (playerTwoUsername) {
this.playerTwoUsername = playerTwoUsername;
}
} }
} }