Nowe toolbary.
[redakcja.git] / project / templates / explorer / panels / gallery.html
index 36a2357..565a636 100644 (file)
@@ -1,7 +1,5 @@
 <div class="toolbar" style="height: 24px">
-    <select name="folders" class="id_folders">
-        {{ form.folders }}
-    </select>
+    {{ form.folders }}
 </div>
 
 <div class="images-wrap" style="position: absolute; top: 24px; left:0px; right:0px; bottom: 0px;">
 panel_hooks = {
     load: function() {
         var contentDiv = this.contentDiv;
-        $('.id_folders', contentDiv).change(function() {
+        $('select[name=folders]', contentDiv).change(function() {
+            var select = this;
             $('.images', contentDiv).fadeOut('slow', function() { 
-                $(this).html('').load('{% url folder_image_ajax %}' + $('.id_folders', contentDiv).val() + '/',  function() {
+                $(this).html('').load('{% url folder_image_ajax %}' + $(select).val() + '/',  function() {
+                    $('.images', contentDiv).fadeIn('slow');
                     $('.images-wrap', contentDiv).data('lazyload:lastCheckedScrollTop', -10000);
+                    $('.image-box').click(function() {
+                        var src = $('img', $(this)).attr('src');
+                        var idx = src.lastIndexOf('/');
+                        var bigSrc = src.substring(0, idx) + '/big' + src.substring(idx, src.length);
+                        var zoom = $('<div style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: scroll">'
+                            + '<img src="' + bigSrc + '" />'
+                            + '</div>').click(function() {
+                                $(this).remove();
+                            })
+                        zoom.appendTo(contentDiv);
+                    });
                 });
             })
         });