starnakin/42_ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adding game mode button to matchmaking view

Browse Source
This commit is contained in:
Kbz-8
2024-02-21 16:34:50 +01:00
committed by AdrienLSH
parent 4d126c1683
commit 300c3768ed
3 changed files with 24 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/static/js/index.js
View File

@ -5,8 +5,8 @@ import Search from "./views/Search.js";
import HomeView from "./views/HomeView.js";
import LogoutView from "./views/accounts/LogoutView.js";
import GameOfflineView from "./views/GameOfflineView.js";
//import GameView from "./views/GameView.js";
import GameView from "./views/GameView3D.js";
import GameView2D from "./views/GameView.js";
import GameView3D from "./views/GameView3D.js";
import PageNotFoundView from './views/PageNotFoundView.js' ;
@ -89,8 +89,8 @@ const router = async(uri) => {
{ path: "/settings", view: SettingsView },
{ path: "/matchmaking", view: MatchMakingView },
{ path: "/games/offline", view: GameOfflineView },
{ path: "/games/:id", view: GameView },
{ path: "/tictactoe", view: TicTacToeView },
{ path: "/games/0/:id", view: GameView2D },
{ path: "/games/1/:id", view: GameView3D },
];
// Test each route for potential match

52
frontend/static/js/views/MatchMakingView.js
View File

@ -6,7 +6,8 @@ export default class extends AbstractAuthenticatedView {
constructor(params)
{
super(params, "Matchmaking");
super(params, "Matchmaking");
this.game_mode = 0; // 0 -> 2D; 1 -> 3D
}
async press_button()
@ -27,6 +28,20 @@ export default class extends AbstractAuthenticatedView {
}
}
async press_button_game_mode()
{
if(this.game_mode === 0)
{
document.getElementById("game-mode").value = "3D";
this.game_mode = 1;
}
else
{
document.getElementById("game-mode").value = "2D";
this.game_mode = 0;
}
}
ondisconnect(event)
{
document.getElementById("button").value = "Find a game";
@ -36,7 +51,7 @@ export default class extends AbstractAuthenticatedView {
{
if (data.detail === "game_found")
{
navigateTo(`/games/${data.game_id}`);
navigateTo(`/games/${this.game_mode}/${data.game_id}`);
return;
}
this.display_data(data);
@ -50,36 +65,8 @@ export default class extends AbstractAuthenticatedView {
async postInit()
{
let button = document.getElementById("button");
button.onclick = this.press_button.bind(this);
let input = document.getElementById("nb_players-input");
input.addEventListener('keydown', async ev => {
if (ev.key !== 'Enter')
return;
if (client.matchmaking.searching)
client.matchmaking.stop();
let nb_players = document.getElementById("nb_players-input").value;
await client.matchmaking.start(this.onreceive.bind(this), this.ondisconnect.bind(this), nb_players);
document.getElementById("button").value = "Stop matchmaking";
});
let update = () => {
if (input.value < 2)
button.disabled = true;
else
button.disabled = false;
};
["change", "oninput"].forEach((event_name) => {
input.addEventListener(event_name, update);
});
document.getElementById("button").onclick = this.press_button.bind(this)
document.getElementById("game-mode").onclick = this.press_button_game_mode.bind(this)
}
async getHtml() {
@ -87,6 +74,7 @@ export default class extends AbstractAuthenticatedView {
<h1>Select mode</h1>
<input type="number" value="2" min="1" id="nb_players-input">
<input type="button" value="Find a game" id="button">
<input type="button" value="2D" id="game-mode">
<span id="detail"></span>
`;
}