project/templates/explorer/panels/gallery.html

   1 <div class="panel">
   2     <div class="images-wrap">
   3         <div class="images">
   4             <p>Aby zobaczyć obrazki wybierz folder poniżej:</p>
   5             <p><select name="folders" class="id_folders">
   6             <option value="" selected="selected">-- Wybierz folder z obrazkami --</option>
   7             <option value="andersen_basnie">andersen_basnie</option>
   8             </select></p>
   9         </div>
  10     </div>
  11 </div>
  12 <script type="text/javascript" charset="utf-8">
  13
  14     (function() {
  15         function resizeEditor(event, panel) {
  16             var panel = panel || event.data.panel;
  17             $('.images-wrap', panel).height($(panel).height());
  18         }
  19
  20         panel(function(event, panel) {
  21             $('.id_folders', panel).change(function() {
  22                 $('.images', panel).load('{% url folder_image_ajax %}' + $('.id_folders', panel).val() + '/', function() {
  23                     $('.images-wrap', panel).data('lazyload:lastCheckedScrollTop', -10000);
  24                 });
  25             });
  26             $('.images-wrap', panel).lazyload('.image-box', {threshold: 640 * 10, scrollTreshold: 640 * 5});
  27
  28             $(window).bind('resize', {'panel': panel}, resizeEditor);
  29             resizeEditor(null, panel);
  30         }, function(event, panel) {
  31         });
  32     })()
  33 </script>