{% load thumbnail %}
{% load iconolab_tags %}
{% with annotation_data.annotation_obj as annotation %}
<li>
  <div class="panel panel-default annotation-panel">
    <div class="panel-heading">
      {% if annotation.current_revision.title %}
        {{annotation.current_revision.title}}
      {% else %}
        <i>Annotation sans titre</i>
      {% endif %}
    </div>
    <div class="panel-body">
      <div style="position:relative" class="{% if large_image %}large-{% endif %}image-detail">
        {% if large_image %}
          {% thumbnail annotation.image.media "400x400" crop=False as im %}
            <a href="{% url 'image_detail' annotation.image.item.collection.name annotation.image.image_guid %}#{{ annotation.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="{{ annotation.current_revision.fragment|clean_path }}" opacity="0.7" fill="orange"></path>
                </g>
              </svg>
            </a>
          {% endthumbnail %}
        {% else %}
          {% thumbnail annotation.image.media "150x150" crop=False as im %}
            <a href="{% url 'image_detail' annotation.image.item.collection.name annotation.image.image_guid %}#{{ annotation.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="{{ annotation.current_revision.fragment|clean_path }}" opacity="0.7" fill="orange"></path>
                </g>
              </svg>
            </a>
          {% endthumbnail %}
        {% endif %}
      </div>
      <div class="annotation-detail">
        <dl class="dl-horizontal">
          <dt>Total révisions: {{annotations.stats.revisions_count}} </dt>
          <dd><span class="badge">{{annotation.stats.comments_count}}</span></dd>
          <dt>Soumises par <i>{{user.username}}</i>: </dt>
          <dd><span class="badge">{{annotation_data.revisions_count}}</span></dd>
          <dt>.. Révisions en attente: </dt>
          <dd><span class="badge {% if annotation_data.awaiting_count %}badge-warning{% endif %}">{{annotation_data.awaiting_count}}</span></dd>
          <dt>.. Révisions acceptées: </dt>
          <dd><span class="badge {% if annotation_data.accepted_count %}badge-success{% endif %}">{{annotation_data.accepted_count}}</span></dd>
        </dl>
        <a class="btn btn-default btn-sm userpage-annotation-btn pull-left" href="{% url 'image_detail' annotation.image.item.collection.name annotation.image.image_guid %}#{{ annotation.annotation_guid }}">Voir annotation</a>
      </div>
      {% if with_stats %}
      <div class="stats-annotation-userpage">
        {% include "partials/annotation_stats_panel.html" with annotation=annotation label="Statistiques sur cette annotation:" %}
      </div>
      {% endif %}
    </div>
  </div>
</li>
{% endwith %}
