{% extends 'base_main.html' %}

{% block title %}{{ task.name }}{% endblock %}

{% block scripts %}
    function deleteFile(file_id) {
        $.ajax({
            type: "POST",
            url: "/admin/task?task_id={{ task.id }}",
            data: {"id": file_id, "csrfmiddlewaretoken": document.getElementsByName("csrfmiddlewaretoken")[0].value, "action": "delete_file"},
            success: function(data) {
                if (data == "ok") {
                    var elem = document.getElementById("file_" + file_id);
                    elem.parentNode.removeChild(elem);
                }
            }
        });
    }
    function setActionCreate(action) {
        document.getElementById('action_create').value = action;
    }
{% endblock %}

{% block main %}
    <h3 style="margin-bottom: 40px;">Настройки задачи <a data-toggle="modal" data-target="#exampleModalLongcheck"><i class="fa fa-eye"></i></a></h3>
    <div class="modal fade bd-example-modal-lg" id="exampleModalLongcheck" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitlecheck" aria-hidden="true">
                  <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content">
                      <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLongTitlecheck">Предпросмотр</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                        </button>
                      </div>
                      <div class="modal-body">
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-12">
                                    <iframe src="/task?task_id={{ task.id }}" style="width: 100%; height: 1000px;" embedded=true></iframe>
                                </div>
                            </div>
                        </div>
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times"></i> Закрыть</button>
                        <input id="action_create" type="hidden" name="action" value="">
                      </div>
                    </div>
                  </div>
                </div>
    <form method="POST">
        {% csrf_token %}
        <table style="width: 100%;">
            <tr>
                <td style="width: 250px;">
                    Название задачи
                </td>
                <td>
                    <h4><input type="text" value="{{ task.name }}" name="name" class="task-settings-input" placeholder="Новая задача"></h4>
                </td>
            </tr>
            <tr>
                <td>
                    Легенда
                </td>
                <td>
                    <textarea class="task-settings-input task-settings-textarea" name="legend">{{ task.legend }}</textarea>
                </td>
            </tr>
            <tr>
                <td>
                    Формат входных данных
                </td>
                <td>
                    <textarea class="task-settings-input task-settings-textarea" name="input_format">{{ task.input_format }}</textarea>
                </td>
            </tr>
            <tr>
                <td>
                    Формат выходных данных
                </td>
                <td>
                    <textarea class="task-settings-input task-settings-textarea" name="output_format">{{ task.output_format }}</textarea>
                </td>
            </tr>
            <tr>
                <td>
                    Примечания
                </td>
                <td>
                    <textarea class="task-settings-input task-settings-textarea" name="specifications">{{ task.specifications }}</textarea>
                </td>
            </tr>
            <tr>
                <td>
                    Ограничение по времени (мс)
                </td>
                <td>
                    <input type="text" name="time_limit" value="{{ task.time_limit }}" class="task-settings-input">
                </td>
            </tr>
            <tr>
                <td>
                    Оценка времени решения (мин)
                </td>
                <td>
                    <input type="text" name="time_estimation" value="{{ task.time_estimation }}" class="task-settings-input">
                </td>
            </tr>
            <tr>
                <td>
                    Публичная задача
                </td>
                <td>
                    <input type="checkbox" name="public" {% if task.public %}checked {% endif %}class="task-settings-input">
                </td>
            </tr>
        </table>
        <button type="submit" class="btn btn-light" style="margin-top: 15px;"><i class="fa fa-save"></i> Сохранить</button>
    </form>
    <hr><hr>
    <h3>Редакторы</h3>
    {% for editor in task.editors %}
        <i class="fa fa-user"></i> <a href="/account?username={{ editor }}">{{ editor }}</a><br>
    {% endfor %}
        <button type="button" class="btn btn-primary" style="margin-top: 20px;" data-toggle="modal" data-target="#exampleU"><i class="fa fa-pencil"></i> Редактировать</button>
        <div class="modal fade" id="exampleU" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitleU" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <form method="POST">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLongTitleU">Редактировать редакторов таска</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-12">
                                    {% csrf_token %}
                                    <input type="hidden" name="action" value="users_edit">
                                    {% for u in user.userinfo.verified_friends %}
                                        <input type="checkbox" {% if u.username in task.editors %}checked{% endif %} name="user_{{ u.username }}"> <a href="/account?username={{ u.username }}">{{ u.username }}</a><br>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times-circle"></i> Закрыть</button>
                        <button type="submit" class="btn btn-success"><i class="fa fa-check"></i> Установить</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <hr><hr>
    <h3 style="margin-bottom: 40px;">Загрузка тестов и файлов</h3>
        <p style="color: red">{{ error_message }}</p>
        <table style="width: 80%;">
            <tr>
                <td>
                    <h4>Тесты</h4>
                </td>
                <td>
                    <h4>Файлы</h4>
                </td>
            </tr>
            <tr>
                <td valign="top">
                    {% for test in task.tests %}
                        <div id="file_{{ test.id }}">
                        <i class="fa fa-file"></i> <button class="btn btn-link" {% if not test.readable %}style="color: red;" {% else %}data-toggle="modal" data-target="#filesModalLong{{ test.id }}"{% endif %}>{{ test.filename }}</button><button class="btn btn-link" style="color: black;" onclick="deleteFile({{ test.id }});"><i class="fa fa-times"></i> </button><br>
                    {% if test.readable %}
