text: {% extends 'base.html' %}
  
  {% load staticfiles %}
  
  {% block title %}{{ review.title }}{% endblock %}
  
  {% block javascript %}
    <script>
    var contacts = [
      {% for contact in user.profile.get_following %}
        { 
          pk: '{{ contact.pk }}', 
          email: '{{ contact.email }}', 
          name: '{{ contact.profile.get_screen_name }}' 
        }{% if not forloop.last %}, {% endif %}
      {% endfor %}
    ];
    </script>
    <script src="{% static 'js/review.js' %}?_=1"></script>
  {% endblock %}
  
  {% block content %}
  
    {% include "reviews/review_header.html" with active_menu="review" %}
  
    <div class="row">
      <div class="col-sm-7 col-md-8 col-lg-9">
        <form method="post">
          {% csrf_token %}
          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Review details</h3>
            </div>
            <div class="panel-body">
              {% include 'form_vertical.html' with form=form %}
            </div>
            <div class="panel-footer">
              <button type="submit" class="btn btn-success">
                <span class="glyphicon glyphicon-ok"></span>
                Save
              </button>
            </div>
          </div>
        </form>
      </div>
      <div class="col-sm-5 col-md-4 col-lg-3">
        <div class="panel panel-default">
          <div class="panel-heading">
            <h3 class="panel-title">Authors</h3>
          </div>
          <ul class="list-group authors" data-remove-url="{% url 'reviews:remove_author_from_review' %}">
            <li class="list-group-item" author-id="{{ review.author.id }}">
              <a href="/{{ review.author.username }}/">
                {{ review.author.profile.get_screen_name }}
              </a>
              <span class="badge">main author</span>
            </li>
            {% for author in review.co_authors.all %}
              <li  class="list-group-item" data-user-id="{{ author.id }}">
                <a href="{% url 'reviews' author.username %}">{{ author.profile.get_screen_name }}</a>
                {% if user.id == review.author.id %}
                  <a href="javascript:void(0);" class="js-remove-author text-danger pull-right">
                    <span class="glyphicon glyphicon-remove"></span>
                  </a>
                {% elif user.id == author.id %}
                  <form method="post" action="{% url 'reviews:leave' %}" style="display: inline">
                    {% csrf_token %}
                    <input type="hidden" name="review-id" value="{{ review.id }}">
                    <a href="javascript:void(0);" class="js-leave text-danger pull-right">(leave)</a>
                  </form>
                {% endif %}
              </li>
            {% endfor %}
          </ul>
          {% if user.id == review.author.id %}
            <div class="panel-footer">
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#add-author-modal">
                <span class="glyphicon glyphicon-plus"></span>
                Add author
              </button>
              <form method="post" action="{% url 'reviews:add_author_to_review' %}">
                {% csrf_token %}
                <input type="hidden" name="review-id" value="{{ review.pk }}">
                <div class="modal fade" id="add-author-modal">
                  <div class="modal-dialog">
                    <div class="modal-content">
                      <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">Add author</h4>
                      </div>
                      <div class="modal-body">
                        <div class="alert alert-info">
                          You may add someone that doesn't have a Parsifal Account. Just type his email adress and we will send an invitation. :)
                        </div>
                        <div class="form-group">
                          <label for="users" class="control-label">Contacts</label>
                          <select id="users" name="users" class="contacts" placeholder="Pick an author or invite someone..."></select>
                        </div>
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn btn-success">Send invitation</button>
                      </div>
                    </div>
                  </div>
                </div>
              </form>
            </div>
          {% endif %}
        </div>
      </div>
    </div>
    
  {% endblock content %}