You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
71 lines
2.2 KiB
71 lines
2.2 KiB
{% extends 'tournaments/broadcast_base.html' %}
|
|
|
|
{% block head_title %}Classement{% endblock %}
|
|
{% block first_title %}{{ tournament.display_name }}{% endblock %}
|
|
{% block second_title %}Classement{% endblock %}
|
|
|
|
{% block content %}
|
|
|
|
{% load static %}
|
|
|
|
<div x-data="{
|
|
paginatedRankings: null,
|
|
active: 1,
|
|
retrieveRankings() {
|
|
fetch('/tournament/{{ tournament.id }}/rankings/json/')
|
|
.then(res => res.json())
|
|
.then((data) => {
|
|
|
|
let pageSize = 20
|
|
this.paginatedRankings = this.paginate(data, pageSize)
|
|
|
|
const splitGroups = [];
|
|
this.paginatedRankings.forEach(group => {
|
|
const firstHalf = group.slice(0, pageSize / 2);
|
|
const secondHalf = group.slice(pageSize / 2);
|
|
if (secondHalf.length > 0) {
|
|
splitGroups.push([firstHalf, secondHalf]);
|
|
} else {
|
|
splitGroups.push([firstHalf]);
|
|
}
|
|
});
|
|
this.paginatedRankings = splitGroups;
|
|
|
|
})
|
|
},
|
|
paginate(array, pageSize) {
|
|
let paginatedArray = [];
|
|
for (let i = 0; i < array.length; i += pageSize) {
|
|
paginatedArray.push(array.slice(i, i + pageSize));
|
|
}
|
|
return paginatedArray;
|
|
},
|
|
loop() {
|
|
this.retrieveRankings()
|
|
setInterval(() => {
|
|
this.retrieveRankings()
|
|
this.active = this.active === this.paginatedRankings.length ? 1 : this.active+1
|
|
}, 15000)
|
|
}
|
|
|
|
}" x-init="loop()">
|
|
|
|
<div class="grid-x">
|
|
<template x-for="i in paginatedRankings.length" >
|
|
<template x-for="column in paginatedRankings[i-1]" >
|
|
<div class="cell medium-6 large-6 topblock my-block" x-show="active === i">
|
|
|
|
<div class="bubble">
|
|
<template x-for="(ranking, index) in column" >
|
|
|
|
{% include 'tournaments/broadcasted_ranking.html' %}
|
|
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|