{% extends 'iconolab_base.html' %}

{% load thumbnail %}
{% load iconolab_tags %}

{% block content %}

    <h2>Recherche</h2>

    <form method="get" class="form-inline" action="{% if collection_name %}{% url 'search_indexes:collection_search' collection_name %}{% else %}{% url 'search_indexes:global_search' %}{% endif %}">
      <div class="form-group">
        <div class="input-group">
          <div class="input-group-addon">Chercher</div>
          <input id="id_{{form.q.name}}" type="text" class="form-control" name="{{form.q.name}}" placeholder="...">
          <div class="input-group-addon">dans les </div>
          <select class="form-control" id="id_{{form.model_type.name}}" name="{{form.model_type.name}}">
            {% for val, label in form.fields.model_type.choices %}
                <option value="{{ val }}"{% if label == 'Annotations' %} selected{% endif %}>{{ label }}</option>
            {% endfor %}
          </select>
          {% if collection %}
            <div class="input-group-addon">du fonds {{collection.verbose_name}}</div>
          {% else %}
            <div class="input-group-addon">du site</div>
          {% endif %}
        </div>
      </div>
      <input type="submit" class="search-submit btn btn-primary" value="Rechercher" style="margin-left: 10px;">
    </form>
    <h3><strong>{{ page_obj.paginator.count }}</strong> annotation(s)</h3>
    <ul class="annotation-list-wrapper list-inline">
      {% if not page_obj.object_list %}
          <h3 class="text-center"><small>Aucune annotation à afficher</small></p>
      {% else %}
        <table class="table table-condensed">
          <thead>
            <th></th>
            <th>Titre</th>
            <th>Auteur</th>
            <th>Créée le</th>
            <th>Révisée le</th>
            <th>Contributeurs</th>
            <th>Statistiques</th>
          </thead>
          {% for result in page_obj.object_list %}
            <tr>
              <td>
                <div class="fragment-container" style="position: relative">
                  {% thumbnail result.object.image.media "150x150" crop=False as im %}
                    <a href="{% url 'annotation_detail' result.object.image.item.collection.name result.object.image.image_guid result.object.annotation_guid %}">
                      <img v-el:small-image src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" />
                      <svg width="{{ im.width }}" height="{{ im.height }}" version="1.1" style="position:absolute; top:0px; left: 0px">
                        <g transform="matrix({% transform_matrix im_width=im.width im_height=im.height max_x=100 max_y=100 %})">
                          <path d="{{ result.object.current_revision.fragment|clean_path }}" opacity="0.7" fill="orange"></path>
                        </g>
                      </svg>
                    </a>
                  {% endthumbnail %}
                </div>
              </td>
              <td>{{ result.object.current_revision.title }}</td>
              <td><a href="{% url 'user_home' result.object.author.id %}" style="color:#000000">{{ result.object.author }}</a></td>
              <td>{{ result.object.created|date:'d-m-Y' }}</td>
              <td>{{ result.object.current_revision.created|date:'d-m-Y' }}</td>
              <td>
                {% for contributor in result.object.stats.contributors.all %}
                    <a href="{% url 'user_home' contributor.id %}" style="color:#000000">{{ contributor.username }}</a>{% if not forloop.last %}, {% endif %}
                {% endfor %}
              </td>
              <td>
                  {% include "partials/annotation_stats_panel.html" with annotation=result.object %}
              </td>
            </tr>
          {% endfor %}
        </table>
      {% endif %}
    </ul>
    <ul class="pagination pull-right items-perpage" style="margin-left: 15px;">
      <li class="active pagination-label"><a>Annotations par page : </a></li>
      <li class="{% if page_obj.paginator.per_page == 5 %}active{% endif %}">
      <a href="?q={{ query }}&perpage=5">5</a>
      </li>
      <li class="{% if page_obj.paginator.per_page == 10 %}active{% endif %}">
      <a href="?q={{ query }}&perpage=10">10</a>
      </li>
      <li class="{% if page_obj.paginator.per_page == 25 %}active{% endif %}">
      <a href="?q={{ query }}&perpage=25">25</a>
      </li>
      <li class="{% if page_obj.paginator.per_page == 100 %}active{% endif %}">
      <a href="?q={{ query }}&perpage=100">100</a>
      </li>
    </ul>
    {% if page_obj.has_previous or page_obj.has_next %}
    <ul class="pagination pull-right items-pagination">
      {% if page_obj.has_previous %}
      <li>
        <a href="?page={{page_obj.previous_page_number}}&perpage={{page_obj.paginator.per_page}}" aria-label="Précédent">
          <span aria-hidden="true">&laquo;</span>
        </a>
      </li>
      {% endif %}

      {% for page in page_obj.paginator.page_range %}
        <li id="page-link-{{page}}" class="pagination-link {% if page == page_obj.number %}active{% endif %}">
          <a {% if page != page_obj.number %}href="?q={{query}}&page={{page}}&perpage={{page_obj.paginator.per_page}}"{% endif %}>{{page}}</a>
        </li>
      {% endfor %}

      {% if page_obj.has_next %}
      <li>
         <a href="?page={{page_obj.next_page_number}}&perpage={{page_obj.paginator.per_page}}" aria-label="Précédent">
          <span aria-hidden="true">&raquo;</span>
         </a>
      </li>
      {% endif %}
    </ul>
    {% endif %}
{% endblock %}