NDOJ/templates/submission/status.html

{% extends "submission/info-base.html" %}
{% block media %}
    <style>
        .line {
            position: relative;
        }

        .highlighter {
            position: absolute;
            width: 9999px;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
        }

        a:active .line .highlighter {
            background: rgba(255, 212, 0, 0.48);
        }

        .copy-clipboard {
            margin-top: 0;
        }

        .testcases-table tbody:last-child {
            border-bottom: none;
        }

        .toggle {
            cursor: pointer;
            font-weight: 400;
        }

        #source-header {
            font-size: 1.54em;
            margin-bottom: 1em;
        }

        .case-icons i {
            font-size: large;
            font-weight: bolder;
            cursor: pointer;
        }
    </style>
{% endblock %}
{% block content_js_media %}
    <script type="text/javascript" src="{{ static('event.js') }}"></script>
    {% if not submission.is_graded and last_msg %}
        <script type="text/javascript">$(function () {
            var blocked = false, request = false;
            var list = $('#test-cases');

            function update() {
                if (blocked) {
                    request = true;
                    return;
                }
                request = false;
                blocked = true;
                $.ajax({
                    url: '{{ url('submission_testcases_query') }}',
                    data: {id: '{{ submission.id }}'}
                }).done(function (data) {
                    data = $(data);
                    list.find(".open").each(function() {
                        var id = $(this).attr("id");
                        data.find("#" + id).removeClass("closed").addClass("open");
                        data.find("#" + id + "-output").show();
                    });
                    list.empty().html(data).find('.toggle').each(function () {
                        register_toggle($(this));
                    });
                    $(".case-icons i").each(function() {
                        $(this).on("click", function() {
                            var id = "tr#" + $(this).attr("id").split("-")[1];
                            $(id).click();
                            $([document.documentElement, document.body]).animate({
                                    scrollTop: $(id).offset().top - 50
                                }, 800);
                        });
                    });
                    setTimeout(function () {
                        blocked = false;
                        if (request)
                            update();
                    }, 500);
                }).fail(function (data) {
                    console.log('Failed to update testcases!');
                });

                if ($(window).scrollTop() + $(window).height() > $(document).height() - 100)
                    $("html, body").animate({scrollTop: $(document).height()}, 0);
            }

            var receiver = new EventReceiver(
                "{{ EVENT_DAEMON_LOCATION }}", "{{ EVENT_DAEMON_POLL_LOCATION }}",
                ['sub_{{ submission.id_secret }}'], {{ last_msg }}, function (message) {
                    switch (message.type) {
                        case 'internal-error':
                        case 'grading-end':
                        case 'compile-error':
                            $('#abort-button').remove();
                            $('#grading-label').remove();
                        case 'test-case':
                        case 'grading-begin':
                        case 'processing':
                            update();
                    }
                }
            )
        });
        </script>
    {% endif %}
{% endblock %}
{% block body %}
    <div style="clear: both"></div>
    <br>
    {% if request.user == submission.user.user or perms.judge.resubmit_other %}
        <div><a href="{{ url('problem_submit', submission.problem.code, submission.id) }}">{{ _('Resubmit') }}</a></div>
    {% endif %}
    {% if perms.judge.rejudge_submission %}
        <div>
            <form action="{{ url('submission_rejudge') }}" method="post">
                {% csrf_token %}
                <a href="#" onclick="parentNode.submit()">{{ _('Rejudge') }}</a>
                <input type="hidden" name="id" value="{{ submission.id }}">
                <input type="hidden" name="path" value="{{ url('submission_status', submission.id) }}">
            </form>
        </div>
    {% endif %}

    <br>
    <h3 id="source-header" class="toggle closed"><i class="fa fa-chevron-right fa-fw"></i>{{_('Source code')}}</h3>
    <div class="source-wrap toggled" style="display: none; margin-bottom: 1em">
        <table style="width: 100%">
            <tr>
                <td class="source-ln" style="width: 0">
                    <div>
                        {% for line in raw_source.split('\n') %}
                            <a href="#line-{{ loop.index }}" name="line-{{ loop.index }}">
                                <pre class="line">{{ loop.index }}</pre>
                            </a>
                        {% endfor %}
                    </div>
                </td>
                <td class="source-code">{{ highlighted_source }}</td>
            </tr>
        </table>
    </div>

    <div id="test-cases">{% include "submission/status-testcases.html" %}</div>
    {% if not submission.is_graded %}
        {% if perms.judge.abort_any_submission %}
            <div id="abort-button">
                <br>
                <hr>
                <br>
                <form action="{{ url('submission_abort', submission.id) }}" method="post">
                    {% csrf_token %}
                    <input style="float:left" type="submit" value="{{ _('Abort') }}" class="button">
                    <br><br>
                </form>
            </div>
        {% endif %}
    {% endif %}
{% endblock %}