IW4M-Admin/Master/master/templates/index.html
RaidMax 36d493f05b update file localizations
update custom callbacks
add server count to master
add most played to token list
2018-05-21 16:09:27 -05:00

65 lines
2.1 KiB
HTML

{% extends "layout.html" %}
{% block content %}
<div class="row">
<div class="col-12">
<figure>
<div id="history_graph">{{history_graph|safe}}</div>
<figcaption class="float-right">
<span id="history_graph_zoom_out" class="h4 oi oi-zoom-out text-muted" style="cursor:pointer;"></span>
<span id="history_graph_zoom_in" class="h4 oi oi-zoom-in text-muted" style="cursor:pointer;"></span>
</figcaption>
<figcaption class="float-left">
<span class="h4 text-muted">{{instance_count}} instances</span>
<span class="h4 text-muted">&mdash; {{client_count}} clients</span>
<span class="h4 text-muted">&mdash; {{server_count}} servers</span>
</figcaption>
</figure>
</div>
<div class="col-12">
</div>
</div>
{% endblock %}
{% block scripts %}
<script type="text/javascript" src="http://kozea.github.com/pygal.js/latest/pygal-tooltips.min.js"></script>
<script>
let dataPoints = {{data_points}};
let maxPoints = 2880;
maxPoints = Math.min(maxPoints, dataPoints);
let zoomLevel = Math.floor(maxPoints);
let performingZoom = false;
function updateHistoryGraph() {
perfomingZoom = true;
$.get('/history/' + zoomLevel)
.done(function (content) {
$('#history_graph').html(content.message);
//maxPoints = Math.min(maxPoints, dataPoints);
perfomingZoom = false;
});
}
//setInterval(updateHistoryGraph, 30000);
$('#history_graph_zoom_out').click(function () {
if (performingZoom === true) {
return false;
}
zoomLevel = Math.floor(zoomLevel * 2) <= maxPoints ? Math.floor(zoomLevel * 2) : maxPoints;
updateHistoryGraph();
});
$('#history_graph_zoom_in').click(function () {
if (performingZoom === true) {
return false;
}
zoomLevel = zoomLevel / 2 > 2 ? Math.ceil(zoomLevel / 2) : 2;
updateHistoryGraph();
});
</script>
{% endblock %}