API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Feb 15th, 2014
1,362
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 49.80 KB | None | 0 0
raw download clone embed print report
  1. /**
  2.  * BxSlider v4.1.1 - Fully loaded, responsive content slider
  3.  * http://bxslider.com
  4.  *
  5.  * Copyright 2013, Steven Wanderski - http://stevenwanderski.com - http://bxcreative.com
  6.  * Written while drinking Belgian ales and listening to jazz
  7.  *
  8.  * Released under the MIT license - http://opensource.org/licenses/MIT
  9.  */
  10.  
  11. $(document).ready(function(){
  12. $('.bxslider').bxSlider({
  13.     auto: true,
  14.     mode: 'fade',
  15.     captions: true
  16. })
  17. })
  18. ;
  19.  
  20. ;(function($){
  21.  
  22.     var plugin = {};
  23.  
  24.     var defaults = {
  25.  
  26.         // GENERAL
  27.         mode: 'horizontal',
  28.         slideSelector: '',
  29.         infiniteLoop: true,
  30.         hideControlOnEnd: false,
  31.         speed: 500,
  32.         easing: null,
  33.         slideMargin: 0,
  34.         startSlide: 0,
  35.         randomStart: false,
  36.         captions: false,
  37.         ticker: false,
  38.         tickerHover: false,
  39.         adaptiveHeight: false,
  40.         adaptiveHeightSpeed: 500,
  41.         video: false,
  42.         useCSS: true,
  43.         preloadImages: 'visible',
  44.         responsive: true,
  45.  
  46.         // TOUCH
  47.         touchEnabled: true,
  48.         swipeThreshold: 50,
  49.         oneToOneTouch: true,
  50.         preventDefaultSwipeX: true,
  51.         preventDefaultSwipeY: false,
  52.  
  53.         // PAGER
  54.         pager: true,
  55.         pagerType: 'full',
  56.         pagerShortSeparator: ' / ',
  57.         pagerSelector: null,
  58.         buildPager: null,
  59.         pagerCustom: null,
  60.  
  61.         // CONTROLS
  62.         controls: true,
  63.         nextText: 'Next',
  64.         prevText: 'Prev',
  65.         nextSelector: null,
  66.         prevSelector: null,
  67.         autoControls: false,
  68.         startText: 'Start',
  69.         stopText: 'Stop',
  70.         autoControlsCombine: false,
  71.         autoControlsSelector: null,
  72.  
  73.         // AUTO
  74.         auto: false,
  75.         pause: 4000,
  76.         autoStart: true,
  77.         autoDirection: 'next',
  78.         autoHover: false,
  79.         autoDelay: 0,
  80.  
  81.         // CAROUSEL
  82.         minSlides: 1,
  83.         maxSlides: 1,
  84.         moveSlides: 0,
  85.         slideWidth: 0,
  86.  
  87.         // CALLBACKS
  88.         onSliderLoad: function() {},
  89.         onSlideBefore: function() {},
  90.         onSlideAfter: function() {},
  91.         onSlideNext: function() {},
  92.         onSlidePrev: function() {}
  93.     }
  94.  
  95.     $.fn.bxSlider = function(options){
  96.  
  97.         if(this.length == 0) return this;
  98.  
  99.         // support mutltiple elements
  100.         if(this.length > 1){
  101.             this.each(function(){$(this).bxSlider(options)});
  102.             return this;
  103.         }
  104.  
  105.         // create a namespace to be used throughout the plugin
  106.         var slider = {};
  107.         // set a reference to our slider element
  108.         var el = this;
  109.         plugin.el = this;
  110.  
  111.         /**
  112.          * Makes slideshow responsive
  113.          */
  114.         // first get the original window dimens (thanks alot IE)
  115.         var windowWidth = $(window).width();
  116.         var windowHeight = $(window).height();
  117.  
  118.  
  119.  
  120.         /**
  121.          * ===================================================================================
  122.          * = PRIVATE FUNCTIONS
  123.          * ===================================================================================
  124.          */
  125.  
  126.         /**
  127.          * Initializes namespace settings to be used throughout plugin
  128.          */
  129.         var init = function(){
  130.             // merge user-supplied options with the defaults
  131.             slider.settings = $.extend({}, defaults, options);
  132.             // parse slideWidth setting
  133.             slider.settings.slideWidth = parseInt(slider.settings.slideWidth);
  134.             // store the original children
  135.             slider.children = el.children(slider.settings.slideSelector);
  136.             // check if actual number of slides is less than minSlides / maxSlides
  137.             if(slider.children.length < slider.settings.minSlides) slider.settings.minSlides = slider.children.length;
  138.             if(slider.children.length < slider.settings.maxSlides) slider.settings.maxSlides = slider.children.length;
  139.             // if random start, set the startSlide setting to random number
  140.             if(slider.settings.randomStart) slider.settings.startSlide = Math.floor(Math.random() * slider.children.length);
  141.             // store active slide information
  142.             slider.active = { index: slider.settings.startSlide }
  143.             // store if the slider is in carousel mode (displaying / moving multiple slides)
  144.             slider.carousel = slider.settings.minSlides > 1 || slider.settings.maxSlides > 1;
  145.             // if carousel, force preloadImages = 'all'
  146.             if(slider.carousel) slider.settings.preloadImages = 'all';
  147.             // calculate the min / max width thresholds based on min / max number of slides
  148.             // used to setup and update carousel slides dimensions
  149.             slider.minThreshold = (slider.settings.minSlides * slider.settings.slideWidth) + ((slider.settings.minSlides - 1) * slider.settings.slideMargin);
  150.             slider.maxThreshold = (slider.settings.maxSlides * slider.settings.slideWidth) + ((slider.settings.maxSlides - 1) * slider.settings.slideMargin);
  151.             // store the current state of the slider (if currently animating, working is true)
  152.             slider.working = false;
  153.             // initialize the controls object
  154.             slider.controls = {};
  155.             // initialize an auto interval
  156.             slider.interval = null;
  157.             // determine which property to use for transitions
  158.             slider.animProp = slider.settings.mode == 'vertical' ? 'top' : 'left';
  159.             // determine if hardware acceleration can be used
  160.             slider.usingCSS = slider.settings.useCSS && slider.settings.mode != 'fade' && (function(){
  161.                 // create our test div element
  162.                 var div = document.createElement('div');
  163.                 // css transition properties
  164.                 var props = ['WebkitPerspective', 'MozPerspective', 'OPerspective', 'msPerspective'];
  165.                 // test for each property
  166.                 for(var i in props){
  167.                     if(div.style[props[i]] !== undefined){
  168.                         slider.cssPrefix = props[i].replace('Perspective', '').toLowerCase();
  169.                         slider.animProp = '-' + slider.cssPrefix + '-transform';
  170.                         return true;
  171.                     }
  172.                 }
  173.                 return false;
  174.             }());
  175.             // if vertical mode always make maxSlides and minSlides equal
  176.             if(slider.settings.mode == 'vertical') slider.settings.maxSlides = slider.settings.minSlides;
  177.             // save original style data
  178.             el.data("origStyle", el.attr("style"));
  179.             el.children(slider.settings.slideSelector).each(function() {
  180.               $(this).data("origStyle", $(this).attr("style"));
  181.             });
  182.             // perform all DOM / CSS modifications
  183.             setup();
  184.         }
  185.  
  186.         /**
  187.          * Performs all DOM and CSS modifications
  188.          */
  189.         var setup = function(){
  190.             // wrap el in a wrapper
  191.             el.wrap('<div class="bx-wrapper"><div class="bx-viewport"></div></div>');
  192.             // store a namspace reference to .bx-viewport
  193.             slider.viewport = el.parent();
  194.             // add a loading div to display while images are loading
  195.             slider.loader = $('<div class="bx-loading" />');
  196.             slider.viewport.prepend(slider.loader);
  197.             // set el to a massive width, to hold any needed slides
  198.             // also strip any margin and padding from el
  199.             el.css({
  200.                 width: slider.settings.mode == 'horizontal' ? (slider.children.length * 100 + 215) + '%' : 'auto',
  201.                 position: 'relative'
  202.             });
  203.             // if using CSS, add the easing property
  204.             if(slider.usingCSS && slider.settings.easing){
  205.                 el.css('-' + slider.cssPrefix + '-transition-timing-function', slider.settings.easing);
  206.             // if not using CSS and no easing value was supplied, use the default JS animation easing (swing)
  207.             }else if(!slider.settings.easing){
  208.                 slider.settings.easing = 'swing';
  209.             }
  210.             var slidesShowing = getNumberSlidesShowing();
  211.             // make modifications to the viewport (.bx-viewport)
  212.             slider.viewport.css({
  213.                 width: '100%',
  214.                 overflow: 'hidden',
  215.                 position: 'relative'
  216.             });
  217.             slider.viewport.parent().css({
  218.                 maxWidth: getViewportMaxWidth()
  219.             });
  220.             // make modification to the wrapper (.bx-wrapper)
  221.             if(!slider.settings.pager) {
  222.                 slider.viewport.parent().css({
  223.                 margin: '0 auto 0px'
  224.                 });
  225.             }
  226.             // apply css to all slider children
  227.             slider.children.css({
  228.                 'float': slider.settings.mode == 'horizontal' ? 'left' : 'none',
  229.                 listStyle: 'none',
  230.                 position: 'relative'
  231.             });
  232.             // apply the calculated width after the float is applied to prevent scrollbar interference
  233.             slider.children.css('width', getSlideWidth());
  234.             // if slideMargin is supplied, add the css
  235.             if(slider.settings.mode == 'horizontal' && slider.settings.slideMargin > 0) slider.children.css('marginRight', slider.settings.slideMargin);
  236.             if(slider.settings.mode == 'vertical' && slider.settings.slideMargin > 0) slider.children.css('marginBottom', slider.settings.slideMargin);
  237.             // if "fade" mode, add positioning and z-index CSS
  238.             if(slider.settings.mode == 'fade'){
  239.                 slider.children.css({
  240.                     position: 'absolute',
  241.                     zIndex: 0,
  242.                     display: 'none'
  243.                 });
  244.                 // prepare the z-index on the showing element
  245.                 slider.children.eq(slider.settings.startSlide).css({zIndex: 50, display: 'block'});
  246.             }
  247.             // create an element to contain all slider controls (pager, start / stop, etc)
  248.             slider.controls.el = $('<div class="bx-controls" />');
  249.             // if captions are requested, add them
  250.             if(slider.settings.captions) appendCaptions();
  251.             // check if startSlide is last slide
  252.             slider.active.last = slider.settings.startSlide == getPagerQty() - 1;
  253.             // if video is true, set up the fitVids plugin
  254.             if(slider.settings.video) el.fitVids();
  255.             // set the default preload selector (visible)
  256.             var preloadSelector = slider.children.eq(slider.settings.startSlide);
  257.             if (slider.settings.preloadImages == "all") preloadSelector = slider.children;
  258.             // only check for control addition if not in "ticker" mode
  259.             if(!slider.settings.ticker){
  260.                 // if pager is requested, add it
  261.                 if(slider.settings.pager) appendPager();
  262.                 // if controls are requested, add them
  263.                 if(slider.settings.controls) appendControls();
  264.                 // if auto is true, and auto controls are requested, add them
  265.                 if(slider.settings.auto && slider.settings.autoControls) appendControlsAuto();
  266.                 // if any control option is requested, add the controls wrapper
  267.                 if(slider.settings.controls || slider.settings.autoControls || slider.settings.pager) slider.viewport.after(slider.controls.el);
  268.             // if ticker mode, do not allow a pager
  269.             }else{
  270.                 slider.settings.pager = false;
  271.             }
  272.             // preload all images, then perform final DOM / CSS modifications that depend on images being loaded
  273.             loadElements(preloadSelector, start);
  274.         }
  275.  
  276.         var loadElements = function(selector, callback){
  277.             var total = selector.find('img, iframe').length;
  278.             if (total == 0){
  279.                 callback();
  280.                 return;
  281.             }
  282.             var count = 0;
  283.             selector.find('img, iframe').each(function(){
  284.                 $(this).one('load', function() {
  285.                   if(++count == total) callback();
  286.                 }).each(function() {
  287.                   if(this.complete) $(this).load();
  288.                 });
  289.             });
  290.         }
  291.  
  292.         /**
  293.          * Start the slider
  294.          */
  295.         var start = function(){
  296.             // if infinite loop, prepare additional slides
  297.             if(slider.settings.infiniteLoop && slider.settings.mode != 'fade' && !slider.settings.ticker){
  298.                 var slice = slider.settings.mode == 'vertical' ? slider.settings.minSlides : slider.settings.maxSlides;
  299.                 var sliceAppend = slider.children.slice(0, slice).clone().addClass('bx-clone');
  300.                 var slicePrepend = slider.children.slice(-slice).clone().addClass('bx-clone');
  301.                 el.append(sliceAppend).prepend(slicePrepend);
  302.             }
  303.             // remove the loading DOM element
  304.             slider.loader.remove();
  305.             // set the left / top position of "el"
  306.             setSlidePosition();
  307.             // if "vertical" mode, always use adaptiveHeight to prevent odd behavior
  308.             if (slider.settings.mode == 'vertical') slider.settings.adaptiveHeight = true;
  309.             // set the viewport height
  310.             slider.viewport.height(getViewportHeight());
  311.             // make sure everything is positioned just right (same as a window resize)
  312.             el.redrawSlider();
  313.             // onSliderLoad callback
  314.             slider.settings.onSliderLoad(slider.active.index);
  315.             // slider has been fully initialized
  316.             slider.initialized = true;
  317.             // bind the resize call to the window
  318.             if (slider.settings.responsive) $(window).bind('resize', resizeWindow);
  319.             // if auto is true, start the show
  320.             if (slider.settings.auto && slider.settings.autoStart) initAuto();
  321.             // if ticker is true, start the ticker
  322.             if (slider.settings.ticker) initTicker();
  323.             // if pager is requested, make the appropriate pager link active
  324.             if (slider.settings.pager) updatePagerActive(slider.settings.startSlide);
  325.             // check for any updates to the controls (like hideControlOnEnd updates)
  326.             if (slider.settings.controls) updateDirectionControls();
  327.             // if touchEnabled is true, setup the touch events
  328.             if (slider.settings.touchEnabled && !slider.settings.ticker) initTouch();
  329.         }
  330.  
  331.         /**
  332.          * Returns the calculated height of the viewport, used to determine either adaptiveHeight or the maxHeight value
  333.          */
  334.         var getViewportHeight = function(){
  335.             var height = 0;
  336.             // first determine which children (slides) should be used in our height calculation
  337.             var children = $();
  338.             // if mode is not "vertical" and adaptiveHeight is false, include all children
  339.             if(slider.settings.mode != 'vertical' && !slider.settings.adaptiveHeight){
  340.                 children = slider.children;
  341.             }else{
  342.                 // if not carousel, return the single active child
  343.                 if(!slider.carousel){
  344.                     children = slider.children.eq(slider.active.index);
  345.                 // if carousel, return a slice of children
  346.                 }else{
  347.                     // get the individual slide index
  348.                     var currentIndex = slider.settings.moveSlides == 1 ? slider.active.index : slider.active.index * getMoveBy();
  349.                     // add the current slide to the children
  350.                     children = slider.children.eq(currentIndex);
  351.                     // cycle through the remaining "showing" slides
  352.                     for (i = 1; i <= slider.settings.maxSlides - 1; i++){
  353.                         // if looped back to the start
  354.                         if(currentIndex + i >= slider.children.length){
  355.                             children = children.add(slider.children.eq(i - 1));
  356.                         }else{
  357.                             children = children.add(slider.children.eq(currentIndex + i));
  358.                         }
  359.                     }
  360.                 }
  361.             }
  362.             // if "vertical" mode, calculate the sum of the heights of the children
  363.             if(slider.settings.mode == 'vertical'){
  364.                 children.each(function(index) {
  365.                   height += $(this).outerHeight();
  366.                 });
  367.                 // add user-supplied margins
  368.                 if(slider.settings.slideMargin > 0){
  369.                     height += slider.settings.slideMargin * (slider.settings.minSlides - 1);
  370.                 }
  371.             // if not "vertical" mode, calculate the max height of the children
  372.             }else{
  373.                 height = Math.max.apply(Math, children.map(function(){
  374.                     return $(this).outerHeight(false);
  375.                 }).get());
  376.             }
  377.             return height;
  378.         }
  379.  
  380.         /**
  381.          * Returns the calculated width to be used for the outer wrapper / viewport
  382.          */
  383.         var getViewportMaxWidth = function(){
  384.             var width = '100%';
  385.             if(slider.settings.slideWidth > 0){
  386.                 if(slider.settings.mode == 'horizontal'){
  387.                     width = (slider.settings.maxSlides * slider.settings.slideWidth) + ((slider.settings.maxSlides - 1) * slider.settings.slideMargin);
  388.                 }else{
  389.                     width = slider.settings.slideWidth;
  390.                 }
  391.             }
  392.             return width;
  393.         }
  394.  
  395.         /**
  396.          * Returns the calculated width to be applied to each slide
  397.          */
  398.         var getSlideWidth = function(){
  399.             // start with any user-supplied slide width
  400.             var newElWidth = slider.settings.slideWidth;
  401.             // get the current viewport width
  402.             var wrapWidth = slider.viewport.width();
  403.             // if slide width was not supplied, or is larger than the viewport use the viewport width
  404.             if(slider.settings.slideWidth == 0 ||
  405.                 (slider.settings.slideWidth > wrapWidth && !slider.carousel) ||
  406.                 slider.settings.mode == 'vertical'){
  407.                 newElWidth = wrapWidth;
  408.             // if carousel, use the thresholds to determine the width
  409.             }else if(slider.settings.maxSlides > 1 && slider.settings.mode == 'horizontal'){
  410.                 if(wrapWidth > slider.maxThreshold){
  411.                     // newElWidth = (wrapWidth - (slider.settings.slideMargin * (slider.settings.maxSlides - 1))) / slider.settings.maxSlides;
  412.                 }else if(wrapWidth < slider.minThreshold){
  413.                     newElWidth = (wrapWidth - (slider.settings.slideMargin * (slider.settings.minSlides - 1))) / slider.settings.minSlides;
  414.                 }
  415.             }
  416.             return newElWidth;
  417.         }
  418.  
  419.         /**
  420.          * Returns the number of slides currently visible in the viewport (includes partially visible slides)
  421.          */
  422.         var getNumberSlidesShowing = function(){
  423.             var slidesShowing = 1;
  424.             if(slider.settings.mode == 'horizontal' && slider.settings.slideWidth > 0){
  425.                 // if viewport is smaller than minThreshold, return minSlides
  426.                 if(slider.viewport.width() < slider.minThreshold){
  427.                     slidesShowing = slider.settings.minSlides;
  428.                 // if viewport is larger than minThreshold, return maxSlides
  429.                 }else if(slider.viewport.width() > slider.maxThreshold){
  430.                     slidesShowing = slider.settings.maxSlides;
  431.                 // if viewport is between min / max thresholds, divide viewport width by first child width
  432.                 }else{
  433.                     var childWidth = slider.children.first().width();
  434.                     slidesShowing = Math.floor(slider.viewport.width() / childWidth);
  435.                 }
  436.             // if "vertical" mode, slides showing will always be minSlides
  437.             }else if(slider.settings.mode == 'vertical'){
  438.                 slidesShowing = slider.settings.minSlides;
  439.             }
  440.             return slidesShowing;
  441.         }
  442.  
  443.         /**
  444.          * Returns the number of pages (one full viewport of slides is one "page")
  445.          */
  446.         var getPagerQty = function(){
  447.             var pagerQty = 0;
  448.             // if moveSlides is specified by the user
  449.             if(slider.settings.moveSlides > 0){
  450.                 if(slider.settings.infiniteLoop){
  451.                     pagerQty = slider.children.length / getMoveBy();
  452.                 }else{
  453.                     // use a while loop to determine pages
  454.                     var breakPoint = 0;
  455.                     var counter = 0
  456.                     // when breakpoint goes above children length, counter is the number of pages
  457.                     while (breakPoint < slider.children.length){
  458.                         ++pagerQty;
  459.                         breakPoint = counter + getNumberSlidesShowing();
  460.                         counter += slider.settings.moveSlides <= getNumberSlidesShowing() ? slider.settings.moveSlides : getNumberSlidesShowing();
  461.                     }
  462.                 }
  463.             // if moveSlides is 0 (auto) divide children length by sides showing, then round up
  464.             }else{
  465.                 pagerQty = Math.ceil(slider.children.length / getNumberSlidesShowing());
  466.             }
  467.             return pagerQty;
  468.         }
  469.  
  470.         /**
  471.          * Returns the number of indivual slides by which to shift the slider
  472.          */
  473.         var getMoveBy = function(){
  474.             // if moveSlides was set by the user and moveSlides is less than number of slides showing
  475.             if(slider.settings.moveSlides > 0 && slider.settings.moveSlides <= getNumberSlidesShowing()){
  476.                 return slider.settings.moveSlides;
  477.             }
  478.             // if moveSlides is 0 (auto)
  479.             return getNumberSlidesShowing();
  480.         }
  481.  
  482.         /**
  483.          * Sets the slider's (el) left or top position
  484.          */
  485.         var setSlidePosition = function(){
  486.             // if last slide, not infinite loop, and number of children is larger than specified maxSlides
  487.             if(slider.children.length > slider.settings.maxSlides && slider.active.last && !slider.settings.infiniteLoop){
  488.                 if (slider.settings.mode == 'horizontal'){
  489.                     // get the last child's position
  490.                     var lastChild = slider.children.last();
  491.                     var position = lastChild.position();
  492.                     // set the left position
  493.                     setPositionProperty(-(position.left - (slider.viewport.width() - lastChild.width())), 'reset', 0);
  494.                 }else if(slider.settings.mode == 'vertical'){
  495.                     // get the last showing index's position
  496.                     var lastShowingIndex = slider.children.length - slider.settings.minSlides;
  497.                     var position = slider.children.eq(lastShowingIndex).position();
  498.                     // set the top position
  499.                     setPositionProperty(-position.top, 'reset', 0);
  500.                 }
  501.             // if not last slide
  502.             }else{
  503.                 // get the position of the first showing slide
  504.                 var position = slider.children.eq(slider.active.index * getMoveBy()).position();
  505.                 // check for last slide
  506.                 if (slider.active.index == getPagerQty() - 1) slider.active.last = true;
  507.                 // set the repective position
  508.                 if (position != undefined){
  509.                     if (slider.settings.mode == 'horizontal') setPositionProperty(-position.left, 'reset', 0);
  510.                     else if (slider.settings.mode == 'vertical') setPositionProperty(-position.top, 'reset', 0);
  511.                 }
  512.             }
  513.         }
  514.  
  515.         /**
  516.          * Sets the el's animating property position (which in turn will sometimes animate el).
  517.          * If using CSS, sets the transform property. If not using CSS, sets the top / left property.
  518.          *
  519.          * @param value (int)
  520.          *  - the animating property's value
  521.          *
  522.          * @param type (string) 'slider', 'reset', 'ticker'
  523.          *  - the type of instance for which the function is being
  524.          *
  525.          * @param duration (int)
  526.          *  - the amount of time (in ms) the transition should occupy
  527.          *
  528.          * @param params (array) optional
  529.          *  - an optional parameter containing any variables that need to be passed in
  530.          */
  531.         var setPositionProperty = function(value, type, duration, params){
  532.             // use CSS transform
  533.             if(slider.usingCSS){
  534.                 // determine the translate3d value
  535.                 var propValue = slider.settings.mode == 'vertical' ? 'translate3d(0, ' + value + 'px, 0)' : 'translate3d(' + value + 'px, 0, 0)';
  536.                 // add the CSS transition-duration
  537.                 el.css('-' + slider.cssPrefix + '-transition-duration', duration / 1000 + 's');
  538.                 if(type == 'slide'){
  539.                     // set the property value
  540.                     el.css(slider.animProp, propValue);
  541.                     // bind a callback method - executes when CSS transition completes
  542.                     el.bind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function(){
  543.                         // unbind the callback
  544.                         el.unbind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd');
  545.                         updateAfterSlideTransition();
  546.                     });
  547.                 }else if(type == 'reset'){
  548.                     el.css(slider.animProp, propValue);
  549.                 }else if(type == 'ticker'){
  550.                     // make the transition use 'linear'
  551.                     el.css('-' + slider.cssPrefix + '-transition-timing-function', 'linear');
  552.                     el.css(slider.animProp, propValue);
  553.                     // bind a callback method - executes when CSS transition completes
  554.                     el.bind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function(){
  555.                         // unbind the callback
  556.                         el.unbind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd');
  557.                         // reset the position
  558.                         setPositionProperty(params['resetValue'], 'reset', 0);
  559.                         // start the loop again
  560.                         tickerLoop();
  561.                     });
  562.                 }
  563.             // use JS animate
  564.             }else{
  565.                 var animateObj = {};
  566.                 animateObj[slider.animProp] = value;
  567.                 if(type == 'slide'){
  568.                     el.animate(animateObj, duration, slider.settings.easing, function(){
  569.                         updateAfterSlideTransition();
  570.                     });
  571.                 }else if(type == 'reset'){
  572.                     el.css(slider.animProp, value)
  573.                 }else if(type == 'ticker'){
  574.                     el.animate(animateObj, speed, 'linear', function(){
  575.                         setPositionProperty(params['resetValue'], 'reset', 0);
  576.                         // run the recursive loop after animation
  577.                         tickerLoop();
  578.                     });
  579.                 }
  580.             }
  581.         }
  582.  
  583.         /**
  584.          * Populates the pager with proper amount of pages
  585.          */
  586.         var populatePager = function(){
  587.             var pagerHtml = '';
  588.             var pagerQty = getPagerQty();
  589.             // loop through each pager item
  590.             for(var i=0; i < pagerQty; i++){
  591.                 var linkContent = '';
  592.                 // if a buildPager function is supplied, use it to get pager link value, else use index + 1
  593.                 if(slider.settings.buildPager && $.isFunction(slider.settings.buildPager)){
  594.                     linkContent = slider.settings.buildPager(i);
  595.                     slider.pagerEl.addClass('bx-custom-pager');
  596.                 }else{
  597.                     linkContent = i + 1;
  598.                     slider.pagerEl.addClass('bx-default-pager');
  599.                 }
  600.                 // var linkContent = slider.settings.buildPager && $.isFunction(slider.settings.buildPager) ? slider.settings.buildPager(i) : i + 1;
  601.                 // add the markup to the string
  602.                 pagerHtml += '<div class="bx-pager-item"><a href="" data-slide-index="' + i + '" class="bx-pager-link">' + linkContent + '</a></div>';
  603.             };
  604.             // populate the pager element with pager links
  605.             slider.pagerEl.html(pagerHtml);
  606.         }
  607.  
  608.         /**
  609.          * Appends the pager to the controls element
  610.          */
  611.         var appendPager = function(){
  612.             if(!slider.settings.pagerCustom){
  613.                 // create the pager DOM element
  614.                 slider.pagerEl = $('<div class="bx-pager" />');
  615.                 // if a pager selector was supplied, populate it with the pager
  616.                 if(slider.settings.pagerSelector){
  617.                     $(slider.settings.pagerSelector).html(slider.pagerEl);
  618.                 // if no pager selector was supplied, add it after the wrapper
  619.                 }else{
  620.                     slider.controls.el.addClass('bx-has-pager').append(slider.pagerEl);
  621.                 }
  622.                 // populate the pager
  623.                 populatePager();
  624.             }else{
  625.                 slider.pagerEl = $(slider.settings.pagerCustom);
  626.             }
  627.             // assign the pager click binding
  628.             slider.pagerEl.delegate('a', 'click', clickPagerBind);
  629.         }
  630.  
  631.         /**
  632.          * Appends prev / next controls to the controls element
  633.          */
  634.         var appendControls = function(){
  635.             slider.controls.next = $('<a class="bx-next" href="">' + slider.settings.nextText + '</a>');
  636.             slider.controls.prev = $('<a class="bx-prev" href="">' + slider.settings.prevText + '</a>');
  637.             // bind click actions to the controls
  638.             slider.controls.next.bind('click', clickNextBind);
  639.             slider.controls.prev.bind('click', clickPrevBind);
  640.             // if nextSlector was supplied, populate it
  641.             if(slider.settings.nextSelector){
  642.                 $(slider.settings.nextSelector).append(slider.controls.next);
  643.             }
  644.             // if prevSlector was supplied, populate it
  645.             if(slider.settings.prevSelector){
  646.                 $(slider.settings.prevSelector).append(slider.controls.prev);
  647.             }
  648.             // if no custom selectors were supplied
  649.             if(!slider.settings.nextSelector && !slider.settings.prevSelector){
  650.                 // add the controls to the DOM
  651.                 slider.controls.directionEl = $('<div class="bx-controls-direction" />');
  652.                 // add the control elements to the directionEl
  653.                 slider.controls.directionEl.append(slider.controls.prev).append(slider.controls.next);
  654.                 // slider.viewport.append(slider.controls.directionEl);
  655.                 slider.controls.el.addClass('bx-has-controls-direction').append(slider.controls.directionEl);
  656.             }
  657.         }
  658.  
  659.         /**
  660.          * Appends start / stop auto controls to the controls element
  661.          */
  662.         var appendControlsAuto = function(){
  663.             slider.controls.start = $('<div class="bx-controls-auto-item"><a class="bx-start" href="">' + slider.settings.startText + '</a></div>');
  664.             slider.controls.stop = $('<div class="bx-controls-auto-item"><a class="bx-stop" href="">' + slider.settings.stopText + '</a></div>');
  665.             // add the controls to the DOM
  666.             slider.controls.autoEl = $('<div class="bx-controls-auto" />');
  667.             // bind click actions to the controls
  668.             slider.controls.autoEl.delegate('.bx-start', 'click', clickStartBind);
  669.             slider.controls.autoEl.delegate('.bx-stop', 'click', clickStopBind);
  670.             // if autoControlsCombine, insert only the "start" control
  671.             if(slider.settings.autoControlsCombine){
  672.                 slider.controls.autoEl.append(slider.controls.start);
  673.             // if autoControlsCombine is false, insert both controls
  674.             }else{
  675.                 slider.controls.autoEl.append(slider.controls.start).append(slider.controls.stop);
  676.             }
  677.             // if auto controls selector was supplied, populate it with the controls
  678.             if(slider.settings.autoControlsSelector){
  679.                 $(slider.settings.autoControlsSelector).html(slider.controls.autoEl);
  680.             // if auto controls selector was not supplied, add it after the wrapper
  681.             }else{
  682.                 slider.controls.el.addClass('bx-has-controls-auto').append(slider.controls.autoEl);
  683.             }
  684.             // update the auto controls
  685.             updateAutoControls(slider.settings.autoStart ? 'stop' : 'start');
  686.         }
  687.  
  688.     /**
  689.      * Appends image captions to the DOM
  690.      * NETCreator enhancement (http://www.netcreator.ro)
  691.      */
  692.     var appendCaptions = function(){
  693.         // cycle through each child
  694.         slider.children.each(function(index){
  695.             // get the image title attribute
  696.             var title = $(this).find('img:first').attr('title');
  697.             var nc_subtitle = $(this).find('img:first').attr('nc-subtitle');
  698.             // append the caption
  699.             if (title != undefined && ('' + title).length && nc_subtitle != undefined) {
  700.                 $(this).append('<div class="bx-caption"><span class="title">' + title + '</span><br/><span class="nc_subtitle">' + nc_subtitle + '</span></div>');
  701.             }
  702.         });
  703.     }
  704.  
  705.         /**
  706.          * Click next binding
  707.          *
  708.          * @param e (event)
  709.          *  - DOM event object
  710.          */
  711.         var clickNextBind = function(e){
  712.             // if auto show is running, stop it
  713.             if (slider.settings.auto) el.stopAuto();
  714.             el.goToNextSlide();
  715.             e.preventDefault();
  716.         }
  717.  
  718.         /**
  719.          * Click prev binding
  720.          *
  721.          * @param e (event)
  722.          *  - DOM event object
  723.          */
  724.         var clickPrevBind = function(e){
  725.             // if auto show is running, stop it
  726.             if (slider.settings.auto) el.stopAuto();
  727.             el.goToPrevSlide();
  728.             e.preventDefault();
  729.         }
  730.  
  731.         /**
  732.          * Click start binding
  733.          *
  734.          * @param e (event)
  735.          *  - DOM event object
  736.          */
  737.         var clickStartBind = function(e){
  738.             el.startAuto();
  739.             e.preventDefault();
  740.         }
  741.  
  742.         /**
  743.          * Click stop binding
  744.          *
  745.          * @param e (event)
  746.          *  - DOM event object
  747.          */
  748.         var clickStopBind = function(e){
  749.             el.stopAuto();
  750.             e.preventDefault();
  751.         }
  752.  
  753.         /**
  754.          * Click pager binding
  755.          *
  756.          * @param e (event)
  757.          *  - DOM event object
  758.          */
  759.         var clickPagerBind = function(e){
  760.             // if auto show is running, stop it
  761.             if (slider.settings.auto) el.stopAuto();
  762.             var pagerLink = $(e.currentTarget);
  763.             var pagerIndex = parseInt(pagerLink.attr('data-slide-index'));
  764.             // if clicked pager link is not active, continue with the goToSlide call
  765.             if(pagerIndex != slider.active.index) el.goToSlide(pagerIndex);
  766.             e.preventDefault();
  767.         }
  768.  
  769.         /**
  770.          * Updates the pager links with an active class
  771.          *
  772.          * @param slideIndex (int)
  773.          *  - index of slide to make active
  774.          */
  775.         var updatePagerActive = function(slideIndex){
  776.             // if "short" pager type
  777.             var len = slider.children.length; // nb of children
  778.             if(slider.settings.pagerType == 'short'){
  779.                 if(slider.settings.maxSlides > 1) {
  780.                     len = Math.ceil(slider.children.length/slider.settings.maxSlides);
  781.                 }
  782.                 slider.pagerEl.html( (slideIndex + 1) + slider.settings.pagerShortSeparator + len);
  783.                 return;
  784.             }
  785.             // remove all pager active classes
  786.             slider.pagerEl.find('a').removeClass('active');
  787.             // apply the active class for all pagers
  788.             slider.pagerEl.each(function(i, el) { $(el).find('a').eq(slideIndex).addClass('active'); });
  789.         }
  790.  
  791.         /**
  792.          * Performs needed actions after a slide transition
  793.          */
  794.         var updateAfterSlideTransition = function(){
  795.             // if infinte loop is true
  796.             if(slider.settings.infiniteLoop){
  797.                 var position = '';
  798.                 // first slide
  799.                 if(slider.active.index == 0){
  800.                     // set the new position
  801.                     position = slider.children.eq(0).position();
  802.                 // carousel, last slide
  803.                 }else if(slider.active.index == getPagerQty() - 1 && slider.carousel){
  804.                     position = slider.children.eq((getPagerQty() - 1) * getMoveBy()).position();
  805.                 // last slide
  806.                 }else if(slider.active.index == slider.children.length - 1){
  807.                     position = slider.children.eq(slider.children.length - 1).position();
  808.                 }
  809.                 if (slider.settings.mode == 'horizontal') { setPositionProperty(-position.left, 'reset', 0);; }
  810.                 else if (slider.settings.mode == 'vertical') { setPositionProperty(-position.top, 'reset', 0);; }
  811.             }
  812.             // declare that the transition is complete
  813.             slider.working = false;
  814.             // onSlideAfter callback
  815.             slider.settings.onSlideAfter(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
  816.         }
  817.  
  818.         /**
  819.          * Updates the auto controls state (either active, or combined switch)
  820.          *
  821.          * @param state (string) "start", "stop"
  822.          *  - the new state of the auto show
  823.          */
  824.         var updateAutoControls = function(state){
  825.             // if autoControlsCombine is true, replace the current control with the new state
  826.             if(slider.settings.autoControlsCombine){
  827.                 slider.controls.autoEl.html(slider.controls[state]);
  828.             // if autoControlsCombine is false, apply the "active" class to the appropriate control
  829.             }else{
  830.                 slider.controls.autoEl.find('a').removeClass('active');
  831.                 slider.controls.autoEl.find('a:not(.bx-' + state + ')').addClass('active');
  832.             }
  833.         }
  834.  
  835.         /**
  836.          * Updates the direction controls (checks if either should be hidden)
  837.          */
  838.         var updateDirectionControls = function(){
  839.             if(getPagerQty() == 1){
  840.                 slider.controls.prev.addClass('disabled');
  841.                 slider.controls.next.addClass('disabled');
  842.             }else if(!slider.settings.infiniteLoop && slider.settings.hideControlOnEnd){
  843.                 // if first slide
  844.                 if (slider.active.index == 0){
  845.                     slider.controls.prev.addClass('disabled');
  846.                     slider.controls.next.removeClass('disabled');
  847.                 // if last slide
  848.                 }else if(slider.active.index == getPagerQty() - 1){
  849.                     slider.controls.next.addClass('disabled');
  850.                     slider.controls.prev.removeClass('disabled');
  851.                 // if any slide in the middle
  852.                 }else{
  853.                     slider.controls.prev.removeClass('disabled');
  854.                     slider.controls.next.removeClass('disabled');
  855.                 }
  856.             }
  857.         }
  858.  
  859.         /**
  860.          * Initialzes the auto process
  861.          */
  862.         var initAuto = function(){
  863.             // if autoDelay was supplied, launch the auto show using a setTimeout() call
  864.             if(slider.settings.autoDelay > 0){
  865.                 var timeout = setTimeout(el.startAuto, slider.settings.autoDelay);
  866.             // if autoDelay was not supplied, start the auto show normally
  867.             }else{
  868.                 el.startAuto();
  869.             }
  870.             // if autoHover is requested
  871.             if(slider.settings.autoHover){
  872.                 // on el hover
  873.                 el.hover(function(){
  874.                     // if the auto show is currently playing (has an active interval)
  875.                     if(slider.interval){
  876.                         // stop the auto show and pass true agument which will prevent control update
  877.                         el.stopAuto(true);
  878.                         // create a new autoPaused value which will be used by the relative "mouseout" event
  879.                         slider.autoPaused = true;
  880.                     }
  881.                 }, function(){
  882.                     // if the autoPaused value was created be the prior "mouseover" event
  883.                     if(slider.autoPaused){
  884.                         // start the auto show and pass true agument which will prevent control update
  885.                         el.startAuto(true);
  886.                         // reset the autoPaused value
  887.                         slider.autoPaused = null;
  888.                     }
  889.                 });
  890.             }
  891.         }
  892.  
  893.         /**
  894.          * Initialzes the ticker process
  895.          */
  896.         var initTicker = function(){
  897.             var startPosition = 0;
  898.             // if autoDirection is "next", append a clone of the entire slider
  899.             if(slider.settings.autoDirection == 'next'){
  900.                 el.append(slider.children.clone().addClass('bx-clone'));
  901.             // if autoDirection is "prev", prepend a clone of the entire slider, and set the left position
  902.             }else{
  903.                 el.prepend(slider.children.clone().addClass('bx-clone'));
  904.                 var position = slider.children.first().position();
  905.                 startPosition = slider.settings.mode == 'horizontal' ? -position.left : -position.top;
  906.             }
  907.             setPositionProperty(startPosition, 'reset', 0);
  908.             // do not allow controls in ticker mode
  909.             slider.settings.pager = false;
  910.             slider.settings.controls = false;
  911.             slider.settings.autoControls = false;
  912.             // if autoHover is requested
  913.             if(slider.settings.tickerHover && !slider.usingCSS){
  914.                 // on el hover
  915.                 slider.viewport.hover(function(){
  916.                     el.stop();
  917.                 }, function(){
  918.                     // calculate the total width of children (used to calculate the speed ratio)
  919.                     var totalDimens = 0;
  920.                     slider.children.each(function(index){
  921.                       totalDimens += slider.settings.mode == 'horizontal' ? $(this).outerWidth(true) : $(this).outerHeight(true);
  922.                     });
  923.                     // calculate the speed ratio (used to determine the new speed to finish the paused animation)
  924.                     var ratio = slider.settings.speed / totalDimens;
  925.                     // determine which property to use
  926.                     var property = slider.settings.mode == 'horizontal' ? 'left' : 'top';
  927.                     // calculate the new speed
  928.                     var newSpeed = ratio * (totalDimens - (Math.abs(parseInt(el.css(property)))));
  929.                     tickerLoop(newSpeed);
  930.                 });
  931.             }
  932.             // start the ticker loop
  933.             tickerLoop();
  934.         }
  935.  
  936.         /**
  937.          * Runs a continuous loop, news ticker-style
  938.          */
  939.         var tickerLoop = function(resumeSpeed){
  940.             speed = resumeSpeed ? resumeSpeed : slider.settings.speed;
  941.             var position = {left: 0, top: 0};
  942.             var reset = {left: 0, top: 0};
  943.             // if "next" animate left position to last child, then reset left to 0
  944.             if(slider.settings.autoDirection == 'next'){
  945.                 position = el.find('.bx-clone').first().position();
  946.             // if "prev" animate left position to 0, then reset left to first non-clone child
  947.             }else{
  948.                 reset = slider.children.first().position();
  949.             }
  950.             var animateProperty = slider.settings.mode == 'horizontal' ? -position.left : -position.top;
  951.             var resetValue = slider.settings.mode == 'horizontal' ? -reset.left : -reset.top;
  952.             var params = {resetValue: resetValue};
  953.             setPositionProperty(animateProperty, 'ticker', speed, params);
  954.         }
  955.  
  956.         /**
  957.          * Initializes touch events
  958.          */
  959.         var initTouch = function(){
  960.             // initialize object to contain all touch values
  961.             slider.touch = {
  962.                 start: {x: 0, y: 0},
  963.                 end: {x: 0, y: 0}
  964.             }
  965.             slider.viewport.bind('touchstart', onTouchStart);
  966.         }
  967.  
  968.         /**
  969.          * Event handler for "touchstart"
  970.          *
  971.          * @param e (event)
  972.          *  - DOM event object
  973.          */
  974.         var onTouchStart = function(e){
  975.             if(slider.working){
  976.                 e.preventDefault();
  977.             }else{
  978.                 // record the original position when touch starts
  979.                 slider.touch.originalPos = el.position();
  980.                 var orig = e.originalEvent;
  981.                 // record the starting touch x, y coordinates
  982.                 slider.touch.start.x = orig.changedTouches[0].pageX;
  983.                 slider.touch.start.y = orig.changedTouches[0].pageY;
  984.                 // bind a "touchmove" event to the viewport
  985.                 slider.viewport.bind('touchmove', onTouchMove);
  986.                 // bind a "touchend" event to the viewport
  987.                 slider.viewport.bind('touchend', onTouchEnd);
  988.             }
  989.         }
  990.  
  991.         /**
  992.          * Event handler for "touchmove"
  993.          *
  994.          * @param e (event)
  995.          *  - DOM event object
  996.          */
  997.         var onTouchMove = function(e){
  998.             var orig = e.originalEvent;
  999.             // if scrolling on y axis, do not prevent default
  1000.             var xMovement = Math.abs(orig.changedTouches[0].pageX - slider.touch.start.x);
  1001.             var yMovement = Math.abs(orig.changedTouches[0].pageY - slider.touch.start.y);
  1002.             // x axis swipe
  1003.             if((xMovement * 3) > yMovement && slider.settings.preventDefaultSwipeX){
  1004.                 e.preventDefault();
  1005.             // y axis swipe
  1006.             }else if((yMovement * 3) > xMovement && slider.settings.preventDefaultSwipeY){
  1007.                 e.preventDefault();
  1008.             }
  1009.             if(slider.settings.mode != 'fade' && slider.settings.oneToOneTouch){
  1010.                 var value = 0;
  1011.                 // if horizontal, drag along x axis
  1012.                 if(slider.settings.mode == 'horizontal'){
  1013.                     var change = orig.changedTouches[0].pageX - slider.touch.start.x;
  1014.                     value = slider.touch.originalPos.left + change;
  1015.                 // if vertical, drag along y axis
  1016.                 }else{
  1017.                     var change = orig.changedTouches[0].pageY - slider.touch.start.y;
  1018.                     value = slider.touch.originalPos.top + change;
  1019.                 }
  1020.                 setPositionProperty(value, 'reset', 0);
  1021.             }
  1022.         }
  1023.  
  1024.         /**
  1025.          * Event handler for "touchend"
  1026.          *
  1027.          * @param e (event)
  1028.          *  - DOM event object
  1029.          */
  1030.         var onTouchEnd = function(e){
  1031.             slider.viewport.unbind('touchmove', onTouchMove);
  1032.             var orig = e.originalEvent;
  1033.             var value = 0;
  1034.             // record end x, y positions
  1035.             slider.touch.end.x = orig.changedTouches[0].pageX;
  1036.             slider.touch.end.y = orig.changedTouches[0].pageY;
  1037.             // if fade mode, check if absolute x distance clears the threshold
  1038.             if(slider.settings.mode == 'fade'){
  1039.                 var distance = Math.abs(slider.touch.start.x - slider.touch.end.x);
  1040.                 if(distance >= slider.settings.swipeThreshold){
  1041.                     slider.touch.start.x > slider.touch.end.x ? el.goToNextSlide() : el.goToPrevSlide();
  1042.                     el.stopAuto();
  1043.                 }
  1044.             // not fade mode
  1045.             }else{
  1046.                 var distance = 0;
  1047.                 // calculate distance and el's animate property
  1048.                 if(slider.settings.mode == 'horizontal'){
  1049.                     distance = slider.touch.end.x - slider.touch.start.x;
  1050.                     value = slider.touch.originalPos.left;
  1051.                 }else{
  1052.                     distance = slider.touch.end.y - slider.touch.start.y;
  1053.                     value = slider.touch.originalPos.top;
  1054.                 }
  1055.                 // if not infinite loop and first / last slide, do not attempt a slide transition
  1056.                 if(!slider.settings.infiniteLoop && ((slider.active.index == 0 && distance > 0) || (slider.active.last && distance < 0))){
  1057.                     setPositionProperty(value, 'reset', 200);
  1058.                 }else{
  1059.                     // check if distance clears threshold
  1060.                     if(Math.abs(distance) >= slider.settings.swipeThreshold){
  1061.                         distance < 0 ? el.goToNextSlide() : el.goToPrevSlide();
  1062.                         el.stopAuto();
  1063.                     }else{
  1064.                         // el.animate(property, 200);
  1065.                         setPositionProperty(value, 'reset', 200);
  1066.                     }
  1067.                 }
  1068.             }
  1069.             slider.viewport.unbind('touchend', onTouchEnd);
  1070.         }
  1071.  
  1072.         /**
  1073.          * Window resize event callback
  1074.          */
  1075.         var resizeWindow = function(e){
  1076.             // get the new window dimens (again, thank you IE)
  1077.             var windowWidthNew = $(window).width();
  1078.             var windowHeightNew = $(window).height();
  1079.             // make sure that it is a true window resize
  1080.             // *we must check this because our dinosaur friend IE fires a window resize event when certain DOM elements
  1081.             // are resized. Can you just die already?*
  1082.             if(windowWidth != windowWidthNew || windowHeight != windowHeightNew){
  1083.                 // set the new window dimens
  1084.                 windowWidth = windowWidthNew;
  1085.                 windowHeight = windowHeightNew;
  1086.                 // update all dynamic elements
  1087.                 el.redrawSlider();
  1088.             }
  1089.         }
  1090.  
  1091.         /**
  1092.          * ===================================================================================
  1093.          * = PUBLIC FUNCTIONS
  1094.          * ===================================================================================
  1095.          */
  1096.  
  1097.         /**
  1098.          * Performs slide transition to the specified slide
  1099.          *
  1100.          * @param slideIndex (int)
  1101.          *  - the destination slide's index (zero-based)
  1102.          *
  1103.          * @param direction (string)
  1104.          *  - INTERNAL USE ONLY - the direction of travel ("prev" / "next")
  1105.          */
  1106.         el.goToSlide = function(slideIndex, direction){
  1107.             // if plugin is currently in motion, ignore request
  1108.             if(slider.working || slider.active.index == slideIndex) return;
  1109.             // declare that plugin is in motion
  1110.             slider.working = true;
  1111.             // store the old index
  1112.             slider.oldIndex = slider.active.index;
  1113.             // if slideIndex is less than zero, set active index to last child (this happens during infinite loop)
  1114.             if(slideIndex < 0){
  1115.                 slider.active.index = getPagerQty() - 1;
  1116.             // if slideIndex is greater than children length, set active index to 0 (this happens during infinite loop)
  1117.             }else if(slideIndex >= getPagerQty()){
  1118.                 slider.active.index = 0;
  1119.             // set active index to requested slide
  1120.             }else{
  1121.                 slider.active.index = slideIndex;
  1122.             }
  1123.             // onSlideBefore, onSlideNext, onSlidePrev callbacks
  1124.             slider.settings.onSlideBefore(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
  1125.             if(direction == 'next'){
  1126.                 slider.settings.onSlideNext(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
  1127.             }else if(direction == 'prev'){
  1128.                 slider.settings.onSlidePrev(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
  1129.             }
  1130.             // check if last slide
  1131.             slider.active.last = slider.active.index >= getPagerQty() - 1;
  1132.             // update the pager with active class
  1133.             if(slider.settings.pager) updatePagerActive(slider.active.index);
  1134.             // // check for direction control update
  1135.             if(slider.settings.controls) updateDirectionControls();
  1136.             // if slider is set to mode: "fade"
  1137.             if(slider.settings.mode == 'fade'){
  1138.                 // if adaptiveHeight is true and next height is different from current height, animate to the new height
  1139.                 if(slider.settings.adaptiveHeight && slider.viewport.height() != getViewportHeight()){
  1140.                     slider.viewport.animate({height: getViewportHeight()}, slider.settings.adaptiveHeightSpeed);
  1141.                 }
  1142.                 // fade out the visible child and reset its z-index value
  1143.                 slider.children.filter(':visible').fadeOut(slider.settings.speed).css({zIndex: 0});
  1144.                 // fade in the newly requested slide
  1145.                 slider.children.eq(slider.active.index).css('zIndex', 51).fadeIn(slider.settings.speed, function(){
  1146.                     $(this).css('zIndex', 50);
  1147.                     updateAfterSlideTransition();
  1148.                 });
  1149.             // slider mode is not "fade"
  1150.             }else{
  1151.                 // if adaptiveHeight is true and next height is different from current height, animate to the new height
  1152.                 if(slider.settings.adaptiveHeight && slider.viewport.height() != getViewportHeight()){
  1153.                     slider.viewport.animate({height: getViewportHeight()}, slider.settings.adaptiveHeightSpeed);
  1154.                 }
  1155.                 var moveBy = 0;
  1156.                 var position = {left: 0, top: 0};
  1157.                 // if carousel and not infinite loop
  1158.                 if(!slider.settings.infiniteLoop && slider.carousel && slider.active.last){
  1159.                     if(slider.settings.mode == 'horizontal'){
  1160.                         // get the last child position
  1161.                         var lastChild = slider.children.eq(slider.children.length - 1);
  1162.                         position = lastChild.position();
  1163.                         // calculate the position of the last slide
  1164.                         moveBy = slider.viewport.width() - lastChild.outerWidth();
  1165.                     }else{
  1166.                         // get last showing index position
  1167.                         var lastShowingIndex = slider.children.length - slider.settings.minSlides;
  1168.                         position = slider.children.eq(lastShowingIndex).position();
  1169.                     }
  1170.                     // horizontal carousel, going previous while on first slide (infiniteLoop mode)
  1171.                 }else if(slider.carousel && slider.active.last && direction == 'prev'){
  1172.                     // get the last child position
  1173.                     var eq = slider.settings.moveSlides == 1 ? slider.settings.maxSlides - getMoveBy() : ((getPagerQty() - 1) * getMoveBy()) - (slider.children.length - slider.settings.maxSlides);
  1174.                     var lastChild = el.children('.bx-clone').eq(eq);
  1175.                     position = lastChild.position();
  1176.                 // if infinite loop and "Next" is clicked on the last slide
  1177.                 }else if(direction == 'next' && slider.active.index == 0){
  1178.                     // get the last clone position
  1179.                     position = el.find('> .bx-clone').eq(slider.settings.maxSlides).position();
  1180.                     slider.active.last = false;
  1181.                 // normal non-zero requests
  1182.                 }else if(slideIndex >= 0){
  1183.                     var requestEl = slideIndex * getMoveBy();
  1184.                     position = slider.children.eq(requestEl).position();
  1185.                 }
  1186.  
  1187.                 /* If the position doesn't exist
  1188.                  * (e.g. if you destroy the slider on a next click),
  1189.                  * it doesn't throw an error.
  1190.                  */
  1191.                 if ("undefined" !== typeof(position)) {
  1192.                     var value = slider.settings.mode == 'horizontal' ? -(position.left - moveBy) : -position.top;
  1193.                     // plugin values to be animated
  1194.                     setPositionProperty(value, 'slide', slider.settings.speed);
  1195.                 }
  1196.             }
  1197.         }
  1198.  
  1199.         /**
  1200.          * Transitions to the next slide in the show
  1201.          */
  1202.         el.goToNextSlide = function(){
  1203.             // if infiniteLoop is false and last page is showing, disregard call
  1204.             if (!slider.settings.infiniteLoop && slider.active.last) return;
  1205.             var pagerIndex = parseInt(slider.active.index) + 1;
  1206.             el.goToSlide(pagerIndex, 'next');
  1207.         }
  1208.  
  1209.         /**
  1210.          * Transitions to the prev slide in the show
  1211.          */
  1212.         el.goToPrevSlide = function(){
  1213.             // if infiniteLoop is false and last page is showing, disregard call
  1214.             if (!slider.settings.infiniteLoop && slider.active.index == 0) return;
  1215.             var pagerIndex = parseInt(slider.active.index) - 1;
  1216.             el.goToSlide(pagerIndex, 'prev');
  1217.         }
  1218.  
  1219.         /**
  1220.          * Starts the auto show
  1221.          *
  1222.          * @param preventControlUpdate (boolean)
  1223.          *  - if true, auto controls state will not be updated
  1224.          */
  1225.         el.startAuto = function(preventControlUpdate){
  1226.             // if an interval already exists, disregard call
  1227.             if(slider.interval) return;
  1228.             // create an interval
  1229.             slider.interval = setInterval(function(){
  1230.                 slider.settings.autoDirection == 'next' ? el.goToNextSlide() : el.goToPrevSlide();
  1231.             }, slider.settings.pause);
  1232.             // if auto controls are displayed and preventControlUpdate is not true
  1233.             if (slider.settings.autoControls && preventControlUpdate != true) updateAutoControls('stop');
  1234.         }
  1235.  
  1236.         /**
  1237.          * Stops the auto show
  1238.          *
  1239.          * @param preventControlUpdate (boolean)
  1240.          *  - if true, auto controls state will not be updated
  1241.          */
  1242.         el.stopAuto = function(preventControlUpdate){
  1243.             // if no interval exists, disregard call
  1244.             if(!slider.interval) return;
  1245.             // clear the interval
  1246.             clearInterval(slider.interval);
  1247.             slider.interval = null;
  1248.             // if auto controls are displayed and preventControlUpdate is not true
  1249.             if (slider.settings.autoControls && preventControlUpdate != true) updateAutoControls('start');
  1250.         }
  1251.  
  1252.         /**
  1253.          * Returns current slide index (zero-based)
  1254.          */
  1255.         el.getCurrentSlide = function(){
  1256.             return slider.active.index;
  1257.         }
  1258.  
  1259.         /**
  1260.          * Returns number of slides in show
  1261.          */
  1262.         el.getSlideCount = function(){
  1263.             return slider.children.length;
  1264.         }
  1265.  
  1266.         /**
  1267.          * Update all dynamic slider elements
  1268.          */
  1269.         el.redrawSlider = function(){
  1270.             // resize all children in ratio to new screen size
  1271.             slider.children.add(el.find('.bx-clone')).outerWidth(getSlideWidth());
  1272.             // adjust the height
  1273.             slider.viewport.css('height', getViewportHeight());
  1274.             // update the slide position
  1275.             if(!slider.settings.ticker) setSlidePosition();
  1276.             // if active.last was true before the screen resize, we want
  1277.             // to keep it last no matter what screen size we end on
  1278.             if (slider.active.last) slider.active.index = getPagerQty() - 1;
  1279.             // if the active index (page) no longer exists due to the resize, simply set the index as last
  1280.             if (slider.active.index >= getPagerQty()) slider.active.last = true;
  1281.             // if a pager is being displayed and a custom pager is not being used, update it
  1282.             if(slider.settings.pager && !slider.settings.pagerCustom){
  1283.                 populatePager();
  1284.                 updatePagerActive(slider.active.index);
  1285.             }
  1286.         }
  1287.  
  1288.         /**
  1289.          * Destroy the current instance of the slider (revert everything back to original state)
  1290.          */
  1291.         el.destroySlider = function(){
  1292.             // don't do anything if slider has already been destroyed
  1293.             if(!slider.initialized) return;
  1294.             slider.initialized = false;
  1295.             $('.bx-clone', this).remove();
  1296.             slider.children.each(function() {
  1297.                 $(this).data("origStyle") != undefined ? $(this).attr("style", $(this).data("origStyle")) : $(this).removeAttr('style');
  1298.             });
  1299.             $(this).data("origStyle") != undefined ? this.attr("style", $(this).data("origStyle")) : $(this).removeAttr('style');
  1300.             $(this).unwrap().unwrap();
  1301.             if(slider.controls.el) slider.controls.el.remove();
  1302.             if(slider.controls.next) slider.controls.next.remove();
  1303.             if(slider.controls.prev) slider.controls.prev.remove();
  1304.             if(slider.pagerEl) slider.pagerEl.remove();
  1305.             $('.bx-caption', this).remove();
  1306.             if(slider.controls.autoEl) slider.controls.autoEl.remove();
  1307.             clearInterval(slider.interval);
  1308.             if(slider.settings.responsive) $(window).unbind('resize', resizeWindow);
  1309.         }
  1310.  
  1311.         /**
  1312.          * Reload the slider (revert all DOM changes, and re-initialize)
  1313.          */
  1314.         el.reloadSlider = function(settings){
  1315.             if (settings != undefined) options = settings;
  1316.             el.destroySlider();
  1317.             init();
  1318.         }
  1319.  
  1320.         init();
  1321.  
  1322.         // returns the current jQuery object
  1323.         return this;
  1324.     }
  1325.  
  1326. })(jQuery);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!