diff --git a/js/jquery.bxslider.js b/js/jquery.bxslider.js
index 67ac4d839..915954482 100644
--- a/js/jquery.bxslider.js
+++ b/js/jquery.bxslider.js
@@ -1,1607 +1,1365 @@
/**
- * bxSlider v4.2.12
- * Copyright 2013-2015 Steven Wanderski
+ * BxSlider v4.1.1 - Fully loaded, responsive content slider
+ * http://bxslider.com
+ *
+ * Copyright 2013, Steven Wanderski - http://stevenwanderski.com - http://bxcreative.com
* Written while drinking Belgian ales and listening to jazz
- * Licensed under MIT (http://opensource.org/licenses/MIT)
+ *
+ * Released under the MIT license - http://opensource.org/licenses/MIT
*/
-;(function($) {
+;(function($){
- var defaults = {
+ var plugin = {};
- // GENERAL
- mode: 'horizontal',
- slideSelector: '',
- infiniteLoop: true,
- hideControlOnEnd: false,
- speed: 500,
- easing: null,
- slideMargin: 0,
- startSlide: 0,
- randomStart: false,
- captions: false,
- ticker: false,
- tickerHover: false,
- adaptiveHeight: false,
- adaptiveHeightSpeed: 500,
- video: false,
- useCSS: true,
- preloadImages: 'visible',
- responsive: true,
- slideZIndex: 50,
- wrapperClass: 'bx-wrapper',
+ var defaults = {
- // TOUCH
- touchEnabled: true,
- swipeThreshold: 50,
- oneToOneTouch: true,
- preventDefaultSwipeX: true,
- preventDefaultSwipeY: false,
+ // GENERAL
+ mode: 'horizontal',
+ slideSelector: '',
+ infiniteLoop: true,
+ hideControlOnEnd: false,
+ speed: 500,
+ easing: null,
+ slideMargin: 0,
+ startSlide: 0,
+ randomStart: false,
+ captions: false,
+ ticker: false,
+ tickerHover: false,
+ adaptiveHeight: false,
+ adaptiveHeightSpeed: 50,
+ video: false,
+ useCSS: true,
+ preloadImages: 'visible',
+ responsive: true,
- // ACCESSIBILITY
- ariaLive: true,
- ariaHidden: true,
+ // TOUCH
+ touchEnabled: true,
+ swipeThreshold: 50,
+ oneToOneTouch: true,
+ preventDefaultSwipeX: true,
+ preventDefaultSwipeY: false,
- // KEYBOARD
- keyboardEnabled: false,
+ // PAGER
+ pager: true,
+ pagerType: 'full',
+ pagerShortSeparator: ' / ',
+ pagerSelector: null,
+ buildPager: null,
+ pagerCustom: null,
- // PAGER
- pager: true,
- pagerType: 'full',
- pagerShortSeparator: ' / ',
- pagerSelector: null,
- buildPager: null,
- pagerCustom: null,
+ // CONTROLS
+ controls: true,
+ nextText: 'Next',
+ prevText: 'Prev',
+ nextSelector: null,
+ prevSelector: null,
+ autoControls: false,
+ startText: 'Start',
+ stopText: 'Stop',
+ autoControlsCombine: false,
+ autoControlsSelector: null,
- // CONTROLS
- controls: true,
- nextText: 'Next',
- prevText: 'Prev',
- nextSelector: null,
- prevSelector: null,
- autoControls: false,
- startText: 'Start',
- stopText: 'Stop',
- autoControlsCombine: false,
- autoControlsSelector: null,
+ // AUTO
+ auto: false,
+ pause: 4000,
+ autoStart: true,
+ autoDirection: 'next',
+ autoHover: false,
+ autoDelay: 0,
+ controlladd: false,
- // AUTO
- auto: false,
- pause: 4000,
- autoStart: true,
- autoDirection: 'next',
- stopAutoOnClick: false,
- autoHover: false,
- autoDelay: 0,
- autoSlideForOnePage: false,
+ // CAROUSEL
+ minSlides: 1,
+ maxSlides: 1,
+ moveSlides: 0,
+ slideWidth: 0,
- // CAROUSEL
- minSlides: 1,
- maxSlides: 1,
- moveSlides: 0,
- slideWidth: 0,
- shrinkItems: false,
+ SUPPORTS_TOUCH : 'ontouchstart' in window,
- // CALLBACKS
- onSliderLoad: function() { return true; },
- onSlideBefore: function() { return true; },
- onSlideAfter: function() { return true; },
- onSlideNext: function() { return true; },
- onSlidePrev: function() { return true; },
- onSliderResize: function() { return true; }
- };
+ // CALLBACKS
+ onSliderLoad: function() {},
+ onSlideBefore: function() {},
+ onSlideAfter: function() {},
+ onSlideNext: function() {},
+ onSlidePrev: function() {},
- $.fn.bxSlider = function(options) {
+ //ADD
+ interval_arr: []
+ }
- if (this.length === 0) {
- return this;
- }
+ $.fn.bxSlider = function(options){
- // support multiple elements
- if (this.length > 1) {
- this.each(function() {
- $(this).bxSlider(options);
- });
- return this;
- }
+ if(this.length == 0) return this;
- // create a namespace to be used throughout the plugin
- var slider = {},
- // set a reference to our slider element
- el = this,
- // get the original window dimens (thanks a lot IE)
- windowWidth = $(window).width(),
- windowHeight = $(window).height();
+ // support mutltiple elements
+ if(this.length > 1){
+ this.each(function(){$(this).bxSlider(options)});
+ return this;
+ }
- // Return if slider is already initialized
- if ($(el).data('bxSlider')) { return; }
+ // create a namespace to be used throughout the plugin
+ var slider = {};
+ // set a reference to our slider element
+ var el = this;
+ plugin.el = this;
- /**
- * ===================================================================================
- * = PRIVATE FUNCTIONS
- * ===================================================================================
- */
+ /**
+ * Makes slideshow responsive
+ */
+ // first get the original window dimens (thanks alot IE)
+ var windowWidth = $(window).width();
+ var windowHeight = $(window).height();
- /**
- * Initializes namespace settings to be used throughout plugin
- */
- var init = function() {
- // Return if slider is already initialized
- if ($(el).data('bxSlider')) { return; }
- // merge user-supplied options with the defaults
- slider.settings = $.extend({}, defaults, options);
- // parse slideWidth setting
- slider.settings.slideWidth = parseInt(slider.settings.slideWidth);
- // store the original children
- slider.children = el.children(slider.settings.slideSelector);
- // check if actual number of slides is less than minSlides / maxSlides
- if (slider.children.length < slider.settings.minSlides) { slider.settings.minSlides = slider.children.length; }
- if (slider.children.length < slider.settings.maxSlides) { slider.settings.maxSlides = slider.children.length; }
- // if random start, set the startSlide setting to random number
- if (slider.settings.randomStart) { slider.settings.startSlide = Math.floor(Math.random() * slider.children.length); }
- // store active slide information
- slider.active = { index: slider.settings.startSlide };
- // store if the slider is in carousel mode (displaying / moving multiple slides)
- slider.carousel = slider.settings.minSlides > 1 || slider.settings.maxSlides > 1 ? true : false;
- // if carousel, force preloadImages = 'all'
- if (slider.carousel) { slider.settings.preloadImages = 'all'; }
- // calculate the min / max width thresholds based on min / max number of slides
- // used to setup and update carousel slides dimensions
- slider.minThreshold = (slider.settings.minSlides * slider.settings.slideWidth) + ((slider.settings.minSlides - 1) * slider.settings.slideMargin);
- slider.maxThreshold = (slider.settings.maxSlides * slider.settings.slideWidth) + ((slider.settings.maxSlides - 1) * slider.settings.slideMargin);
- // store the current state of the slider (if currently animating, working is true)
- slider.working = false;
- // initialize the controls object
- slider.controls = {};
- // initialize an auto interval
- slider.interval = null;
- // determine which property to use for transitions
- slider.animProp = slider.settings.mode === 'vertical' ? 'top' : 'left';
- // determine if hardware acceleration can be used
- slider.usingCSS = slider.settings.useCSS && slider.settings.mode !== 'fade' && (function() {
- // create our test div element
- var div = document.createElement('div'),
- // css transition properties
- props = ['WebkitPerspective', 'MozPerspective', 'OPerspective', 'msPerspective'];
- // test for each property
- for (var i = 0; i < props.length; i++) {
- if (div.style[props[i]] !== undefined) {
- slider.cssPrefix = props[i].replace('Perspective', '').toLowerCase();
- slider.animProp = '-' + slider.cssPrefix + '-transform';
- return true;
- }
- }
- return false;
- }());
- // if vertical mode always make maxSlides and minSlides equal
- if (slider.settings.mode === 'vertical') { slider.settings.maxSlides = slider.settings.minSlides; }
- // save original style data
- el.data('origStyle', el.attr('style'));
- el.children(slider.settings.slideSelector).each(function() {
- $(this).data('origStyle', $(this).attr('style'));
- });
- // perform all DOM / CSS modifications
- setup();
- };
- /**
- * Performs all DOM and CSS modifications
- */
- var setup = function() {
- var preloadSelector = slider.children.eq(slider.settings.startSlide); // set the default preload selector (visible)
+ /**
+ * ===================================================================================
+ * = PRIVATE FUNCTIONS
+ * ===================================================================================
+ */
- // wrap el in a wrapper
- el.wrap('
');
- // store a namespace reference to .bx-viewport
- slider.viewport = el.parent();
+ /**
+ * Initializes namespace settings to be used throughout plugin
+ */
+ var init = function(){
+ // merge user-supplied options with the defaults
+ slider.settings = $.extend({}, defaults, options);
+ // parse slideWidth setting
+ slider.settings.slideWidth = parseInt(slider.settings.slideWidth);
+ // store the original children
+ slider.children = el.children(slider.settings.slideSelector);
+ // check if actual number of slides is less than minSlides / maxSlides
+ if(slider.children.length < slider.settings.minSlides) slider.settings.minSlides = slider.children.length;
+ if(slider.children.length < slider.settings.maxSlides) slider.settings.maxSlides = slider.children.length;
+ // if random start, set the startSlide setting to random number
+ if(slider.settings.randomStart) slider.settings.startSlide = Math.floor(Math.random() * slider.children.length);
+ // store active slide information
+ slider.active = { index: slider.settings.startSlide }
+ // store if the slider is in carousel mode (displaying / moving multiple slides)
+ slider.carousel = slider.settings.minSlides > 1 || slider.settings.maxSlides > 1;
+ // if carousel, force preloadImages = 'all'
+ if(slider.carousel) slider.settings.preloadImages = 'all';
+ // calculate the min / max width thresholds based on min / max number of slides
+ // used to setup and update carousel slides dimensions
+ slider.minThreshold = (slider.settings.minSlides * slider.settings.slideWidth) + ((slider.settings.minSlides - 1) * slider.settings.slideMargin);
+ slider.maxThreshold = (slider.settings.maxSlides * slider.settings.slideWidth) + ((slider.settings.maxSlides - 1) * slider.settings.slideMargin);
+ // store the current state of the slider (if currently animating, working is true)
+ slider.working = false;
+ // initialize the controls object
+ slider.controls = {};
+ // initialize an auto interval
+ slider.interval = null;
+ // determine which property to use for transitions
+ slider.animProp = slider.settings.mode == 'vertical' ? 'top' : 'left';
+ // determine if hardware acceleration can be used
+ slider.usingCSS = slider.settings.useCSS && slider.settings.mode != 'fade' && (function(){
+ // create our test div element
+ var div = document.createElement('div');
+ // css transition properties
+ var props = ['WebkitPerspective', 'MozPerspective', 'OPerspective', 'msPerspective'];
+ // test for each property
+ for(var i in props){
+ if(div.style[props[i]] !== undefined){
+ slider.cssPrefix = props[i].replace('Perspective', '').toLowerCase();
+ slider.animProp = '-' + slider.cssPrefix + '-transform';
+ return true;
+ }
+ }
+ return false;
+ }());
+ var useTouchEvents = slider.settings.SUPPORTS_TOUCH;
+ slider.START_EV = useTouchEvents ? 'touchstart' : 'mousedown',
+ slider.MOVE_EV = useTouchEvents ? 'touchmove' : 'mousemove',
+ slider.END_EV = useTouchEvents ? 'touchend' : 'mouseup',
+ slider.LEAVE_EV = useTouchEvents ? null : 'mouseleave', //we manually detect leave on touch devices, so null event here
+ slider.CANCEL_EV = 'touchcancel';
- // add aria-live if the setting is enabled and ticker mode is disabled
- if (slider.settings.ariaLive && !slider.settings.ticker) {
- slider.viewport.attr('aria-live', 'polite');
- }
- // add a loading div to display while images are loading
- slider.loader = $('');
- slider.viewport.prepend(slider.loader);
- // set el to a massive width, to hold any needed slides
- // also strip any margin and padding from el
- el.css({
- width: slider.settings.mode === 'horizontal' ? (slider.children.length * 1000 + 215) + '%' : 'auto',
- position: 'relative'
- });
- // if using CSS, add the easing property
- if (slider.usingCSS && slider.settings.easing) {
- el.css('-' + slider.cssPrefix + '-transition-timing-function', slider.settings.easing);
- // if not using CSS and no easing value was supplied, use the default JS animation easing (swing)
- } else if (!slider.settings.easing) {
- slider.settings.easing = 'swing';
- }
- // make modifications to the viewport (.bx-viewport)
- slider.viewport.css({
- width: '100%',
- overflow: 'hidden',
- position: 'relative'
- });
- slider.viewport.parent().css({
- maxWidth: getViewportMaxWidth()
- });
- // apply css to all slider children
- slider.children.css({
- float: slider.settings.mode === 'horizontal' ? 'left' : 'none',
- listStyle: 'none',
- position: 'relative'
- });
- // apply the calculated width after the float is applied to prevent scrollbar interference
- slider.children.css('width', getSlideWidth());
- // if slideMargin is supplied, add the css
- if (slider.settings.mode === 'horizontal' && slider.settings.slideMargin > 0) { slider.children.css('marginRight', slider.settings.slideMargin); }
- if (slider.settings.mode === 'vertical' && slider.settings.slideMargin > 0) { slider.children.css('marginBottom', slider.settings.slideMargin); }
- // if "fade" mode, add positioning and z-index CSS
- if (slider.settings.mode === 'fade') {
- slider.children.css({
- position: 'absolute',
- zIndex: 0,
- display: 'none'
- });
- // prepare the z-index on the showing element
- slider.children.eq(slider.settings.startSlide).css({zIndex: slider.settings.slideZIndex, display: 'block'});
- }
- // create an element to contain all slider controls (pager, start / stop, etc)
- slider.controls.el = $('');
- // if captions are requested, add them
- if (slider.settings.captions) { appendCaptions(); }
- // check if startSlide is last slide
- slider.active.last = slider.settings.startSlide === getPagerQty() - 1;
- // if video is true, set up the fitVids plugin
- if (slider.settings.video) { el.fitVids(); }
- if (slider.settings.preloadImages === 'all' || slider.settings.ticker) { preloadSelector = slider.children; }
- // only check for control addition if not in "ticker" mode
- if (!slider.settings.ticker) {
- // if controls are requested, add them
- if (slider.settings.controls) { appendControls(); }
- // if auto is true, and auto controls are requested, add them
- if (slider.settings.auto && slider.settings.autoControls) { appendControlsAuto(); }
- // if pager is requested, add it
- if (slider.settings.pager) { appendPager(); }
- // if any control option is requested, add the controls wrapper
- if (slider.settings.controls || slider.settings.autoControls || slider.settings.pager) { slider.viewport.after(slider.controls.el); }
- // if ticker mode, do not allow a pager
- } else {
- slider.settings.pager = false;
- }
- loadElements(preloadSelector, start);
- };
+ // if vertical mode always make maxSlides and minSlides equal
+ if(slider.settings.mode == 'vertical') slider.settings.maxSlides = slider.settings.minSlides;
+ // save original style data
+ el.data("origStyle", el.attr("style"));
+ el.children(slider.settings.slideSelector).each(function() {
+ $(this).data("origStyle", $(this).attr("style"));
+ });
+ el.pause = slider.settings.pause;
+ // perform all DOM / CSS modifications
+ setup();
+ }
- var loadElements = function(selector, callback) {
- var total = selector.find('img:not([src=""]), iframe').length,
- count = 0;
- if (total === 0) {
- callback();
- return;
- }
- selector.find('img:not([src=""]), iframe').each(function() {
- $(this).one('load error', function() {
- if (++count === total) { callback(); }
- }).each(function() {
- if (this.complete) { $(this).trigger('load'); }
- });
- });
- };
+ /**
+ * Performs all DOM and CSS modifications
+ */
+ var setup = function(){
+ // wrap el in a wrapper
+ el.wrap('');
+ // store a namspace reference to .bx-viewport
+ slider.viewport = el.parent();
+ // add a loading div to display while images are loading
+ slider.loader = $('');
+ slider.viewport.prepend(slider.loader);
+ // set el to a massive width, to hold any needed slides
+ // also strip any margin and padding from el
+ el.css({
+ width: slider.settings.mode == 'horizontal' ? (slider.children.length * 100 + 215) + '%' : 'auto',
+ position: 'relative'
+ });
+ el.state = slider.settings.auto ? 'start' : 'stop';
+ // if using CSS, add the easing property
+ if(slider.usingCSS && slider.settings.easing){
+ el.css('-' + slider.cssPrefix + '-transition-timing-function', slider.settings.easing);
+ // if not using CSS and no easing value was supplied, use the default JS animation easing (swing)
+ }else if(!slider.settings.easing){
+ slider.settings.easing = 'swing';
+ }
+ var slidesShowing = getNumberSlidesShowing();
+ // make modifications to the viewport (.bx-viewport)
+ slider.viewport.css({
+ width: '100%',
+ overflow: 'hidden',
+ position: 'relative'
+ });
+ slider.viewport.parent().css({
+ maxWidth: getViewportMaxWidth()
+ });
+ // make modification to the wrapper (.bx-wrapper)
+ if(!slider.settings.pager) {
+ slider.viewport.parent().css({
+ margin: '0 auto 0px'
+ });
+ }
+ // apply css to all slider children
+ slider.children.css({
+ 'float': slider.settings.mode == 'horizontal' ? 'left' : 'none',
+ listStyle: 'none',
+ position: 'relative'
+ });
+ // apply the calculated width after the float is applied to prevent scrollbar interference
+ slider.children.css('width', getSlideWidth());
+ // if slideMargin is supplied, add the css
+ if(slider.settings.mode == 'horizontal' && slider.settings.slideMargin > 0) slider.children.css('marginRight', slider.settings.slideMargin);
+ if(slider.settings.mode == 'vertical' && slider.settings.slideMargin > 0) slider.children.css('marginBottom', slider.settings.slideMargin);
+ // if "fade" mode, add positioning and z-index CSS
+ if(slider.settings.mode == 'fade'){
+ slider.children.css({
+ position: 'absolute',
+ zIndex: 0,
+ display: 'none'
+ });
+ // prepare the z-index on the showing element
+ slider.children.eq(slider.settings.startSlide).css({zIndex: 50, display: 'block'});
+ }
+ // create an element to contain all slider controls (pager, start / stop, etc)
+ slider.controls.el = $('');
+ // if captions are requested, add them
+ if(slider.settings.captions) appendCaptions();
+ // check if startSlide is last slide
+ slider.active.last = slider.settings.startSlide == getPagerQty() - 1;
+ // if video is true, set up the fitVids plugin
+ if(slider.settings.video) el.fitVids();
+ // set the default preload selector (visible)
+ var preloadSelector = slider.children.eq(slider.settings.startSlide);
+ if (slider.settings.preloadImages == "all") preloadSelector = slider.children;
+ // only check for control addition if not in "ticker" mode
+ if(!slider.settings.ticker){
+ // if pager is requested, add it
+ if(slider.settings.pager) appendPager();
+ // if controls are requested, add them
+ if(slider.settings.controls) appendControls();
+ // if auto is true, and auto controls are requested, add them
+ if(slider.settings.auto && slider.settings.autoControls) appendControlsAuto();
+ // if any control option is requested, add the controls wrapper
+ if(slider.settings.controls || slider.settings.autoControls || slider.settings.pager) slider.viewport.after(slider.controls.el);
+ // if ticker mode, do not allow a pager
+ }else{
+ slider.settings.pager = false;
+ }
+ // preload all images, then perform final DOM / CSS modifications that depend on images being loaded
+ loadElements(preloadSelector, start);
+ }
- /**
- * Start the slider
- */
- var start = function() {
- // if infinite loop, prepare additional slides
- if (slider.settings.infiniteLoop && slider.settings.mode !== 'fade' && !slider.settings.ticker) {
- var slice = slider.settings.mode === 'vertical' ? slider.settings.minSlides : slider.settings.maxSlides,
- sliceAppend = slider.children.slice(0, slice).clone(true).addClass('bx-clone'),
- slicePrepend = slider.children.slice(-slice).clone(true).addClass('bx-clone');
- if (slider.settings.ariaHidden) {
- sliceAppend.attr('aria-hidden', true);
- slicePrepend.attr('aria-hidden', true);
- }
- el.append(sliceAppend).prepend(slicePrepend);
- }
- // remove the loading DOM element
- slider.loader.remove();
- // set the left / top position of "el"
- setSlidePosition();
- // if "vertical" mode, always use adaptiveHeight to prevent odd behavior
- if (slider.settings.mode === 'vertical') { slider.settings.adaptiveHeight = true; }
- // set the viewport height
- slider.viewport.height(getViewportHeight());
- // make sure everything is positioned just right (same as a window resize)
- el.redrawSlider();
- // onSliderLoad callback
- slider.settings.onSliderLoad.call(el, slider.active.index);
- // slider has been fully initialized
- slider.initialized = true;
- // bind the resize call to the window
- if (slider.settings.responsive) { $(window).bind('resize', resizeWindow); }
- // if auto is true and has more than 1 page, start the show
- if (slider.settings.auto && slider.settings.autoStart && (getPagerQty() > 1 || slider.settings.autoSlideForOnePage)) { initAuto(); }
- // if ticker is true, start the ticker
- if (slider.settings.ticker) { initTicker(); }
- // if pager is requested, make the appropriate pager link active
- if (slider.settings.pager) { updatePagerActive(slider.settings.startSlide); }
- // check for any updates to the controls (like hideControlOnEnd updates)
- if (slider.settings.controls) { updateDirectionControls(); }
- // if touchEnabled is true, setup the touch events
- if (slider.settings.touchEnabled && !slider.settings.ticker) { initTouch(); }
- // if keyboardEnabled is true, setup the keyboard events
- if (slider.settings.keyboardEnabled && !slider.settings.ticker) {
- $(document).keydown(keyPress);
- }
- };
+ var loadElements = function(selector, callback){
+ var total = selector.find('img, iframe').length;
+ if (total == 0){
+ callback();
+ return;
+ }
+ var count = 0;
+ selector.find('img, iframe').each(function(){
+ $(this).one('load', function() {
+ if(++count == total) callback();
+ }).each(function() {
+ if(this.complete) $(this).load();
+ });
+ });
+ }
- /**
- * Returns the calculated height of the viewport, used to determine either adaptiveHeight or the maxHeight value
- */
- var getViewportHeight = function() {
- var height = 0;
- // first determine which children (slides) should be used in our height calculation
- var children = $();
- // if mode is not "vertical" and adaptiveHeight is false, include all children
- if (slider.settings.mode !== 'vertical' && !slider.settings.adaptiveHeight) {
- children = slider.children;
- } else {
- // if not carousel, return the single active child
- if (!slider.carousel) {
- children = slider.children.eq(slider.active.index);
- // if carousel, return a slice of children
- } else {
- // get the individual slide index
- var currentIndex = slider.settings.moveSlides === 1 ? slider.active.index : slider.active.index * getMoveBy();
- // add the current slide to the children
- children = slider.children.eq(currentIndex);
- // cycle through the remaining "showing" slides
- for (i = 1; i <= slider.settings.maxSlides - 1; i++) {
- // if looped back to the start
- if (currentIndex + i >= slider.children.length) {
- children = children.add(slider.children.eq(i - 1));
- } else {
- children = children.add(slider.children.eq(currentIndex + i));
+ /**
+ * Start the slider
+ */
+ var start = function(){
+ // if infinite loop, prepare additional slides
+ if(slider.settings.infiniteLoop && slider.settings.mode != 'fade' && !slider.settings.ticker){
+ var slice = slider.settings.mode == 'vertical' ? slider.settings.minSlides : slider.settings.maxSlides;
+ var sliceAppend = slider.children.slice(0, slice).clone().addClass('bx-clone');
+ var slicePrepend = slider.children.slice(-slice).clone().addClass('bx-clone');
+ el.append(sliceAppend).prepend(slicePrepend);
+ }
+ // remove the loading DOM element
+ slider.loader.remove();
+ // set the left / top position of "el"
+ setSlidePosition();
+ // if "vertical" mode, always use adaptiveHeight to prevent odd behavior
+ if (slider.settings.mode == 'vertical') slider.settings.adaptiveHeight = true;
+ // set the viewport height
+ slider.viewport.height(getViewportHeight());
+ // make sure everything is positioned just right (same as a window resize)
+ el.redrawSlider();
+ // onSliderLoad callback
+ slider.settings.onSliderLoad(slider.active.index);
+ // slider has been fully initialized
+ slider.initialized = true;
+ // bind the resize call to the window
+ if (slider.settings.responsive) $(window).bind('resize', resizeWindow);
+ // if auto is true, start the show
+ if (slider.settings.auto && slider.settings.autoStart) initAuto();
+ // if ticker is true, start the ticker
+ if (slider.settings.ticker) initTicker();
+ // if pager is requested, make the appropriate pager link active
+ if (slider.settings.pager) updatePagerActive(slider.settings.startSlide);
+ // check for any updates to the controls (like hideControlOnEnd updates)
+ if (slider.settings.controls) updateDirectionControls();
+ // if touchEnabled is true, setup the touch events
+ if (slider.settings.touchEnabled && !slider.settings.ticker) initTouch();
+ }
+
+ /**
+ * Returns the calculated height of the viewport, used to determine either adaptiveHeight or the maxHeight value
+ */
+ var getViewportHeight = function(){
+ var height = 0;
+ // first determine which children (slides) should be used in our height calculation
+ var children = $();
+ // if mode is not "vertical" and adaptiveHeight is false, include all children
+ if(slider.settings.mode != 'vertical' && !slider.settings.adaptiveHeight){
+ children = slider.children;
+ }else{
+ // if not carousel, return the single active child
+ if(!slider.carousel){
+ children = slider.children.eq(slider.active.index);
+ // if carousel, return a slice of children
+ }else{
+ // get the individual slide index
+ var currentIndex = slider.settings.moveSlides == 1 ? slider.active.index : slider.active.index * getMoveBy();
+ // add the current slide to the children
+ children = slider.children.eq(currentIndex);
+ // cycle through the remaining "showing" slides
+ for (i = 1; i <= slider.settings.maxSlides - 1; i++){
+ // if looped back to the start
+ if(currentIndex + i >= slider.children.length){
+ children = children.add(slider.children.eq(i - 1));
+ }else{
+ children = children.add(slider.children.eq(currentIndex + i));
+ }
+ }
+ }
+ }
+ // if "vertical" mode, calculate the sum of the heights of the children
+ if(slider.settings.mode == 'vertical'){
+ children.each(function(index) {
+ height += $(this).outerHeight();
+ });
+ // add user-supplied margins
+ if(slider.settings.slideMargin > 0){
+ height += slider.settings.slideMargin * (slider.settings.minSlides - 1);
+ }
+ // if not "vertical" mode, calculate the max height of the children
+ }else{
+ height = Math.max.apply(Math, children.map(function(){
+ return $(this).outerHeight(false);
+ }).get());
+ }
+ return height;
+ }
+
+ /**
+ * Returns the calculated width to be used for the outer wrapper / viewport
+ */
+ var getViewportMaxWidth = function(){
+ var width = '100%';
+ if(slider.settings.slideWidth > 0){
+ if(slider.settings.mode == 'horizontal'){
+ width = (slider.settings.maxSlides * slider.settings.slideWidth) + ((slider.settings.maxSlides - 1) * slider.settings.slideMargin);
+ }else{
+ width = slider.settings.slideWidth;
+ }
+ }
+ return width;
+ }
+
+ /**
+ * Returns the calculated width to be applied to each slide
+ */
+ var getSlideWidth = function(){
+ // start with any user-supplied slide width
+ var newElWidth = slider.settings.slideWidth;
+ // get the current viewport width
+ var wrapWidth = slider.viewport.width();
+ // if slide width was not supplied, or is larger than the viewport use the viewport width
+ if(slider.settings.slideWidth == 0 ||
+ (slider.settings.slideWidth > wrapWidth && !slider.carousel) ||
+ slider.settings.mode == 'vertical'){
+ newElWidth = wrapWidth;
+ // if carousel, use the thresholds to determine the width
+ }else if(slider.settings.maxSlides > 1 && slider.settings.mode == 'horizontal'){
+ if(wrapWidth > slider.maxThreshold){
+ // newElWidth = (wrapWidth - (slider.settings.slideMargin * (slider.settings.maxSlides - 1))) / slider.settings.maxSlides;
+ }else if(wrapWidth < slider.minThreshold){
+ newElWidth = (wrapWidth - (slider.settings.slideMargin * (slider.settings.minSlides - 1))) / slider.settings.minSlides;
+ }
+ }
+ return newElWidth;
+ }
+
+ /**
+ * Returns the number of slides currently visible in the viewport (includes partially visible slides)
+ */
+ var getNumberSlidesShowing = function(){
+ var slidesShowing = 1;
+ if(slider.settings.mode == 'horizontal' && slider.settings.slideWidth > 0){
+ // if viewport is smaller than minThreshold, return minSlides
+ if(slider.viewport.width() < slider.minThreshold){
+ slidesShowing = slider.settings.minSlides;
+ // if viewport is larger than minThreshold, return maxSlides
+ }else if(slider.viewport.width() > slider.maxThreshold){
+ slidesShowing = slider.settings.maxSlides;
+ // if viewport is between min / max thresholds, divide viewport width by first child width
+ }else{
+ var childWidth = slider.children.first().width();
+ slidesShowing = Math.floor(slider.viewport.width() / childWidth);
+ }
+ // if "vertical" mode, slides showing will always be minSlides
+ }else if(slider.settings.mode == 'vertical'){
+ slidesShowing = slider.settings.minSlides;
+ }
+ return slidesShowing;
+ }
+
+ /**
+ * Returns the number of pages (one full viewport of slides is one "page")
+ */
+ var getPagerQty = function(){
+ var pagerQty = 0;
+ // if moveSlides is specified by the user
+ if(slider.settings.moveSlides > 0){
+ if(slider.settings.infiniteLoop){
+ pagerQty = slider.children.length / getMoveBy();
+ }else{
+ // use a while loop to determine pages
+ var breakPoint = 0;
+ var counter = 0
+ // when breakpoint goes above children length, counter is the number of pages
+ while (breakPoint < slider.children.length){
+ ++pagerQty;
+ breakPoint = counter + getNumberSlidesShowing();
+ counter += slider.settings.moveSlides <= getNumberSlidesShowing() ? slider.settings.moveSlides : getNumberSlidesShowing();
+ }
+ }
+ // if moveSlides is 0 (auto) divide children length by sides showing, then round up
+ }else{
+ pagerQty = Math.ceil(slider.children.length / getNumberSlidesShowing());
+ }
+ return pagerQty;
+ }
+
+ /**
+ * Returns the number of indivual slides by which to shift the slider
+ */
+ var getMoveBy = function(){
+ // if moveSlides was set by the user and moveSlides is less than number of slides showing
+ if(slider.settings.moveSlides > 0 && slider.settings.moveSlides <= getNumberSlidesShowing()){
+ return slider.settings.moveSlides;
+ }
+ // if moveSlides is 0 (auto)
+ return getNumberSlidesShowing();
+ }
+
+ /**
+ * Sets the slider's (el) left or top position
+ */
+ var setSlidePosition = function(){
+ // if last slide, not infinite loop, and number of children is larger than specified maxSlides
+ if(slider.children.length > slider.settings.maxSlides && slider.active.last && !slider.settings.infiniteLoop){
+ if (slider.settings.mode == 'horizontal'){
+ // get the last child's position
+ var lastChild = slider.children.last();
+ var position = lastChild.position();
+ // set the left position
+ setPositionProperty(-(position.left - (slider.viewport.width() - lastChild.width())), 'reset', 0);
+ }else if(slider.settings.mode == 'vertical'){
+ // get the last showing index's position
+ var lastShowingIndex = slider.children.length - slider.settings.minSlides;
+ var position = slider.children.eq(lastShowingIndex).position();
+ // set the top position
+ setPositionProperty(-position.top, 'reset', 0);
+ }
+ // if not last slide
+ }else{
+ // get the position of the first showing slide
+ var position = slider.children.eq(slider.active.index * getMoveBy()).position();
+ // check for last slide
+ if (slider.active.index == getPagerQty() - 1) slider.active.last = true;
+ // set the repective position
+ if (position != undefined){
+ if (slider.settings.mode == 'horizontal') setPositionProperty(-position.left, 'reset', 0);
+ else if (slider.settings.mode == 'vertical') setPositionProperty(-position.top, 'reset', 0);
+ }
+ }
+ }
+
+ /**
+ * Sets the el's animating property position (which in turn will sometimes animate el).
+ * If using CSS, sets the transform property. If not using CSS, sets the top / left property.
+ *
+ * @param value (int)
+ * - the animating property's value
+ *
+ * @param type (string) 'slider', 'reset', 'ticker'
+ * - the type of instance for which the function is being
+ *
+ * @param duration (int)
+ * - the amount of time (in ms) the transition should occupy
+ *
+ * @param params (array) optional
+ * - an optional parameter containing any variables that need to be passed in
+ */
+ var setPositionProperty = function(value, type, duration, params){
+ // use CSS transform
+ if(slider.usingCSS){
+ // determine the translate3d value
+ var propValue = slider.settings.mode == 'vertical' ? 'translate3d(0, ' + value + 'px, 0)' : 'translate3d(' + value + 'px, 0, 0)';
+ // add the CSS transition-duration
+ el.css('-' + slider.cssPrefix + '-transition-duration', duration / 1000 + 's');
+ if(type == 'slide'){
+ // set the property value
+ el.css(slider.animProp, propValue);
+ // bind a callback method - executes when CSS transition completes
+ el.bind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function(){
+ // unbind the callback
+ el.unbind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd');
+ updateAfterSlideTransition();
+ });
+ }else if(type == 'reset'){
+ el.css(slider.animProp, propValue);
+ }else if(type == 'ticker'){
+ // make the transition use 'linear'
+ el.css('-' + slider.cssPrefix + '-transition-timing-function', 'linear');
+ el.css(slider.animProp, propValue);
+ // bind a callback method - executes when CSS transition completes
+ el.bind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function(){
+ // unbind the callback
+ el.unbind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd');
+ // reset the position
+ setPositionProperty(params['resetValue'], 'reset', 0);
+ // start the loop again
+ tickerLoop();
+ });
+ }
+ // use JS animate
+ }else{
+ var animateObj = {};
+ animateObj[slider.animProp] = value;
+ if(type == 'slide'){
+ el.animate(animateObj, duration, slider.settings.easing, function(){
+ updateAfterSlideTransition();
+ });
+ }else if(type == 'reset'){
+ el.css(slider.animProp, value)
+ }else if(type == 'ticker'){
+ el.animate(animateObj, speed, 'linear', function(){
+ setPositionProperty(params['resetValue'], 'reset', 0);
+ // run the recursive loop after animation
+ tickerLoop();
+ });
+ }
+ }
+ }
+
+ /**
+ * Populates the pager with proper amount of pages
+ */
+ var populatePager = function(){
+ var pagerHtml = '';
+ var pagerQty = getPagerQty();
+ // loop through each pager item
+ for(var i=0; i < pagerQty; i++){
+ var linkContent = '';
+ // if a buildPager function is supplied, use it to get pager link value, else use index + 1
+ if(slider.settings.buildPager && $.isFunction(slider.settings.buildPager)){
+ linkContent = slider.settings.buildPager(i);
+ slider.pagerEl.addClass('bx-custom-pager');
+ }else{
+ linkContent = i + 1;
+ slider.pagerEl.addClass('bx-default-pager');
+ }
+ // var linkContent = slider.settings.buildPager && $.isFunction(slider.settings.buildPager) ? slider.settings.buildPager(i) : i + 1;
+ // add the markup to the string
+ pagerHtml += '';
+ };
+ // populate the pager element with pager links
+ slider.pagerEl.html(pagerHtml);
+ }
+
+ /**
+ * Appends the pager to the controls element
+ */
+ var appendPager = function(){
+ if(!slider.settings.pagerCustom){
+ // create the pager DOM element
+ slider.pagerEl = $('');
+ // if a pager selector was supplied, populate it with the pager
+ if(slider.settings.pagerSelector){
+ $(slider.settings.pagerSelector).html(slider.pagerEl);
+ // if no pager selector was supplied, add it after the wrapper
+ }else{
+ slider.controls.el.addClass('bx-has-pager').append(slider.pagerEl);
+ }
+ // populate the pager
+ populatePager();
+ }else{
+ slider.pagerEl = $(slider.settings.pagerCustom);
+ }
+ // assign the pager click binding
+ slider.pagerEl.on('click', 'a', clickPagerBind);
+ }
+
+ /**
+ * Appends prev / next controls to the controls element
+ */
+ var appendControls = function(){
+ slider.controls.next = $('' + slider.settings.nextText + '');
+ slider.controls.prev = $('' + slider.settings.prevText + '');
+ // bind click actions to the controls
+ slider.controls.next.bind('click', clickNextBind);
+ slider.controls.prev.bind('click', clickPrevBind);
+ // if nextSlector was supplied, populate it
+ if(slider.settings.nextSelector){
+ $(slider.settings.nextSelector).append(slider.controls.next);
+ }
+ // if prevSlector was supplied, populate it
+ if(slider.settings.prevSelector){
+ $(slider.settings.prevSelector).append(slider.controls.prev);
+ }
+ // if no custom selectors were supplied
+ if(!slider.settings.nextSelector && !slider.settings.prevSelector){
+ // add the controls to the DOM
+ slider.controls.directionEl = $('');
+ // add the control elements to the directionEl
+ slider.controls.directionEl.append(slider.controls.prev).append(slider.controls.next);
+ // slider.viewport.append(slider.controls.directionEl);
+ slider.controls.el.addClass('bx-has-controls-direction').append(slider.controls.directionEl);
+ }
+ }
+
+ /**
+ * Appends start / stop auto controls to the controls element
+ */
+ var appendControlsAuto = function(){
+ slider.controls.start = $('');
+ slider.controls.stop = $('');
+ // add the controls to the DOM
+ slider.controls.autoEl = $('');
+ // bind click actions to the controls
+ slider.controls.autoEl.delegate('.bx-start', 'click', clickStartBind);
+ slider.controls.autoEl.delegate('.bx-stop', 'click', clickStopBind);
+ // if autoControlsCombine, insert only the "start" control
+ if(slider.settings.autoControlsCombine){
+ slider.controls.autoEl.append(slider.controls.start);
+ // if autoControlsCombine is false, insert both controls
+ }else{
+ slider.controls.autoEl.append(slider.controls.start).append(slider.controls.stop);
+ }
+ // if auto controls selector was supplied, populate it with the controls
+ if(slider.settings.autoControlsSelector){
+ $(slider.settings.autoControlsSelector).html(slider.controls.autoEl);
+ // if auto controls selector was not supplied, add it after the wrapper
+ }else{
+ slider.controls.el.addClass('bx-has-controls-auto').append(slider.controls.autoEl);
+ }
+
+ // update the auto controls
+ updateAutoControls(slider.settings.autoStart ? 'stop' : 'start');
+ }
+
+ /**
+ * Appends image captions to the DOM
+ */
+ var appendCaptions = function(){
+ // cycle through each child
+ slider.children.each(function(index){
+ // get the image title attribute
+ var title = $(this).find('img:first').attr('title');
+ // append the caption
+ if (title != undefined && ('' + title).length) {
+ $(this).append('' + title + '
');
+ }
+ });
+ }
+
+ /**
+ * Click next binding
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var clickNextBind = function(e){
+ // if auto show is running, stop it
+ if (slider.settings.auto) el.stopAuto();
+ el.goToNextSlide();
+ e.preventDefault();
+ }
+
+ /**
+ * Click prev binding
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var clickPrevBind = function(e){
+ // if auto show is running, stop it
+ if (slider.settings.auto) el.stopAuto();
+ el.goToPrevSlide();
+ e.preventDefault();
+ }
+
+ /**
+ * Click start binding
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var clickStartBind = function(e){
+ el.startAuto();
+ e.preventDefault();
+ }
+
+ /**
+ * Click stop binding
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var clickStopBind = function(e){
+ el.stopAuto();
+ e.preventDefault();
+ }
+
+ /**
+ * Click pager binding
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var clickPagerBind = function(e){
+ // if auto show is running, stop it
+ if (slider.settings.auto) el.stopAuto();
+ var pagerLink = $(e.currentTarget);
+ if(pagerLink.attr('data-slide-index') !== undefined){
+ var pagerIndex = parseInt(pagerLink.attr('data-slide-index'));
+ // if clicked pager link is not active, continue with the goToSlide call
+ if(pagerIndex != slider.active.index) el.goToSlide(pagerIndex);
+ e.preventDefault();
+ }
+ }
+
+ /**
+ * Updates the pager links with an active class
+ *
+ * @param slideIndex (int)
+ * - index of slide to make active
+ */
+ var updatePagerActive = function(slideIndex){
+ // if "short" pager type
+ var len = slider.children.length; // nb of children
+ if(slider.settings.pagerType == 'short'){
+ if(slider.settings.maxSlides > 1) {
+ len = Math.ceil(slider.children.length/slider.settings.maxSlides);
+ }
+ slider.pagerEl.html( (slideIndex + 1) + slider.settings.pagerShortSeparator + len);
+ return;
+ }
+ // remove all pager active classes
+ slider.pagerEl.find('a').removeClass('active');
+ // apply the active class for all pagers
+ slider.pagerEl.each(function(i, el) { $(el).find('a').eq(slideIndex).addClass('active'); });
+ }
+
+ /**
+ * Performs needed actions after a slide transition
+ */
+ var updateAfterSlideTransition = function(){
+ // if infinte loop is true
+ if(slider.settings.infiniteLoop){
+ var position = '';
+ // first slide
+ if(slider.active.index == 0){
+ // set the new position
+ position = slider.children.eq(0).position();
+ // carousel, last slide
+ }else if(slider.active.index == getPagerQty() - 1 && slider.carousel){
+ position = slider.children.eq((getPagerQty() - 1) * getMoveBy()).position();
+ // last slide
+ }else if(slider.active.index == slider.children.length - 1){
+ position = slider.children.eq(slider.children.length - 1).position();
+ }
+ if (slider.settings.mode == 'horizontal') { setPositionProperty(-position.left, 'reset', 0);; }
+ else if (slider.settings.mode == 'vertical') { setPositionProperty(-position.top, 'reset', 0);; }
+ }
+ // declare that the transition is complete
+ slider.working = false;
+ // onSlideAfter callback
+ slider.settings.onSlideAfter(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
+ }
+
+ /**
+ * Updates the auto controls state (either active, or combined switch)
+ *
+ * @param state (string) "start", "stop"
+ * - the new state of the auto show
+ */
+ var updateAutoControls = function(state){
+
+ el.trigger("updateautocontrols", state);
+
+ // if autoControlsCombine is true, replace the current control with the new state
+ if(slider.settings.autoControlsCombine){
+ slider.controls.autoEl.html(slider.controls[state]);
+ // if autoControlsCombine is false, apply the "active" class to the appropriate control
+ }else{
+ slider.controls.autoEl.find('a').removeClass('active');
+ slider.controls.autoEl.find('a:not(.bx-' + state + ')').addClass('active');
+ }
+ }
+
+ /**
+ * Updates the direction controls (checks if either should be hidden)
+ */
+ var updateDirectionControls = function(){
+ if(getPagerQty() == 1){
+ slider.controls.prev.addClass('disabled');
+ slider.controls.next.addClass('disabled');
+ }else if(!slider.settings.infiniteLoop && slider.settings.hideControlOnEnd){
+ // if first slide
+ if (slider.active.index == 0){
+ slider.controls.prev.addClass('disabled');
+ slider.controls.next.removeClass('disabled');
+ // if last slide
+ }else if(slider.active.index == getPagerQty() - 1){
+ slider.controls.next.addClass('disabled');
+ slider.controls.prev.removeClass('disabled');
+ // if any slide in the middle
+ }else{
+ slider.controls.prev.removeClass('disabled');
+ slider.controls.next.removeClass('disabled');
+ }
+ }
+ }
+
+ /**
+ * Initialzes the auto process
+ */
+ var initAuto = function(){
+ // if autoDelay was supplied, launch the auto show using a setTimeout() call
+ if(slider.settings.autoDelay > 0){
+ var timeout = setTimeout(el.startAuto, slider.settings.autoDelay);
+ // if autoDelay was not supplied, start the auto show normally
+ }else{
+ el.startAuto();
+ }
+ // if autoHover is requested
+ if(slider.settings.autoHover){
+ // on el hover
+ el.hover(function(){
+ // if the auto show is currently playing (has an active interval)
+ if(slider.interval){
+ // stop the auto show and pass true agument which will prevent control update
+ el.stopAuto(true);
+ // create a new autoPaused value which will be used by the relative "mouseout" event
+ slider.autoPaused = true;
+ }
+ }, function(){
+ // if the autoPaused value was created be the prior "mouseover" event
+ if(slider.autoPaused){
+ // start the auto show and pass true agument which will prevent control update
+ el.startAuto(true);
+ // reset the autoPaused value
+ slider.autoPaused = null;
+ }
+ });
+ }
+ }
+
+ /**
+ * Initialzes the ticker process
+ */
+ var initTicker = function(){
+ var startPosition = 0;
+ // if autoDirection is "next", append a clone of the entire slider
+ if(slider.settings.autoDirection == 'next'){
+ el.append(slider.children.clone().addClass('bx-clone'));
+ // if autoDirection is "prev", prepend a clone of the entire slider, and set the left position
+ }else{
+ el.prepend(slider.children.clone().addClass('bx-clone'));
+ var position = slider.children.first().position();
+ startPosition = slider.settings.mode == 'horizontal' ? -position.left : -position.top;
+ }
+ setPositionProperty(startPosition, 'reset', 0);
+ // do not allow controls in ticker mode
+ slider.settings.pager = false;
+ slider.settings.controls = false;
+ slider.settings.autoControls = false;
+ // if autoHover is requested
+ if(slider.settings.tickerHover && !slider.usingCSS){
+ // on el hover
+ slider.viewport.hover(function(){
+ el.stop();
+ }, function(){
+ // calculate the total width of children (used to calculate the speed ratio)
+ var totalDimens = 0;
+ slider.children.each(function(index){
+ totalDimens += slider.settings.mode == 'horizontal' ? $(this).outerWidth(true) : $(this).outerHeight(true);
+ });
+ // calculate the speed ratio (used to determine the new speed to finish the paused animation)
+ var ratio = slider.settings.speed / totalDimens;
+ // determine which property to use
+ var property = slider.settings.mode == 'horizontal' ? 'left' : 'top';
+ // calculate the new speed
+ var newSpeed = ratio * (totalDimens - (Math.abs(parseInt(el.css(property)))));
+ tickerLoop(newSpeed);
+ });
+ }
+ // start the ticker loop
+ tickerLoop();
+ }
+
+ /**
+ * Runs a continuous loop, news ticker-style
+ */
+ var tickerLoop = function(resumeSpeed){
+ speed = resumeSpeed ? resumeSpeed : slider.settings.speed;
+ var position = {left: 0, top: 0};
+ var reset = {left: 0, top: 0};
+ // if "next" animate left position to last child, then reset left to 0
+ if(slider.settings.autoDirection == 'next'){
+ position = el.find('.bx-clone').first().position();
+ // if "prev" animate left position to 0, then reset left to first non-clone child
+ }else{
+ reset = slider.children.first().position();
+ }
+ var animateProperty = slider.settings.mode == 'horizontal' ? -position.left : -position.top;
+ var resetValue = slider.settings.mode == 'horizontal' ? -reset.left : -reset.top;
+ var params = {resetValue: resetValue};
+ setPositionProperty(animateProperty, 'ticker', speed, params);
+ }
+
+ /**
+ * Initializes touch events
+ */
+ var initTouch = function(){
+ // initialize object to contain all touch values
+ slider.touch = {
+ start: {x: 0, y: 0},
+ end: {x: 0, y: 0}
+ }
+ slider.viewport.bind(slider.START_EV, onTouchStart);
+ slider.children.bind('click', onClick_check);
+ }
+
+ var isScrolling;
+ /**
+ * Event handler for "touchstart"
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var onTouchStart = function(e){
+ // used for testing first move event
+ isScrolling = undefined;
+ if(slider.working){
+ e.preventDefault();
+ }else{
+ // record the original position when touch starts
+ slider.touch.originalPos = el.position();
+ var orig = e.originalEvent;
+ var evt = slider.settings.SUPPORTS_TOUCH ? orig.changedTouches[0] : e;
+ // record the starting touch x, y coordinates
+ slider.touch.start.x = evt.pageX;
+ slider.touch.start.y = evt.pageY;
+ // bind a "touchmove" event to the viewport
+ slider.viewport.bind(slider.MOVE_EV, onTouchMove);
+ // bind a "touchend" event to the viewport
+ slider.viewport.bind(slider.END_EV, onTouchEnd);
+ }
+ }
+
+ var onClick_check = function(e){
+ if(slider.working){
+ e.preventDefault();
}
- }
}
- }
- // if "vertical" mode, calculate the sum of the heights of the children
- if (slider.settings.mode === 'vertical') {
- children.each(function(index) {
- height += $(this).outerHeight();
- });
- // add user-supplied margins
- if (slider.settings.slideMargin > 0) {
- height += slider.settings.slideMargin * (slider.settings.minSlides - 1);
- }
- // if not "vertical" mode, calculate the max height of the children
- } else {
- height = Math.max.apply(Math, children.map(function() {
- return $(this).outerHeight(false);
- }).get());
- }
+ /**
+ * Event handler for "touchmove"
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var onTouchMove = function(e){
+ var orig = e.originalEvent;
+ var evt = slider.settings.SUPPORTS_TOUCH ? orig.changedTouches[0] : e;
+ // if scrolling on y axis, do not prevent default
+ var xMovement = Math.abs(evt.pageX - slider.touch.start.x);
+ var yMovement = Math.abs(evt.pageY - slider.touch.start.y);
- if (slider.viewport.css('box-sizing') === 'border-box') {
- height += parseFloat(slider.viewport.css('padding-top')) + parseFloat(slider.viewport.css('padding-bottom')) +
- parseFloat(slider.viewport.css('border-top-width')) + parseFloat(slider.viewport.css('border-bottom-width'));
- } else if (slider.viewport.css('box-sizing') === 'padding-box') {
- height += parseFloat(slider.viewport.css('padding-top')) + parseFloat(slider.viewport.css('padding-bottom'));
- }
-
- return height;
- };
-
- /**
- * Returns the calculated width to be used for the outer wrapper / viewport
- */
- var getViewportMaxWidth = function() {
- var width = '100%';
- if (slider.settings.slideWidth > 0) {
- if (slider.settings.mode === 'horizontal') {
- width = (slider.settings.maxSlides * slider.settings.slideWidth) + ((slider.settings.maxSlides - 1) * slider.settings.slideMargin);
- } else {
- width = slider.settings.slideWidth;
- }
- }
- return width;
- };
-
- /**
- * Returns the calculated width to be applied to each slide
- */
- var getSlideWidth = function() {
- var newElWidth = slider.settings.slideWidth, // start with any user-supplied slide width
- wrapWidth = slider.viewport.width(); // get the current viewport width
- // if slide width was not supplied, or is larger than the viewport use the viewport width
- if (slider.settings.slideWidth === 0 ||
- (slider.settings.slideWidth > wrapWidth && !slider.carousel) ||
- slider.settings.mode === 'vertical') {
- newElWidth = wrapWidth;
- // if carousel, use the thresholds to determine the width
- } else if (slider.settings.maxSlides > 1 && slider.settings.mode === 'horizontal') {
- if (wrapWidth > slider.maxThreshold) {
- return newElWidth;
- } else if (wrapWidth < slider.minThreshold) {
- newElWidth = (wrapWidth - (slider.settings.slideMargin * (slider.settings.minSlides - 1))) / slider.settings.minSlides;
- } else if (slider.settings.shrinkItems) {
- newElWidth = Math.floor((wrapWidth + slider.settings.slideMargin) / (Math.ceil((wrapWidth + slider.settings.slideMargin) / (newElWidth + slider.settings.slideMargin))) - slider.settings.slideMargin);
- }
- }
- return newElWidth;
- };
-
- /**
- * Returns the number of slides currently visible in the viewport (includes partially visible slides)
- */
- var getNumberSlidesShowing = function() {
- var slidesShowing = 1,
- childWidth = null;
- if (slider.settings.mode === 'horizontal' && slider.settings.slideWidth > 0) {
- // if viewport is smaller than minThreshold, return minSlides
- if (slider.viewport.width() < slider.minThreshold) {
- slidesShowing = slider.settings.minSlides;
- // if viewport is larger than maxThreshold, return maxSlides
- } else if (slider.viewport.width() > slider.maxThreshold) {
- slidesShowing = slider.settings.maxSlides;
- // if viewport is between min / max thresholds, divide viewport width by first child width
- } else {
- childWidth = slider.children.first().width() + slider.settings.slideMargin;
- slidesShowing = Math.floor((slider.viewport.width() +
- slider.settings.slideMargin) / childWidth);
- }
- // if "vertical" mode, slides showing will always be minSlides
- } else if (slider.settings.mode === 'vertical') {
- slidesShowing = slider.settings.minSlides;
- }
- return slidesShowing;
- };
-
- /**
- * Returns the number of pages (one full viewport of slides is one "page")
- */
- var getPagerQty = function() {
- var pagerQty = 0,
- breakPoint = 0,
- counter = 0;
- // if moveSlides is specified by the user
- if (slider.settings.moveSlides > 0) {
- if (slider.settings.infiniteLoop) {
- pagerQty = Math.ceil(slider.children.length / getMoveBy());
- } else {
- // when breakpoint goes above children length, counter is the number of pages
- while (breakPoint < slider.children.length) {
- ++pagerQty;
- breakPoint = counter + getNumberSlidesShowing();
- counter += slider.settings.moveSlides <= getNumberSlidesShowing() ? slider.settings.moveSlides : getNumberSlidesShowing();
- }
- }
- // if moveSlides is 0 (auto) divide children length by sides showing, then round up
- } else {
- pagerQty = Math.ceil(slider.children.length / getNumberSlidesShowing());
- }
- return pagerQty;
- };
-
- /**
- * Returns the number of individual slides by which to shift the slider
- */
- var getMoveBy = function() {
- // if moveSlides was set by the user and moveSlides is less than number of slides showing
- if (slider.settings.moveSlides > 0 && slider.settings.moveSlides <= getNumberSlidesShowing()) {
- return slider.settings.moveSlides;
- }
- // if moveSlides is 0 (auto)
- return getNumberSlidesShowing();
- };
-
- /**
- * Sets the slider's (el) left or top position
- */
- var setSlidePosition = function() {
- var position, lastChild, lastShowingIndex;
- // if last slide, not infinite loop, and number of children is larger than specified maxSlides
- if (slider.children.length > slider.settings.maxSlides && slider.active.last && !slider.settings.infiniteLoop) {
- if (slider.settings.mode === 'horizontal') {
- // get the last child's position
- lastChild = slider.children.last();
- position = lastChild.position();
- // set the left position
- setPositionProperty(-(position.left - (slider.viewport.width() - lastChild.outerWidth())), 'reset', 0);
- } else if (slider.settings.mode === 'vertical') {
- // get the last showing index's position
- lastShowingIndex = slider.children.length - slider.settings.minSlides;
- position = slider.children.eq(lastShowingIndex).position();
- // set the top position
- setPositionProperty(-position.top, 'reset', 0);
- }
- // if not last slide
- } else {
- // get the position of the first showing slide
- position = slider.children.eq(slider.active.index * getMoveBy()).position();
- // check for last slide
- if (slider.active.index === getPagerQty() - 1) { slider.active.last = true; }
- // set the respective position
- if (position !== undefined) {
- if (slider.settings.mode === 'horizontal') { setPositionProperty(-position.left, 'reset', 0); }
- else if (slider.settings.mode === 'vertical') { setPositionProperty(-position.top, 'reset', 0); }
- }
- }
- };
-
- /**
- * Sets the el's animating property position (which in turn will sometimes animate el).
- * If using CSS, sets the transform property. If not using CSS, sets the top / left property.
- *
- * @param value (int)
- * - the animating property's value
- *
- * @param type (string) 'slide', 'reset', 'ticker'
- * - the type of instance for which the function is being
- *
- * @param duration (int)
- * - the amount of time (in ms) the transition should occupy
- *
- * @param params (array) optional
- * - an optional parameter containing any variables that need to be passed in
- */
- var setPositionProperty = function(value, type, duration, params) {
- var animateObj, propValue;
- // use CSS transform
- if (slider.usingCSS) {
- // determine the translate3d value
- propValue = slider.settings.mode === 'vertical' ? 'translate3d(0, ' + value + 'px, 0)' : 'translate3d(' + value + 'px, 0, 0)';
- // add the CSS transition-duration
- el.css('-' + slider.cssPrefix + '-transition-duration', duration / 1000 + 's');
- if (type === 'slide') {
- // set the property value
- el.css(slider.animProp, propValue);
- if (duration !== 0) {
- // bind a callback method - executes when CSS transition completes
- el.bind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function(e) {
- //make sure it's the correct one
- if (!$(e.target).is(el)) { return; }
- // unbind the callback
- el.unbind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd');
- updateAfterSlideTransition();
- });
- } else { //duration = 0
- updateAfterSlideTransition();
- }
- } else if (type === 'reset') {
- el.css(slider.animProp, propValue);
- } else if (type === 'ticker') {
- // make the transition use 'linear'
- el.css('-' + slider.cssPrefix + '-transition-timing-function', 'linear');
- el.css(slider.animProp, propValue);
- if (duration !== 0) {
- el.bind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function(e) {
- //make sure it's the correct one
- if (!$(e.target).is(el)) { return; }
- // unbind the callback
- el.unbind('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd');
- // reset the position
- setPositionProperty(params.resetValue, 'reset', 0);
- // start the loop again
- tickerLoop();
- });
- } else { //duration = 0
- setPositionProperty(params.resetValue, 'reset', 0);
- tickerLoop();
- }
- }
- // use JS animate
- } else {
- animateObj = {};
- animateObj[slider.animProp] = value;
- if (type === 'slide') {
- el.animate(animateObj, duration, slider.settings.easing, function() {
- updateAfterSlideTransition();
- });
- } else if (type === 'reset') {
- el.css(slider.animProp, value);
- } else if (type === 'ticker') {
- el.animate(animateObj, duration, 'linear', function() {
- setPositionProperty(params.resetValue, 'reset', 0);
- // run the recursive loop after animation
- tickerLoop();
- });
- }
- }
- };
-
- /**
- * Populates the pager with proper amount of pages
- */
- var populatePager = function() {
- var pagerHtml = '',
- linkContent = '',
- pagerQty = getPagerQty();
- // loop through each pager item
- for (var i = 0; i < pagerQty; i++) {
- linkContent = '';
- // if a buildPager function is supplied, use it to get pager link value, else use index + 1
- if (slider.settings.buildPager && $.isFunction(slider.settings.buildPager) || slider.settings.pagerCustom) {
- linkContent = slider.settings.buildPager(i);
- slider.pagerEl.addClass('bx-custom-pager');
- } else {
- linkContent = i + 1;
- slider.pagerEl.addClass('bx-default-pager');
- }
- // var linkContent = slider.settings.buildPager && $.isFunction(slider.settings.buildPager) ? slider.settings.buildPager(i) : i + 1;
- // add the markup to the string
- pagerHtml += '';
- }
- // populate the pager element with pager links
- slider.pagerEl.html(pagerHtml);
- };
-
- /**
- * Appends the pager to the controls element
- */
- var appendPager = function() {
- if (!slider.settings.pagerCustom) {
- // create the pager DOM element
- slider.pagerEl = $('');
- // if a pager selector was supplied, populate it with the pager
- if (slider.settings.pagerSelector) {
- $(slider.settings.pagerSelector).html(slider.pagerEl);
- // if no pager selector was supplied, add it after the wrapper
- } else {
- slider.controls.el.addClass('bx-has-pager').append(slider.pagerEl);
- }
- // populate the pager
- populatePager();
- } else {
- slider.pagerEl = $(slider.settings.pagerCustom);
- }
- // assign the pager click binding
- slider.pagerEl.on('click touchend', 'a', clickPagerBind);
- };
-
- /**
- * Appends prev / next controls to the controls element
- */
- var appendControls = function() {
- slider.controls.next = $('' + slider.settings.nextText + '');
- slider.controls.prev = $('' + slider.settings.prevText + '');
- // bind click actions to the controls
- slider.controls.next.bind('click touchend', clickNextBind);
- slider.controls.prev.bind('click touchend', clickPrevBind);
- // if nextSelector was supplied, populate it
- if (slider.settings.nextSelector) {
- $(slider.settings.nextSelector).append(slider.controls.next);
- }
- // if prevSelector was supplied, populate it
- if (slider.settings.prevSelector) {
- $(slider.settings.prevSelector).append(slider.controls.prev);
- }
- // if no custom selectors were supplied
- if (!slider.settings.nextSelector && !slider.settings.prevSelector) {
- // add the controls to the DOM
- slider.controls.directionEl = $('');
- // add the control elements to the directionEl
- slider.controls.directionEl.append(slider.controls.prev).append(slider.controls.next);
- // slider.viewport.append(slider.controls.directionEl);
- slider.controls.el.addClass('bx-has-controls-direction').append(slider.controls.directionEl);
- }
- };
-
- /**
- * Appends start / stop auto controls to the controls element
- */
- var appendControlsAuto = function() {
- slider.controls.start = $('');
- slider.controls.stop = $('');
- // add the controls to the DOM
- slider.controls.autoEl = $('');
- // bind click actions to the controls
- slider.controls.autoEl.on('click', '.bx-start', clickStartBind);
- slider.controls.autoEl.on('click', '.bx-stop', clickStopBind);
- // if autoControlsCombine, insert only the "start" control
- if (slider.settings.autoControlsCombine) {
- slider.controls.autoEl.append(slider.controls.start);
- // if autoControlsCombine is false, insert both controls
- } else {
- slider.controls.autoEl.append(slider.controls.start).append(slider.controls.stop);
- }
- // if auto controls selector was supplied, populate it with the controls
- if (slider.settings.autoControlsSelector) {
- $(slider.settings.autoControlsSelector).html(slider.controls.autoEl);
- // if auto controls selector was not supplied, add it after the wrapper
- } else {
- slider.controls.el.addClass('bx-has-controls-auto').append(slider.controls.autoEl);
- }
- // update the auto controls
- updateAutoControls(slider.settings.autoStart ? 'stop' : 'start');
- };
-
- /**
- * Appends image captions to the DOM
- */
- var appendCaptions = function() {
- // cycle through each child
- slider.children.each(function(index) {
- // get the image title attribute
- var title = $(this).find('img:first').attr('title');
- // append the caption
- if (title !== undefined && ('' + title).length) {
- $(this).append('' + title + '
');
- }
- });
- };
-
- /**
- * Click next binding
- *
- * @param e (event)
- * - DOM event object
- */
- var clickNextBind = function(e) {
- e.preventDefault();
- if (slider.controls.el.hasClass('disabled')) { return; }
- // if auto show is running, stop it
- if (slider.settings.auto && slider.settings.stopAutoOnClick) { el.stopAuto(); }
- el.goToNextSlide();
- };
-
- /**
- * Click prev binding
- *
- * @param e (event)
- * - DOM event object
- */
- var clickPrevBind = function(e) {
- e.preventDefault();
- if (slider.controls.el.hasClass('disabled')) { return; }
- // if auto show is running, stop it
- if (slider.settings.auto && slider.settings.stopAutoOnClick) { el.stopAuto(); }
- el.goToPrevSlide();
- };
-
- /**
- * Click start binding
- *
- * @param e (event)
- * - DOM event object
- */
- var clickStartBind = function(e) {
- el.startAuto();
- e.preventDefault();
- };
-
- /**
- * Click stop binding
- *
- * @param e (event)
- * - DOM event object
- */
- var clickStopBind = function(e) {
- el.stopAuto();
- e.preventDefault();
- };
-
- /**
- * Click pager binding
- *
- * @param e (event)
- * - DOM event object
- */
- var clickPagerBind = function(e) {
- var pagerLink, pagerIndex;
- e.preventDefault();
- if (slider.controls.el.hasClass('disabled')) {
- return;
- }
- // if auto show is running, stop it
- if (slider.settings.auto && slider.settings.stopAutoOnClick) { el.stopAuto(); }
- pagerLink = $(e.currentTarget);
- if (pagerLink.attr('data-slide-index') !== undefined) {
- pagerIndex = parseInt(pagerLink.attr('data-slide-index'));
- // if clicked pager link is not active, continue with the goToSlide call
- if (pagerIndex !== slider.active.index) { el.goToSlide(pagerIndex); }
- }
- };
-
- /**
- * Updates the pager links with an active class
- *
- * @param slideIndex (int)
- * - index of slide to make active
- */
- var updatePagerActive = function(slideIndex) {
- // if "short" pager type
- var len = slider.children.length; // nb of children
- if (slider.settings.pagerType === 'short') {
- if (slider.settings.maxSlides > 1) {
- len = Math.ceil(slider.children.length / slider.settings.maxSlides);
- }
- slider.pagerEl.html((slideIndex + 1) + slider.settings.pagerShortSeparator + len);
- return;
- }
- // remove all pager active classes
- slider.pagerEl.find('a').removeClass('active');
- // apply the active class for all pagers
- slider.pagerEl.each(function(i, el) { $(el).find('a').eq(slideIndex).addClass('active'); });
- };
-
- /**
- * Performs needed actions after a slide transition
- */
- var updateAfterSlideTransition = function() {
- // if infinite loop is true
- if (slider.settings.infiniteLoop) {
- var position = '';
- // first slide
- if (slider.active.index === 0) {
- // set the new position
- position = slider.children.eq(0).position();
- // carousel, last slide
- } else if (slider.active.index === getPagerQty() - 1 && slider.carousel) {
- position = slider.children.eq((getPagerQty() - 1) * getMoveBy()).position();
- // last slide
- } else if (slider.active.index === slider.children.length - 1) {
- position = slider.children.eq(slider.children.length - 1).position();
- }
- if (position) {
- if (slider.settings.mode === 'horizontal') { setPositionProperty(-position.left, 'reset', 0); }
- else if (slider.settings.mode === 'vertical') { setPositionProperty(-position.top, 'reset', 0); }
- }
- }
- // declare that the transition is complete
- slider.working = false;
- // onSlideAfter callback
- slider.settings.onSlideAfter.call(el, slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
- };
-
- /**
- * Updates the auto controls state (either active, or combined switch)
- *
- * @param state (string) "start", "stop"
- * - the new state of the auto show
- */
- var updateAutoControls = function(state) {
- // if autoControlsCombine is true, replace the current control with the new state
- if (slider.settings.autoControlsCombine) {
- slider.controls.autoEl.html(slider.controls[state]);
- // if autoControlsCombine is false, apply the "active" class to the appropriate control
- } else {
- slider.controls.autoEl.find('a').removeClass('active');
- slider.controls.autoEl.find('a:not(.bx-' + state + ')').addClass('active');
- }
- };
-
- /**
- * Updates the direction controls (checks if either should be hidden)
- */
- var updateDirectionControls = function() {
- if (getPagerQty() === 1) {
- slider.controls.prev.addClass('disabled');
- slider.controls.next.addClass('disabled');
- } else if (!slider.settings.infiniteLoop && slider.settings.hideControlOnEnd) {
- // if first slide
- if (slider.active.index === 0) {
- slider.controls.prev.addClass('disabled');
- slider.controls.next.removeClass('disabled');
- // if last slide
- } else if (slider.active.index === getPagerQty() - 1) {
- slider.controls.next.addClass('disabled');
- slider.controls.prev.removeClass('disabled');
- // if any slide in the middle
- } else {
- slider.controls.prev.removeClass('disabled');
- slider.controls.next.removeClass('disabled');
- }
- }
- };
-
- /**
- * Initializes the auto process
- */
- var initAuto = function() {
- // if autoDelay was supplied, launch the auto show using a setTimeout() call
- if (slider.settings.autoDelay > 0) {
- var timeout = setTimeout(el.startAuto, slider.settings.autoDelay);
- // if autoDelay was not supplied, start the auto show normally
- } else {
- el.startAuto();
-
- //add focus and blur events to ensure its running if timeout gets paused
- $(window).focus(function() {
- el.startAuto();
- }).blur(function() {
- el.stopAuto();
- });
- }
- // if autoHover is requested
- if (slider.settings.autoHover) {
- // on el hover
- el.hover(function() {
- // if the auto show is currently playing (has an active interval)
- if (slider.interval) {
- // stop the auto show and pass true argument which will prevent control update
- el.stopAuto(true);
- // create a new autoPaused value which will be used by the relative "mouseout" event
- slider.autoPaused = true;
- }
- }, function() {
- // if the autoPaused value was created be the prior "mouseover" event
- if (slider.autoPaused) {
- // start the auto show and pass true argument which will prevent control update
- el.startAuto(true);
- // reset the autoPaused value
- slider.autoPaused = null;
- }
- });
- }
- };
-
- /**
- * Initializes the ticker process
- */
- var initTicker = function() {
- var startPosition = 0,
- position, transform, value, idx, ratio, property, newSpeed, totalDimens;
- // if autoDirection is "next", append a clone of the entire slider
- if (slider.settings.autoDirection === 'next') {
- el.append(slider.children.clone().addClass('bx-clone'));
- // if autoDirection is "prev", prepend a clone of the entire slider, and set the left position
- } else {
- el.prepend(slider.children.clone().addClass('bx-clone'));
- position = slider.children.first().position();
- startPosition = slider.settings.mode === 'horizontal' ? -position.left : -position.top;
- }
- setPositionProperty(startPosition, 'reset', 0);
- // do not allow controls in ticker mode
- slider.settings.pager = false;
- slider.settings.controls = false;
- slider.settings.autoControls = false;
- // if autoHover is requested
- if (slider.settings.tickerHover) {
- if (slider.usingCSS) {
- idx = slider.settings.mode === 'horizontal' ? 4 : 5;
- slider.viewport.hover(function() {
- transform = el.css('-' + slider.cssPrefix + '-transform');
- value = parseFloat(transform.split(',')[idx]);
- setPositionProperty(value, 'reset', 0);
- }, function() {
- totalDimens = 0;
- slider.children.each(function(index) {
- totalDimens += slider.settings.mode === 'horizontal' ? $(this).outerWidth(true) : $(this).outerHeight(true);
- });
- // calculate the speed ratio (used to determine the new speed to finish the paused animation)
- ratio = slider.settings.speed / totalDimens;
- // determine which property to use
- property = slider.settings.mode === 'horizontal' ? 'left' : 'top';
- // calculate the new speed
- newSpeed = ratio * (totalDimens - (Math.abs(parseInt(value))));
- tickerLoop(newSpeed);
- });
- } else {
- // on el hover
- slider.viewport.hover(function() {
- el.stop();
- }, function() {
- // calculate the total width of children (used to calculate the speed ratio)
- totalDimens = 0;
- slider.children.each(function(index) {
- totalDimens += slider.settings.mode === 'horizontal' ? $(this).outerWidth(true) : $(this).outerHeight(true);
- });
- // calculate the speed ratio (used to determine the new speed to finish the paused animation)
- ratio = slider.settings.speed / totalDimens;
- // determine which property to use
- property = slider.settings.mode === 'horizontal' ? 'left' : 'top';
- // calculate the new speed
- newSpeed = ratio * (totalDimens - (Math.abs(parseInt(el.css(property)))));
- tickerLoop(newSpeed);
- });
- }
- }
- // start the ticker loop
- tickerLoop();
- };
-
- /**
- * Runs a continuous loop, news ticker-style
- */
- var tickerLoop = function(resumeSpeed) {
- var speed = resumeSpeed ? resumeSpeed : slider.settings.speed,
- position = {left: 0, top: 0},
- reset = {left: 0, top: 0},
- animateProperty, resetValue, params;
-
- // if "next" animate left position to last child, then reset left to 0
- if (slider.settings.autoDirection === 'next') {
- position = el.find('.bx-clone').first().position();
- // if "prev" animate left position to 0, then reset left to first non-clone child
- } else {
- reset = slider.children.first().position();
- }
- animateProperty = slider.settings.mode === 'horizontal' ? -position.left : -position.top;
- resetValue = slider.settings.mode === 'horizontal' ? -reset.left : -reset.top;
- params = {resetValue: resetValue};
- setPositionProperty(animateProperty, 'ticker', speed, params);
- };
-
- /**
- * Check if el is on screen
- */
- var isOnScreen = function(el) {
- var win = $(window),
- viewport = {
- top: win.scrollTop(),
- left: win.scrollLeft()
- },
- bounds = el.offset();
-
- viewport.right = viewport.left + win.width();
- viewport.bottom = viewport.top + win.height();
- bounds.right = bounds.left + el.outerWidth();
- bounds.bottom = bounds.top + el.outerHeight();
-
- return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));
- };
-
- /**
- * Initializes keyboard events
- */
- var keyPress = function(e) {
- var activeElementTag = document.activeElement.tagName.toLowerCase(),
- tagFilters = 'input|textarea',
- p = new RegExp(activeElementTag,['i']),
- result = p.exec(tagFilters);
-
- if (result == null && isOnScreen(el)) {
- if (e.keyCode === 39) {
- clickNextBind(e);
- return false;
- } else if (e.keyCode === 37) {
- clickPrevBind(e);
- return false;
- }
- }
- };
-
- /**
- * Initializes touch events
- */
- var initTouch = function() {
- // initialize object to contain all touch values
- slider.touch = {
- start: {x: 0, y: 0},
- end: {x: 0, y: 0}
- };
- slider.viewport.bind('touchstart MSPointerDown pointerdown', onTouchStart);
-
- //for browsers that have implemented pointer events and fire a click after
- //every pointerup regardless of whether pointerup is on same screen location as pointerdown or not
- slider.viewport.on('click', '.bxslider a', function(e) {
- if (slider.viewport.hasClass('click-disabled')) {
- e.preventDefault();
- slider.viewport.removeClass('click-disabled');
- }
- });
- };
-
- /**
- * Event handler for "touchstart"
- *
- * @param e (event)
- * - DOM event object
- */
- var onTouchStart = function(e) {
- //disable slider controls while user is interacting with slides to avoid slider freeze that happens on touch devices when a slide swipe happens immediately after interacting with slider controls
- slider.controls.el.addClass('disabled');
-
- if (slider.working) {
- e.preventDefault();
- slider.controls.el.removeClass('disabled');
- } else {
- // record the original position when touch starts
- slider.touch.originalPos = el.position();
- var orig = e.originalEvent,
- touchPoints = (typeof orig.changedTouches !== 'undefined') ? orig.changedTouches : [orig];
- // record the starting touch x, y coordinates
- slider.touch.start.x = touchPoints[0].pageX;
- slider.touch.start.y = touchPoints[0].pageY;
-
- if (slider.viewport.get(0).setPointerCapture) {
- slider.pointerId = orig.pointerId;
- slider.viewport.get(0).setPointerCapture(slider.pointerId);
- }
- // bind a "touchmove" event to the viewport
- slider.viewport.bind('touchmove MSPointerMove pointermove', onTouchMove);
- // bind a "touchend" event to the viewport
- slider.viewport.bind('touchend MSPointerUp pointerup', onTouchEnd);
- slider.viewport.bind('MSPointerCancel pointercancel', onPointerCancel);
- }
- };
-
- /**
- * Cancel Pointer for Windows Phone
- *
- * @param e (event)
- * - DOM event object
- */
- var onPointerCancel = function(e) {
- /* onPointerCancel handler is needed to deal with situations when a touchend
- doesn't fire after a touchstart (this happens on windows phones only) */
- setPositionProperty(slider.touch.originalPos.left, 'reset', 0);
-
- //remove handlers
- slider.controls.el.removeClass('disabled');
- slider.viewport.unbind('MSPointerCancel pointercancel', onPointerCancel);
- slider.viewport.unbind('touchmove MSPointerMove pointermove', onTouchMove);
- slider.viewport.unbind('touchend MSPointerUp pointerup', onTouchEnd);
- if (slider.viewport.get(0).releasePointerCapture) {
- slider.viewport.get(0).releasePointerCapture(slider.pointerId);
- }
- };
-
- /**
- * Event handler for "touchmove"
- *
- * @param e (event)
- * - DOM event object
- */
- var onTouchMove = function(e) {
- var orig = e.originalEvent,
- touchPoints = (typeof orig.changedTouches !== 'undefined') ? orig.changedTouches : [orig],
- // if scrolling on y axis, do not prevent default
- xMovement = Math.abs(touchPoints[0].pageX - slider.touch.start.x),
- yMovement = Math.abs(touchPoints[0].pageY - slider.touch.start.y),
- value = 0,
- change = 0;
-
- // x axis swipe
- if ((xMovement * 3) > yMovement && slider.settings.preventDefaultSwipeX) {
- e.preventDefault();
- // y axis swipe
- } else if ((yMovement * 3) > xMovement && slider.settings.preventDefaultSwipeY) {
- e.preventDefault();
- }
- if (slider.settings.mode !== 'fade' && slider.settings.oneToOneTouch) {
- // if horizontal, drag along x axis
- if (slider.settings.mode === 'horizontal') {
- change = touchPoints[0].pageX - slider.touch.start.x;
- value = slider.touch.originalPos.left + change;
- // if vertical, drag along y axis
- } else {
- change = touchPoints[0].pageY - slider.touch.start.y;
- value = slider.touch.originalPos.top + change;
- }
- setPositionProperty(value, 'reset', 0);
- }
- };
-
- /**
- * Event handler for "touchend"
- *
- * @param e (event)
- * - DOM event object
- */
- var onTouchEnd = function(e) {
- slider.viewport.unbind('touchmove MSPointerMove pointermove', onTouchMove);
- //enable slider controls as soon as user stops interacing with slides
- slider.controls.el.removeClass('disabled');
- var orig = e.originalEvent,
- touchPoints = (typeof orig.changedTouches !== 'undefined') ? orig.changedTouches : [orig],
- value = 0,
- distance = 0;
- // record end x, y positions
- slider.touch.end.x = touchPoints[0].pageX;
- slider.touch.end.y = touchPoints[0].pageY;
- // if fade mode, check if absolute x distance clears the threshold
- if (slider.settings.mode === 'fade') {
- distance = Math.abs(slider.touch.start.x - slider.touch.end.x);
- if (distance >= slider.settings.swipeThreshold) {
- if (slider.touch.start.x > slider.touch.end.x) {
- el.goToNextSlide();
- } else {
- el.goToPrevSlide();
- }
- el.stopAuto();
- }
- // not fade mode
- } else {
- // calculate distance and el's animate property
- if (slider.settings.mode === 'horizontal') {
- distance = slider.touch.end.x - slider.touch.start.x;
- value = slider.touch.originalPos.left;
- } else {
- distance = slider.touch.end.y - slider.touch.start.y;
- value = slider.touch.originalPos.top;
- }
- // if not infinite loop and first / last slide, do not attempt a slide transition
- if (!slider.settings.infiniteLoop && ((slider.active.index === 0 && distance > 0) || (slider.active.last && distance < 0))) {
- setPositionProperty(value, 'reset', 200);
- } else {
- // check if distance clears threshold
- if (Math.abs(distance) >= slider.settings.swipeThreshold) {
- if (distance < 0) {
- el.goToNextSlide();
- } else {
- el.goToPrevSlide();
+ // determine if scrolling test has run - one time test
+ if ( typeof isScrolling == 'undefined') {
+ isScrolling = !!( isScrolling || xMovement < yMovement );
+ }
+ if (!isScrolling && slider.settings.mode != 'vertical') {
+ // x axis swipe
+ if((xMovement * 3) > yMovement && slider.settings.preventDefaultSwipeX){
+ e.preventDefault();
+ // y axis swipe
+ }else if((yMovement * 3) > xMovement && slider.settings.preventDefaultSwipeY){
+ e.preventDefault();
+ }
+ if(slider.settings.mode != 'fade' && slider.settings.oneToOneTouch){
+ var value = 0;
+ // if horizontal, drag along x axis
+ if(slider.settings.mode == 'horizontal'){
+ var change = evt.pageX - slider.touch.start.x;
+ value = slider.touch.originalPos.left + change;
+ // if vertical, drag along y axis
+ }else{
+ var change = evt.pageY - slider.touch.start.y;
+ value = slider.touch.originalPos.top + change;
+ }
+ setPositionProperty(value, 'reset', 0);
+ }
}
- el.stopAuto();
- } else {
- // el.animate(property, 200);
- setPositionProperty(value, 'reset', 200);
- }
- }
- }
- slider.viewport.unbind('touchend MSPointerUp pointerup', onTouchEnd);
- if (slider.viewport.get(0).releasePointerCapture) {
- slider.viewport.get(0).releasePointerCapture(slider.pointerId);
- }
- };
+ }
- /**
- * Window resize event callback
- */
- var resizeWindow = function(e) {
- // don't do anything if slider isn't initialized.
- if (!slider.initialized) { return; }
- // Delay if slider working.
- if (slider.working) {
- window.setTimeout(resizeWindow, 10);
- } else {
- // get the new window dimens (again, thank you IE)
- var windowWidthNew = $(window).width(),
- windowHeightNew = $(window).height();
- // make sure that it is a true window resize
- // *we must check this because our dinosaur friend IE fires a window resize event when certain DOM elements
- // are resized. Can you just die already?*
- if (windowWidth !== windowWidthNew || windowHeight !== windowHeightNew) {
- // set the new window dimens
- windowWidth = windowWidthNew;
- windowHeight = windowHeightNew;
- // update all dynamic elements
- el.redrawSlider();
- // Call user resize handler
- slider.settings.onSliderResize.call(el, slider.active.index);
- }
- }
- };
+ /**
+ * Event handler for "touchend"
+ *
+ * @param e (event)
+ * - DOM event object
+ */
+ var onTouchEnd = function(e){
+ slider.viewport.unbind(slider.MOVE_EV, onTouchMove);
+ var orig = e.originalEvent;
+ var evt = slider.settings.SUPPORTS_TOUCH ? orig.changedTouches[0] : e;
+ var value = 0;
+ // record end x, y positions
+ slider.touch.end.x = evt.pageX;
+ slider.touch.end.y = evt.pageY;
+ // if fade mode, check if absolute x distance clears the threshold
+ if(slider.settings.mode == 'fade'){
+ var distance = Math.abs(slider.touch.start.x - slider.touch.end.x);
+ if(distance >= slider.settings.swipeThreshold){
+ slider.touch.start.x > slider.touch.end.x ? el.goToNextSlide() : el.goToPrevSlide();
+ el.stopAuto();
+ }
+ // not fade mode
+ }else{
+ var distance = 0;
+ // calculate distance and el's animate property
+ if(slider.settings.mode == 'horizontal'){
+ distance = slider.touch.end.x - slider.touch.start.x;
+ value = slider.touch.originalPos.left;
+ }else{
+ distance = slider.touch.end.y - slider.touch.start.y;
+ value = slider.touch.originalPos.top;
+ }
+ // if not infinite loop and first / last slide, do not attempt a slide transition
+ if(!slider.settings.infiniteLoop && ((slider.active.index == 0 && distance > 0) || (slider.active.last && distance < 0))){
+ setPositionProperty(value, 'reset', 200);
+ }else{
+ // check if distance clears threshold
+ if(Math.abs(distance) >= slider.settings.swipeThreshold){
+ distance < 0 ? el.goToNextSlide() : el.goToPrevSlide();
+ el.stopAuto();
+ }else{
+ // el.animate(property, 200);
+ setPositionProperty(value, 'reset', 200);
+ }
+ }
+ }
+ slider.viewport.unbind(slider.END_EV, onTouchEnd);
+ }
- /**
- * Adds an aria-hidden=true attribute to each element
- *
- * @param startVisibleIndex (int)
- * - the first visible element's index
- */
- var applyAriaHiddenAttributes = function(startVisibleIndex) {
- var numberOfSlidesShowing = getNumberSlidesShowing();
- // only apply attributes if the setting is enabled and not in ticker mode
- if (slider.settings.ariaHidden && !slider.settings.ticker) {
- // add aria-hidden=true to all elements
- slider.children.attr('aria-hidden', 'true');
- // get the visible elements and change to aria-hidden=false
- slider.children.slice(startVisibleIndex, startVisibleIndex + numberOfSlidesShowing).attr('aria-hidden', 'false');
- }
- };
+ /**
+ * Window resize event callback
+ */
+ var resizeWindow = function(e){
+ // get the new window dimens (again, thank you IE)
+ var windowWidthNew = $(window).width();
+ var windowHeightNew = $(window).height();
+ // make sure that it is a true window resize
+ // *we must check this because our dinosaur friend IE fires a window resize event when certain DOM elements
+ // are resized. Can you just die already?*
+ if(windowWidth != windowWidthNew || windowHeight != windowHeightNew){
+ // set the new window dimens
+ windowWidth = windowWidthNew;
+ windowHeight = windowHeightNew;
+ // update all dynamic elements
+ el.redrawSlider();
+ }
+ }
- /**
- * Returns index according to present page range
- *
- * @param slideOndex (int)
- * - the desired slide index
- */
- var setSlideIndex = function(slideIndex) {
- if (slideIndex < 0) {
- if (slider.settings.infiniteLoop) {
- return getPagerQty() - 1;
- }else {
- //we don't go to undefined slides
- return slider.active.index;
- }
- // if slideIndex is greater than children length, set active index to 0 (this happens during infinite loop)
- } else if (slideIndex >= getPagerQty()) {
- if (slider.settings.infiniteLoop) {
- return 0;
- } else {
- //we don't move to undefined pages
- return slider.active.index;
- }
- // set active index to requested slide
- } else {
- return slideIndex;
- }
- };
+ /**
+ * ===================================================================================
+ * = PUBLIC FUNCTIONS
+ * ===================================================================================
+ */
- /**
- * ===================================================================================
- * = PUBLIC FUNCTIONS
- * ===================================================================================
- */
+ /**
+ * Performs slide transition to the specified slide
+ *
+ * @param slideIndex (int)
+ * - the destination slide's index (zero-based)
+ *
+ * @param direction (string)
+ * - INTERNAL USE ONLY - the direction of travel ("prev" / "next")
+ */
+ el.goToSlide = function(slideIndex, direction, workignore){
+ // if plugin is currently in motion, ignore request
+ if( slider.active.index == slideIndex ) return;
+ if( !workignore && slider.working ) return;
- /**
- * Performs slide transition to the specified slide
- *
- * @param slideIndex (int)
- * - the destination slide's index (zero-based)
- *
- * @param direction (string)
- * - INTERNAL USE ONLY - the direction of travel ("prev" / "next")
- */
- el.goToSlide = function(slideIndex, direction) {
- // onSlideBefore, onSlideNext, onSlidePrev callbacks
- // Allow transition canceling based on returned value
- var performTransition = true,
- moveBy = 0,
- position = {left: 0, top: 0},
- lastChild = null,
- lastShowingIndex, eq, value, requestEl;
- // store the old index
- slider.oldIndex = slider.active.index;
- //set new index
- slider.active.index = setSlideIndex(slideIndex);
+ // declare that plugin is in motion
+ slider.working = true;
+ // store the old index
+ slider.oldIndex = slider.active.index;
+ // if slideIndex is less than zero, set active index to last child (this happens during infinite loop)
+ if(slideIndex < 0){
+ slider.active.index = getPagerQty() - 1;
+ // if slideIndex is greater than children length, set active index to 0 (this happens during infinite loop)
+ }else if(slideIndex >= getPagerQty()){
+ slider.active.index = 0;
+ // set active index to requested slide
+ }else{
+ slider.active.index = slideIndex;
+ }
+ // onSlideBefore, onSlideNext, onSlidePrev callbacks
+ slider.settings.onSlideBefore(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
+ if(direction == 'next'){
+ slider.settings.onSlideNext(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
+ }else if(direction == 'prev'){
+ slider.settings.onSlidePrev(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
+ }
+ // check if last slide
+ slider.active.last = slider.active.index >= getPagerQty() - 1;
+ // update the pager with active class
+ if(slider.settings.pager) updatePagerActive(slider.active.index);
+ // // check for direction control update
+ if(slider.settings.controls) updateDirectionControls();
+ // if slider is set to mode: "fade"
+ if(slider.settings.mode == 'fade'){
+ // if adaptiveHeight is true and next height is different from current height, animate to the new height
+ if(slider.settings.adaptiveHeight && slider.viewport.height() != getViewportHeight()){
+ slider.viewport.animate({height: getViewportHeight()}, slider.settings.adaptiveHeightSpeed);
+ }
+ // fade out the visible child and reset its z-index value
+ slider.children.filter(':visible').stop( true, true ).fadeOut(slider.settings.speed).css({zIndex: 0});
+ // fade in the newly requested slide
+ slider.children.eq(slider.active.index).css('zIndex', 51).stop( true, true ).fadeIn(slider.settings.speed, function(){
+ $(this).css('zIndex', 50);
+ updateAfterSlideTransition();
+ });
+ // slider mode is not "fade"
+ }else{
+ // if adaptiveHeight is true and next height is different from current height, animate to the new height
+ if(slider.settings.adaptiveHeight && slider.viewport.height() != getViewportHeight()){
+ slider.viewport.animate({height: getViewportHeight()}, slider.settings.adaptiveHeightSpeed);
+ }
+ var moveBy = 0;
+ var position = {left: 0, top: 0};
+ // if carousel and not infinite loop
+ if(!slider.settings.infiniteLoop && slider.carousel && slider.active.last){
+ if(slider.settings.mode == 'horizontal'){
+ // get the last child position
+ var lastChild = slider.children.eq(slider.children.length - 1);
+ position = lastChild.position();
+ // calculate the position of the last slide
+ moveBy = slider.viewport.width() - lastChild.outerWidth();
+ }else{
+ // get last showing index position
+ var lastShowingIndex = slider.children.length - slider.settings.minSlides;
+ position = slider.children.eq(lastShowingIndex).position();
+ }
+ // horizontal carousel, going previous while on first slide (infiniteLoop mode)
+ }else if(slider.carousel && slider.active.last && direction == 'prev'){
+ // get the last child position
+ var eq = slider.settings.moveSlides == 1 ? slider.settings.maxSlides - getMoveBy() : ((getPagerQty() - 1) * getMoveBy()) - (slider.children.length - slider.settings.maxSlides);
+ var lastChild = el.children('.bx-clone').eq(eq);
+ position = lastChild.position();
+ // if infinite loop and "Next" is clicked on the last slide
+ }else if(direction == 'next' && slider.active.index == 0){
+ // get the last clone position
+ position = el.find('> .bx-clone').eq(slider.settings.maxSlides).position();
+ slider.active.last = false;
+ // normal non-zero requests
+ }else if(slideIndex >= 0){
+ var requestEl = slideIndex * getMoveBy();
+ position = slider.children.eq(requestEl).position();
+ }
- // if plugin is currently in motion, ignore request
- if (slider.working || slider.active.index === slider.oldIndex) { return; }
- // declare that plugin is in motion
- slider.working = true;
+ /* If the position doesn't exist
+ * (e.g. if you destroy the slider on a next click),
+ * it doesn't throw an error.
+ */
+ if ("undefined" !== typeof(position)) {
+ var value = slider.settings.mode == 'horizontal' ? -(position.left - moveBy) : -position.top;
+ // plugin values to be animated
+ setPositionProperty(value, 'slide', slider.settings.speed);
+ }
+ }
+ }
- performTransition = slider.settings.onSlideBefore.call(el, slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
+ /**
+ * Transitions to the next slide in the show
+ */
+ el.goToNextSlide = function(){
+ // if infiniteLoop is false and last page is showing, disregard call
+ if (!slider.settings.infiniteLoop && slider.active.last) return;
+ var pagerIndex = parseInt(slider.active.index) + 1;
+ el.goToSlide(pagerIndex, 'next');
+ }
- // If transitions canceled, reset and return
- if (typeof (performTransition) !== 'undefined' && !performTransition) {
- slider.active.index = slider.oldIndex; // restore old index
- slider.working = false; // is not in motion
- return;
- }
+ /**
+ * Transitions to the prev slide in the show
+ */
+ el.goToPrevSlide = function(){
+ // if infiniteLoop is false and last page is showing, disregard call
+ if (!slider.settings.infiniteLoop && slider.active.index == 0) return;
+ var pagerIndex = parseInt(slider.active.index) - 1;
+ el.goToSlide(pagerIndex, 'prev');
+ }
- if (direction === 'next') {
- // Prevent canceling in future functions or lack there-of from negating previous commands to cancel
- if (!slider.settings.onSlideNext.call(el, slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index)) {
- performTransition = false;
- }
- } else if (direction === 'prev') {
- // Prevent canceling in future functions or lack there-of from negating previous commands to cancel
- if (!slider.settings.onSlidePrev.call(el, slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index)) {
- performTransition = false;
- }
- }
+ /**
+ * Starts the auto show
+ *
+ * @param preventControlUpdate (boolean)
+ * - if true, auto controls state will not be updated
+ */
+ el.startAuto = function(preventControlUpdate){
+ // if an interval already exists, disregard call
+ if(slider.interval) return;
+ // create an interval
+ slider.interval = setInterval(function(){
+ slider.settings.autoDirection == 'next' ? el.goToNextSlide() : el.goToPrevSlide();
+ }, el.pause);
- // check if last slide
- slider.active.last = slider.active.index >= getPagerQty() - 1;
- // update the pager with active class
- if (slider.settings.pager || slider.settings.pagerCustom) { updatePagerActive(slider.active.index); }
- // // check for direction control update
- if (slider.settings.controls) { updateDirectionControls(); }
- // if slider is set to mode: "fade"
- if (slider.settings.mode === 'fade') {
- // if adaptiveHeight is true and next height is different from current height, animate to the new height
- if (slider.settings.adaptiveHeight && slider.viewport.height() !== getViewportHeight()) {
- slider.viewport.animate({height: getViewportHeight()}, slider.settings.adaptiveHeightSpeed);
- }
- // fade out the visible child and reset its z-index value
- slider.children.filter(':visible').fadeOut(slider.settings.speed).css({zIndex: 0});
- // fade in the newly requested slide
- slider.children.eq(slider.active.index).css('zIndex', slider.settings.slideZIndex + 1).fadeIn(slider.settings.speed, function() {
- $(this).css('zIndex', slider.settings.slideZIndex);
- updateAfterSlideTransition();
- });
- // slider mode is not "fade"
- } else {
- // if adaptiveHeight is true and next height is different from current height, animate to the new height
- if (slider.settings.adaptiveHeight && slider.viewport.height() !== getViewportHeight()) {
- slider.viewport.animate({height: getViewportHeight()}, slider.settings.adaptiveHeightSpeed);
- }
- // if carousel and not infinite loop
- if (!slider.settings.infiniteLoop && slider.carousel && slider.active.last) {
- if (slider.settings.mode === 'horizontal') {
- // get the last child position
- lastChild = slider.children.eq(slider.children.length - 1);
- position = lastChild.position();
- // calculate the position of the last slide
- moveBy = slider.viewport.width() - lastChild.outerWidth();
- } else {
- // get last showing index position
- lastShowingIndex = slider.children.length - slider.settings.minSlides;
- position = slider.children.eq(lastShowingIndex).position();
- }
- // horizontal carousel, going previous while on first slide (infiniteLoop mode)
- } else if (slider.carousel && slider.active.last && direction === 'prev') {
- // get the last child position
- eq = slider.settings.moveSlides === 1 ? slider.settings.maxSlides - getMoveBy() : ((getPagerQty() - 1) * getMoveBy()) - (slider.children.length - slider.settings.maxSlides);
- lastChild = el.children('.bx-clone').eq(eq);
- position = lastChild.position();
- // if infinite loop and "Next" is clicked on the last slide
- } else if (direction === 'next' && slider.active.index === 0) {
- // get the last clone position
- position = el.find('> .bx-clone').eq(slider.settings.maxSlides).position();
- slider.active.last = false;
- // normal non-zero requests
- } else if (slideIndex >= 0) {
- //parseInt is applied to allow floats for slides/page
- requestEl = slideIndex * parseInt(getMoveBy());
- position = slider.children.eq(requestEl).position();
+ // if auto controls are displayed and preventControlUpdate is not true
+ if (slider.settings.autoControls && preventControlUpdate != true) updateAutoControls('stop');
+ }
+
+ /**
+ * Stops the auto show
+ *
+ * @param preventControlUpdate (boolean)
+ * - if true, auto controls state will not be updated
+ */
+ el.stopAuto = function(preventControlUpdate){
+ // if no interval exists, disregard call
+ if(!slider.interval) return;
+ // clear the interval
+ el.clearTimer();
+ slider.interval = null;
+ // if auto controls are displayed and preventControlUpdate is not true
+ if (slider.settings.autoControls && preventControlUpdate != true) updateAutoControls('start');
+ }
+
+ /**
+ * clear
+ */
+ el.clearTimer = function(){
+ clearInterval(slider.interval);
}
- /* If the position doesn't exist
- * (e.g. if you destroy the slider on a next click),
- * it doesn't throw an error.
- */
- if (typeof (position) !== 'undefined') {
- value = slider.settings.mode === 'horizontal' ? -(position.left - moveBy) : -position.top;
- // plugin values to be animated
- setPositionProperty(value, 'slide', slider.settings.speed);
- } else {
- slider.working = false;
- }
- }
- if (slider.settings.ariaHidden) { applyAriaHiddenAttributes(slider.active.index * getMoveBy()); }
- };
+ /**
+ * Returns current slide index (zero-based)
+ */
+ el.getCurrentSlide = function(){
+ return slider.active.index;
+ }
- /**
- * Transitions to the next slide in the show
- */
- el.goToNextSlide = function() {
- // if infiniteLoop is false and last page is showing, disregard call
- if (!slider.settings.infiniteLoop && slider.active.last) { return; }
- var pagerIndex = parseInt(slider.active.index) + 1;
- el.goToSlide(pagerIndex, 'next');
- };
+ /**
+ * Returns number of slides in show
+ */
+ el.getSlideCount = function(){
+ return slider.children.length;
+ }
- /**
- * Transitions to the prev slide in the show
- */
- el.goToPrevSlide = function() {
- // if infiniteLoop is false and last page is showing, disregard call
- if (!slider.settings.infiniteLoop && slider.active.index === 0) { return; }
- var pagerIndex = parseInt(slider.active.index) - 1;
- el.goToSlide(pagerIndex, 'prev');
- };
+ /**
+ * Update all dynamic slider elements
+ */
+ el.redrawSlider = function(){
+ // resize all children in ratio to new screen size
+ slider.children.add(el.find('.bx-clone')).outerWidth(getSlideWidth());
+ // adjust the height
+ slider.viewport.css('height', getViewportHeight());
+ // update the slide position
+ if(!slider.settings.ticker) setSlidePosition();
+ // if active.last was true before the screen resize, we want
+ // to keep it last no matter what screen size we end on
+ if (slider.active.last) slider.active.index = getPagerQty() - 1;
+ // if the active index (page) no longer exists due to the resize, simply set the index as last
+ if (slider.active.index >= getPagerQty()) slider.active.last = true;
+ // if a pager is being displayed and a custom pager is not being used, update it
+ if(slider.settings.pager && !slider.settings.pagerCustom){
+ populatePager();
+ updatePagerActive(slider.active.index);
+ }
+ }
- /**
- * Starts the auto show
- *
- * @param preventControlUpdate (boolean)
- * - if true, auto controls state will not be updated
- */
- el.startAuto = function(preventControlUpdate) {
- // if an interval already exists, disregard call
- if (slider.interval) { return; }
- // create an interval
- slider.interval = setInterval(function() {
- if (slider.settings.autoDirection === 'next') {
- el.goToNextSlide();
- } else {
- el.goToPrevSlide();
- }
- }, slider.settings.pause);
- // if auto controls are displayed and preventControlUpdate is not true
- if (slider.settings.autoControls && preventControlUpdate !== true) { updateAutoControls('stop'); }
- };
+ /**
+ * Destroy the current instance of the slider (revert everything back to original state)
+ */
+ el.destroySlider = function(){
+ // don't do anything if slider has already been destroyed
+ if(!slider.initialized) return;
+ slider.initialized = false;
+ $('.bx-clone', this).remove();
+ slider.children.each(function() {
+ $(this).data("origStyle") != undefined ? $(this).attr("style", $(this).data("origStyle")) : $(this).removeAttr('style');
+ });
+ $(this).data("origStyle") != undefined ? this.attr("style", $(this).data("origStyle")) : $(this).removeAttr('style');
+ $(this).unwrap().unwrap();
+ if(slider.controls.el) slider.controls.el.remove();
+ if(slider.controls.next) slider.controls.next.remove();
+ if(slider.controls.prev) slider.controls.prev.remove();
+ if(slider.pagerEl) slider.pagerEl.remove();
+ $('.bx-caption', this).remove();
+ if(slider.controls.autoEl) slider.controls.autoEl.remove();
+ el.clearTimer();
+ if(slider.settings.responsive) $(window).unbind('resize', resizeWindow);
+ }
- /**
- * Stops the auto show
- *
- * @param preventControlUpdate (boolean)
- * - if true, auto controls state will not be updated
- */
- el.stopAuto = function(preventControlUpdate) {
- // if no interval exists, disregard call
- if (!slider.interval) { return; }
- // clear the interval
- clearInterval(slider.interval);
- slider.interval = null;
- // if auto controls are displayed and preventControlUpdate is not true
- if (slider.settings.autoControls && preventControlUpdate !== true) { updateAutoControls('start'); }
- };
+ /**
+ * Reload the slider (revert all DOM changes, and re-initialize)
+ */
+ el.reloadSlider = function(settings){
+ if (settings != undefined) options = settings;
+ el.destroySlider();
+ init();
+ }
- /**
- * Returns current slide index (zero-based)
- */
- el.getCurrentSlide = function() {
- return slider.active.index;
- };
+ init();
- /**
- * Returns current slide element
- */
- el.getCurrentSlideElement = function() {
- return slider.children.eq(slider.active.index);
- };
+ // returns the current jQuery object
+ return this;
+ }
- /**
- * Returns a slide element
- * @param index (int)
- * - The index (zero-based) of the element you want returned.
- */
- el.getSlideElement = function(index) {
- return slider.children.eq(index);
- };
-
- /**
- * Returns number of slides in show
- */
- el.getSlideCount = function() {
- return slider.children.length;
- };
-
- /**
- * Return slider.working variable
- */
- el.isWorking = function() {
- return slider.working;
- };
-
- /**
- * Update all dynamic slider elements
- */
- el.redrawSlider = function() {
- // resize all children in ratio to new screen size
- slider.children.add(el.find('.bx-clone')).outerWidth(getSlideWidth());
- // adjust the height
- slider.viewport.css('height', getViewportHeight());
- // update the slide position
- if (!slider.settings.ticker) { setSlidePosition(); }
- // if active.last was true before the screen resize, we want
- // to keep it last no matter what screen size we end on
- if (slider.active.last) { slider.active.index = getPagerQty() - 1; }
- // if the active index (page) no longer exists due to the resize, simply set the index as last
- if (slider.active.index >= getPagerQty()) { slider.active.last = true; }
- // if a pager is being displayed and a custom pager is not being used, update it
- if (slider.settings.pager && !slider.settings.pagerCustom) {
- populatePager();
- updatePagerActive(slider.active.index);
- }
- if (slider.settings.ariaHidden) { applyAriaHiddenAttributes(slider.active.index * getMoveBy()); }
- };
-
- /**
- * Destroy the current instance of the slider (revert everything back to original state)
- */
- el.destroySlider = function() {
- // don't do anything if slider has already been destroyed
- if (!slider.initialized) { return; }
- slider.initialized = false;
- $('.bx-clone', this).remove();
- slider.children.each(function() {
- if ($(this).data('origStyle') !== undefined) {
- $(this).attr('style', $(this).data('origStyle'));
- } else {
- $(this).removeAttr('style');
- }
- });
- if ($(this).data('origStyle') !== undefined) {
- this.attr('style', $(this).data('origStyle'));
- } else {
- $(this).removeAttr('style');
- }
- $(this).unwrap().unwrap();
- if (slider.controls.el) { slider.controls.el.remove(); }
- if (slider.controls.next) { slider.controls.next.remove(); }
- if (slider.controls.prev) { slider.controls.prev.remove(); }
- if (slider.pagerEl && slider.settings.controls && !slider.settings.pagerCustom) { slider.pagerEl.remove(); }
- $('.bx-caption', this).remove();
- if (slider.controls.autoEl) { slider.controls.autoEl.remove(); }
- clearInterval(slider.interval);
- if (slider.settings.responsive) { $(window).unbind('resize', resizeWindow); }
- if (slider.settings.keyboardEnabled) { $(document).unbind('keydown', keyPress); }
- //remove self reference in data
- $(this).removeData('bxSlider');
- };
-
- /**
- * Reload the slider (revert all DOM changes, and re-initialize)
- */
- el.reloadSlider = function(settings) {
- if (settings !== undefined) { options = settings; }
- el.destroySlider();
- init();
- //store reference to self in order to access public functions later
- $(el).data('bxSlider', this);
- };
-
- init();
-
- $(el).data('bxSlider', this);
-
- // returns the current jQuery object
- return this;
- };
-
-})(jQuery);
+})(jQuery);
\ No newline at end of file