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

games: add: goal table

Browse Source
This commit is contained in:
starnakin
2024-02-20 16:54:14 +01:00
committed by AdrienLSH
parent 2560ec908d
commit a4a6eebb12
7 changed files with 58 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/static/js/views/GameView.js
View File

@ -2,6 +2,7 @@ import { client } from "../index.js";
import { Game } from "../api/game/Game.js";
import AbstractView from "./abstracts/AbstractView.js";
import { MyPlayer } from "../api/game/MyPlayer.js";
import { lang } from "../index.js"
export default class extends AbstractView
{
@ -94,7 +95,7 @@ export default class extends AbstractView
this.my_player = new MyPlayer(client,
this.game,
my_player.rail,
my_player.nb_gool,
my_player.nb_goal,
my_player.position,
);
this.game.players[index] = this.my_player;
@ -113,6 +114,26 @@ export default class extends AbstractView
await this.join_game();
}
display_players_list()
{
let players_list = document.getElementById("players_list");
this.game.players.forEach(player => {
console.log(player);
let tr = document.createElement("tr");
let name = document.createElement("td");
let goal = document.createElement("td");
name.innerText = player.username;
goal.innerText = player.nb_goal;
tr.appendChild(name);
tr.appendChild(goal);
players_list.appendChild(tr);
});
}
async postInit()
{
let error_code = await this.game.init();
@ -121,6 +142,7 @@ export default class extends AbstractView
return error_code;
await this.update_game_state();
this.display_players_list();
}
async leavePage()
@ -138,7 +160,17 @@ export default class extends AbstractView
return /* HTML */ `
<link rel="stylesheet" href="/static/css/game.css">
<h2 id="game-state"></h2>
<div id="player_list"></div>
<table>
<thead>
<tr>
<th scope="col">${lang.get("gamePlayersListName")}</th>
<th scope="col">${lang.get("gameGoalTaken")}</th>
</tr>
</thead>
<tbody id="players_list">
</tbody>
</table>
`;
}
}