6be3c9f22a8b134cd531da44c814602951689594
[panikweb.git] / panikweb_templates / templates / combo / gallery.html
1 {% load thumbnail %}
2 <div class="gallery" id="gallery-{{cell.id}}">
3 {% for image in cell.image_set.all %}
4   {% if forloop.first %}
5 {% thumbnail image.image "640x480" crop="50% 25%" as im %}
6 <div class="first">
7 <img src="{{ im.url }}"/>
8 <span>{% if image.title %}{{ image.title }}{% endif %}</span>
9 </div>
10 <div> {# extra opened <div> #}
11 {% endthumbnail %}
12   {% endif %}
13 {% thumbnail image.image "60x60" crop="50% 25%" as im %}
14 {% thumbnail image.image "640x480" crop="50% 25%" as im_large %}
15 <span data-image-large="{{ im_large.url }}"><img src="{{ im.url }}"
16         {% if image.title %} title="{{image.title}}" {% endif %}/></span>
17 {% endthumbnail %}
18 {% endthumbnail %}
19
20   {% if forloop.last %}
21   </div> {# close extra <div> #}
22   {% endif %}
23 {% endfor %}
24 </div>
25 <script type="text/javascript">
26 $(function() {
27   var $gallery = $('#gallery-{{cell.id}}');
28   $gallery.find('span').on('click', function() {
29     $gallery.find('div.first img').attr('src', $(this).data('image-large'));
30   });
31 });
32 </script>