mirror of
https://github.com/FAUSheppy/open-web-leaderboard.git
synced 2025-12-06 07:01:36 +01:00
97 lines
3.6 KiB
HTML
97 lines
3.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>Player: {{ player.name }}</title>
|
|
<meta name="Description" content="Player: {{ player.name }}">
|
|
{% include "default_head_content.html" %}
|
|
</head>
|
|
<body class="bg-special">
|
|
{% include 'navbar.html' %}
|
|
<div class="container mt-3 mb-3" role="main">
|
|
<div class="player-headline">
|
|
<h1>
|
|
{{ player.name }}
|
|
</h1>
|
|
<h3>
|
|
Rating: <i>{{ player.rating }}</i> <br>
|
|
{% if player.rank == 0 %}
|
|
<i><small>Missing {{ 10 - player.games }} placement games!</small></i>
|
|
{% elif not player.lastGame %}
|
|
<i><small>Must play a game again before being assigned a rank!</small></i>
|
|
{% else %}
|
|
Rank: {{ player.rank }}
|
|
{%endif%}
|
|
</h3>
|
|
</div>
|
|
<div class="plot-container">
|
|
<canvas id="lineChart">
|
|
</canvas>
|
|
</div>
|
|
<div class="mt-3 medal-container">
|
|
{% for m in medals %}
|
|
{{ m }}
|
|
{% endfor %}
|
|
</div>
|
|
<p class="mt-5 mb-3">
|
|
</p>
|
|
</div>
|
|
<!-- {% include 'footer.html' %}-->
|
|
<script defer>
|
|
var canvas = document.getElementById("lineChart")
|
|
var ctx = canvas.getContext('2d');
|
|
var historicalRank = new Chart(ctx, {
|
|
type: 'line',
|
|
data: {
|
|
labels: [ {{ CSV_MONTH_YEAR_OF_RATINGS | safe }} ],
|
|
datasets: [{
|
|
label: "Rating",
|
|
data: [ {{ CSV_RATINGS | safe }} ],
|
|
backgroundColor: [ 'rgba(105, 0, 132, .2)' ],
|
|
borderColor: [ 'rgba(200, 99, 132, .7)' ],
|
|
borderWidth: 2
|
|
}],
|
|
},
|
|
options: {
|
|
scales: {
|
|
yAxes: [{
|
|
ticks : {
|
|
suggestedMin : {{ Y_MIN }},
|
|
suggestedMax : {{ Y_MAX }},
|
|
min : {{ Y_MIN }},
|
|
max : {{ Y_MAX }}
|
|
}
|
|
}],
|
|
xAxes: [{
|
|
type: 'time',
|
|
distribution: 'series',
|
|
time: {
|
|
round : false,
|
|
unit: "day"
|
|
},
|
|
ticks : {
|
|
autoSkip : true,
|
|
source : "labels"
|
|
},
|
|
gridLines: {
|
|
display: false,
|
|
offsetGridLines: true
|
|
}
|
|
}]
|
|
},
|
|
responsive: true
|
|
}
|
|
});
|
|
var datasetHelper = {{ CSV_TIMESTAMPS | safe }}
|
|
canvas.onclick = function (evt) {
|
|
var points = historicalRank.getElementsAtEvent(evt);
|
|
if(points.length != 1){
|
|
return
|
|
}
|
|
var timestampMs = datasetHelper[points[0]._index] / 1000
|
|
var idString = timestampMs.toString()
|
|
window.location.href = "/round-info?id=" + idString
|
|
};
|
|
</script>
|
|
</body>
|
|
</html>
|