Author: mgallegos Date: 2012-05-09 15:29:08 +0200 (Wed, 09 May 2012) New Revision: 312 Added: trunk/src/jquery.bxSlider.js Modified: trunk/wp-theme/mc2-form.php Log: Added: trunk/src/jquery.bxSlider.js =================================================================== --- trunk/src/jquery.bxSlider.js (rev 0) +++ trunk/src/jquery.bxSlider.js 2012-05-09 13:29:08 UTC (rev 312) @@ -0,0 +1,1260 @@ +/** + * jQuery bxSlider v3.0 + * http://bxslider.com + * + * Copyright 2011, Steven Wanderski + * http://bxcreative.com + * + * Free to use and abuse under the MIT license. + * http://www.opensource.org/licenses/mit-license.php + * + */ + + +(function($){ + + $.fn.bxSlider = function(options){ + + var defaults = { + mode: 'horizontal', // 'horizontal', 'vertical', 'fade' + infiniteLoop: true, // true, false - display first slide after last + hideControlOnEnd: false, // true, false - if true, will hide 'next' control on last slide and 'prev' control on first + controls: true, // true, false - previous and next controls + speed: 500, // integer - in ms, duration of time slide transitions will occupy + easing: 'swing', // used with jquery.easing.1.3.js - see http://gsgd.co.uk/sandbox/jquery/easing/ for available options + pager: false, // true / false - display a pager + pagerSelector: null, // jQuery selector - element to contain the pager. ex: '#pager' + pagerType: 'full', // 'full', 'short' - if 'full' pager displays 1,2,3... if 'short' pager displays 1 / 4 + pagerLocation: 'bottom', // 'bottom', 'top' - location of pager + pagerShortSeparator: '/', // string - ex: 'of' pager would display 1 of 4 + pagerActiveClass: 'pager-active', // string - classname attached to the active pager link + nextText: 'next', // string - text displayed for 'next' control + nextImage: '', // string - filepath of image used for 'next' control. ex: 'images/next.jpg' + nextSelector: null, // jQuery selector - element to contain the next control. ex: '#next' + prevText: 'prev', // string - text displayed for 'previous' control + prevImage: '', // string - filepath of image used for 'previous' control. ex: 'images/prev.jpg' + prevSelector: null, // jQuery selector - element to contain the previous control. ex: '#next' + captions: false, // true, false - display image captions (reads the image 'title' tag) + captionsSelector: null, // jQuery selector - element to contain the captions. ex: '#captions' + auto: false, // true, false - make slideshow change automatically + autoDirection: 'next', // 'next', 'prev' - direction in which auto show will traverse + autoControls: false, // true, false - show 'start' and 'stop' controls for auto show + autoControlsSelector: null, // jQuery selector - element to contain the auto controls. ex: '#auto-controls' + autoStart: true, // true, false - if false show will wait for 'start' control to activate + autoHover: false, // true, false - if true show will pause on mouseover + autoDelay: 0, // integer - in ms, the amount of time before starting the auto show + pause: 3000, // integer - in ms, the duration between each slide transition + startText: 'start', // string - text displayed for 'start' control + startImage: '', // string - filepath of image used for 'start' control. ex: 'images/start.jpg' + stopText: 'stop', // string - text displayed for 'stop' control + stopImage: '', // string - filepath of image used for 'stop' control. ex: 'images/stop.jpg' + ticker: false, // true, false - continuous motion ticker mode (think news ticker) + // note: autoControls, autoControlsSelector, and autoHover apply to ticker! + tickerSpeed: 5000, // float - use value between 1 and 5000 to determine ticker speed - the smaller the value the faster the ticker speed + tickerDirection: 'next', // 'next', 'prev' - direction in which ticker show will traverse + tickerHover: false, // true, false - if true ticker will pause on mouseover + wrapperClass: 'bx-wrapper', // string - classname attached to the slider wraper + startingSlide: 0, // integer - show will start on specified slide. note: slides are zero based! + displaySlideQty: 1, // integer - number of slides to display at once + moveSlideQty: 1, // integer - number of slides to move at once + randomStart: false, // true, false - if true show will start on a random slide + onBeforeSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + onAfterSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + onLastSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + onFirstSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + onNextSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + onPrevSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + buildPager: null // function(slideIndex, slideHtmlObject){ return string; } - advanced use only! see the tutorial here: http://bxslider.com/custom-pager + } + + var options = $.extend(defaults, options); + + // cache the base element + var base = this; + // initialize (and localize) all variables + var $parent = ''; + var $origElement = ''; + var $children = ''; + var $outerWrapper = ''; + var $firstChild = ''; + var childrenWidth = ''; + var childrenOuterWidth = ''; + var wrapperWidth = ''; + var wrapperHeight = ''; + var $pager = ''; + var interval = ''; + var $autoControls = ''; + var $stopHtml = ''; + var $startContent = ''; + var $stopContent = ''; + var autoPlaying = true; + var loaded = false; + var childrenMaxWidth = 0; + var childrenMaxHeight = 0; + var currentSlide = 0; + var origLeft = 0; + var origTop = 0; + var origShowWidth = 0; + var origShowHeight = 0; + var tickerLeft = 0; + var tickerTop = 0; + var isWorking = false; + + var firstSlide = 0; + var lastSlide = $children.length - 1; + + + // PUBLIC FUNCTIONS + + /** + * Go to specified slide + */ + this.goToSlide = function(number, stopAuto){ + if(!isWorking){ + isWorking = true; + // set current slide to argument + currentSlide = number; + options.onBeforeSlide(currentSlide, $children.length, $children.eq(currentSlide)); + // check if stopAuto argument is supplied + if(typeof(stopAuto) == 'undefined'){ + var stopAuto = true; + } + if(stopAuto){ + // if show is auto playing, stop it + if(options.auto){ + base.stopShow(true); + } + } + slide = number; + // check for first slide callback + if(slide == firstSlide){ + options.onFirstSlide(currentSlide, $children.length, $children.eq(currentSlide)); + } + // check for last slide callback + if(slide == lastSlide){ + options.onLastSlide(currentSlide, $children.length, $children.eq(currentSlide)); + } + // horizontal + if(options.mode == 'horizontal'){ + $parent.animate({'left': '-'+getSlidePosition(slide, 'left')+'px'}, options.speed, options.easing, function(){ + isWorking = false; + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + // vertical + }else if(options.mode == 'vertical'){ + $parent.animate({'top': '-'+getSlidePosition(slide, 'top')+'px'}, options.speed, options.easing, function(){ + isWorking = false; + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + // fade + }else if(options.mode == 'fade'){ + setChildrenFade(); + } + // check to remove controls on last/first slide + checkEndControls(); + // accomodate multi slides + if(options.moveSlideQty > 1){ + number = Math.floor(number / options.moveSlideQty); + } + // make the current slide active + makeSlideActive(number); + // display the caption + showCaptions(); + } + } + + /** + * Go to next slide + */ + this.goToNextSlide = function(stopAuto){ + // check if stopAuto argument is supplied + if(typeof(stopAuto) == 'undefined'){ + var stopAuto = true; + } + if(stopAuto){ + // if show is auto playing, stop it + if(options.auto){ + base.stopShow(true); + } + } + // makes slideshow finite + if(!options.infiniteLoop){ + if(!isWorking){ + var slideLoop = false; + // make current slide the old value plus moveSlideQty + currentSlide = (currentSlide + (options.moveSlideQty)); + // if current slide has looped on itself + if(currentSlide <= lastSlide){ + checkEndControls(); + // next slide callback + options.onNextSlide(currentSlide, $children.length, $children.eq(currentSlide)); + // move to appropriate slide + base.goToSlide(currentSlide); + }else{ + currentSlide -= options.moveSlideQty; + } + } // end if(!isWorking) + }else{ + if(!isWorking){ + isWorking = true; + var slideLoop = false; + // make current slide the old value plus moveSlideQty + currentSlide = (currentSlide + options.moveSlideQty); + // if current slide has looped on itself + if(currentSlide > lastSlide){ + currentSlide = currentSlide % $children.length; + slideLoop = true; + } + // next slide callback + options.onNextSlide(currentSlide, $children.length, $children.eq(currentSlide)); + // slide before callback + options.onBeforeSlide(currentSlide, $children.length, $children.eq(currentSlide)); + if(options.mode == 'horizontal'){ + // get the new 'left' property for $parent + var parentLeft = (options.moveSlideQty * childrenOuterWidth); + // animate to the new 'left' + $parent.animate({'left': '-='+parentLeft+'px'}, options.speed, options.easing, function(){ + isWorking = false; + // if its time to loop, reset the $parent + if(slideLoop){ + $parent.css('left', '-'+getSlidePosition(currentSlide, 'left')+'px'); + } + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + }else if(options.mode == 'vertical'){ + // get the new 'left' property for $parent + var parentTop = (options.moveSlideQty * childrenMaxHeight); + // animate to the new 'left' + $parent.animate({'top': '-='+parentTop+'px'}, options.speed, options.easing, function(){ + isWorking = false; + // if its time to loop, reset the $parent + if(slideLoop){ + $parent.css('top', '-'+getSlidePosition(currentSlide, 'top')+'px'); + } + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + }else if(options.mode == 'fade'){ + setChildrenFade(); + } + // make the current slide active + if(options.moveSlideQty > 1){ + makeSlideActive(Math.ceil(currentSlide / options.moveSlideQty)); + }else{ + makeSlideActive(currentSlide); + } + // display the caption + showCaptions(); + } // end if(!isWorking) + + } + } // end function + + /** + * Go to previous slide + */ + this.goToPreviousSlide = function(stopAuto){ + // check if stopAuto argument is supplied + if(typeof(stopAuto) == 'undefined'){ + var stopAuto = true; + } + if(stopAuto){ + // if show is auto playing, stop it + if(options.auto){ + base.stopShow(true); + } + } + // makes slideshow finite + if(!options.infiniteLoop){ + if(!isWorking){ + var slideLoop = false; + // make current slide the old value plus moveSlideQty + currentSlide = currentSlide - options.moveSlideQty; + // if current slide has looped on itself + if(currentSlide < 0){ + currentSlide = 0; + // if specified, hide the control on the last slide + if(options.hideControlOnEnd){ + $('.bx-prev', $outerWrapper).hide(); + } + } + checkEndControls(); + // next slide callback + options.onPrevSlide(currentSlide, $children.length, $children.eq(currentSlide)); + // move to appropriate slide + base.goToSlide(currentSlide); + } + }else{ + if(!isWorking){ + isWorking = true; + var slideLoop = false; + // make current slide the old value plus moveSlideQty + currentSlide = (currentSlide - (options.moveSlideQty)); + // if current slide has looped on itself + if(currentSlide < 0){ + negativeOffset = (currentSlide % $children.length); + if(negativeOffset == 0){ + currentSlide = 0; + }else{ + currentSlide = ($children.length) + negativeOffset; + } + slideLoop = true; + } + // next slide callback + options.onPrevSlide(currentSlide, $children.length, $children.eq(currentSlide)); + // slide before callback + options.onBeforeSlide(currentSlide, $children.length, $children.eq(currentSlide)); + if(options.mode == 'horizontal'){ + // get the new 'left' property for $parent + var parentLeft = (options.moveSlideQty * childrenOuterWidth); + // animate to the new 'left' + $parent.animate({'left': '+='+parentLeft+'px'}, options.speed, options.easing, function(){ + isWorking = false; + // if its time to loop, reset the $parent + if(slideLoop){ + $parent.css('left', '-'+getSlidePosition(currentSlide, 'left')+'px'); + } + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + }else if(options.mode == 'vertical'){ + // get the new 'left' property for $parent + var parentTop = (options.moveSlideQty * childrenMaxHeight); + // animate to the new 'left' + $parent.animate({'top': '+='+parentTop+'px'}, options.speed, options.easing, function(){ + isWorking = false; + // if its time to loop, reset the $parent + if(slideLoop){ + $parent.css('top', '-'+getSlidePosition(currentSlide, 'top')+'px'); + } + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + }else if(options.mode == 'fade'){ + setChildrenFade(); + } + // make the current slide active + if(options.moveSlideQty > 1){ + makeSlideActive(Math.ceil(currentSlide / options.moveSlideQty)); + }else{ + makeSlideActive(currentSlide); + } + // display the caption + showCaptions(); + } // end if(!isWorking) + } + } // end function + + /** + * Go to first slide + */ + this.goToFirstSlide = function(stopAuto){ + // check if stopAuto argument is supplied + if(typeof(stopAuto) == 'undefined'){ + var stopAuto = true; + } + base.goToSlide(firstSlide, stopAuto); + } + + /** + * Go to last slide + */ + this.goToLastSlide = function(){ + // check if stopAuto argument is supplied + if(typeof(stopAuto) == 'undefined'){ + var stopAuto = true; + } + base.goToSlide(lastSlide, stopAuto); + } + + /** + * Get the current slide + */ + this.getCurrentSlide = function(){ + return currentSlide; + } + + /** + * Get the total slide count + */ + this.getSlideCount = function(){ + return $children.length; + } + + /** + * Stop the slideshow + */ + this.stopShow = function(changeText){ + clearInterval(interval); + // check if changeText argument is supplied + if(typeof(changeText) == 'undefined'){ + var changeText = true; + } + if(changeText && options.autoControls){ + $autoControls.html($startContent).removeClass('stop').addClass('start'); + autoPlaying = false; + } + } + + /** + * Start the slideshow + */ + this.startShow = function(changeText){ + // check if changeText argument is supplied + if(typeof(changeText) == 'undefined'){ + var changeText = true; + } + setAutoInterval(); + if(changeText && options.autoControls){ + $autoControls.html($stopContent).removeClass('start').addClass('stop'); + autoPlaying = true; + } + } + + /** + * Stops the ticker + */ + this.stopTicker = function(changeText){ + $parent.stop(); + // check if changeText argument is supplied + if(typeof(changeText) == 'undefined'){ + var changeText = true; + } + if(changeText && options.ticker){ + $autoControls.html($startContent).removeClass('stop').addClass('start'); + autoPlaying = false; + } + } + + /** + * Starts the ticker + */ + this.startTicker = function(changeText){ + if(options.mode == 'horizontal'){ + if(options.tickerDirection == 'next'){ + // get the 'left' property where the ticker stopped + var stoppedLeft = parseInt($parent.css('left')); + // calculate the remaining distance the show must travel until the loop + var remainingDistance = (origShowWidth + stoppedLeft) + $children.eq(0).width(); + }else if(options.tickerDirection == 'prev'){ + // get the 'left' property where the ticker stopped + var stoppedLeft = -parseInt($parent.css('left')); + // calculate the remaining distance the show must travel until the loop + var remainingDistance = (stoppedLeft) - $children.eq(0).width(); + } + // calculate the speed ratio to seamlessly finish the loop + var finishingSpeed = (remainingDistance * options.tickerSpeed) / origShowWidth; + // call the show + moveTheShow(tickerLeft, remainingDistance, finishingSpeed); + }else if(options.mode == 'vertical'){ + if(options.tickerDirection == 'next'){ + // get the 'top' property where the ticker stopped + var stoppedTop = parseInt($parent.css('top')); + // calculate the remaining distance the show must travel until the loop + var remainingDistance = (origShowHeight + stoppedTop) + $children.eq(0).height(); + }else if(options.tickerDirection == 'prev'){ + // get the 'left' property where the ticker stopped + var stoppedTop = -parseInt($parent.css('top')); + // calculate the remaining distance the show must travel until the loop + var remainingDistance = (stoppedTop) - $children.eq(0).height(); + } + // calculate the speed ratio to seamlessly finish the loop + var finishingSpeed = (remainingDistance * options.tickerSpeed) / origShowHeight; + // call the show + moveTheShow(tickerTop, remainingDistance, finishingSpeed); + // check if changeText argument is supplied + if(typeof(changeText) == 'undefined'){ + var changeText = true; + } + if(changeText && options.ticker){ + $autoControls.html($stopContent).removeClass('start').addClass('stop'); + autoPlaying = true; + } + } + } + + /** + * Initialize a new slideshow + */ + this.initShow = function(){ + + // reinitialize all variables + // base = this; + $parent = $(this); + $origElement = $parent.clone(); + $children = $parent.children(); + $outerWrapper = ''; + $firstChild = $parent.children(':first'); + childrenWidth = $firstChild.width(); + childrenMaxWidth = 0; + childrenOuterWidth = $firstChild.outerWidth(); + childrenMaxHeight = 0; + wrapperWidth = getWrapperWidth(); + wrapperHeight = getWrapperHeight(); + isWorking = false; + $pager = ''; + currentSlide = 0; + origLeft = 0; + origTop = 0; + interval = ''; + $autoControls = ''; + $stopHtml = ''; + $startContent = ''; + $stopContent = ''; + autoPlaying = true; + loaded = false; + origShowWidth = 0; + origShowHeight = 0; + tickerLeft = 0; + tickerTop = 0; + + firstSlide = 0; + lastSlide = $children.length - 1; + + // get the largest child's height and width + $children.each(function(index) { + if($(this).outerHeight() > childrenMaxHeight){ + childrenMaxHeight = $(this).outerHeight(); + } + if($(this).outerWidth() > childrenMaxWidth){ + childrenMaxWidth = $(this).outerWidth(); + } + }); + + // get random slide number + if(options.randomStart){ + var randomNumber = Math.floor(Math.random() * $children.length); + currentSlide = randomNumber; + origLeft = childrenOuterWidth * (options.moveSlideQty + randomNumber); + origTop = childrenMaxHeight * (options.moveSlideQty + randomNumber); + // start show at specific slide + }else{ + currentSlide = options.startingSlide; + origLeft = childrenOuterWidth * (options.moveSlideQty + options.startingSlide); + origTop = childrenMaxHeight * (options.moveSlideQty + options.startingSlide); + } + + // set initial css + initCss(); + + // check to show pager + if(options.pager && !options.ticker){ + if(options.pagerType == 'full'){ + showPager('full'); + }else if(options.pagerType == 'short'){ + showPager('short'); + } + } + + // check to show controls + if(options.controls && !options.ticker){ + setControlsVars(); + } + + // check if auto + if(options.auto || options.ticker){ + // check if auto controls are displayed + if(options.autoControls){ + setAutoControlsVars(); + } + // check if show should auto start + if(options.autoStart){ + // check if autostart should delay + setTimeout(function(){ + base.startShow(true); + }, options.autoDelay); + }else{ + base.stopShow(true); + } + // check if show should pause on hover + if(options.autoHover && !options.ticker){ + setAutoHover(); + } + } + // make the starting slide active + if(options.moveSlideQty > 1){ + makeSlideActive(Math.ceil(currentSlide / options.moveSlideQty)); + }else{ + makeSlideActive(currentSlide); + } + // check for finite show and if controls should be hidden + checkEndControls(); + // show captions + if(options.captions){ + showCaptions(); + } + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + } + + /** + * Destroy the current slideshow + */ + this.destroyShow = function(){ + // stop the auto show + clearInterval(interval); + // remove any controls / pagers that have been appended + $('.bx-next, .bx-prev, .bx-pager, .bx-auto', $outerWrapper).remove(); + // unwrap all bx-wrappers + $parent.unwrap().unwrap().removeAttr('style'); + // remove any styles that were appended + $parent.children().removeAttr('style').not('.pager').remove(); + // remove any childrent that were appended + $children.removeClass('pager'); + + } + + /** + * Reload the current slideshow + */ + this.reloadShow = function(){ + base.destroyShow(); + base.initShow(); + } + + // PRIVATE FUNCTIONS + + /** + * Creates all neccessary styling for the slideshow + */ + function initCss(){ + // layout the children + setChildrenLayout(options.startingSlide); + // CSS for horizontal mode + if(options.mode == 'horizontal'){ + // wrap the <ul> in div that acts as a window and make the <ul> uber wide + $parent + .wrap('<div class="'+options.wrapperClass+'" style="width:'+wrapperWidth+'px; position:relative;"></div>') + .wrap('<div class="bx-window" style="position:relative; overflow:hidden; width:'+wrapperWidth+'px;"></div>') + .css({ + width: '999999px', + position: 'relative', + left: '-'+(origLeft)+'px' + }); + $parent.children().css({ + width: childrenWidth, + 'float': 'left', + listStyle: 'none' + }); + $outerWrapper = $parent.parent().parent(); + $children.addClass('pager'); + // CSS for vertical mode + }else if(options.mode == 'vertical'){ + // wrap the <ul> in div that acts as a window and make the <ul> uber tall + $parent + .wrap('<div class="'+options.wrapperClass+'" style="width:'+childrenMaxWidth+'px; position:relative;"></div>') + .wrap('<div class="bx-window" style="width:'+childrenMaxWidth+'px; height:'+wrapperHeight+'px; position:relative; overflow:hidden;"></div>') + .css({ + height: '999999px', + position: 'relative', + top: '-'+(origTop)+'px' + }); + $parent.children().css({ + listStyle: 'none', + height: childrenMaxHeight + }); + $outerWrapper = $parent.parent().parent(); + $children.addClass('pager'); + // CSS for fade mode + }else if(options.mode == 'fade'){ + // wrap the <ul> in div that acts as a window + $parent + .wrap('<div class="'+options.wrapperClass+'" style="width:'+childrenMaxWidth+'px; position:relative;"></div>') + .wrap('<div class="bx-window" style="height:'+childrenMaxHeight+'px; width:'+childrenMaxWidth+'px; position:relative; overflow:hidden;"></div>'); + $parent.children().css({ + listStyle: 'none', + position: 'absolute', + top: 0, + left: 0, + zIndex: 98 + }); + $outerWrapper = $parent.parent().parent(); + $children.not(':eq('+currentSlide+')').fadeTo(0, 0); + $children.eq(currentSlide).css('zIndex', 99); + } + // if captions = true setup a div placeholder + if(options.captions && options.captionsSelector == null){ + $outerWrapper.append('<div class="bx-captions"></div>'); + } + } + + /** + * Depending on mode, lays out children in the proper setup + */ + function setChildrenLayout(){ + // lays out children for horizontal or vertical modes + if(options.mode == 'horizontal' || options.mode == 'vertical'){ + + // get the children behind + var $prependedChildren = getArraySample($children, 0, options.moveSlideQty, 'backward'); + + // add each prepended child to the back of the original element + $.each($prependedChildren, function(index) { + $parent.prepend($(this)); + }); + + // total number of slides to be hidden after the window + var totalNumberAfterWindow = ($children.length + options.moveSlideQty) - 1; + // number of original slides hidden after the window + var pagerExcess = $children.length - options.displaySlideQty; + // number of slides to append to the original hidden slides + var numberToAppend = totalNumberAfterWindow - pagerExcess; + // get the sample of extra slides to append + var $appendedChildren = getArraySample($children, 0, numberToAppend, 'forward'); + + if(options.infiniteLoop){ + // add each appended child to the front of the original element + $.each($appendedChildren, function(index) { + $parent.append($(this)); + }); + } + } + } + + /** + * Sets all variables associated with the controls + */ + function setControlsVars(){ + // check if text or images should be used for controls + // check "next" + if(options.nextImage != ''){ + nextContent = options.nextImage; + nextType = 'image'; + }else{ + nextContent = options.nextText; + nextType = 'text'; + } + // check "prev" + if(options.prevImage != ''){ + prevContent = options.prevImage; + prevType = 'image'; + }else{ + prevContent = options.prevText; + prevType = 'text'; + } + // show the controls + showControls(nextType, nextContent, prevType, prevContent); + } + + /** + * Puts slideshow into auto mode + * + * @param int pause number of ms the slideshow will wait between slides + * @param string direction 'forward', 'backward' sets the direction of the slideshow (forward/backward) + * @param bool controls determines if start/stop controls will be displayed + */ + function setAutoInterval(){ + if(options.auto){ + // finite loop + if(!options.infiniteLoop){ + if(options.autoDirection == 'next'){ + interval = setInterval(function(){ + currentSlide += options.moveSlideQty; + // if currentSlide has exceeded total number + if(currentSlide > lastSlide){ + currentSlide = currentSlide % $children.length; + } + base.goToSlide(currentSlide, false); + }, options.pause); + }else if(options.autoDirection == 'prev'){ + interval = setInterval(function(){ + currentSlide -= options.moveSlideQty; + // if currentSlide is smaller than zero + if(currentSlide < 0){ + negativeOffset = (currentSlide % $children.length); + if(negativeOffset == 0){ + currentSlide = 0; + }else{ + currentSlide = ($children.length) + negativeOffset; + } + } + base.goToSlide(currentSlide, false); + }, options.pause); + } + // infinite loop + }else{ + if(options.autoDirection == 'next'){ + interval = setInterval(function(){ + base.goToNextSlide(false); + }, options.pause); + }else if(options.autoDirection == 'prev'){ + interval = setInterval(function(){ + base.goToPreviousSlide(false); + }, options.pause); + } + } + + }else if(options.ticker){ + + options.tickerSpeed *= 10; + + // get the total width of the original show + $('.pager', $outerWrapper).each(function(index) { + origShowWidth += $(this).width(); + origShowHeight += $(this).height(); + }); + + // if prev start the show from the last slide + if(options.tickerDirection == 'prev' && options.mode == 'horizontal'){ + $parent.css('left', '-'+(origShowWidth+origLeft)+'px'); + }else if(options.tickerDirection == 'prev' && options.mode == 'vertical'){ + $parent.css('top', '-'+(origShowHeight+origTop)+'px'); + } + + if(options.mode == 'horizontal'){ + // get the starting left position + tickerLeft = parseInt($parent.css('left')); + // start the ticker + moveTheShow(tickerLeft, origShowWidth, options.tickerSpeed); + }else if(options.mode == 'vertical'){ + // get the starting top position + tickerTop = parseInt($parent.css('top')); + // start the ticker + moveTheShow(tickerTop, origShowHeight, options.tickerSpeed); + } + + // check it tickerHover applies + if(options.tickerHover){ + setTickerHover(); + } + } + } + + function moveTheShow(leftCss, distance, speed){ + // if horizontal + if(options.mode == 'horizontal'){ + // if next + if(options.tickerDirection == 'next'){ + $parent.animate({'left': '-='+distance+'px'}, speed, 'linear', function(){ + $parent.css('left', leftCss); + moveTheShow(leftCss, origShowWidth, options.tickerSpeed); + }); + // if prev + }else if(options.tickerDirection == 'prev'){ + $parent.animate({'left': '+='+distance+'px'}, speed, 'linear', function(){ + $parent.css('left', leftCss); + moveTheShow(leftCss, origShowWidth, options.tickerSpeed); + }); + } + // if vertical + }else if(options.mode == 'vertical'){ + // if next + if(options.tickerDirection == 'next'){ + $parent.animate({'top': '-='+distance+'px'}, speed, 'linear', function(){ + $parent.css('top', leftCss); + moveTheShow(leftCss, origShowHeight, options.tickerSpeed); + }); + // if prev + }else if(options.tickerDirection == 'prev'){ + $parent.animate({'top': '+='+distance+'px'}, speed, 'linear', function(){ + $parent.css('top', leftCss); + moveTheShow(leftCss, origShowHeight, options.tickerSpeed); + }); + } + } + } + + /** + * Sets all variables associated with the controls + */ + function setAutoControlsVars(){ + // check if text or images should be used for controls + // check "start" + if(options.startImage != ''){ + startContent = options.startImage; + startType = 'image'; + }else{ + startContent = options.startText; + startType = 'text'; + } + // check "stop" + if(options.stopImage != ''){ + stopContent = options.stopImage; + stopType = 'image'; + }else{ + stopContent = options.stopText; + stopType = 'text'; + } + // show the controls + showAutoControls(startType, startContent, stopType, stopContent); + } + + /** + * Handles hover events for auto shows + */ + function setAutoHover(){ + // hover over the slider window + $outerWrapper.find('.bx-window').hover(function() { + if(autoPlaying){ + base.stopShow(false); + } + }, function() { + if(autoPlaying){ + base.startShow(false); + } + }); + } + + /** + * Handles hover events for ticker mode + */ + function setTickerHover(){ + // on hover stop the animation + $parent.hover(function() { + if(autoPlaying){ + base.stopTicker(false); + } + }, function() { + if(autoPlaying){ + base.startTicker(false); + } + }); + } + + /** + * Handles fade animation + */ + function setChildrenFade(){ + // fade out any other child besides the current + $children.not(':eq('+currentSlide+')').fadeTo(options.speed, 0).css('zIndex', 98); + // fade in the current slide + $children.eq(currentSlide).css('zIndex', 99).fadeTo(options.speed, 1, function(){ + isWorking = false; + // ie fade fix + if(jQuery.browser.msie){ + $children.eq(currentSlide).get(0).style.removeAttribute('filter'); + } + // perform the callback function + options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); + }); + }; + + /** + * Makes slide active + */ + function makeSlideActive(number){ + if(options.pagerType == 'full' && options.pager){ + // remove all active classes + $('a', $pager).removeClass(options.pagerActiveClass); + // assign active class to appropriate slide + $('a', $pager).eq(number).addClass(options.pagerActiveClass); + }else if(options.pagerType == 'short' && options.pager){ + $('.bx-pager-current', $pager).html(currentSlide+1); + } + } + + /** + * Displays next/prev controls + * + * @param string nextType 'image', 'text' + * @param string nextContent if type='image', specify a filepath to the image. if type='text', specify text. + * @param string prevType 'image', 'text' + * @param string prevContent if type='image', specify a filepath to the image. if type='text', specify text. + */ + function showControls(nextType, nextContent, prevType, prevContent){ + // create pager html elements + var $nextHtml = $('<a href="" class="bx-next"></a>'); + var $prevHtml = $('<a href="" class="bx-prev"></a>'); + // check if next is 'text' or 'image' + if(nextType == 'text'){ + $nextHtml.html(nextContent); + }else{ + $nextHtml.html('<img src="'+nextContent+'" />'); + } + // check if prev is 'text' or 'image' + if(prevType == 'text'){ + $prevHtml.html(prevContent); + }else{ + $prevHtml.html('<img src="'+prevContent+'" />'); + } + // check if user supplied a selector to populate next control + if(options.prevSelector){ + $(options.prevSelector).append($prevHtml); + }else{ + $outerWrapper.append($prevHtml); + } + // check if user supplied a selector to populate next control + if(options.nextSelector){ + $(options.nextSelector).append($nextHtml); + }else{ + $outerWrapper.append($nextHtml); + } + // click next control + $nextHtml.click(function() { + base.goToNextSlide(); + return false; + }); + // click prev control + $prevHtml.click(function() { + base.goToPreviousSlide(); + return false; + }); + } + + /** + * Displays the pager + * + * @param string type 'full', 'short' + */ + function showPager(type){ + // sets up logic for finite multi slide shows + var pagerQty = $children.length; + // if we are moving more than one at a time and we have a finite loop + if(options.moveSlideQty > 1){ + // if slides create an odd number of pages + if($children.length % options.moveSlideQty != 0){ + // pagerQty = $children.length / options.moveSlideQty + 1; + pagerQty = Math.ceil($children.length / options.moveSlideQty); + // if slides create an even number of pages + }else{ + pagerQty = $children.length / options.moveSlideQty; + } + } + var pagerString = ''; + // check if custom build function was supplied + if(options.buildPager){ + for(var i=0; i<pagerQty; i++){ + pagerString += options.buildPager(i, $children.eq(i * options.moveSlideQty)); + } + + // if not, use default pager + }else if(type == 'full'){ + // build the full pager + for(var i=1; i<=pagerQty; i++){ + pagerString += '<a href="" class="pager-link pager-'+i+'">'+i+'</a>'; + } + }else if(type == 'short') { + // build the short pager + pagerString = '<span class="bx-pager-current">'+(options.startingSlide+1)+'</span> '+options.pagerShortSeparator+' <span class="bx-pager-total">'+$children.length+'</span>'; + } + // check if user supplied a pager selector + if(options.pagerSelector){ + $(options.pagerSelector).append(pagerString); + $pager = $(options.pagerSelector); + }else{ + var $pagerContainer = $('<div class="bx-pager"></div>'); + $pagerContainer.append(pagerString); + // attach the pager to the DOM + if(options.pagerLocation == 'top'){ + $outerWrapper.prepend($pagerContainer); + }else if(options.pagerLocation == 'bottom'){ + $outerWrapper.append($pagerContainer); + } + // cache the pager element + $pager = $('.bx-pager', $outerWrapper); + } + $pager.children().click(function() { + // only if pager is full mode + if(options.pagerType == 'full'){ + // get the index from the link + var slideIndex = $pager.children().index(this); + // accomodate moving more than one slide + if(options.moveSlideQty > 1){ + slideIndex *= options.moveSlideQty; + } + base.goToSlide(slideIndex); + } + return false; + }); + } + + /** + * Displays captions + */ + function showCaptions(){ + // get the title from each image + var caption = $('img', $children.eq(currentSlide)).attr('title'); + // if the caption exists + if(caption != ''){ + // if user supplied a selector + if(options.captionsSelector){ + $(options.captionsSelector).html(caption); + }else{ + $('.bx-captions', $outerWrapper).html(caption); + } + }else{ + // if user supplied a selector + if(options.captionsSelector){ + $(options.captionsSelector).html(' '); + }else{ + $('.bx-captions', $outerWrapper).html(' '); + } + } + } + + /** + * Displays start/stop controls for auto and ticker mode + * + * @param string type 'image', 'text' + * @param string next [optional] if type='image', specify a filepath to the image. if type='text', specify text. + * @param string prev [optional] if type='image', specify a filepath to the image. if type='text', specify text. + */ + function showAutoControls(startType, startContent, stopType, stopContent){ + // create pager html elements + $autoControls = $('<a href="" class="bx-start"></a>'); + // check if start is 'text' or 'image' + if(startType == 'text'){ + $startContent = startContent; + }else{ + $startContent = '<img src="'+startContent+'" />'; + } + // check if stop is 'text' or 'image' + if(stopType == 'text'){ + $stopContent = stopContent; + }else{ + $stopContent = '<img src="'+stopContent+'" />'; + } + // check if user supplied a selector to populate next control + if(options.autoControlsSelector){ + $(options.autoControlsSelector).append($autoControls); + }else{ + $outerWrapper.append('<div class="bx-auto"></div>'); + $('.bx-auto', $outerWrapper).html($autoControls); + } + + // click start control + $autoControls.click(function() { + if(options.ticker){ + if($(this).hasClass('stop')){ + base.stopTicker(); + }else if($(this).hasClass('start')){ + base.startTicker(); + } + }else{ + if($(this).hasClass('stop')){ + base.stopShow(true); + }else if($(this).hasClass('start')){ + base.startShow(true); + } + } + return false; + }); + + } + + /** + * Checks if show is in finite mode, and if slide is either first or last, then hides the respective control + */ + function checkEndControls(){ + if(!options.infiniteLoop && options.hideControlOnEnd){ + // check previous + if(currentSlide == firstSlide){ + $('.bx-prev', $outerWrapper).hide(); + }else{ + $('.bx-prev', $outerWrapper).show(); + } + // check next + if(currentSlide == lastSlide){ + $('.bx-next', $outerWrapper).hide(); + }else{ + $('.bx-next', $outerWrapper).show(); + } + } + } + + /** + * Returns the left offset of the slide from the parent container + */ + function getSlidePosition(number, side){ + if(side == 'left'){ + var position = $('.pager', $outerWrapper).eq(number).position().left; + }else if(side == 'top'){ + var position = $('.pager', $outerWrapper).eq(number).position().top; + } + return position; + } + + /** + * Returns the width of the wrapper + */ + function getWrapperWidth(){ + var wrapperWidth = $firstChild.outerWidth() * options.displaySlideQty; + return wrapperWidth; + } + + /** + * Returns the height of the wrapper + */ + function getWrapperHeight(){ + // if displaying multiple slides, multiple wrapper width by number of slides to display + var wrapperHeight = $firstChild.outerHeight() * options.displaySlideQty; + return wrapperHeight; + } + + /** + * Returns a sample of an arry and loops back on itself if the end of the array is reached + * + * @param array array original array the sample is derived from + * @param int start array index sample will start + * @param int length number of items in the sample + * @param string direction 'forward', 'backward' direction the loop should travel in the array + */ + function getArraySample(array, start, length, direction){ + // initialize empty array + var sample = []; + // clone the length argument + var loopLength = length; + // determines when the empty array should start being populated + var startPopulatingArray = false; + // reverse the array if direction = 'backward' + if(direction == 'backward'){ + array = $.makeArray(array); + array.reverse(); + } + // loop through original array until the length argument is met + while(loopLength > 0){ + // loop through original array + $.each(array, function(index, val) { + // check if length has been met + if(loopLength > 0){ + // don't do anything unless first index has been reached + if(!startPopulatingArray){ + // start populating empty array + if(index == start){ + startPopulatingArray = true; + // add element to array + sample.push($(this).clone()); + // decrease the length clone variable + loopLength--; + } + }else{ + // add element to array + sample.push($(this).clone()); + // decrease the length clone variable + loopLength--; + } + // if length has been met, break loose + }else{ + return false; + } + }); + } + return sample; + } + + this.each(function(){ + // make sure the element has children + if($(this).children().length > 0){ + base.initShow(); + } + }); + + return this; + } + + jQuery.fx.prototype.cur = function(){ + if ( this.elem[this.prop] != null && (!this.elem.style || this.elem.style[this.prop] == null) ) { + return this.elem[ this.prop ]; + } + + var r = parseFloat( jQuery.css( this.elem, this.prop ) ); + // return r && r > -10000 ? r : 0; + return r; + } + + +})(jQuery); + Property changes on: trunk/src/jquery.bxSlider.js ___________________________________________________________________ Name: svn:executable + * Modified: trunk/wp-theme/mc2-form.php =================================================================== --- trunk/wp-theme/mc2-form.php 2012-05-09 13:24:26 UTC (rev 311) +++ trunk/wp-theme/mc2-form.php 2012-05-09 13:29:08 UTC (rev 312) @@ -303,7 +303,7 @@ <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="/mc/0.1/jquery.tagsinput.min.js"></script> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js'></script> -<script type='text/javascript' src='/mc/0.1/jquery.bxSlider.min.js'></script> +<script type='text/javascript' src='/mc/0.1/jquery.bxSlider.js'></script> <script type='text/javascript' src='/mc/0.1/jquery.infieldlabel.min.js'></script> <script type='text/javascript' src='/mc/0.1/jquery.blockUI.js'></script> <script type="text/javascript" src="/mc/0.1/mc-dia-form2.js"></script>