{% extends 'combo/cell_form.html' %}
{% load static thumbnail i18n %}

{% block cell-form %}
<ul class="gallery" id="gallery-{{cell.id}}" data-order-url="{% url 'combo-gallery-image-order' gallery_pk=cell.id %}">
{% for image in cell.image_set.all %}
<li data-object-id="{{image.id}}">
{% thumbnail image.image "120x120" crop="50% 25%" as im %}
  <img height="120" src="{{ im.url }}"/>
{% endthumbnail %}
  <span class="image-actions">
  <a rel="popup" class="image-edit icon-edit" href="{% url 'combo-gallery-image-edit' gallery_pk=cell.id pk=image.id %}"></a>
  <a class="image-delete icon-remove-sign" href="{% url 'combo-gallery-image-delete' gallery_pk=cell.id pk=image.id %}"></a>
  </span>
</li>
{% endfor %}
<li><a class="button" rel="popup" href="{% url 'combo-gallery-image-add' gallery_pk=cell.id %}">{% trans 'Add an Image' %}</a></li>
</ul>

<script src="{% static "js/combo.gallery.js" %}"></script>
<script>gallery($('#gallery-{{cell.id}}'));</script>

{% endblock %}