{% extends 'base_index.html' %}
{% block title %}Сдача Экзамена{% endblock %}
{% block head %}
    <script src="/static/js/ckeditor/ckeditor.js"></script>
    <script src="/static/js/ckeditor/adapters/jquery.js"></script>
{% endblock %}
{% block content %}
<div class="wrapper-md">
        <h1 style="    margin-bottom: 20px;
    margin-top: 0;">Тема №{{ theme.sort }}: {{ theme.title }}</h1>
        <div class="row m-l-xs">
          <div class="panel col-lg-6 p-r-none">
            <div class="wrapper-lg">
              <h2 class="m-t-none text-black">Описание задания</h2>
              <div>
                {{ exam.head.description|safe }}
              </div>
            </div>
                {% if exam.materials %}
                  <div class="col-sm-12">
                    <div draggable="true" class="panel panel-info">
                      <div class="panel-heading">
                        Материалы к заданию
                      </div>
                        {% for i in exam.materials %}
                      <div class="list-group bg-white">
                      {% if i.format == 'I' %}
                        <a href="{{ i.url }}" class="list-group-item" target="_blank" id="single_image">
                        {% else %}
                          <a href="{{ i.url }}" class="list-group-item" target="_blank">
                        {% endif %}
                            {% if i.icon_type != 'class' %}
                                <img src="{{ i.icon }}">
                            {% else %}
                                <i class="{{ i.icon }} text-lg inline text-primary"></i>
                            {% endif %}
                          <span class="clear inline">
                            <span>{{ i.title }}</span>
                            <small class="text-muted clear text-ellipsis">{{ i.name }}</small>
                          </span>
                        </a>
                      </div>
                        {% endfor %}
                    </div>
                  </div>
                {% endif %}
          </div>
          <div class="col-lg-6 pl-fix p-r-none">
            <div class="col-lg-12 p-l-none p-r-none">
                <div class="wrapper-lg">
                        <div style="margin-top: 10px;float: right;margin-right: 20px;margin-left: 20px;">
                            <b>ID: {{ student.id }}</b>
                            <h3 style="font-weight: bold;margin-top:0;" reloader_name="fname">{{ student.fname }}</h3>
                            <h3 style="font-weight: bold;" reloader_name="name">{{ student.name }}</h3>
                            <h3 style="font-weight: bold;" reloader_name="oname">{{ student.oname }}</h3>
                        </div>
                        <div style="float: right;">
                            <span class="thumb-lg w-auto-folded avatar m-t-sm">
                              <img src="{{ student.get_image_url }}" class="img-thumbnail" style="width: 100%;" reloader_name="avatar">
                            </span>

                        </div>
                </div>
            </div>
          </div>
        </div>
