lkva/NDOJ
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rewrite contest UI

Browse source
This commit is contained in:
cuom1999 2022-11-27 01:03:38 -06:00
parent 6c9551e089
commit 756023a097
20 changed files with 191 additions and 254 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
judge/views/contests.py
View file

@ -988,7 +988,7 @@ def contest_ranking_ajax(request, contest, participation=None):
class ContestRankingBase(ContestMixin, TitleMixin, DetailView):
template_name = "contest/ranking.html"
tab = None
page_type = None
def get_title(self):
raise NotImplementedError()
@ -1008,12 +1008,12 @@ class ContestRankingBase(ContestMixin, TitleMixin, DetailView):
users, problems = self.get_ranking_list()
context["users"] = users
context["problems"] = problems
context["tab"] = self.tab
context["page_type"] = self.page_type
return context
class ContestRanking(ContestRankingBase):
tab = "ranking"
page_type = "ranking"
def get_title(self):
return _("%s Rankings") % self.object.name
@ -1039,7 +1039,7 @@ class ContestRanking(ContestRankingBase):
class ContestParticipationList(LoginRequiredMixin, ContestRankingBase):
tab = "participation"
page_type = "participation"
def get_title(self):
if self.profile == self.request.profile:

4
judge/widgets/select2.py
View file

