+ 'my-ranking': {
+ props: ['players','sortByScore','writeScoreToDb'],
+ template: `
+ <div id="ranking">
+ <table class="ranking">
+ <tr class="title">
+ <th>Rang</th>
+ <th>Joueur</th>
+ <th>Points</th>
+ <th>Mini-pts</th>
+ </tr>
+ <tr v-for="p in sortedPlayers">
+ <td>{{ p.rank }}</td>
+ <td>{{ p.prenom }} {{ p.nom }}</td>
+ <td>{{ p.pdt }}</td>
+ <td>{{ p.session }}</td>
+ </tr>
+ </table>
+ <div class="button-container-vertical" style="width:200px">
+ <button class="btn cancel" @click="resetPlayers()">Réinitialiser</button>
+ <button id="restoreBtn" class="btn" @click="restoreLast()">Restaurer</button>
+ </div>
+ </div>
+ `,
+ computed: {
+ sortedPlayers: function() {
+ let res = this.rankPeople();
+ // Add rank information (taking care of ex-aequos)
+ let rank = 1;
+ for (let i=0; i<res.length; i++)
+ {
+ if (i==0 || this.sortByScore(res[i],res[i-1]) == 0)
+ res[i].rank = rank;
+ else //strictly lower scoring
+ res[i].rank = ++rank;
+ }
+ return res;
+ },
+ },
+ methods: {
+ rankPeople: function() {
+ return this.players
+ .slice(1) //discard Toto
+ .sort(this.sortByScore);
+ },
+ resetPlayers: function() {
+ this.players
+ .slice(1) //discard Toto
+ .forEach( p => {
+ p.pdt = 0;
+ p.session = 0;
+ p.available = 1;
+ });
+ this.writeScoreToDb();
+ document.getElementById("runPairing").click();
+ },
+ restoreLast: function() {
+ let xhr = new XMLHttpRequest();
+ let self = this;
+ xhr.onreadystatechange = function() {
+ if (this.readyState == 4 && this.status == 200)
+ {
+ let players = JSON.parse(xhr.responseText);
+ if (players.length > 0)
+ {
+ players.unshift({ //add ghost 4th player for 3-players tables
+ prenom: "Toto",
+ nom: "",
+ pdt: 0,
+ session: 0,
+ available: 0,
+ });
+ // NOTE: Vue warning "do not mutate property" if direct self.players = players
+ for (let i=1; i<players.length; i++)
+ {
+ players[i].pdt = parseFloat(players[i].pdt);
+ players[i].session = parseInt(players[i].session);
+ Vue.set(self.players, i, players[i]);
+ }
+ }
+ }
+ };
+ xhr.open("GET", "scripts/rw_players.php?restore=1", true);
+ xhr.send(null);
+ },
+ },
+ },