NDOJ/templates/contest/ranking.html

{% extends "user/base-users.html" %}

{% block title_ruler %}{% endblock %}

{% block title_row %}
    {% set title = contest.name %}
    {% include "contest/contest-tabs.html" %}
{% endblock %}

{% block users_media %}
    <link href="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.css" type="text/css" rel="stylesheet" />

    <style>
        #content-left {
            overflow-x: auto;
        }

        #users-table .username {
            min-width: 20em;
        }

        #users-table td {
            height: 2.5em;
        }

        #users-table a {
            display: block;
        }

        .userinfo a, .user-name a, .user-name form {
            display: inline !important;
        }

        #users-table th a, #users-table th a:link, #users-table th a:visited {
            color: white;
        }

        #users-table th a:hover {
            color: #0F0;
        }

        #users-table td a:hover {
            text-decoration: underline;
        }

        .first-solve {
            background: #00f9a1;
        }

        .rank {
            min-width: 2.5em
        }

        .points {
            min-width: 2.5em;
        }

        .disqualified {
            background-color: #ffa8a8 !important;
        }

        .full-score, .full-score a {
            font-weight: bold;
            color: green;
        }

        .partial-score, .partial-score a {
            color: green;
        }

        .failed-score, .failed-score a {
            font-weight: bold;
            color: red;
        }

        .pretest-full-score, .pretest-full-score a {
            font-weight: bold;
            color: #2980b9;
        }

        .pretest-partial-score, .pretest-partial-score a {
            color: #2980b9;
        }

        .pretest-failed-score, .pretest-failed-score a {
            font-weight: bold;
            color: red;
        }

        .user-points {
            font-weight: bold;
            color: black;
        }

        .solving-time {
            color: gray;
            font-weight: normal;
            font-size: 0.75em;
            padding-bottom: -0.75em;
        }

        .point-denominator {
            border-top: 1px solid gray;
            font-size: 0.7em;
        }

        .start-time {
            display: none;
        }

        .user-name {
            position: relative;
        }

        .organization-column {
            display: none;
            text-align: left !important;
            border-right: none !important;
        }

        .organization-column a {
            color: gray !important;
            font-weight: 600;
        }

        .fullname-column {
            text-align: right !important;
            border-right: none !important;
        }

        .fullname-column span {
            color: gray !important;
            font-weight: 600;
        }

        .featherlight-content {
            border-radius: 10px;
            height: 80%;
            width:  60%;
            overflow: auto;
        }

        .featherlight {
            /*position: re;*/
        }
    </style>

    {% if has_rating %}
        <style>#users-table .rate-box {
            font-size: 0.85em;
            float: left;
        }

        #users-table td:nth-child(1) .rating {
            margin-left: 1.25em;
            display: block;
        }

        #users-table td:nth-child(2) a {
            display: block;
        }
        </style>
    {% endif %}

    <style>
        .select2-selection__arrow {
            display: none;
        }

        .select2-selection__rendered {
            cursor: text;
            overflow: initial !important
        }

        .select2-results__option--highlighted {
            background-color: #DEDEDE !important;
        }

        .select2-results__option {
            white-space: nowrap;
        }

        #search-contest, #search-contest + .select2 {
            margin-top: 0.5em;
        }

        #search-contest {
            width: 200px;
            height: 2.3em;
        }
        html.with-featherlight {
            overflow: unset;
        }
    </style>
{% endblock %}

{% block users_js_media %}
    {% if can_edit %}
        <script type="text/javascript">
            $(function () {
                $('a.disqualify-participation').click(function (e) {
                    e.preventDefault();
                    if (e.ctrlKey || e.metaKey || confirm("{{ _('Are you sure you want to disqualify this participation?') }}"))
                        $(this).closest('form').submit();
                })
                $('a.un-disqualify-participation').click(function (e) {
                    e.preventDefault();
                    if (e.ctrlKey || e.metaKey || confirm("{{ _('Are you sure you want to un-disqualify this participation?') }}"))
                        $(this).closest('form').submit();
                })
            });
        </script>
    {% endif %}
    {% if perms.judge.change_contestparticipation %}
        <script type="text/javascript">
            $(function () {
                $('td.user').find('a.user-name').click(function (e) {
                    var data = $(this).siblings('.edit-participation');
                    if (e.altKey && data.length) {
                        window.open(data.attr('data-link'), '_blank');
                        return false;
                    }
                });
            });
        </script>
    {% endif %}
    {% if not contest.ended %}
        <script type="text/javascript">
            $(function () {
                window.install_tooltips = function () {
                    $('td.user').find('a.user-name').each(function () {
                        var link = $(this);
                        link.mouseenter(function (e) {
                            var start_time = link.siblings('.start-time').text();
                            link.addClass('tooltipped tooltipped-e').attr('aria-label', start_time);
                        }).mouseleave(function (e) {
                            link.removeClass('tooltipped tooltipped-e').removeAttr('aria-label');
                        });
                    });
                };

                install_tooltips();
            });
        </script>
    {% endif %}
    {% include "contest/media-js.html" %}
{% endblock %}

{% block users_table %}
    <div style="margin-bottom: 0.5em">
        {% if tab == 'participation' %}
            {% if contest.can_see_full_scoreboard(request.user) %}
                <input id="search-contest" type="text" placeholder="{{ _('View user participation') }}">
            {% endif %}
        {% endif %}
        <input id="show-organizations-checkbox" type="checkbox" style="vertical-align: bottom">
        <label for="show-organizations-checkbox" style="vertical-align: bottom; margin-right: 1em;">{{ _('Show organizations') }}</label>
    
        <input id="show-fullnames-checkbox" type="checkbox" style="vertical-align: bottom">

        <label for="show-fullnames-checkbox" style="vertical-align: bottom; margin-right: 1em;">{{ _('Show full name') }}</label>
        {% if request.user.is_authenticated %}
        <input id="show-friends-checkbox" type="checkbox" style="vertical-align: bottom;">
        <label for="show-friends-checkbox" style="vertical-align: bottom; margin-right: 1em;">{{ _('Show friends only') }}</label>
        {% endif %}
        <input id="show-total-score-checkbox" type="checkbox" style="vertical-align: bottom; ">
        <label for="show-total-score-checkbox" style="vertical-align: bottom; margin-right: 1em;">{{ _('Total score only') }}</label>
        <input id="show-virtual-checkbox" type="checkbox" style="vertical-align: bottom;">
        <label id="show-virtual-label" for="show-virtual-checkbox" style="vertical-align: bottom; margin-right: 1em;">{{ _('Show virtual participation') }}</label>
        <img src="{{static('loading.gif')}}" style="height: 1em; display:none;" id="loading-gif"></img>
    </div>
    {% include "contest/ranking-table.html" %}
{% endblock %}