X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/b9e5161a49d56f4bc177159c93d0f027e5ba4337..3546a2b2d5f52224bcf95803030611ab505f29cd:/project/templates/explorer/panels/gallery.html diff --git a/project/templates/explorer/panels/gallery.html b/project/templates/explorer/panels/gallery.html index f0ec99bf..0d669726 100644 --- a/project/templates/explorer/panels/gallery.html +++ b/project/templates/explorer/panels/gallery.html @@ -1,29 +1,47 @@ <div class="toolbar" style="height: 24px"> - <select name="folders" class="id_folders"> - <option value="" selected="selected">-- Wybierz folder z obrazkami --</option> - <option value="andersen_basnie">andersen_basnie</option> - </select> + {{ form.folders }} </div> <div class="images-wrap" style="position: absolute; top: 24px; left:0px; right:0px; bottom: 0px;"> - <div class="images"><!-- To jest div na obrazki, które sÄ wstawiane później --></div> + <div class="images"><!-- To jest div na obrazki, które sÄ wstawiane później --></div> </div> <script type="text/javascript" charset="utf-8"> panel_hooks = { - load: function() { - var contentDiv = this.contentDiv; - $('.id_folders', contentDiv).change(function() - { - $('.images', contentDiv).load('{% url folder_image_ajax %}' + $('.id_folders', contentDiv).val() + '/', - function() { + load: function() { + var contentDiv = this.contentDiv; + $('select[name=folders]', contentDiv).change(function() { + var select = this; + $('.images', contentDiv).fadeOut('slow', 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); + }); }); - }); - - $('.images-wrap', contentDiv).lazyload('.image-box', - {threshold: 640 * 10, scrollTreshold: 640 * 5} - ); - } + }) + }); + + $('.images-wrap', contentDiv).lazyload('.image-box', + {threshold: 640 * 10, scrollTreshold: 640 * 5} + ); + + this._endload(); + }, + refresh: function() { + return true; // gallery is always fresh + }, + dirty: function() { + return true; // and it doesn't get dirty + } }; </script>