@ -48,9 +48,7 @@ from django.urls import reverse_lazy
from django.utils.http import urlencode
DEFAULT_SELECT2_JS = settings.STATIC_URL + "libs/select2/select2.js"
DEFAULT_SELECT2_CSS = settings.STATIC_URL + (
"libs/select2/select2.css"
)
DEFAULT_SELECT2_CSS = settings.STATIC_URL + ("libs/select2/select2.css")
__all__ = [
"Select2Widget",

13
resources/blog.scss
View file

@ -173,14 +173,13 @@
}
.left-sidebar-item {
display: flex;
align-items: center;
.sidebar-icon {
font-size: large;
width: 1.2em;
display: inline-block;
i {
position: relative;
bottom: -1.5px;
width: 1.4em;
}
}
}
@ -271,12 +270,12 @@
}
.middle-content {
max-width: 65%;
margin-left: 13%;
max-width: 75%;
width: -webkit-fill-available;
}
.blog-sidebar, .right-sidebar {
width: 20%;
width: 25%;
}
.left-sidebar {

1
resources/contest.scss
View file

@ -91,7 +91,6 @@
}
#banner {
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
padding-bottom: 1em;
a.date {

20
templates/contest/calendar.html
View file

@ -1,12 +1,22 @@
{% extends "base.html" %}
{% block title_ruler %}{% endblock %}
{% extends "two-column-content.html" %}
{% set page_type = 'calendar' %}
{% block title_row %}
{% set tab = 'calendar' %}
{% block left_sidebar %}
{% include "contest/contest-list-tabs.html" %}
{% endblock %}
{% block body %}
{% block middle_content %}
<center style="font-size: 1.6em; margin-top: 0.3em;">
{% if prev_month %}
<a href="{{ url('contest_calendar', prev_month.year, prev_month.month) }}">&laquo; {{ _('Prev') }}</a>
{% endif %}
{% if not (curr_month.year == now.year and curr_month.month == now.month) %}
<a href="{{ url('contest_calendar', now.year, now.month) }}"> {{ _('Today') }}</a>
{% endif %}
{% if next_month %}
<a href="{{ url('contest_calendar', next_month.year, next_month.month) }}">{{ _('Next') }} &raquo;</a>
{% endif %}
</center>
<table id="contest-calendar">
<tr>
<th>{{ _('Sunday') }}</th>

53
templates/contest/contest-datetime.html Normal file
View file

@ -0,0 +1,53 @@
<script type="text/javascript">
$(document).ready(function () {
$('.time-remaining').each(function () {
count_down($(this));
});
});
</script>
<div id="banner">
<a href="https://www.timeanddate.com/worldclock/fixedtime.html?msg={{ contest.name|urlquote('') }}&amp;iso=
{{- contest.start_time|utc|date('Y-m-d\TH:i:s') }}" class="date">
{%- if contest.is_in_contest(request.user) and not request.participation.live -%}
{% if request.participation.spectate %}
{% trans countdown=contest.end_time|as_countdown %}Spectating, contest ends in {{countdown}}.{% endtrans %}
{% elif request.participation.end_time %}
{% trans countdown=request.participation.end_time|as_countdown %}Participating virtually, {{countdown}} remaining.{% endtrans %}
{% else %}
{{- _('Participating virtually.') -}}
{% endif %}
{%- else -%}
{% if contest.start_time > now %}
{% trans countdown=contest.start_time|as_countdown %}Starting in {{countdown}}.{% endtrans %}
{% elif contest.end_time < now %}
{{- _('Contest is over.') -}}
{% else %}
{%- if has_joined -%}
{% if live_participation.ended %}
{% trans countdown=contest.end_time|as_countdown %}Your time is up! Contest ends in {{countdown}}.{% endtrans %}
{% else %}
{% trans countdown=live_participation.end_time|as_countdown %}You have {{countdown}} remaining.{% endtrans %}
{% endif %}
{%- else -%}
{% trans countdown=contest.end_time|as_countdown %}Contest ends in {{countdown}}.{% endtrans %}
{%- endif -%}
{% endif %}
{%- endif -%}
</a>
<div class="time">
{% if contest.time_limit %}
{% trans trimmed start_time=contest.start_time|date(_("F j, Y, G:i T")), end_time=contest.end_time|date(_("F j, Y, G:i T")), time_limit=contest.time_limit|timedelta('localized-no-seconds') %}
<b>{{ time_limit }}</b> window between <b>{{ start_time }}</b> and <b>{{ end_time }}</b>
{% endtrans %}
{% else %}
{% trans trimmed length=contest.contest_window_length|timedelta("localized-no-seconds"), start_time=contest.start_time|date(_("F j, Y, G:i T")) %}
<b>{{ length }}</b> long starting on <b>{{ start_time }}</b>
{% endtrans %}
{% endif %}
</div>
{% if contest.freeze_after and contest.freeze_after + contest.start_time < now %}
<div class="time" style="margin-top: 0.2em">
<b>{{_("Standing was frozen")}}</b> {{_("at")}} <b>{{ (contest.freeze_after + contest.start_time) | date(_("F j, Y, G:i T")) }}</b>
</div>
{% endif %}
</div>

31
templates/contest/contest-list-tabs.html
View file

@ -1,26 +1,5 @@
{% extends "tabs-base.html" %}
{% block post_tab_spacer %}
{% if tab == 'calendar' %}
<div style="font-size: 1.6em; margin-top: 0.3em">
{% if prev_month %}
<a href="{{ url('contest_calendar', prev_month.year, prev_month.month) }}">&laquo; {{ _('Prev') }}</a>
{% endif %}
{% if not (curr_month.year == now.year and curr_month.month == now.month) %}
<a href="{{ url('contest_calendar', now.year, now.month) }}"> {{ _('Today') }}</a>
{% endif %}
{% if next_month %}
<a href="{{ url('contest_calendar', next_month.year, next_month.month) }}">{{ _('Next') }} &raquo;</a>
{% endif %}
</div>
<span class="spacer"></span>
{% endif %}
{% endblock %}
{% block tabs %}
{{ make_tab('list', 'fa-list', url('contest_list'), _('List')) }}
{{ make_tab('calendar', 'fa-calendar', url('contest_calendar', now.year, now.month), _('Calendar')) }}
{% if perms.judge.change_contest %}
{{ make_tab('admin', 'fa-edit', url('admin:judge_contest_changelist'), _('Admin')) }}
{% endif %}
{% endblock %}
<div class="left-sidebar">
{{ make_tab_item('list', 'fa fa-list', url('contest_list'), _('List')) }}
{{ make_tab_item('calendar', 'fa fa-calendar', url('contest_calendar', now.year, now.month), _('Calendar')) }}
{{ make_tab_item('admin', 'fa fa-edit', url('admin:judge_contest_changelist'), _('Admin')) }}
</div>

55
templates/contest/contest-tabs.html
View file

@ -1,31 +1,4 @@
{% extends "tabs-base.html" %}
{% block tabs %}
{{ make_tab('detail', 'fa-info-circle', url('contest_view', contest.key), _('Info')) }}
{% if contest.ended or can_edit %}
{{ make_tab('stats', 'fa-pie-chart', url('contest_stats', contest.key), _('Statistics')) }}
{% endif %}
{% if contest.start_time <= now or perms.judge.see_private_contest %}
{% if contest.can_see_own_scoreboard(request.user) %}
{{ make_tab('ranking', 'fa-bar-chart', url('contest_ranking', contest.key), _('Rankings')) }}
{% if request.user.is_authenticated %}
{{ make_tab('participation', 'fa-users', url('contest_participation_own', contest.key), _('Participation')) }}
{% endif %}
{% else %}
{{ make_tab('ranking', 'fa-bar-chart', None, _('Hidden Rankings')) }}
{% endif %}
{% endif %}
{% if can_edit %}
{% if perms.judge.moss_contest and has_moss_api_key %}
{{ make_tab('moss', 'fa-gavel', url('contest_moss', contest.key), _('MOSS')) }}
{% endif %}
{{ make_tab('edit', 'fa-edit', url('admin:judge_contest_change', contest.id), _('Edit')) }}
{% endif %}
{% if perms.judge.clone_contest %}
{{ make_tab('clone', 'fa-copy', url('contest_clone', contest.key), _('Clone')) }}
{% endif %}
<div class="left-sidebar">
{% if request.user.is_authenticated %}
{% if contest.can_join or is_editor or is_tester %}
{% set in_contest = contest.is_in_contest(request.user) %}
@ -79,4 +52,28 @@
<input type="submit" class="btn-midnightblue" value="{{ _('Login to participate') }}">
</form>
{% endif %}
{% endblock %}
{{ make_tab_item('detail', 'fa fa-info-circle', url('contest_view', contest.key), _('Info')) }}
{% if contest.ended or can_edit %}
{{ make_tab_item('stats', 'fa fa-pie-chart', url('contest_stats', contest.key), _('Statistics')) }}
{% endif %}
{% if contest.start_time <= now or perms.judge.see_private_contest %}
{% if contest.can_see_own_scoreboard(request.user) %}
{{ make_tab_item('ranking', 'fa fa-bar-chart', url('contest_ranking', contest.key), _('Rankings')) }}
{% if request.user.is_authenticated %}
{{ make_tab_item('participation', 'fa fa-users', url('contest_participation_own', contest.key), _('Participation')) }}
{% endif %}
{% else %}
{{ make_tab_item('ranking', 'fa fa-bar-chart', None, _('Hidden Rankings')) }}
{% endif %}
{% endif %}
{% if can_edit %}
{% if perms.judge.moss_contest and has_moss_api_key %}
{{ make_tab_item('moss', 'fa fa-gavel', url('contest_moss', contest.key), _('MOSS')) }}
{% endif %}
{{ make_tab_item('edit', 'fa fa-edit', url('admin:judge_contest_change', contest.id), _('Edit')) }}
{% endif %}
{% if perms.judge.clone_contest %}
{{ make_tab_item('clone', 'fa fa-copy', url('contest_clone', contest.key), _('Clone')) }}
{% endif %}
</div>

80
templates/contest/contest.html
View file

@ -1,78 +1,24 @@
{% extends "common-content.html" %}
{% block title_ruler %}{% endblock %}
{% block title_row %}
{% set tab = 'detail' %}
{% extends "two-column-content.html" %}
{% set page_type = 'detail' %}
{% block left_sidebar %}
{% set title = contest.name %}
{% include "contest/contest-tabs.html" %}
{% endblock %}
{% block content_js_media %}
<script type="text/javascript">
$(document).ready(function () {
$('.time-remaining').each(function () {
count_down($(this));
});
});
</script>
{% block two_col_js %}
{% include "contest/media-js.html" %}
{% include "comments/media-js.html" %}
{% include "actionbar/media-js.html" %}
{% endblock %}
{% block content_media %}
{% block two_col_media %}
{% include "comments/media-css.html" %}
{% include "actionbar/media-css.html" %}
{% endblock %}
{% block body %}
<div id="banner">
<a href="https://www.timeanddate.com/worldclock/fixedtime.html?msg={{ contest.name|urlquote('') }}&amp;iso=
{{- contest.start_time|utc|date('Y-m-d\TH:i:s') }}" class="date">
{%- if contest.is_in_contest(request.user) and not request.participation.live -%}
{% if request.participation.spectate %}
{% trans countdown=contest.end_time|as_countdown %}Spectating, contest ends in {{countdown}}.{% endtrans %}
{% elif request.participation.end_time %}
{% trans countdown=request.participation.end_time|as_countdown %}Participating virtually, {{countdown}} remaining.{% endtrans %}
{% else %}
{{- _('Participating virtually.') -}}
{% endif %}
{%- else -%}
{% if contest.start_time > now %}
{% trans countdown=contest.start_time|as_countdown %}Starting in {{countdown}}.{% endtrans %}
{% elif contest.end_time < now %}
{{- _('Contest is over.') -}}
{% else %}
{%- if has_joined -%}
{% if live_participation.ended %}
{% trans countdown=contest.end_time|as_countdown %}Your time is up! Contest ends in {{countdown}}.{% endtrans %}
{% else %}
{% trans countdown=live_participation.end_time|as_countdown %}You have {{countdown}} remaining.{% endtrans %}
{% endif %}
{%- else -%}
{% trans countdown=contest.end_time|as_countdown %}Contest ends in {{countdown}}.{% endtrans %}
{%- endif -%}
{% endif %}
{%- endif -%}
</a>
<div class="time">
{% if contest.time_limit %}
{% trans trimmed start_time=contest.start_time|date(_("F j, Y, G:i T")), end_time=contest.end_time|date(_("F j, Y, G:i T")), time_limit=contest.time_limit|timedelta('localized-no-seconds') %}
<b>{{ time_limit }}</b> window between <b>{{ start_time }}</b> and <b>{{ end_time }}</b>
{% endtrans %}
{% else %}
{% trans trimmed length=contest.contest_window_length|timedelta("localized-no-seconds"), start_time=contest.start_time|date(_("F j, Y, G:i T")) %}
<b>{{ length }}</b> long starting on <b>{{ start_time }}</b>
{% endtrans %}
{% endif %}
</div>
{% if contest.freeze_after and contest.freeze_after + contest.start_time < now %}
<div class="time" style="margin-top: 0.2em">
<b>{{_("Standing was frozen")}}</b> {{_("at")}} <b>{{ (contest.freeze_after + contest.start_time) | date(_("F j, Y, G:i T")) }}</b>
</div>
{% endif %}
</div>
{% block middle_content %}
{% include "contest/contest-datetime.html" %}
<div class="content-description">
{% cache 3600 'contest_html' contest.id MATH_ENGINE %}
@ -128,12 +74,4 @@
{% include "actionbar/list.html" %}
<br>
{% include "comments/list.html" %}
{% endblock %}
{% block description_end %}{% endblock %}
{% block bodyend %}
{{ super() }}
{% include "comments/math.html" %}
{% endblock %}
k
{% endblock %}

6
templates/contest/list.html
View file

@ -106,11 +106,7 @@
{% endblock %}
{% block left_sidebar %}
<div class="left-sidebar">
{{ make_tab_item('list', 'fa fa-list', url('contest_list'), _('List')) }}
{{ make_tab_item('calendar', 'fa fa-calendar', url('contest_calendar', now.year, now.month), _('Calendar')) }}
{{ make_tab_item('admin', 'fa fa-edit', url('admin:judge_contest_changelist'), _('Admin')) }}
</div>
{% include "contest/contest-list-tabs.html" %}
{% endblock %}
{% macro contest_head(contest) %}

18
templates/contest/moss.html
View file

@ -1,14 +1,11 @@
{% extends "common-content.html" %}
{% block title_ruler %}{% endblock %}
{% block title_row %}
{% set tab = 'moss' %}
{% set title = contest.name %}
{% extends "two-column-content.html" %}
{% set page_type = 'moss' %}
{% block left_sidebar %}
{% include "contest/contest-tabs.html" %}
{% endblock %}
{% block content_media %}
{% block two_col_media %}
<style>
.panes {
display: flex;
@ -21,7 +18,7 @@
</style>
{% endblock %}
{% block content_js_media %}
{% block two_col_js %}
<script type="text/javascript">
$(function () {
$('.contest-moss').click(function () {
@ -35,7 +32,8 @@
});
</script>
{% endblock %}
{% block body %}
{% block middle_content %}
{% if has_results %}
<table class="table">
<thead>

4
templates/contest/ranking-css.html
View file

@ -1,8 +1,4 @@
<style>
#content-left {
overflow-x: auto;
}
#users-table .username {
min-width: 15em;
}

17
templates/contest/ranking.html
View file

@ -1,9 +1,6 @@
{% extends "user/base-users.html" %}
{% extends "user/base-users-two-col.html" %}
{% block title_ruler %}{% endblock %}
{% block title_row %}
{% set title = contest.name %}
{% block left_sidebar %}
{% include "contest/contest-tabs.html" %}
{% endblock %}
@ -60,7 +57,7 @@
});
</script>
{% endif %}
{% if tab == 'ranking' %}
{% if page_type == 'ranking' %}
<script type="text/javascript">
$.fn.ignore = function(sel) {
return this.clone().find(sel || '>*').remove().end();
@ -128,9 +125,10 @@
{% include "contest/media-js.html" %}
{% endblock %}
{% block users_table %}
{% block before_table %}
{% include "contest/contest-datetime.html" %}
<div style="margin-bottom: 0.5em">
{% if tab == 'participation' %}
{% if page_type == 'participation' %}
{% if contest.can_see_full_scoreboard(request.user) %}
<input id="search-contest" type="text" placeholder="{{ _('View user participation') }}">
{% endif %}
@ -155,5 +153,8 @@
{{ _('Download as CSV') }}
</a>
</div>
{% endblock %}
{% block users_table %}
{% include "contest/ranking-table.html" %}
{% endblock %}

15
templates/contest/stats.html
View file

@ -1,14 +1,11 @@
{% extends "common-content.html" %}
{% extends "two-column-content.html" %}
{% set page_type = 'stats' %}
{% block title_ruler %}{% endblock %}
{% block title_row %}
{% set tab = 'stats' %}
{% set title = contest.name %}
{% block left_sidebar %}
{% include "contest/contest-tabs.html" %}
{% endblock %}
{% block content_js_media %}
{% block two_col_js %}
<script type="text/javascript">
window.stats = {{ stats }};
</script>
@ -39,7 +36,7 @@
{% include "contest/media-js.html" %}
{% endblock %}
{% block content_media %}
{% block two_col_media %}
<style>
.chart {
margin: 10px 0;
@ -47,7 +44,7 @@
</style>
{% endblock %}
{% block body %}
{% block middle_content %}
<h3>{{ _('Problem Status Distribution') }}</h3>
<div id="problem-status-count" class="chart">
<canvas></canvas>

2
templates/organization/users.html
View file

@ -1,4 +1,4 @@
{% extends "user/base-users-three-col.html" %}
{% extends "user/base-users-two-col.html" %}
{% block users_media %}
<style>
.kick-form .button {

11
templates/three-column-content.html
View file

@ -10,8 +10,19 @@
margin-left: 0;
}
.middle-right-content {
margin-left: 13%;
display: inline-flex;
}
/* TODO: remove this */
.middle-content {
margin-left: 0;
max-width: 75%;
width: -webkit-fill-available;
}
.blog-sidebar, .right-sidebar {
width: 25%;
}
}
@media(max-width: 799px) {
#content {

35
templates/user/base-users-three-col.html
View file

@ -1,35 +0,0 @@
{% extends "two-column-content.html" %}
{% block two_col_js %}
{% block users_js_media %}{% endblock %}
{% include "user/base-users-js.html" %}
{% endblock %}
{% block two_col_media %}
<link href="http://fonts.cdnfonts.com/css/jersey-m54" rel="stylesheet">
{% block users_media %}{% endblock %}
{% endblock %}
{% block middle_content %}
<div id="common-content">
<div id="content-left" class="users">
{% if page_obj and page_obj.num_pages > 1 %}
<div style="margin-bottom: 7px; margin-top: 3px;">
{% include "list-pages.html" %}
<form id="search-form" name="form" action="{{ url('user_ranking_redirect') }}" method="get">
<input id="search-handle" type="text" name="search"
placeholder="{{ _('Search by handle...') }}">
</form>
</div>
{% endif %}
<table id="users-table" class="table">
{% block users_table %}{% endblock %}
</table>
{% if page_obj and page_obj.num_pages > 1 %}
<div style="margin-top:10px;">{% include "list-pages.html" %}</div>
{% endif %}
</div>
</div>
{% endblock %}

35
templates/user/base-users-two-col.html Normal file
View file

@ -0,0 +1,35 @@
{% extends "two-column-content.html" %}
{% block two_col_js %}
{% block users_js_media %}{% endblock %}
{% include "user/base-users-js.html" %}
{% endblock %}
{% block two_col_media %}
<link href="http://fonts.cdnfonts.com/css/jersey-m54" rel="stylesheet">
{% block users_media %}{% endblock %}
{% endblock %}
{% block middle_content %}
{% if page_obj and page_obj.num_pages > 1 %}
<div style="margin-bottom: 7px; margin-top: 3px;">
{% include "list-pages.html" %}
<form id="search-form" name="form" action="{{ url('user_ranking_redirect') }}" method="get">
<input id="search-handle" type="text" name="search"
placeholder="{{ _('Search by handle...') }}">
</form>
</div>
{% endif %}
{% block before_table %}{% endblock %}
<div style="overflow-x: auto;">
<table id="users-table" class="table">
{% block users_table %}{% endblock %}
</table>
</div>
{% if page_obj and page_obj.num_pages > 1 %}
<div style="margin-top:10px;">{% include "list-pages.html" %}</div>
{% endif %}
{% endblock %}

35
templates/user/base-users.html
View file

@ -1,35 +0,0 @@
{% extends "common-content.html" %}
{% block js_media %}
{% block users_js_media %}{% endblock %}
{% include "user/base-users-js.html" %}
{% endblock %}
{% block media %}
<link href="http://fonts.cdnfonts.com/css/jersey-m54" rel="stylesheet">
{% block users_media %}{% endblock %}
{% endblock %}
{% block body %}
<div id="common-content">
<div id="content-left" class="users">
{% if page_obj and page_obj.num_pages > 1 %}
<div style="margin-bottom: 7px; margin-top: 3px;">
{% include "list-pages.html" %}
<form id="search-form" name="form" action="{{ url('user_ranking_redirect') }}" method="get">
<input id="search-handle" type="text" name="search"
placeholder="{{ _('Search by handle...') }}">
</form>
</div>
{% endif %}
<table id="users-table" class="table">
{% block users_table %}{% endblock %}
</table>
{% if page_obj and page_obj.num_pages > 1 %}
<div style="margin-top:10px;">{% include "list-pages.html" %}</div>
{% endif %}
</div>
</div>
{% endblock %}

2
templates/user/list.html
View file

@ -1,4 +1,4 @@
{% extends "user/base-users-three-col.html" %}
{% extends "user/base-users-two-col.html" %}
{% block users_media %}
<style>