add: tournament: graph de bz

This commit is contained in:
starnakin 2024-03-25 13:21:37 +01:00 committed by AdrienLSH
parent 8d6272c85d
commit 4128f6ae01
5 changed files with 203 additions and 19 deletions

View File

@ -0,0 +1,51 @@
#tournament-tree {
display:flex;
flex-direction:row;
}
.round {
display:flex;
flex-direction:column;
justify-content:center;
width:200px;
list-style:none;
padding:0;
}
.round .spacer{ flex-grow:1; }
.round .spacer:first-child,
.round .spacer:last-child{ flex-grow:.5; }
.round .game-spacer{
flex-grow:1;
}
body{
font-family:sans-serif;
font-size:small;
padding:10px;
line-height:1.4em;
}
li.game{
padding-left:20px;
}
li.game.winner{
font-weight:bold;
}
li.game span{
float:right;
margin-right:5px;
}
li.game-top{ border-bottom:1px solid #aaa; }
li.game-spacer{
border-right:1px solid #aaa;
min-height:40px;
}
li.game-bottom{
border-top:1px solid #aaa;
}

View File

@ -102,7 +102,7 @@ class Tourmanent
return;
this.connected = false;
this._socket.close();
this.disconnect_func(event);
this.disconnectHandler(event);
}
toggle_participation()
@ -112,13 +112,40 @@ class Tourmanent
this._socket.send(JSON.stringify({participate: ""}));
}
async onParticipantsUpdate(data)
{
oldParticipantList = this.par
await this.participantsUpdateHandler();
}
async onError(data)
{
await this.errorHandler(data);
}
/**
*
* @param {MessageEvent} event
*/
onReceive(event)
{
const data = JSON.parse(event.data);
if (data?.detail === "error")
this.onError(data);
else if (data?.detail === "participants_update")
this.onParticipantsUpdate(data);
}
/**
* Join the tournament Websocket
* @param {CallableFunction} receive_func
* @param {CallableFunction} disconnect_func
* @param {CallableFunction} errorHandler
* @param {CallableFunction} participantsUpdateHandler
* @param {CallableFunction} disconnectHandler
* @returns {?}
*/
async join(receive_func, disconnect_func)
async join(participantsUpdateHandler, errorHandler, disconnectHandler)
{
if (!await this.client.isAuthenticated())
return null;
@ -130,13 +157,11 @@ class Tourmanent
this.connected = true;
this.isParticipating = false;
this.receive_func = receive_func;
this.disconnect_func = disconnect_func;
this.participantsUpdateHandler = participantsUpdateHandler;
this.errorHandler = errorHandler;
this.disconnectHandler = disconnectHandler;
this._socket.onmessage = function (event) {
const data = JSON.parse(event.data);
receive_func(data);
};
this._socket.onmessage = this.onReceive.bind(this);
this._socket.onclose = this.leave.bind(this);
}

View File

