Rewrite contest UI

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

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>

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>

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>

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>

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 %}

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) %}

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>

View file

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

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 %}

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>