79 lines
2.4 KiB
HTML
79 lines
2.4 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Scoreboard{% endblock %}
|
|
{% block head %}
|
|
<style type="text/css">
|
|
.teamrow:not(.visible) {
|
|
display: none;
|
|
}
|
|
.teamrow.ineligible {
|
|
color: #888;
|
|
}
|
|
</style>
|
|
<script>
|
|
var ineligibleShown = false;
|
|
function recalcRanks() {
|
|
$(".teamrow.visible").each(function(i, x) {
|
|
$(x).children(".rank").html(i + 1);
|
|
});
|
|
}
|
|
function hideIneligible() {
|
|
$(".teamrow.ineligible").removeClass("visible");
|
|
$("#toggle").html("Show ineligible teams");
|
|
recalcRanks();
|
|
}
|
|
function showIneligible() {
|
|
$(".teamrow.ineligible").addClass("visible");
|
|
$("#toggle").html("Hide ineligible teams");
|
|
recalcRanks();
|
|
}
|
|
function toggleIneligible() {
|
|
if(ineligibleShown) hideIneligible();
|
|
else showIneligible();
|
|
ineligibleShown = !ineligibleShown;
|
|
}
|
|
document.onready = function() {
|
|
hideIneligible();
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
{% block content %}
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<h3>Score progression</h3>
|
|
<div id="chart"></div>
|
|
</div>
|
|
</div>
|
|
<h3>Rankings</h3>
|
|
<a href="javascript:toggleIneligible()" id="toggle">Hide ineligible teams</a>
|
|
<table>
|
|
<thead>
|
|
<tr><th>Rank</th><th>Team</th><th>Affiliation</th><th>Score</th></tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for eligible, teamid, team, affiliation, score in data %}
|
|
<tr class="teamrow {% if not eligible %}in{% endif %}eligible {% if teamid == session.team_id %}blue lighten-3 {% endif %}visible"><td class="rank">{{ rank }}</td><td>{{ team }}</td><td>{{ affiliation }}</td><td>{{ score }}</td></tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% endblock %}
|
|
{% block postscript %}
|
|
<script>
|
|
recalcRanks();
|
|
var graphData = {{ graphdata | tojson }};
|
|
var groupn = 0;
|
|
var groups = new vis.DataSet();
|
|
var items = [];
|
|
graphData.forEach(function(team) {
|
|
var teamName = team[0];
|
|
var scoreEvents = team[1];
|
|
groups.add({ id: groupn, content: teamName, options: { drawPoints: false, interpolation: false } });
|
|
scoreEvents.forEach(function(evt) {
|
|
items.push({ x: evt[0], y: evt[1], group: groupn });
|
|
});
|
|
groupn++;
|
|
});
|
|
var dataset = new vis.DataSet(items);
|
|
var graph = new vis.Graph2d(document.getElementById('chart'), dataset, groups, {legend: true, dataAxis: {left: {range: {min: 0}}}});
|
|
</script>
|
|
{% endblock %}
|