@ -1,3 +1,5 @@
import { Profile } from "../../api/Profile.js";
import { Tourmanent } from "../../api/tournament/Tournament.js";
import {client, navigateTo} from "../../index.js";
import AbstractAuthenticatedView from "../abstracts/AbstractAuthenticatedView.js";
@ -14,10 +16,61 @@ export default class extends AbstractAuthenticatedView
this.tournament.toggle_participation();
}
createGraph()
{
console.log(this.tournament);
let tournament_tree = document.createElement("div");
tournament_tree.id = "tournament-tree";
document.getElementById("app").appendChild(tournament_tree);
for (let round_id = 0; round_id < this.tournament.levels.length; round_id++)
{
let current_round = document.createElement("ul");
tournament_tree.appendChild(current_round);
current_round.className = `round round-${round_id}`;
for (let participant_i = 0; participant_i < this.tournament.levels[round_id].length; participant_i += 2)
{
let spacer = document.createElement("li");
spacer.className = "spacer";
spacer.innerText = "&nbsp;";
current_round.appendChild(spacer);
let game_top = document.createElement("li");
game_top.className = "game game-top";
game_top.innerText = `${this.tournament.levels[round_id][participant_i]}`;
current_round.appendChild(game_top);
let game_spacer = document.createElement("li");
spacer.className = "game game-spacer";
spacer.innerText = "&nbsp;";
current_round.appendChild(game_spacer);
let game_bottom = document.createElement("li");
game_bottom.className = "game game-bottom";
game_bottom.innerText = `${this.tournament.levels[round_id][participant_i + 1]}`;
current_round.appendChild(game_bottom);
}
}
}
async receive(data)
{
if (data.detail === "nb_participants" || data.detail === "update_participants")
document.getElementById("nb_participants").innerText = `${data.nb_participants} / ${this.tournament.nb_players}`;
if (data.detail === "update_participants")
document.getElementById("nb_participants").innerText = `${data.participants} / ${this.tournament.nb_players}`;
if (data.detail === "go_to")
navigateTo(data.url);
if (data.detail === "is_participant")
@ -32,36 +85,56 @@ export default class extends AbstractAuthenticatedView
document.getElementById("display").innerText = state ? "You are a particpant" : "You are not a participant";
}
async ondisconnect(event)
/**
*
* @param {[Profile]} oldParticipantsList
* @param {[Profile]} currentParticipantsList
*/
async onParticipantsUpdate(oldParticipantsList, currentParticipantsList)
{
}
async onDisconnect(event)
{
}
async onError(data)
{
}
async postInit()
{
/**
* @type {Tourmanent}
*/
this.tournament = await client.tournaments.getTournament(this.id);
if (this.tournament === null)
return 404;
this.tournament.join(this.receive.bind(this), this.ondisconnect.bind(this));
this.tournament.join(this.onParticipantsUpdate.bind(this), this.onError.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_participants").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.started === false)
button.disabled = false;
this.createGraph();
}
async getHtml()
{
return `
<link rel="stylesheet" href="/static/css/TournamentPage.css">
<table>
<thead>
<tr>

View File

@ -32,7 +32,7 @@ class TournamentModel(models.Model):
def get_games_id(self):
return [tournament_game.game_id for tournament_game in TournamentGamesModel.objects.filter(tournament_id = self.pk)]
def get_players_id(self):
def get_participants_id(self):
return [model.participant_id for model in TournamentParticipantsModel.objects.filter(tournament_id=self.pk)]
def is_a_participant(self, participant_id: int):
@ -134,7 +134,7 @@ class TournamentRoom(AbstractRoom):
if self.tournament.started:
member.participate = self.tournament.is_a_participant(member.user_id)
member.send_participating()
member.send("nb_participants", {"nb_participants": self.get_nb_participants()})
self.broadcast("update_participants", {"participants": [self.get_participants_id()]})
class TournamentRoomManager(AbstractRoomManager):

View File

@ -1,11 +1,20 @@
from rest_framework import serializers
from .models import TournamentModel
from django.db.models.query import QuerySet
from django.contrib.auth.models import User
from .models import TournamentModel, tournament_manager
from profiles.models import ProfileModel
from profiles.serializers import ProfileSerializer
from games.serializers import GameSerializer
class TournamentSerializer(serializers.ModelSerializer):
levels = serializers.SerializerMethodField(read_only=True, required=False)
state = serializers.SerializerMethodField(read_only=True, required=False)
participants = serializers.SerializerMethodField(read_only=True, required=False)
level = serializers.ReadOnlyField()
started = serializers.ReadOnlyField()
finished = serializers.ReadOnlyField()
@ -13,7 +22,32 @@ class TournamentSerializer(serializers.ModelSerializer):
class Meta:
model = TournamentModel
fields = ["name", "nb_players", "nb_players_by_game", "level", "started", "finished", "levels", "id", "state"]
fields = ["name", "nb_players", "nb_players_by_game", "level", "started", "finished", "levels", "id", "state", "participants"]
def get_participants(self, instance: TournamentModel):
participants_id: list[ProfileModel]
if (instance.started):
participants_id = instance.get_participants_id()
else:
participants_id = tournament_manager.get(instance.pk).get_participants_id()
participants_profile: list[ProfileModel] = []
for participant_id in participants_id:
query: QuerySet = ProfileModel.objects.filter(user_id = participant_id)
profile_data: dict
if query.exists():
profile_data = ProfileSerializer(query[0]).data
else:
profile_data = {
"username": "deleted_user",
"avatar": "/static/avatars/default.avif",
"user_id": participants_id
}
participants_profile.append(profile_data)
return participants_profile
def get_state(self, instance: TournamentModel):
return ["waiting", "started", "finished"][instance.started + instance.finished]
@ -31,6 +65,7 @@ class TournamentSerializer(serializers.ModelSerializer):
if (value < 2):
raise serializers.ValidationError("The numbers of players must be greather than 2.")
return value
def validate_nb_players_by_game(self, value: int):
if (value < 2):
raise serializers.ValidationError("The numbers of players by game must be greather than 2.")