src/wolnelektury/static/js/base.js

   1 (function($) {
   2     $(function() {
   3         $.fn.toggle_slide = function(p) {
   4             cont = $(this);
   5             short_el = p['short_el'] || $(':first-child', this);
   6             long_el = p['long_el'] || short_el.next();
   7             button = p['button'];
   8             short_text = p['short_text'],
   9             long_text = p['long_text'];
  10
  11             var toggle_fun = function(cont, short_el, long_el, button, short_text, long_text) {
  12                 var toggle = function() {
  13                     if (cont.hasClass('short')) {
  14                         cont.animate({"height": long_el.attr("cont_h")+'px'}, {duration: "fast" }).removeClass('short');
  15                         short_el.hide();
  16                         long_el.show();
  17                         if (button && long_text) button.html(long_text);
  18                     } else {
  19                         cont.animate({"height": short_el.attr("cont_h")+'px'}, {duration: "fast" }).addClass('short');
  20                         long_el.hide();
  21                         short_el.show();
  22                         if (button && short_text) button.html(short_text);
  23                     }
  24                     return false;
  25                 };
  26                 return toggle;
  27             };
  28             if (long_el.html().length <= short_el.html().length)
  29                 return;
  30
  31             // ensure long element shown first
  32             long_el.show();short_el.hide();
  33             long_el.attr("cont_h", $(this).height()).hide();
  34             short_el.show().attr("cont_h", $(this).height());
  35             $(this).addClass('short');
  36
  37             if (button && short_text) button.html(short_text);
  38             if (button) button.click(toggle_fun(cont, short_el, long_el, button, short_text, long_text));
  39         };
  40
  41
  42         // Fragments
  43         $('.fragment-with-short').each(function() {
  44             $(this).toggle_slide({
  45                 short_el: $('.fragment-short-text', this),
  46                 long_el: $('.fragment-long-text', this),
  47                 button: $('.toggle', this)
  48             })
  49         });
  50         $('#description').each(function() {
  51             $(this).toggle_slide({
  52                 short_el: $('#description-short', this),
  53                 long_el: $('#description-long', this),
  54                 button: $(this)
  55             })
  56         });
  57
  58
  59
  60                 (function() {
  61                         var $current = null;
  62             var menu_loaded = false;
  63                         $('.hidden-box-wrapper').each(function() {
  64                                 var $hidden = $('.hidden-box', this);
  65                                 $('.hidden-box-trigger', this).click(function(event) {
  66                                         event.preventDefault();
  67                                         if ($current == $hidden) {
  68                                                 $current = null;
  69                                                 $hidden.hide('fast');
  70                                         } else {
  71                                                 $current && $current.hide('fast');
  72                                                 $hidden.show('fast');
  73                                                 $current = $hidden;
  74                         if ($(this).hasClass('load-menu') && !menu_loaded) {
  75                             $.ajax({
  76                                 url: '/katalog/' + LANGUAGE_CODE + '.json',
  77                                 dataType: "json",
  78                             }).done(function(data) {
  79                                 $.each(data, function(index, value) {
  80                                     var $menuitem = $('#menu-' + index);
  81                                     $menuitem.html(value);
  82                                     var $minisearch = $("<input class='mini-search' style='margin-bottom: 1em' />");
  83                                     $minisearch.keyup(function() {
  84                                         var s = $(this).val().toLowerCase();
  85                                         if (s) {
  86                                             $("li", $menuitem).each(function() {
  87                                                 if ($("a", this).text().toLowerCase().indexOf(s) != -1)
  88                                                     $(this).show();
  89                                                 else $(this).hide();
  90                                             });
  91                                         }
  92                                         else {
  93                                             $("li", $menuitem).css("display", "");
  94                                         }
  95                                     });
  96                                     $menuitem.prepend($minisearch);
  97                                 });
  98                                 menu_loaded = true;
  99                             });
 100                         }
 101                                         }
 102                                 });
 103                         });
 104                     /* this kinda breaks the whole page. */
 105                         $('body').click(function(e) {
 106                                 if ($current == null) return;
 107                                 var p = $(e.target);
 108                                 while (p.length) {
 109                                         if (p == $current)
 110                                                 return;
 111                                         if (p.hasClass('hidden-box-trigger')
 112                                             || p.hasClass('simple-toggler')
 113                         || p.hasClass('mini-search'))
 114                                                 return;
 115                                         p = p.parent();
 116                                 }
 117                                 $current.hide('fast');
 118                                 $current = null;
 119                         });
 120                 })();
 121
 122
 123 $('#show-menu').click(function(event) {
 124     event.preventDefault();
 125     //$('#menu').toggle('slow');
 126     $('body').toggleClass('menu-on');
 127 });
 128
 129
 130 $('#book-list-nav h2').click(function(event) {
 131     event.preventDefault();
 132     $('#book-list-nav-index').toggle();
 133 });
 134
 135
 136 $('#themes-list-toggle').click(function(event) {
 137     event.preventDefault();
 138     $('#themes-list').toggle('slow');
 139 });
 140
 141
 142         $('.book-list-index').click(function(){
 143             $('.book-list-show-index').hide('slow');
 144             if($(this).parent().next('ul:not(:hidden)').length == 0){
 145                 $(this).parent().next('ul').toggle('slow');
 146             }
 147             return false;
 148         });
 149
 150         $('.hoverclick').click(function() {$(this).closest('.hoverget').toggleClass('hover');});
 151
 152         $(function(){
 153             $("#search").search();});
 154
 155       $('body').on('click', '.simple-toggler' , function(ev) {
 156         ev.preventDefault();
 157         var scope = $(this).closest('.simple-toggler-scope');
 158         scope.find('.simple-hidden-box').each(function(){
 159           var $this = $(this);
 160           if ($this.is(':hidden')) {
 161             $this.show();
 162           } else {
 163             $this.hide();
 164           }
 165           });
 166       });
 167
 168
 169     $('.tabbed-filter').each(function() {
 170         var tf = this;
 171         $('.tab').click(function() {
 172             if ($(this).hasClass('active')) {
 173                 $(this).removeClass('active');
 174                 $('#' + $(this).attr('data-id')).hide();
 175             }
 176             else {
 177                 var $active = $('.active', tf);
 178                 $active.removeClass('active');
 179                 $('#' + $active.attr('data-id')).hide();
 180                 $(this).addClass('active');
 181                 $('#' + $(this).attr('data-id')).show();
 182             }
 183         });
 184     });
 185
 186
 187     $('.plain-list-paged').each(function() {
 188         // should change on resize?
 189         var $plc = $(this);
 190         var $pl = $('.plain-list', this);
 191
 192         var $items = $('p', $pl);
 193
 194         if ($items.length > 40) {
 195             $items.hide();
 196             var prev = [0, 0];
 197
 198             $('.pager', $plc).paging($items.length, {
 199                 format: '[< ncnnn >]', // define how the navigation should look like and in which order onFormat() get's called
 200                 perpage: 40,
 201                 lapping: 0, // don't overlap pages for the moment
 202                 page: 1, // start at page, can also be "null" or negative
 203                 onSelect: function (page) {
 204                     var data = this.slice;
 205                     $items.slice(prev[0], prev[1]).hide();
 206                     $items.slice(data[0], data[1]).show();
 207                     prev = data;
 208                 },
 209                 onFormat: function (type) {
 210                     switch (type) {
 211                         case 'block': // n and c
 212                             return ' <li><a href="#"' + (this.value == this.page ? ' class="current"' : '') + '>' + this.value + '</a></li>';
 213                         case 'next': // >
 214                             return '<li><a href="#">&rsaquo;</a></li>';
 215                         case 'prev': // <
 216                             return '<li><a href="#">&lsaquo;</a></li>';
 217                         case 'first': // [
 218                             return '<li><a href="#">&laquo;</a></li>';
 219                         case 'last': // ]
 220                             return '<li><a href="#">&raquo;</a></li>';
 221                     }
 222                 }
 223             });
 224         }
 225     });
 226
 227
 228     });
 229 })(jQuery);
 230