{% extends 'iconolab_base.html' %}

{% load staticfiles %}

{% load thumbnail %}

{% load iconolab_tags %}

{% block content %}
  <div id="collection-summary" class="row">
    <div class="col-md-3">
      {% thumbnail collection.image "300x300" crop=False as im %}
        <img src="{{ im.url }}" class="img-responsive">
      {% endthumbnail %}
      <hr>
      <p>
        {{ collection.description | safe }}
      </p>
    </div>
    <div class="col-md-9 description-container">
      <h1>{{ collection.verbose_name }} <small>Fonds Iconolab</small></h1>

      <ul class="nav nav-tabs" role="tablist">
        <li id="tab-items" role="presentation" class="{% if active_list == 'items' %}active{% endif %}">
          <a href="#list-items" role="tab" data-toggle="tab">Objets du fonds</a>
        </li>
        <li id="tab-contribution" role="presentation" class="pull-right {% if active_list == 'contributions' %}active{% endif %}">
          <a href="#list-contribution" role="tab" data-toggle="tab">Appels à contribution</a>
        </li>
        <li id="tab-revised" role="presentation" class="pull-right {% if active_list == 'revised' %}active{% endif %}">
          <a href="#list-revised" role="tab" data-toggle="tab">Annotations les plus révisées</a>
        </li>
        <li id="tab-recent" role="presentation" class="pull-right {% if active_list == 'recent' %}active{% endif %}">
          <a href="#list-recent" role="tab" data-toggle="tab">Annotations récentes</a>
        </li>
      </ul>

      <div class="tab-content">

        <div id="list-recent" role="tabpanel" class="tab-pane {% if active_list == 'recent' %}active{% endif %}">
          {% include "partials/image_annotations_list.html" with annotation_list=recent_pagination_data.list %}
          {% if recent_list %}
            {% include "partials/collection_home_pagination_links.html" with pagination_data=recent_pagination_data list_identifier="recent" %}
          {% endif %}
        </div>
        <div id="list-revised" role="tabpanel" class="tab-pane {% if active_list == 'revised' %}active{% endif %}">
          {% include "partials/image_annotations_list.html" with annotation_list=revised_pagination_data.list %}
          {% if revised_list %}
            {% include "partials/collection_home_pagination_links.html" with pagination_data=revised_pagination_data list_identifier="revised" %}
          {% endif %}
        </div>
        <div id="list-contribution" role="tabpanel" class="tab-pane {% if active_list == 'contributions' %}active{% endif %}">
          {% include "partials/image_annotations_list.html" with annotation_list=contributions_pagination_data.list %}
          {% if contributions_list %}
            {% include "partials/collection_home_pagination_links.html" with pagination_data=contributions_pagination_data list_identifier="contributions" %}
          {% endif %}
        </div>
        <div id="list-items" role="tabpanel" class="tab-pane {% if active_list == 'items' %}active{% endif %}">
          <div class="item-grid">
            {% for item in items_pagination_data.list %}
            <div class="item-grid-item">
              {% include "partials/item_images_preview.html" with item=item %}
              <div class="object-infos text-center">
                <a class="btn btn-default btn-xs collection-home-item-btn" href="{% url 'item_detail' collection_name item.item_guid %}"><i class="fa fa-eye"></i> Détail de l'objet</a>
              </div>
            </div>
            {% endfor %}
          </div>
          {% include "partials/collection_home_pagination_links.html" with pagination_data=items_pagination_data list_identifier="items" %}
        </div>

      </div>

    </div>
  </div>
{% endblock %}