NDOJ/templates/contest/stats.html
2023-01-27 17:11:10 -06:00

83 lines
2.2 KiB
HTML

{% extends "two-column-content.html" %}
{% set page_type = 'stats' %}
{% block left_sidebar %}
{% include "contest/contest-tabs.html" %}
{% endblock %}
{% block two_col_js %}
<script type="text/javascript">
window.stats = {{ stats }};
</script>
{% compress js %}
{% include "stats/media-js.html" %}
<script type="text/javascript">
$(function () {
draw_stacked_bar_chart(window.stats.problem_status_count, $('#problem-status-count'));
draw_bar_chart(window.stats.problem_ac_rate, $('#problem-ac-rate'));
pts_hist = draw_histogram(window.stats.problem_point[0], $('#problem-point'));
draw_pie_chart(window.stats.language_count, $('#language-count'));
draw_bar_chart(window.stats.language_ac_rate, $('#language-ac-rate'));
$('#problem-point-select').change(function() {
pts_hist.destroy();
problem = $(this).val();
pts_hist = draw_histogram(window.stats.problem_point[problem],
$('#problem-point'));
})
$('#problem-point-select').select2({
width: '10em',
});
});
</script>
{% endcompress %}
{% include "contest/media-js.html" %}
{% endblock %}
{% block two_col_media %}
<style>
.chart {
margin: 10px 0;
}
</style>
{% endblock %}
{% block middle_content %}
<h3>{{ _('Problem Status Distribution') }}</h3>
<div id="problem-status-count" class="chart">
<canvas></canvas>
</div>
<h3>{{ _('Problem AC Rate') }}</h3>
<div id="problem-ac-rate" class="chart">
<canvas></canvas>
</div>
<h3>
{{ _('Problem Point Distribution') }}:
<select id="problem-point-select">
{% for name in problems %}
<option value="{{ loop.index0 }}" class="point-dropdown">
{{ name }}
</option>
{% endfor %}
</select>
</h3>
<div id="problem-point" class="chart">
<canvas></canvas>
</div>
<h3>{{ _('Submissions by Language') }}</h3>
<div id="language-count" class="chart">
<canvas width="400" height="300"></canvas>
<ul class="legend"></ul>
</div>
<h3>{{ _('Language AC Rate') }}</h3>
<div id="language-ac-rate" class="chart">
<canvas></canvas>
</div>
{% endblock %}