<form method="POST">{% csrf_token %}
                        <!-- Modal -->
                        <div class="modal fade bd-example-modal-lg" id="filesModalLong{{ test.id }}" tabindex="-1" role="dialog" aria-labelledby="filesModalLongTitle{{ test.id }}" aria-hidden="true">
                          <div class="modal-dialog modal-lg" role="document">
                            <div class="modal-content">
                              <div class="modal-header">
                                <h5 class="modal-title" id="filesModalLongTitle{{ test.id }}">{{ test.filename }}</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                              </div>
                              <div class="modal-body">
                                <div class="container-fluid">
                                    <div class="row">
                                        <div class="col-12">
<textarea cols="82" rows="30" name="text">{{ test.text }}</textarea>
                                        </div>
                                    </div>
                                </div>
                              </div>
                              <div class="modal-footer">
                                {% if test.can_be_sample %}Использовать как пример <input type="checkbox" name="is_sample" {% if test.is_sample %}checked{% endif %}>{% endif %}
                                <button type="button" class="btn btn-secondary" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
                                  <input name="action" value="save_test" type="hidden">
                                  <input name="test_id" value="{{ test.id }}" type="hidden">
                                <button type="submit" class="btn btn-primary"><i class="fa fa-save"></i> Save</button>
                              </div>
                            </div>
                          </div>
                        </div>
                        </form>
                        {% endif %}
                    {% endfor %}
                    <input type="file" style="display: none;" form="form_test_upload" onchange="this.form.submit();" class="btn form-control-file" id="test-upload" value="Выбрать файл" name="file">
                    <label for="test-upload" class="btn btn-primary"><i class="fa fa-upload"></i> Загрузить тесты</label><button style="margin-left: 10px; margin-top: -8px;" class="btn btn-success" data-toggle="modal" data-target="#exampleModalLongnewtest" onclick="setActionCreate('create_test');"><i class="fa fa-plus"></i></button>
                    <form method="POST">
                        {% csrf_token %}
                        <div class="modal fade" id="exampleModalLongnewtest" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitlenewtest" aria-hidden="true">
                              <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                  <div class="modal-header">
                                    <h5 class="modal-title" id="exampleModalLongTitlenewtest">Создать новый тест</h5>
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                      <span aria-hidden="true">&times;</span>
                                    </button>
                                  </div>
                                  <div class="modal-body">
                                    <div class="container-fluid">
                                        <div class="row">
                                            <div class="col-12">
                                                <input type="text" placeholder="Имя теста" name="newfile_name">
                                            </div>
                                        </div>
                                    </div>
                                  </div>
                                  <div class="modal-footer">
                                    <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times"></i> Закрыть</button>
                                    <button type="submit" class="btn btn-success"><i class="fa fa-file"></i> Создать</button>
                                    <input id="action_create" type="hidden" name="action" value="create_test">
                                  </div>
                                </div>
                              </div>
                            </div>
                    </form>
                </td>
                <td valign="top">
                    {% for test in task.files %}
                        <div id="file_{{ test.id }}">
                       <i class="fa {% if test.filename == "checker.py" %}fa-cogs{% else %}fa-file{% endif %}"></i> <button class="btn btn-link" {% if not test.readable %}style="color: red;" {% else %}data-toggle="modal" data-target="#filesModalLong{{ test.id }}"{% endif %}>{{ test.filename }}</button><button class="btn btn-link" style="color: black;" onclick="deleteFile({{ test.id }});"><i class="fa fa-times"></i> </button><br>
                    {% if test.readable %}
