import custom panik gallery template & script

[panikweb.git] / panikweb_templates / templates / combo / gallery.html

diff --git a/panikweb_templates/templates/combo/gallery.html b/panikweb_templates/templates/combo/gallery.html
index b3c6bb983eec196a8c9a53f7bfe709747f076977..6be3c9f22a8b134cd531da44c814602951689594 100644 (file)
--- a/panikweb_templates/templates/combo/gallery.html
+++ b/panikweb_templates/templates/combo/gallery.html
@@ -1,33 +1,32 @@
 {% load thumbnail %}
-{% if cell.title %}<h3>{{ cell.title }}</h3>{% endif %}
 <div class="gallery" id="gallery-{{cell.id}}">
 {% for image in cell.image_set.all %}
   {% if forloop.first %}
 {% thumbnail image.image "640x480" crop="50% 25%" as im %}
-<div class="first" style="display: none;">
+<div class="first">
 <img src="{{ im.url }}"/>
+<span>{% if image.title %}{{ image.title }}{% endif %}</span>
 </div>
-<div>
+<div> {# extra opened <div> #}
 {% endthumbnail %}
   {% endif %}
-{% thumbnail image.image "200x100" crop="50% 25%" as im %}
+{% thumbnail image.image "60x60" crop="50% 25%" as im %}
 {% thumbnail image.image "640x480" crop="50% 25%" as im_large %}
 <span data-image-large="{{ im_large.url }}"><img src="{{ im.url }}"
         {% if image.title %} title="{{image.title}}" {% endif %}/></span>
 {% endthumbnail %}
 {% endthumbnail %}
+
+  {% if forloop.last %}
+  </div> {# close extra <div> #}
+  {% endif %}
 {% endfor %}
 </div>
-</div>
 <script type="text/javascript">
 $(function() {
   var $gallery = $('#gallery-{{cell.id}}');
   $gallery.find('span').on('click', function() {
     $gallery.find('div.first img').attr('src', $(this).data('image-large'));
-    $gallery.find('div.first').show('fade');
-  });
-  $gallery.find('div.first').on('click', function() {
-    $(this).toggle('fade');
   });
 });
 </script>