Render problem list stats with ajax
This commit is contained in:
cuom1999
parent
caf599b5b3
commit
0470bfec68
2 changed files with 92 additions and 87 deletions
|
|
@ -1,4 +1,3 @@
|
|||
import json
|
||||
import os.path
|
||||
from operator import attrgetter
|
||||
|
||||
|
|
@ -455,15 +454,7 @@ class SubmissionsListBase(DiggPaginatorMixin, TitleMixin, ListView):
|
|||
context["selected_languages"] = self.selected_languages_key
|
||||
context["all_statuses"] = self.get_searchable_status_codes()
|
||||
context["selected_statuses"] = self.selected_statuses
|
||||
|
||||
if not self.in_hidden_subtasks_contest():
|
||||
context["results_json"] = mark_safe(json.dumps(self.get_result_data()))
|
||||
context["results_colors_json"] = mark_safe(
|
||||
json.dumps(settings.DMOJ_STATS_SUBMISSION_RESULT_COLORS)
|
||||
)
|
||||
else:
|
||||
context["results_json"] = None
|
||||
|
||||
context["can_show_result_data"] = not self.in_hidden_subtasks_contest()
|
||||
context["page_suffix"] = suffix = (
|
||||
("?" + self.request.GET.urlencode()) if self.request.GET else ""
|
||||
)
|
||||
|
|
@ -509,7 +500,15 @@ class SubmissionsListBase(DiggPaginatorMixin, TitleMixin, ListView):
|
|||
self.include_frozen = True
|
||||
|
||||
if "results" in request.GET:
|
||||
return JsonResponse(self.get_result_data())
|
||||
response = {}
|
||||
if not self.in_hidden_subtasks_contest():
|
||||
response["results_json"] = self.get_result_data()
|
||||
response[
|
||||
"results_colors_json"
|
||||
] = settings.DMOJ_STATS_SUBMISSION_RESULT_COLORS
|
||||
else:
|
||||
response["results_json"] = None
|
||||
return JsonResponse(response)
|
||||
|
||||
return super(SubmissionsListBase, self).get(request, *args, **kwargs)
|
||||
|
||||
|
|
|
|||
|
|
@ -26,9 +26,6 @@
|
|||
window.show_problem = 0;
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if results_json %}
|
||||
window.results_json = {{ results_json }};
|
||||
{% endif %}
|
||||
</script>
|
||||
|
||||
{% compress js %}
|
||||
|
|
@ -52,6 +49,47 @@
|
|||
|
||||
<script src="{{ static('libs/chart.js/Chart.js') }}"></script>
|
||||
<script type="text/javascript">
|
||||
var chart = null;
|
||||
|
||||
function stats_graph(raw_data) {
|
||||
var colors = window.results_colors_json;
|
||||
|
||||
var ctx = $('#status-graph').find('canvas')[0].getContext('2d');
|
||||
var font = $('body').css('font-family');
|
||||
if (chart !== null) {
|
||||
chart.destroy();
|
||||
}
|
||||
chart = new Chart(ctx, {
|
||||
type: 'pie',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: raw_data.categories.map(function(entry) {
|
||||
return entry.count;
|
||||
}),
|
||||
backgroundColor: raw_data.categories.map(function(entry) {
|
||||
return colors[entry.code];
|
||||
}),
|
||||
}],
|
||||
labels: raw_data.categories.map(function(entry) {
|
||||
return entry.name;
|
||||
}),
|
||||
},
|
||||
options: {
|
||||
animation: false,
|
||||
scaleFontFamily: font,
|
||||
tooltips: {
|
||||
titleFontFamily: font,
|
||||
bodyFontFamily: font,
|
||||
},
|
||||
legend: {
|
||||
display: false,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
$('#total-submission-count').text(raw_data.total);
|
||||
}
|
||||
|
||||
$(function () {
|
||||
var info_float = $('.info-float');
|
||||
var container = $('#content-right');
|
||||
|
|
@ -90,48 +128,16 @@
|
|||
});
|
||||
|
||||
// Draw the statistics graph.
|
||||
{% if results_json %}
|
||||
{% if can_show_result_data %}
|
||||
$(function () {
|
||||
var chart = null;
|
||||
function stats_graph(raw_data) {
|
||||
var colors = {{ results_colors_json }};
|
||||
|
||||
var ctx = $('#status-graph').find('canvas')[0].getContext('2d');
|
||||
var font = $('body').css('font-family');
|
||||
if (chart !== null) {
|
||||
chart.destroy();
|
||||
}
|
||||
chart = new Chart(ctx, {
|
||||
type: 'pie',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: raw_data.categories.map(function(entry) {
|
||||
return entry.count;
|
||||
}),
|
||||
backgroundColor: raw_data.categories.map(function(entry) {
|
||||
return colors[entry.code];
|
||||
}),
|
||||
}],
|
||||
labels: raw_data.categories.map(function(entry) {
|
||||
return entry.name;
|
||||
}),
|
||||
},
|
||||
options: {
|
||||
animation: false,
|
||||
scaleFontFamily: font,
|
||||
tooltips: {
|
||||
titleFontFamily: font,
|
||||
bodyFontFamily: font,
|
||||
},
|
||||
legend: {
|
||||
display: false,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
$('#total-submission-count').text(raw_data.total);
|
||||
}
|
||||
stats_graph(window.results_json);
|
||||
let currentUrl = window.location.href;
|
||||
let separator = currentUrl.includes('?') ? '&' : '?';
|
||||
let newUrl = currentUrl + separator + 'results=1';
|
||||
$.get(newUrl, function(data) {
|
||||
window.results_json = data.results_json;
|
||||
window.results_colors_json = data.results_colors_json;
|
||||
stats_graph(window.results_json);
|
||||
});
|
||||
});
|
||||
{% endif %}
|
||||
</script>
|
||||
|
|
@ -320,37 +326,37 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block right_sidebar %}
|
||||
{% if results_json %}
|
||||
<div class="right-sidebar">
|
||||
<div class="submission">
|
||||
<div class="sidebox">
|
||||
<h3 class="colored-text"><i class="fa fa-search"></i>{{ _('Filter submissions') }}</h3>
|
||||
<div class="sidebox-content">
|
||||
<form id="filter-form" name="form" action="" method="get">
|
||||
<div class="filter-form-group">
|
||||
<label class="bold-text margin-label" for="status"><i class="non-italics" >{{ _('Status') }}</i></label>
|
||||
<select id="status" name="status" multiple>
|
||||
{% for id, name in all_statuses %}
|
||||
<option {% if id in selected_statuses %}selected{% endif %}
|
||||
value="{{ id }}">{{ name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-form-group">
|
||||
<label class="bold-text margin-label" for="language"><i class="non-italics">{{ _('Language') }}</i></label>
|
||||
<select id="language" name="language" multiple>
|
||||
{% for code, name in all_languages %}
|
||||
<option {% if code in selected_languages %}selected{% endif %}
|
||||
value="{{ code }}">{{ name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-submit-group" >
|
||||
<a id="go" onclick="form.submit()" class="button small">{{ _('Go') }}</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right-sidebar">
|
||||
<div class="submission">
|
||||
<div class="sidebox">
|
||||
<h3 class="colored-text"><i class="fa fa-search"></i>{{ _('Filter submissions') }}</h3>
|
||||
<div class="sidebox-content">
|
||||
<form id="filter-form" name="form" action="" method="get">
|
||||
<div class="filter-form-group">
|
||||
<label class="bold-text margin-label" for="status"><i class="non-italics" >{{ _('Status') }}</i></label>
|
||||
<select id="status" name="status" multiple>
|
||||
{% for id, name in all_statuses %}
|
||||
<option {% if id in selected_statuses %}selected{% endif %}
|
||||
value="{{ id }}">{{ name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-form-group">
|
||||
<label class="bold-text margin-label" for="language"><i class="non-italics">{{ _('Language') }}</i></label>
|
||||
<select id="language" name="language" multiple>
|
||||
{% for code, name in all_languages %}
|
||||
<option {% if code in selected_languages %}selected{% endif %}
|
||||
value="{{ code }}">{{ name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-submit-group" >
|
||||
<a id="go" onclick="form.submit()" class="button small">{{ _('Go') }}</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
{% if can_show_result_data %}
|
||||
<div class="sidebox">
|
||||
<div id="statistics-table">
|
||||
<h3 class="colored-text"><i class="fa fa-pie-chart"></i>{{ _('Statistics') }}</h3>
|
||||
|
|
@ -364,9 +370,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block left_sidebar %}
|
||||
|
|
|
|||
Loading…
Reference in a new issue