michel/ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

tournament: add: player can join tournament now

Browse Source
This commit is contained in:
starnakin
2023-12-24 16:58:36 +01:00
parent 2932c2af1f
commit 8ba55d5be2
6 changed files with 191 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
frontend/static/js/api/tournament/tournament.js
View File

@ -20,6 +20,8 @@ class Tourmanent
this.levels = levels;
this.state = this.get_state();
this.id = id
this.connected = false;
}
get_state()
@ -50,6 +52,48 @@ class Tourmanent
this.levels = response_data.levels;
this.id = response_data.id
}
leave(event)
{
if (this.connected == false)
return
this.connected = false;
this._socket.close()
this.disconnect_func(event);
}
toggle_participation()
{
if (!this.connected)
return
console.log(this.isParticipating);
this.isParticipating = !this.isParticipating;
console.log(this.isParticipating);
this._socket.send(JSON.stringify({participate: this.isParticipating}));
}
async join(receive_func, disconnect_func)
{
if (!await this.client.isAuthentificate())
return null;
let url = `wss://${window.location.host}/ws/tournaments/${this.id}`;
this._socket = new WebSocket(url);
this.connected = true;
this.isParticipating = false;
this.receive_func = receive_func;
this.disconnect_func = disconnect_func;
this._socket.onmessage = function (event) {
const data = JSON.parse(event.data);
receive_func(data);
};
this._socket.onclose = this.leave.bind(this);
}
}

43
frontend/static/js/views/TournamentPageView.js
View File

@ -9,19 +9,43 @@ export default class extends AbstractAuthentifiedView
this.id = params.id;
}
pressButton()
{
this.tournament.toggle_participation();
document.getElementById("button").value = this.tournament.isParticipating ? "Leave tournament" : "Join tournament";
}
async receive(data)
{
if (data.detail === "nb_participants" || data.detail === "update_participants")
document.getElementById("nb_participants").innerText = `${data.nb_participants} / ${this.tournament.nb_players}`
}
async ondisconnect(event)
{
}
async postInit()
{
let tournament = await client.tournaments.getTournament(this.id);
this.tournament = await client.tournaments.getTournament(this.id);
if (tournament === null)
if (this.tournament === null)
return 1;
document.getElementById("name").innerText = tournament.name;
document.getElementById("nb_players").innerText = tournament.nb_players;
document.getElementById("nb_players_by_game").innerText = tournament.nb_players_by_game;
document.getElementById("level").innerText = tournament.level;
document.getElementById("state").innerText = tournament.state;
this.tournament.join(this.receive.bind(this), this.ondisconnect.bind(this));
let button = document.getElementById("button")
button.onclick = this.pressButton.bind(this);
document.getElementById("name").innerText = this.tournament.name;
document.getElementById("nb_players").innerText = this.tournament.nb_players;
document.getElementById("nb_players_by_game").innerText = this.tournament.nb_players_by_game;
document.getElementById("level").innerText = this.tournament.level;
document.getElementById("state").innerText = this.tournament.state;
if (this.tournament.state === "waiting")
button.disabled = false;
}
async getHtml()
@ -46,12 +70,17 @@ export default class extends AbstractAuthentifiedView
<td>Number of round</td>
<td id="level">Loading...</td>
</tr>
<tr>
<td>Number of player</td>
<td id="nb_participants">Loading...</td>
</tr>
<tr>
<td>status</td>
<td id="state">Loading...</td>
</tr>
</tbody>
</table>
<input type="button" id="button" value="Join tournament" disabled>
`
}
}