{% extends "dashboard/base.html" %}
{% load crispy_forms_tags %}
{% load i18n %}
{% load static %}

{% block title-page %}{{ exam.name }} | {% trans "group" %}{% endblock %}

{% block content %}

<div class="row">
  <div class="col-md-7">
    <div class="panel panel-default">
  <div class="panel-heading">
    <div class="pull-right" style="padding-top: 15px;">
      <a title="{% trans "Rename" %}" class="btn btn-default btn-xs exam-details-rename-button">
        <i class="fa fa-pencil"></i>
      </a>
      <a title="{% trans "Delete" %}" data-exam-pk="{{ exam.pk }}" class="btn btn-default btn-xs real-link exam-delete" href="{% url "dashboard.views.exam-delete" pk=exam.pk %}">
        <i class="fa fa-trash-o"></i>
      </a>
    </div>
    <h1>
      <form action="" method="POST" id="exam-details-rename-form" class="js-hidden">
        {% csrf_token %}
        <div class="input-exam">
          <input id="exam-details-rename-name" class="form-control" name="new_name"
            type="text" value="{{ exam.name }}" required />
          <span class="input-group-btn">
            <button type="submit" id="exam-details-rename-submit" class="btn">
              {% trans "Rename" %}
            </button>
          </span>
        </div>
      </form>
      <div id="exam-details-h1-name">
        <span class="no-js-hidden">{{ exam.name }}</span>
      </div>
    </h1>
  </div><!-- .page-header -->
  <div class="row">
    <div class="col-md-12" id="exam-detail-pane">
      <div class="panel panel-default panel-body" id="exam-detail-panel">
        <dl id="description">
          <dt style="margin-top: 5px;">
            {% trans "Description" %}:
            {% if is_operator %}
              <a href="#" class="exam-details-home-edit-description-click"><i class="fa fa-pencil"></i></a>
            {% endif %}
          </dt>
          <dd>
            {% csrf_token %}
            <div class="exam-details-home-edit-description-click">
              <div class="exam-details-home-edit-description">{{ exam.description|linebreaks }}</div>
            </div>
            <div id="exam-details-home-description" class="js-hidden">
              <form method="POST">
                <textarea name="new_description" class="form-control">{{ exam.description }}</textarea>
                <button type="submit" class="btn btn-xs btn-success exam-details-description-submit
                  {% if not is_operator %}disabled{% endif %}">
                  <i class="fa fa-pencil"></i> {% trans "Update" %}
                </button>
              </form>
            </div>
          </dd>
        </dl>
        <hr />
          <h3 id="exam-detail-template-header">{% trans "Template" %}</h3>
          <form action="." method="post">{% csrf_token %}
            <select class="form-control" name="new-template"{% if not templates %} disabled{% endif %}>
              {% if not exam.template.pk %} <option value="-1" selected="selected">---</option>{%endif%}
              {% for template in templates %}
              <option{% if template.pk == exam.template.pk %} selected="selected"{%endif%} value="{{template.pk}}">{{template.name}}</option>
              {% endfor %}
            </select>
            <br />
            <div class="form-actions">
              <button type="submit" class="btn btn-success">{% trans "Save" %}</button>
            </div>
          </form>
        <hr />
          <h3 id="exam-detail-users-header">
            {% trans "Examenees" %}
            <a data-exam_pk="{{ exam.pk }}" href="{% url "dashboard.views.exam-detail.remove-all-user" exam_pk=exam.pk %}" class="btn btn-danger exam-remove-all-btn pull-right">
              {% trans "Remove all users" %}
            </a>
          </h3>
          <form action="" method="post">{% csrf_token %}
          <table class="table table-striped table-with-form-fields table-bordered" id="exam-detail-user-table">
            <tbody>
              <thead><tr><th></th><th>{% trans "Who" %}</th><th>{% trans "Remove" %}</th></tr></thead>
                {% for i in users %}
                  <tr>
                    <td>
                      <img class="profile-avatar" src="{{ i.profile.get_avatar_url}}"/>
                    </td>
                    <td>
                      <a href="{% url "dashboard.views.profile" username=i.username %}" title="{{ i.username }}"
                        >{% include "dashboard/_display-name.html" with user=i show_org=True %}</a>
                    </td>
                    <td>
                      <a data-member_pk="{{i.pk}}" href="{% url "dashboard.views.exam-detail.remove-user" exam_pk=exam.pk user_pk=i.pk %}" class="real-link delete-from-group btn btn-link btn-xs"><i class="fa fa-times">
                          <span class="sr-only">{% trans "remove" %}</span></i>
                      </a>
                    </td>
                  </tr>
                {% endfor %}
                <tr>
                  <td><i class="fa fa-plus"></i></td>
                  <td colspan="2">
                    {{addmemberform.new_member}}
                  </td>
                </tr>
              </tbody>
            </table>
            <textarea name="new_members" class="form-control"
              placeholder="{% trans "Add multiple users at once (one identifier per line)." %}"></textarea>
            <div class="form-actions">
              <button type="submit" class="btn btn-success">{% trans "Save" %}</button>
            </div>
          </form>
        <hr />
        <h3 id="exam-detail-perm-header">{% trans "Access permissions" %}</h3>
        {% include "dashboard/_manage_access.html" with table_id="exam-detail-perm-table" %}
      </div>
    </div>
  </div>
    </div>
  </div>
  <div class="col-md-5">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="no-margin"><i class="fa fa-desktop"></i> {% trans "Virtual machines"  %}</h4>
      </div>
      <div class="panel-body">
        <a href="{% url "dashboard.views.exam-start" pk=exam.pk %}" class="btn btn-xs btn-success mass-operation"
          title="Deploy">
          <i class="fa fa-play"></i>
        </a>
        <a href="{% url "dashboard.views.exam-shutdown" pk=exam.pk %}" class="btn btn-xs btn-warning mass-operation"
          title="Shutdown">
          <i class="fa fa-power-off"></i>
        </a>
        <a href="{% url "dashboard.views.exam-stop" pk=exam.pk %}" class="btn btn-xs btn-warning mass-operation"
          title="Shut off">
          <i class="fa fa-plug"></i>
        </a>
        <a href="{% url "dashboard.views.exam-destroy" pk=exam.pk %}" class="btn btn-xs btn-danger mass-operation"
          title="Destroy">
          <i class="fa fa-times"></i>
        </a>
        <hr />

        <div class="table-responsive">
          <table class="table table-bordered table-striped table-hover vm-list-table"
           id="vm-list-table">
            <thead><tr>
                <th data-sort="string" class="orderable sortable">
                  {% trans "Owner" as t %}
                  {% include "dashboard/vm-list/header-link.html" with name=t sort="owner" %}
                </th>
                <th data-sort="string">
                  {% trans "State" as t %}
                  {% include "dashboard/vm-list/header-link.html" with name=t sort="status" %}
                </th>
                <th data-sort="string" class="name orderable sortable">
                  {% trans "Name" as t %}
                  {% include "dashboard/vm-list/header-link.html" with name=t sort="name" %}
                </th>
            </tr></thead><tbody>
            {% for instance in instances %}
            <tr class="{% cycle 'odd' 'even' %}" data-vm-pk="{{ instance.pk }}">
              <td>
                <a href="{% url "dashboard.views.profile" username=instance.owner.username %}" title="{{ instance.owner.username }}">
                  {% include "dashboard/_display-name.html" with user=instance.owner show_org=True %}
                </a>
              </td>
              <td class="state">
                <i class="fa fa-fw
                  {% if show_acts_in_progress and instance.is_in_status_change %}
                    fa-spin fa-spinner
                  {% else %}
                  {{ instance.get_status_icon }}{% endif %}"></i>
                <span>{{ instance.get_status_display }}</span>
              </td>
              <td class="name"><a class="real-link" href="{% url "dashboard.views.detail" instance.pk %}">
                  {{ instance.name }}</a>
              </td>
            </tr>
            {% empty %}
            <tr>
              <td colspan="7">
                {% if request.GET.s %}
                  <strong>{% trans "No result." %}</strong>
                {% else %}
                  <strong>{% trans "You have no virtual machines." %}</strong>
                {% endif %}
              </td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
        </div><!-- .table-responsive -->
      </div>
    </div>
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="no-margin"><i class="fa user"></i> {% trans "Owner"  %}</h4>
      </div>
        {% if is_owner %}
        {% blocktrans %}You are the current owner of this template.{% endblocktrans %}
        {% else %}
        {% url "dashboard.views.profile" username=object.owner.username as url %}
        {% blocktrans with owner=object.owner name=object.owner.get_full_name%}
          The current owner of this template is <a href="{{url}}">{{name}} ({{owner}})</a>.
        {% endblocktrans %}
        {% endif %}
        {% if is_owner or user.is_superuser %}
        <br />
        <a href="{% url "dashboard.views.exam-transfer-ownership" exam.pk %}"
           class="btn btn-link tx-tpl-ownership">{% trans "Transfer ownership..." %}</a>
        {% endif %}
    </div>
    {% if is_owner %}
    <div class="panel panel-default">
      <div class="panel-heading">
        <a href="{% url "dashboard.views.exam-delete" pk=exam.pk %}"
         class="btn btn-xs btn-danger pull-right template-delete">
          {% trans "Delete" %}
        </a>
        <h4 class="no-margin"><i class="fa fa-times"></i> {% trans "Delete Exam"  %}</h4>
      </div>
    </div>
    {% endif %}
  </div>
</div>
{% endblock %}
