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

<ul class="annotation-list-wrapper list-inline">

	<h4><strong>Annotations de l'image</strong></h4>
    
    {% if not annotation_list %}
        <p> Aucune annotation pour cette image </p>
    {% else %}
    	{% for annotation in annotation_list %}
    	<li class="small-image-wrapper">
    		
    		<div class="fragment-container" style="position: relative">
    		{% thumbnail annotation.image.media "x300" crop="center" as im %}
    			<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>
    			</div>
    		{% endthumbnail %}
    			<div class="fragment-infos">
    				<a class="fa fa-eye" href="{% url 'annotation_detail' collection_name image_guid annotation.annotation_guid  %}">Voir</a>
    				<p class="small">Créee par <strong>{{ annotation.author }}</strong></strong><p>
    				<p class="small">Révisée par <strong>{{ annotation.current_revision.author }}</strong>
    				le {{ annotation.current_revision.created|date:'d-m-Y' }}
    				</p>
    			</div>
    	</li>
        {% endfor %}
    {% endif %}
</ul>