<a class="go_to_textarea"><p class="bg-info" style="padding: 10px;text-align: center;font-size: 20px;    border-radius: 5px;">Перейти к последней попытке
    <i class="glyphicon glyphicon-arrow-down" style="    float: right;
    margin-right: 10px;
    margin-top: 5px;"></i> </p></a>
            <div class="row">

            <a name="comment_list_place"></a>
            {% if exam.tries %}
            <h3 style="margin-bottom: 25px;margin-left: 20px;font-weight: bold;border-bottom: 1px dotted #ccc;padding-bottom: 5px;"><i class="glyphicon glyphicon-briefcase"></i>&nbsp;Попыток: (<span name="comments_length">{{ exam.tries|length }}</span>) : </h3>
            {% endif %}
              <div class="col-lg-12" name="exam_comments_block">
              {% if exam.tries %}
                        {% for try in exam.tries %}
                            <div class="m-b b-l m-l-md streamline" name="try_comments_{{ try.id }}" exam_id="{{ exam.head.mid }}">
                                    <div name="try_{{ try.id }}">
                                            <span class="pull-left thumb-sm avatar m-l-n-md">
                                            <img src="/static/img/mini_logo.png" class="img-circle"></span>
                                            <div class="m-l-lg panel b-a" style="background:#CCFFFF;">
                                            <div class="panel-heading pos-rlt b-b b-light">
                                            <span class="arrow left" style="display: none;"></span>
                                            <b>LMS: ~# </b>
                                            <span class="arrow left" style="border-right-color:#CCFFFF;"></span>
                                            <span style="font-size: 16px;color: #666;font-weight: bold;">Попытка №{{ forloop.counter }}</span>
                                                <script>window.last_try = {{ forloop.counter }}</script>

                                            <span class="text-muted m-l-sm pull-right" style="margin-top: -1px;">
                                                <span class="label font-normal text-white bg-{{ try.status.color }}" style="margin-left: 10px;font-size: 19px;font-weight: bold;{{ try.status.styles }}">
                                                    <span class="hidden-sm hidden-xs hidden-md">{{ try.status.title }}</span><i class="{{ try.status.icon }}" style="top: 3px;    margin: 0 15px;"></i>
                                                </span>

                                            </span>
                                            </div>
                                                </div>
                                            <!-- -->
                                    </div>
                                {% for comment in try.comments %}
                                    <a href="comment{{ comment.id }}" {% if forloop.last %} id="go_to_textarea"{% endif %}></a>
                                    <div name="comment_{{ comment.id }}">
                                            <span class="pull-left thumb-sm avatar m-l-n-md">
                                            <img src="{{ comment.owner_avatar }}" class="img-circle"></span>
                                            <div class="m-l-lg panel b-a" style="background: {% if comment.owner_type.flag == 'T' %}#f5fce5{% endif %}">
                                            <div class="panel-heading pos-rlt b-b b-light">
                                            <span class="arrow left" style="display: none;"></span>
                                            <b style="margin-right: 5px;">{{ comment.owner }}</b>
                                            <span class="arrow left" style="border-right-color: {% if comment.owner_type.flag == 'T' %}#f5fce5{% endif %}"></span>
                                            <label class="label {{ comment.owner_type.background }} m-l-xs">{{ comment.owner_type.title }}</label>
                                            <span class="text-muted m-l-sm pull-right">{{ comment.date }}</span>
                                            </div>
                                            <div class="panel-body" readable_comment="{{ comment.id }}">
                                            <div class="m-b-xs">{{ comment.text|safe }}</div>
                                            {% for file in comment.files %}
                                                <div name="message_files" message_id="{{ comment.id }}">
                                                    <div class="panel m-b-none" style="box-shadow: none; border: 1px solid rgba(0, 0, 0, 0.05); padding: 4px; margin-bottom: 3px !important;">
                                                        <a href="{{ file.url }}" target="{% if file.format == 'F' %}_blank{% endif %}" id="">
                                                            <i class="{{ file.icon }} text-primary"></i> &nbsp;{{ file.name }}
                                                        </a>
                                                    </div>
                                                </div>
                                            {% endfor %}
                                            </div>
                                        </div>
                                    </div>
                                {% endfor %}
                            </div>
                        {% endfor %}
                {% endif %}
                      {% if request.user.is_authenticated %}
                          {% if exam.head.status.flag != 'N' and exam.head.status.flag != 'F'  %}
                              <div class="progress" name="sent_comment_progress" style="height: 40px;display: none;">
                                  <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
                                       style="width: 100%; font-weight: bold; font-size: 15px;padding: 10px;">
                                    ОТПРАВКА КОММЕНТАРИЯ
                                  </div>
                              </div>
                                  <a name="comment_send_form_place"></a>
                                <form name="comment_send_form" onsubmit="return false" method="POST">
                                <h3 style="margin-bottom: 15px;margin-left: 20px;font-weight: bold;border-top: 1px dotted #ccc;padding-top: 10px;"><i class="glyphicon glyphicon-comment"></i>&nbsp;ОСТАВИТЬ СООБЩЕНИЕ <span name="reply_info"></span>: </h3>
                                    <div>

                                    </div>
                                <div class="clearfix" style="margin-bottom:10px;">
                                  <div class="form-group">
                                    <div class="col-sm-12 p-r-none">
                                        <input type="text" name="exam_id" readonly value="{{ exam.head.id }}" style="display: none;">
                                        <textarea style="overflow:scroll;height:200px;max-height:200px;width: 100%;border-radius:3px;font-weight: bold;padding: 15px 20px;" name="exam_text" class="form-control"></textarea>
                                    </div>
                                  </div>
                                </div>
                                <div class="form-group">
                                  <div class="col-xs-12 col-sm-12 col-md-9 p-r-none m-b-md" name="files_sketches">

                                  </div>
                                  <div class="col-xs-12 col-sm-12 col-md-3 p-r-none m-b-md">
                                    <button class="btn btn-lg btn-success m-t-xs pull-right" style="    border-radius: 0 20px 20px 0;" onclick="send_exam_up_teacher('comment_send_form', 'form_file_load')">
                                        <i class="glyphicon glyphicon-thumbs-up" style="    margin: 0 10px 0 5px;"></i> Одобрить
                                    </button>
                                      <button class="btn btn-lg btn-danger m-t-xs pull-right" style="    border-radius: 20px 0 0 20px;" onclick="send_exam_down_teacher('comment_send_form', 'form_file_load')">
                                          Отказать <i class="glyphicon glyphicon-thumbs-down" style="    margin: 0 5px 0 10px;"></i>
                                      </button>
                                  </div>

                                </div>
                                  </form>
                                <form enctype='multipart/form-data'
                                          action='/storage/upload_file/'
                                          method='post'
                                          name='load_file'
                                          id="form_file_load_form"
                                          target='hidden_frame'
                                          class="load_file" style="text-align: right; clear: right; margin-bottom: 20px;">
                                    <input type='hidden' name='MAX_FILE_SIZE' value='64000'>
                                        <input id="form_file_load" name='file_load' type='file' data-icon="false" data-classbutton="btn btn-default" data-classinput="form-control inline v-middle input-s"  tabindex="-1"
                                           style="outline: 0;background: #ffc; padding: 5px 10px;border-radius: 5px;margin: auto;position: absolute; clip: rect(0px, 0px, 0px, 0px);" sketch_place="files_sketches">
                                            <button class="btn btn-default" onclick="return false;" style="display: none;" name="form_file_load_progress">
                                                <img src="/static/img/ui-anim_basic_16x16.gif">
                                            </button>
                                                          <div class="bootstrap-filestyle input-group" name="form_file_load_button">
                                                              <span tabindex="0" class="group-span-filestyle input-group-btn" style="text-align: right;">
                                                                  <label for="form_file_load" class="btn btn-default ">
                                                                      <span><span class="glyphicon glyphicon-save-file"></span> Добавить файл</span>
                                                                  </label>
                                                              </span>
                                                          </div>
                                    <input type="text" name="clip_file_id" readonly value="0" style="display: none;">
                                </form>
                          {% endif %}
                  {% else %}
                      <p>Для работы с домашним заданием, авторизуйтесь.</p>
                  {% endif %}
                  </div>
            </div>
        </div>
{% endblock %}
{% block js %}
    <script type="text/javascript" src='/static/js/exam.js'></script>
{% endblock %}