{% extends 'layouts/base.html' %}

{% load filters %}

{% block javascripts %}
<link rel="stylesheet"
          href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.2.0/build/styles/default.min.css">
        <script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.2.0/build/highlight.min.js"></script>
        <script>hljs.highlightAll();</script>

{% endblock %}

{% block content %}
    <div class="card border-0 shadow mb-4">
        <div class="card-body">
            <h4>
            <table class="table" style="width: 50%;">
                <tr>
                    <td>
                        Id решения
                    </td>
                    <td>
                        {{ solution.id }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Пользователь
                    </td>
                    <td>
                        <a href="/account?username={{ solution.user.username }}"><img src="{{ solution.user.userinfo.profile_pic_url }}" width="30px" height="30px" style="border-radius: 50%; margin-right: 10px;">{{ solution.user.username }}</a>
                    </td>
                </tr>
                <tr>
                    <td>
                        Задача
                    </td>
                    <td>
                        <a href="/task?{% if solution.set %}{% with settask=solution.set|settask:solution.task %}setTask_id={{ settask.id }}{% endwith %}{% else %}task_id={{ solution.task.id }}{% endif %}">{{ solution.task.name }}</a>
                    </td>
                </tr>
                <tr>
                    <td>
                        Время отправки
                    </td>
                    <td>
                        {{ solution.time_sent }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Язык
                    </td>
                    <td>
                        <img src="{{ solution.language.logo_url }}" width="30px" height="30px"> {{ solution.language.name }}
                    </td>
                </tr>
                <tr>
                    <td>
                        Результат
                    </td>
                    <td>
                        <span class="badge bg-{% if solution.result == in_queue_status %}secondary{% else %}{% if solution.result == ok_status %}success{% else %}{% if solution.result|startswith:testing_status %}info{% else %}danger{% endif %}{% endif %}{% endif %}">{% if solution.result == testing_status %}<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="circle-notch" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" style="width: 20px;" class="svg-inline--fa fa-circle-notch fa-w-16 fa-spin fa-lg"><path fill="currentColor" d="M288 39.056v16.659c0 10.804 7.281 20.159 17.686 23.066C383.204 100.434 440 171.518 440 256c0 101.689-82.295 184-184 184-101.689 0-184-82.295-184-184 0-84.47 56.786-155.564 134.312-177.219C216.719 75.874 224 66.517 224 55.712V39.064c0-15.709-14.834-27.153-30.046-23.234C86.603 43.482 7.394 141.206 8.003 257.332c.72 137.052 111.477 246.956 248.531 246.667C393.255 503.711 504 392.788 504 256c0-115.633-79.14-212.779-186.211-240.236C302.678 11.889 288 23.456 288 39.056z" class=""></path></svg> {% endif %}{{ solution.result }}</span>
                    </td>
                </tr>
            </table>
            </h4>
        </div>
    </div>
    <div class="card border-0 shadow mb-4">
        <div class="card-body">
            {% for entity in solution.files %}
                <h5>{{ entity.filename }}</h5>
<pre><code class="{{ entity.highlight }}" style="border: 1px solid black;">{{ entity.text }}</code></pre>
            {% endfor %}
        </div>
    </div>
            {% if solution.task.creator == user or user.username in solution.task.editors or solution.set and solution.set.creator == user or solution.set and user.username in solution.set.editors %}
                {% for key, value in solution.extras.items %}
                    <div class="card border-0 shadow mb-4">
                        <div class="card-body">
                            <h1 class="h6">Тест {{ key }}</h1>
                            Затраченное время: {{ value.time_spent }} мс
                            <div class="row">
                                <div class="col-4" style="background-color: #DDDDDD;">
                                    Ожидаемый вывод:<br>
                                    {{ value.predicted }}
                                </div>
                                <div class="col-4"></div>
                                <div class="col-4" style="background-color: #DDDDDD;">
                                    Фактический вывод:<br>
                                    {{ value.output }}
                                </div>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            {% endif %}
{% endblock %}