<form method="POST">{% csrf_token %}
                        <!-- Modal -->
                        <div class="modal fade bd-example-modal-lg" id="filesModalLong{{ test.id }}" tabindex="-1" role="dialog" aria-labelledby="filesModalLongTitle{{ test.id }}" aria-hidden="true">
                          <div class="modal-dialog modal-lg" role="document">
                            <div class="modal-content">
                              <div class="modal-header">
                                <h5 class="modal-title" id="filesModalLongTitle{{ test.id }}">{{ test.filename }}</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                              </div>
                              <div class="modal-body">
                                <div class="container-fluid">
                                    <div class="row">
                                        <div class="col-12">
<textarea cols="82" rows="30" name="text">{{ test.text }}</textarea>
                                        </div>
                                    </div>
                                </div>
                              </div>
                              <div class="modal-footer">
                                {% if test.can_be_sample %}Использовать как пример <input type="checkbox" name="is_sample" {% if test.is_sample %}checked{% endif %}>{% endif %}
                                <button type="button" class="btn btn-secondary" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
                                  <input name="action" value="save_test" type="hidden">
                                  <input name="test_id" value="{{ test.id }}" type="hidden">
                                <button type="submit" class="btn btn-primary"><i class="fa fa-save"></i> Save</button>
                              </div>
                            </div>
                          </div>
                        </div>
                        </form>
                        {% endif %}
                        </div>
                    {% endfor %}
                    <input type="file" style="display: none;" form="form_file_upload" onchange="this.form.submit();" class="btn form-control-file" id="file-upload" value="Выбрать файл" name="file">
                    <label for="file-upload" class="btn btn-primary"><i class="fa fa-upload"></i> Загрузить файлы</label><button style="margin-left: 10px; margin-top: -8px;" class="btn btn-success" data-toggle="modal" data-target="#exampleModalLongnewfile" onclick="setActionCreate('create_file');"><i class="fa fa-plus"></i></button>
                    <form method="POST">
                        {% csrf_token %}
                        <div class="modal fade" id="exampleModalLongnewfile" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitlenewfile" aria-hidden="true">
                              <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                  <div class="modal-header">
                                    <h5 class="modal-title" id="exampleModalLongTitlenewfile">Создать новый файл</h5>
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                      <span aria-hidden="true">&times;</span>
                                    </button>
                                  </div>
                                  <div class="modal-body">
                                    <div class="container-fluid">
                                        <div class="row">
                                            <div class="col-12">
                                                <input type="text" placeholder="Имя файла" name="newfile_name">
                                            </div>
                                        </div>
                                    </div>
                                  </div>
                                  <div class="modal-footer">
                                    <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times"></i> Закрыть</button>
                                    <button type="submit" class="btn btn-success"><i class="fa fa-file"></i> Создать</button>
                                    <input id="action_create" type="hidden" name="action" value="create_file">
                                  </div>
                                </div>
                              </div>
                            </div>
                    </form>
                </td>
            </tr>
        </table>

{% endblock %}