JAVASCRIPT   20

jQuery Nivo Slider

Guest on 27th June 2022 03:50:32 PM

  1. /*
  2.  * jQuery Nivo Slider v3.2
  3.  * http://nivo.dev7studios.com
  4.  *
  5.  * Copyright 2012, Dev7studios
  6.  * Free to use and abuse under the MIT license.
  7.  * http://www.opensource.org/licenses/mit-license.php
  8.  */
  9.  
  10. (function($) {
  11.     var NivoSlider = function(element, options){
  12.  
  13.         // Defaults are below
  14.         var settings = $.extend({}, $.fn.nivoSlider.defaults, options);
  15.  
  16.         // Useful variables. Play carefully.
  17.         var vars = {
  18.             currentSlide: 0,
  19.             currentImage: '',
  20.             totalSlides: 0,
  21.             running: false,
  22.             paused: false,
  23.             stop: false,
  24.             controlNavEl: false
  25.         };
  26.  
  27.         // Get this slider
  28.         var slider = $(element);
  29.  
  30.         slider.data('nivo:vars', vars).addClass('nivoSlider');
  31.  
  32.         // Find our slider children
  33.         var kids = slider.children();
  34.         kids.each(function() {
  35.             var child = $(this);
  36.             var link = '';
  37.             if(!child.is('img')){
  38.                 if(child.is('a')){
  39.                     child.addClass('nivo-imageLink');
  40.                     link = child;
  41.                 }
  42.                 child = child.find('img:first');
  43.             }
  44.             // Get img width & height
  45.             var childWidth = (childWidth === 0) ? child.attr('width') : child.width(),
  46.                 childHeight = (childHeight === 0) ? child.attr('height') : child.height();
  47.  
  48.             if(link !== ''){
  49.                 link.css('display','none');
  50.             }
  51.             child.css('display','none');
  52.             vars.totalSlides++;
  53.         });
  54.          
  55.         // If randomStart
  56.         if(settings.randomStart){
  57.             settings.startSlide = Math.floor(Math.random() * vars.totalSlides);
  58.         }
  59.        
  60.         // Set startSlide
  61.         if(settings.startSlide > 0){
  62.             if(settings.startSlide >= vars.totalSlides) { settings.startSlide = vars.totalSlides - 1; }
  63.             vars.currentSlide = settings.startSlide;
  64.         }
  65.        
  66.         // Get initial image
  67.         if($(kids[vars.currentSlide]).is('img')){
  68.             vars.currentImage = $(kids[vars.currentSlide]);
  69.         } else {
  70.             vars.currentImage = $(kids[vars.currentSlide]).find('img:first');
  71.         }
  72.        
  73.         // Show initial link
  74.         if($(kids[vars.currentSlide]).is('a')){
  75.             $(kids[vars.currentSlide]).css('display','block');
  76.         }
  77.        
  78.         // Set first background
  79.         var sliderImg = $('<img/>').addClass('nivo-main-image');
  80.         sliderImg.attr('src', vars.currentImage.attr('src')).show();
  81.         slider.append(sliderImg);
  82.  
  83.         // Detect Window Resize
  84.         $(window).resize(function() {
  85.             slider.children('img').width(slider.width());
  86.             sliderImg.attr('src', vars.currentImage.attr('src'));
  87.             sliderImg.stop().height('auto');
  88.             $('.nivo-slice').remove();
  89.             $('.nivo-box').remove();
  90.         });
  91.  
  92.         //Create caption
  93.         slider.append($('<div class="nivo-caption"></div>'));
  94.        
  95.         // Process caption function
  96.         var processCaption = function(settings){
  97.             var nivoCaption = $('.nivo-caption', slider);
  98.             if(vars.currentImage.attr('title') != '' && vars.currentImage.attr('title') != undefined){
  99.                 var title = vars.currentImage.attr('title');
  100.                 if(title.substr(0,1) == '#') title = $(title).html();  
  101.  
  102.                 if(nivoCaption.css('display') == 'block'){
  103.                     setTimeout(function(){
  104.                         nivoCaption.html(title);
  105.                     }, settings.animSpeed);
  106.                 } else {
  107.                     nivoCaption.html(title);
  108.                     nivoCaption.stop().fadeIn(settings.animSpeed);
  109.                 }
  110.             } else {
  111.                 nivoCaption.stop().fadeOut(settings.animSpeed);
  112.             }
  113.         }
  114.        
  115.         //Process initial  caption
  116.         processCaption(settings);
  117.        
  118.         // In the words of Super Mario "let's a go!"
  119.         var timer = 0;
  120.         if(!settings.manualAdvance && kids.length > 1){
  121.             timer = setInterval(function(){ nivoRun(slider, kids, settings, false); }, settings.pauseTime);
  122.         }
  123.        
  124.         // Add Direction nav
  125.         if(settings.directionNav){
  126.             slider.append('<div class="nivo-directionNav"><a class="nivo-prevNav">'+ settings.prevText +'</a><a class="nivo-nextNav">'+ settings.nextText +'</a></div>');
  127.            
  128.             $(slider).on('click', 'a.nivo-prevNav', function(){
  129.                 if(vars.running) { return false; }
  130.                 clearInterval(timer);
  131.                 timer = '';
  132.                 vars.currentSlide -= 2;
  133.                 nivoRun(slider, kids, settings, 'prev');
  134.             });
  135.            
  136.             $(slider).on('click', 'a.nivo-nextNav', function(){
  137.                 if(vars.running) { return false; }
  138.                 clearInterval(timer);
  139.                 timer = '';
  140.                 nivoRun(slider, kids, settings, 'next');
  141.             });
  142.         }
  143.        
  144.         // Add Control nav
  145.         if(settings.controlNav){
  146.             vars.controlNavEl = $('<div class="nivo-controlNav"></div>');
  147.             slider.after(vars.controlNavEl);
  148.             for(var i = 0; i < kids.length; i++){
  149.                 if(settings.controlNavThumbs){
  150.                     vars.controlNavEl.addClass('nivo-thumbs-enabled');
  151.                     var child = kids.eq(i);
  152.                     if(!child.is('img')){
  153.                         child = child.find('img:first');
  154.                     }
  155.                     if(child.attr('data-thumb')) vars.controlNavEl.append('<a class="nivo-control" rel="'+ i +'"><img src="'+ child.attr('data-thumb') +'" alt="" /></a>');
  156.                 } else {
  157.                     vars.controlNavEl.append('<a class="nivo-control" rel="'+ i +'">'+ (i + 1) +'</a>');
  158.                 }
  159.             }
  160.  
  161.             //Set initial active link
  162.             $('a:eq('+ vars.currentSlide +')', vars.controlNavEl).addClass('active');
  163.            
  164.             $('a', vars.controlNavEl).bind('click', function(){
  165.                 if(vars.running) return false;
  166.                 if($(this).hasClass('active')) return false;
  167.                 clearInterval(timer);
  168.                 timer = '';
  169.                 sliderImg.attr('src', vars.currentImage.attr('src'));
  170.                 vars.currentSlide = $(this).attr('rel') - 1;
  171.                 nivoRun(slider, kids, settings, 'control');
  172.             });
  173.         }
  174.        
  175.         //For pauseOnHover setting
  176.         if(settings.pauseOnHover){
  177.             slider.hover(function(){
  178.                 vars.paused = true;
  179.                 clearInterval(timer);
  180.                 timer = '';
  181.             }, function(){
  182.                 vars.paused = false;
  183.                 // Restart the timer
  184.                 if(timer === '' && !settings.manualAdvance){
  185.                     timer = setInterval(function(){ nivoRun(slider, kids, settings, false); }, settings.pauseTime);
  186.                 }
  187.             });
  188.         }
  189.        
  190.         // Event when Animation finishes
  191.         slider.bind('nivo:animFinished', function(){
  192.             sliderImg.attr('src', vars.currentImage.attr('src'));
  193.             vars.running = false;
  194.             // Hide child links
  195.             $(kids).each(function(){
  196.                 if($(this).is('a')){
  197.                    $(this).css('display','none');
  198.                 }
  199.             });
  200.             // Show current link
  201.             if($(kids[vars.currentSlide]).is('a')){
  202.                 $(kids[vars.currentSlide]).css('display','block');
  203.             }
  204.             // Restart the timer
  205.             if(timer === '' && !vars.paused && !settings.manualAdvance){
  206.                 timer = setInterval(function(){ nivoRun(slider, kids, settings, false); }, settings.pauseTime);
  207.             }
  208.             // Trigger the afterChange callback
  209.             settings.afterChange.call(this);
  210.         });
  211.        
  212.         // Add slices for slice animations
  213.         var createSlices = function(slider, settings, vars) {
  214.                 if($(vars.currentImage).parent().is('a')) $(vars.currentImage).parent().css('display','block');
  215.             $('img[src="'+ vars.currentImage.attr('src') +'"]', slider).not('.nivo-main-image,.nivo-control img').width(slider.width()).css('visibility', 'hidden').show();
  216.             var sliceHeight = ($('img[src="'+ vars.currentImage.attr('src') +'"]', slider).not('.nivo-main-image,.nivo-control img').parent().is('a')) ? $('img[src="'+ vars.currentImage.attr('src') +'"]', slider).not('.nivo-main-image,.nivo-control img').parent().height() : $('img[src="'+ vars.currentImage.attr('src') +'"]', slider).not('.nivo-main-image,.nivo-control img').height();
  217.  
  218.             for(var i = 0; i < settings.slices; i++){
  219.                 var sliceWidth = Math.round(slider.width()/settings.slices);
  220.                
  221.                 if(i === settings.slices-1){
  222.                     slider.append(
  223.                         $('<div class="nivo-slice" name="'+i+'"><img src="'+ vars.currentImage.attr('src') +'" style="position:absolute; width:'+ slider.width() +'px; height:auto; display:block !important; top:0; left:-'+ ((sliceWidth + (i * sliceWidth)) - sliceWidth) +'px;" /></div>').css({
  224.                             left:(sliceWidth*i)+'px',
  225.                             width:(slider.width()-(sliceWidth*i))+'px',
  226.                             height:sliceHeight+'px',
  227.                             opacity:'0',
  228.                             overflow:'hidden'
  229.                         })
  230.                     );
  231.                 } else {
  232.                     slider.append(
  233.                         $('<div class="nivo-slice" name="'+i+'"><img src="'+ vars.currentImage.attr('src') +'" style="position:absolute; width:'+ slider.width() +'px; height:auto; display:block !important; top:0; left:-'+ ((sliceWidth + (i * sliceWidth)) - sliceWidth) +'px;" /></div>').css({
  234.                             left:(sliceWidth*i)+'px',
  235.                             width:sliceWidth+'px',
  236.                             height:sliceHeight+'px',
  237.                             opacity:'0',
  238.                             overflow:'hidden'
  239.                         })
  240.                     );
  241.                 }
  242.             }
  243.            
  244.             $('.nivo-slice', slider).height(sliceHeight);
  245.             sliderImg.stop().animate({
  246.                 height: $(vars.currentImage).height()
  247.             }, settings.animSpeed);
  248.         };
  249.        
  250.         // Add boxes for box animations
  251.         var createBoxes = function(slider, settings, vars){
  252.                 if($(vars.currentImage).parent().is('a')) $(vars.currentImage).parent().css('display','block');
  253.             $('img[src="'+ vars.currentImage.attr('src') +'"]', slider).not('.nivo-main-image,.nivo-control img').width(slider.width()).css('visibility', 'hidden').show();
  254.             var boxWidth = Math.round(slider.width()/settings.boxCols),
  255.                 boxHeight = Math.round($('img[src="'+ vars.currentImage.attr('src') +'"]', slider).not('.nivo-main-image,.nivo-control img').height() / settings.boxRows);
  256.            
  257.                        
  258.             for(var rows = 0; rows < settings.boxRows; rows++){
  259.                 for(var cols = 0; cols < settings.boxCols; cols++){
  260.                     if(cols === settings.boxCols-1){
  261.                         slider.append(
  262.                             $('<div class="nivo-box" name="'+ cols +'" rel="'+ rows +'"><img src="'+ vars.currentImage.attr('src') +'" style="position:absolute; width:'+ slider.width() +'px; height:auto; display:block; top:-'+ (boxHeight*rows) +'px; left:-'+ (boxWidth*cols) +'px;" /></div>').css({
  263.                                 opacity:0,
  264.                                 left:(boxWidth*cols)+'px',
  265.                                 top:(boxHeight*rows)+'px',
  266.                                 width:(slider.width()-(boxWidth*cols))+'px'
  267.                                
  268.                             })
  269.                         );
  270.                         $('.nivo-box[name="'+ cols +'"]', slider).height($('.nivo-box[name="'+ cols +'"] img', slider).height()+'px');
  271.                     } else {
  272.                         slider.append(
  273.                             $('<div class="nivo-box" name="'+ cols +'" rel="'+ rows +'"><img src="'+ vars.currentImage.attr('src') +'" style="position:absolute; width:'+ slider.width() +'px; height:auto; display:block; top:-'+ (boxHeight*rows) +'px; left:-'+ (boxWidth*cols) +'px;" /></div>').css({
  274.                                 opacity:0,
  275.                                 left:(boxWidth*cols)+'px',
  276.                                 top:(boxHeight*rows)+'px',
  277.                                 width:boxWidth+'px'
  278.                             })
  279.                         );
  280.                         $('.nivo-box[name="'+ cols +'"]', slider).height($('.nivo-box[name="'+ cols +'"] img', slider).height()+'px');
  281.                     }
  282.                 }
  283.             }
  284.            
  285.             sliderImg.stop().animate({
  286.                 height: $(vars.currentImage).height()
  287.             }, settings.animSpeed);
  288.         };
  289.  
  290.         // Private run method
  291.         var nivoRun = function(slider, kids, settings, nudge){          
  292.             // Get our vars
  293.             var vars = slider.data('nivo:vars');
  294.            
  295.             // Trigger the lastSlide callback
  296.             if(vars && (vars.currentSlide === vars.totalSlides - 1)){
  297.                 settings.lastSlide.call(this);
  298.             }
  299.            
  300.             // Stop
  301.             if((!vars || vars.stop) && !nudge) { return false; }
  302.            
  303.             // Trigger the beforeChange callback
  304.             settings.beforeChange.call(this);
  305.  
  306.             // Set current background before change
  307.             if(!nudge){
  308.                 sliderImg.attr('src', vars.currentImage.attr('src'));
  309.             } else {
  310.                 if(nudge === 'prev'){
  311.                     sliderImg.attr('src', vars.currentImage.attr('src'));
  312.                 }
  313.                 if(nudge === 'next'){
  314.                     sliderImg.attr('src', vars.currentImage.attr('src'));
  315.                 }
  316.             }
  317.            
  318.             vars.currentSlide++;
  319.             // Trigger the slideshowEnd callback
  320.             if(vars.currentSlide === vars.totalSlides){
  321.                 vars.currentSlide = 0;
  322.                 settings.slideshowEnd.call(this);
  323.             }
  324.             if(vars.currentSlide < 0) { vars.currentSlide = (vars.totalSlides - 1); }
  325.             // Set vars.currentImage
  326.             if($(kids[vars.currentSlide]).is('img')){
  327.                 vars.currentImage = $(kids[vars.currentSlide]);
  328.             } else {
  329.                 vars.currentImage = $(kids[vars.currentSlide]).find('img:first');
  330.             }
  331.            
  332.             // Set active links
  333.             if(settings.controlNav){
  334.                 $('a', vars.controlNavEl).removeClass('active');
  335.                 $('a:eq('+ vars.currentSlide +')', vars.controlNavEl).addClass('active');
  336.             }
  337.            
  338.             // Process caption
  339.             processCaption(settings);            
  340.            
  341.             // Remove any slices from last transition
  342.             $('.nivo-slice', slider).remove();
  343.            
  344.             // Remove any boxes from last transition
  345.             $('.nivo-box', slider).remove();
  346.            
  347.             var currentEffect = settings.effect,
  348.                 anims = '';
  349.                
  350.             // Generate random effect
  351.             if(settings.effect === 'random'){
  352.                 anims = new Array('sliceDownRight','sliceDownLeft','sliceUpRight','sliceUpLeft','sliceUpDown','sliceUpDownLeft','fold','fade',
  353.                 'boxRandom','boxRain','boxRainReverse','boxRainGrow','boxRainGrowReverse');
  354.                 currentEffect = anims[Math.floor(Math.random()*(anims.length + 1))];
  355.                 if(currentEffect === undefined) { currentEffect = 'fade'; }
  356.             }
  357.            
  358.             // Run random effect from specified set (eg: effect:'fold,fade')
  359.             if(settings.effect.indexOf(',') !== -1){
  360.                 anims = settings.effect.split(',');
  361.                 currentEffect = anims[Math.floor(Math.random()*(anims.length))];
  362.                 if(currentEffect === undefined) { currentEffect = 'fade'; }
  363.             }
  364.            
  365.             // Custom transition as defined by "data-transition" attribute
  366.             if(vars.currentImage.attr('data-transition')){
  367.                 currentEffect = vars.currentImage.attr('data-transition');
  368.             }
  369.        
  370.             // Run effects
  371.             vars.running = true;
  372.             var timeBuff = 0,
  373.                 i = 0,
  374.                 slices = '',
  375.                 firstSlice = '',
  376.                 totalBoxes = '',
  377.                 boxes = '';
  378.            
  379.             if(currentEffect === 'sliceDown' || currentEffect === 'sliceDownRight' || currentEffect === 'sliceDownLeft'){
  380.                 createSlices(slider, settings, vars);
  381.                 timeBuff = 0;
  382.                 i = 0;
  383.                 slices = $('.nivo-slice', slider);
  384.                 if(currentEffect === 'sliceDownLeft') { slices = $('.nivo-slice', slider)._reverse(); }
  385.                
  386.                 slices.each(function(){
  387.                     var slice = $(this);
  388.                     slice.css({ 'top': '0px' });
  389.                     if(i === settings.slices-1){
  390.                         setTimeout(function(){
  391.                             slice.animate({opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); });
  392.                         }, (100 + timeBuff));
  393.                     } else {
  394.                         setTimeout(function(){
  395.                             slice.animate({opacity:'1.0' }, settings.animSpeed);
  396.                         }, (100 + timeBuff));
  397.                     }
  398.                     timeBuff += 50;
  399.                     i++;
  400.                 });
  401.             } else if(currentEffect === 'sliceUp' || currentEffect === 'sliceUpRight' || currentEffect === 'sliceUpLeft'){
  402.                 createSlices(slider, settings, vars);
  403.                 timeBuff = 0;
  404.                 i = 0;
  405.                 slices = $('.nivo-slice', slider);
  406.                 if(currentEffect === 'sliceUpLeft') { slices = $('.nivo-slice', slider)._reverse(); }
  407.                
  408.                 slices.each(function(){
  409.                     var slice = $(this);
  410.                     slice.css({ 'bottom': '0px' });
  411.                     if(i === settings.slices-1){
  412.                         setTimeout(function(){
  413.                             slice.animate({opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); });
  414.                         }, (100 + timeBuff));
  415.                     } else {
  416.                         setTimeout(function(){
  417.                             slice.animate({opacity:'1.0' }, settings.animSpeed);
  418.                         }, (100 + timeBuff));
  419.                     }
  420.                     timeBuff += 50;
  421.                     i++;
  422.                 });
  423.             } else if(currentEffect === 'sliceUpDown' || currentEffect === 'sliceUpDownRight' || currentEffect === 'sliceUpDownLeft'){
  424.                 createSlices(slider, settings, vars);
  425.                 timeBuff = 0;
  426.                 i = 0;
  427.                 var v = 0;
  428.                 slices = $('.nivo-slice', slider);
  429.                 if(currentEffect === 'sliceUpDownLeft') { slices = $('.nivo-slice', slider)._reverse(); }
  430.                
  431.                 slices.each(function(){
  432.                     var slice = $(this);
  433.                     if(i === 0){
  434.                         slice.css('top','0px');
  435.                         i++;
  436.                     } else {
  437.                         slice.css('bottom','0px');
  438.                         i = 0;
  439.                     }
  440.                    
  441.                     if(v === settings.slices-1){
  442.                         setTimeout(function(){
  443.                             slice.animate({opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); });
  444.                         }, (100 + timeBuff));
  445.                     } else {
  446.                         setTimeout(function(){
  447.                             slice.animate({opacity:'1.0' }, settings.animSpeed);
  448.                         }, (100 + timeBuff));
  449.                     }
  450.                     timeBuff += 50;
  451.                     v++;
  452.                 });
  453.             } else if(currentEffect === 'fold'){
  454.                 createSlices(slider, settings, vars);
  455.                 timeBuff = 0;
  456.                 i = 0;
  457.                
  458.                 $('.nivo-slice', slider).each(function(){
  459.                     var slice = $(this);
  460.                     var origWidth = slice.width();
  461.                     slice.css({ top:'0px', width:'0px' });
  462.                     if(i === settings.slices-1){
  463.                         setTimeout(function(){
  464.                             slice.animate({ width:origWidth, opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); });
  465.                         }, (100 + timeBuff));
  466.                     } else {
  467.                         setTimeout(function(){
  468.                             slice.animate({ width:origWidth, opacity:'1.0' }, settings.animSpeed);
  469.                         }, (100 + timeBuff));
  470.                     }
  471.                     timeBuff += 50;
  472.                     i++;
  473.                 });
  474.             } else if(currentEffect === 'fade'){
  475.                 createSlices(slider, settings, vars);
  476.                
  477.                 firstSlice = $('.nivo-slice:first', slider);
  478.                 firstSlice.css({
  479.                     'width': slider.width() + 'px'
  480.                 });
  481.    
  482.                 firstSlice.animate({ opacity:'1.0' }, (settings.animSpeed*2), '', function(){ slider.trigger('nivo:animFinished'); });
  483.             } else if(currentEffect === 'slideInRight'){
  484.                 createSlices(slider, settings, vars);
  485.                
  486.                 firstSlice = $('.nivo-slice:first', slider);
  487.                 firstSlice.css({
  488.                     'width': '0px',
  489.                     'opacity': '1'
  490.                 });
  491.  
  492.                 firstSlice.animate({ width: slider.width() + 'px' }, (settings.animSpeed*2), '', function(){ slider.trigger('nivo:animFinished'); });
  493.             } else if(currentEffect === 'slideInLeft'){
  494.                 createSlices(slider, settings, vars);
  495.                
  496.                 firstSlice = $('.nivo-slice:first', slider);
  497.                 firstSlice.css({
  498.                     'width': '0px',
  499.                     'opacity': '1',
  500.                     'left': '',
  501.                     'right': '0px'
  502.                 });
  503.  
  504.                 firstSlice.animate({ width: slider.width() + 'px' }, (settings.animSpeed*2), '', function(){
  505.                     // Reset positioning
  506.                     firstSlice.css({
  507.                         'left': '0px',
  508.                         'right': ''
  509.                     });
  510.                     slider.trigger('nivo:animFinished');
  511.                 });
  512.             } else if(currentEffect === 'boxRandom'){
  513.                 createBoxes(slider, settings, vars);
  514.                
  515.                 totalBoxes = settings.boxCols * settings.boxRows;
  516.                 i = 0;
  517.                 timeBuff = 0;
  518.  
  519.                 boxes = shuffle($('.nivo-box', slider));
  520.                 boxes.each(function(){
  521.                     var box = $(this);
  522.                     if(i === totalBoxes-1){
  523.                         setTimeout(function(){
  524.                             box.animate({ opacity:'1' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); });
  525.                         }, (100 + timeBuff));
  526.                     } else {
  527.                         setTimeout(function(){
  528.                             box.animate({ opacity:'1' }, settings.animSpeed);
  529.                         }, (100 + timeBuff));
  530.                     }
  531.                     timeBuff += 20;
  532.                     i++;
  533.                 });
  534.             } else if(currentEffect === 'boxRain' || currentEffect === 'boxRainReverse' || currentEffect === 'boxRainGrow' || currentEffect === 'boxRainGrowReverse'){
  535.                 createBoxes(slider, settings, vars);
  536.                
  537.                 totalBoxes = settings.boxCols * settings.boxRows;
  538.                 i = 0;
  539.                 timeBuff = 0;
  540.                
  541.                 // Split boxes into 2D array
  542.                 var rowIndex = 0;
  543.                 var colIndex = 0;
  544.                 var box2Darr = [];
  545.                 box2Darr[rowIndex] = [];
  546.                 boxes = $('.nivo-box', slider);
  547.                 if(currentEffect === 'boxRainReverse' || currentEffect === 'boxRainGrowReverse'){
  548.                     boxes = $('.nivo-box', slider)._reverse();
  549.                 }
  550.                 boxes.each(function(){
  551.                     box2Darr[rowIndex][colIndex] = $(this);
  552.                     colIndex++;
  553.                     if(colIndex === settings.boxCols){
  554.                         rowIndex++;
  555.                         colIndex = 0;
  556.                         box2Darr[rowIndex] = [];
  557.                     }
  558.                 });
  559.                
  560.                 // Run animation
  561.                 for(var cols = 0; cols < (settings.boxCols * 2); cols++){
  562.                     var prevCol = cols;
  563.                     for(var rows = 0; rows < settings.boxRows; rows++){
  564.                         if(prevCol >= 0 && prevCol < settings.boxCols){
  565.                             /* Due to some weird JS bug with loop vars
  566.                             being used in setTimeout, this is wrapped
  567.                             with an anonymous function call */
  568.                             (function(row, col, time, i, totalBoxes) {
  569.                                 var box = $(box2Darr[row][col]);
  570.                                 var w = box.width();
  571.                                 var h = box.height();
  572.                                 if(currentEffect === 'boxRainGrow' || currentEffect === 'boxRainGrowReverse'){
  573.                                     box.width(0).height(0);
  574.                                 }
  575.                                 if(i === totalBoxes-1){
  576.                                     setTimeout(function(){
  577.                                         box.animate({ opacity:'1', width:w, height:h }, settings.animSpeed/1.3, '', function(){ slider.trigger('nivo:animFinished'); });
  578.                                     }, (100 + time));
  579.                                 } else {
  580.                                     setTimeout(function(){
  581.                                         box.animate({ opacity:'1', width:w, height:h }, settings.animSpeed/1.3);
  582.                                     }, (100 + time));
  583.                                 }
  584.                             })(rows, prevCol, timeBuff, i, totalBoxes);
  585.                             i++;
  586.                         }
  587.                         prevCol--;
  588.                     }
  589.                     timeBuff += 100;
  590.                 }
  591.             }          
  592.         };
  593.        
  594.         // Shuffle an array
  595.         var shuffle = function(arr){
  596.             for(var j, x, i = arr.length; i; j = parseInt(Math.random() * i, 10), x = arr[--i], arr[i] = arr[j], arr[j] = x);
  597.             return arr;
  598.         };
  599.        
  600.         // For debugging
  601.         var trace = function(msg){
  602.             if(this.console && typeof console.log !== 'undefined') { console.log(msg); }
  603.         };
  604.        
  605.         // Start / Stop
  606.         this.stop = function(){
  607.             if(!$(element).data('nivo:vars').stop){
  608.                 $(element).data('nivo:vars').stop = true;
  609.                 trace('Stop Slider');
  610.             }
  611.         };
  612.        
  613.         this.start = function(){
  614.             if($(element).data('nivo:vars').stop){
  615.                 $(element).data('nivo:vars').stop = false;
  616.                 trace('Start Slider');
  617.             }
  618.         };
  619.        
  620.         // Trigger the afterLoad callback
  621.         settings.afterLoad.call(this);
  622.        
  623.         return this;
  624.     };
  625.        
  626.     $.fn.nivoSlider = function(options) {
  627.         return this.each(function(key, value){
  628.             var element = $(this);
  629.             // Return early if this element already has a plugin instance
  630.             if (element.data('nivoslider')) { return element.data('nivoslider'); }
  631.             // Pass options to plugin constructor
  632.             var nivoslider = new NivoSlider(this, options);
  633.             // Store plugin object in this element's data
  634.             element.data('nivoslider', nivoslider);
  635.         });
  636.     };
  637.    
  638.     //Default settings
  639.     $.fn.nivoSlider.defaults = {
  640.         effect: 'random',
  641.         slices: 15,
  642.         boxCols: 8,
  643.         boxRows: 4,
  644.         animSpeed: 500,
  645.         pauseTime: 3000,
  646.         startSlide: 0,
  647.         directionNav: true,
  648.         controlNav: true,
  649.         controlNavThumbs: false,
  650.         pauseOnHover: true,
  651.         manualAdvance: false,
  652.         prevText: 'Prev',
  653.         nextText: 'Next',
  654.         randomStart: false,
  655.         beforeChange: function(){},
  656.         afterChange: function(){},
  657.         slideshowEnd: function(){},
  658.         lastSlide: function(){},
  659.         afterLoad: function(){}
  660.     };
  661.  
  662.     $.fn._reverse = [].reverse;
  663.    
  664. })(jQuery);

Raw Paste


Login or Register to edit or fork this paste. It's free.