"Fossies" - the Fresh Open Source Software Archive

Member "pmd-src-6.47.0/docs/_includes/initialize_shuffle.html" (25 Jun 2022, 3308 Bytes) of package /linux/misc/pmd-src-6.47.0.zip:

    1 <script type="text/javascript">
    2 $(document).ready(function() {
    3     $('#toc').toc({ minimumHeaders: 0, listType: 'ul', showSpeed: 0, headers: 'h2,h3,h4' });
    4 });
    5 
    6 </script>
    7 <!-- shuffle -->
    8 <script>
    9 var shuffleme = (function( $ ) {
   10   'use strict';
   11 
   12   var $grid = $('#grid'),
   13       $filterOptions = $('.filter-options'),
   14       $sizer = $grid.find('.shuffle_sizer'),
   15 
   16   init = function() {
   17 
   18     // None of these need to be executed synchronously
   19     setTimeout(function() {
   20       listen();
   21       setupFilters();
   22     }, 100);
   23 
   24     // instantiate the plugin
   25     $grid.shuffle({
   26       itemSelector: '[class*="col-"]',
   27       sizer: $sizer    
   28     });
   29   },
   30 
   31   // Set up button clicks
   32   setupFilters = function() {
   33     var $btns = $filterOptions.children().add('.topical-filter');
   34     $btns.on('click', function() {
   35       var $this = $(this),
   36           isActive = $this.hasClass( 'active' ),
   37           isMainTopicButton = $this.hasClass('topical-filter'),
   38           group = isActive ? 'all' : $this.data('group');
   39 
   40       // Hide current label, show current label in title
   41       if ( !isActive ) {
   42         $('.filter-options .active').add('.topical-filter.active').removeClass('active');
   43       }
   44 
   45       $this.toggleClass('active');
   46 
   47       // Filter elements
   48       $grid.shuffle( 'shuffle', group );
   49 
   50       // scroll to the grid
   51       if ( isMainTopicButton && !isActive ) {
   52           $('html, body').animate({
   53               scrollTop: $("#grid-rule").offset().top
   54           }, 500);
   55       }
   56 
   57     });
   58 
   59     $btns = null;
   60   },
   61 
   62   // Re layout shuffle when images load. This is only needed
   63   // below 768 pixels because the .picture-item height is auto and therefore
   64   // the height of the picture-item is dependent on the image
   65   // I recommend using imagesloaded to determine when an image is loaded
   66   // but that doesn't support IE7
   67   listen = function() {
   68     var debouncedLayout = $.throttle( 300, function() {
   69       $grid.shuffle('update');
   70     });
   71 
   72     // Get all images inside shuffle
   73     $grid.find('img').each(function() {
   74       var proxyImage;
   75 
   76       // Image already loaded
   77       if ( this.complete && this.naturalWidth !== undefined ) {
   78         return;
   79       }
   80 
   81       // If none of the checks above matched, simulate loading on detached element.
   82       proxyImage = new Image();
   83       $( proxyImage ).on('load', function() {
   84         $(this).off('load');
   85         debouncedLayout();
   86       });
   87 
   88       proxyImage.src = this.src;
   89     });
   90 
   91     // Because this method doesn't seem to be perfect.
   92     setTimeout(function() {
   93       debouncedLayout();
   94     }, 500);
   95   };      
   96 
   97   return {
   98     init: init
   99   };
  100 }( jQuery ));
  101 
  102 
  103 
  104 $(document).ready(function() {
  105   shuffleme.init();
  106 });
  107 
  108     </script>
  109 
  110 <!-- new attempt-->
  111 
  112 <script>
  113     $(document).ready(function() {
  114      
  115     /* initialize shuffle plugin */
  116     var $grid = $('#grid');
  117          
  118     $grid.shuffle({
  119         itemSelector: '.item' // the selector for the items in the grid
  120     });
  121  
  122 });</script>
  123 
  124 <script>
  125 $('#filter a').click(function (e) {
  126     e.preventDefault();
  127          
  128     // set active class
  129     $('#filter a').removeClass('active');
  130     $(this).addClass('active');
  131          
  132     // get group name from clicked item
  133     var groupName = $(this).attr('data-group');
  134          
  135     // reshuffle grid
  136     $grid.shuffle('shuffle', groupName );
  137 });</script>
  138 
  139