{% load i18n %}
{% load markup %}
{% load custom_tags %}
{% load wikitags %}

<script>
$(document).ready(function () {
    $(function() { 
        $("#products li.product").css('width', 110);
        $("#products li.product").css('height', 90);
        $('#products img.imgzoom').attr('width', 80);
        $('#products img.catzoom').attr('width', 80);
    });
})
</script>
<script>
var popup = function (url) {
      window.open(url,'_blank','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=1000,height=800');
      return false;
}
</script>

{% if share.imgSize %}

<div class="clear"></div>

<h1>{% trans "Images" %} ({{ share.imgSize }} items)</h1>
<div class="imageshare"><ul id="products">
    {% for e in share.imageInShare %}
        <li id="image-{{ e.id }}"class="product"><em>{{ e.name }}</em>
            {% if share.share.isOwned %}
                <a href="#" onclick="return popup('{% url image_viewer e.id %}')"><img id="{{ e.id }}" class="imgzoom" src="{% url render_thumbnail e.id %}" alt="image" title="{{ e.name }}"/></a>
            {% else %}
                <a href="#" onclick="return popup('{% url image_viewer share.share.id e.id %}')"><img id="{{ e.id }}" class="imgzoom" src="{% url render_thumbnail e.id share.share.id %}" alt="image" title="{{ e.name }}"/></a>
            {% endif %}
        </li>
    {% endfor %}
</ul></div>
{% endif %}

</div>