1/** 2 * jQuery bxSlider v3.0 3 * http://bxslider.com 4 * 5 * Copyright 2011, Steven Wanderski 6 * http://bxcreative.com 7 * 8 * Free to use and abuse under the MIT license. 9 * http://www.opensource.org/licenses/mit-license.php 10 * 11 */ 12 13 14(function($){ 15 16 $.fn.bxSlider = function(options){ 17 18 var defaults = { 19 mode: 'horizontal', // 'horizontal', 'vertical', 'fade' 20 infiniteLoop: true, // true, false - display first slide after last 21 hideControlOnEnd: false, // true, false - if true, will hide 'next' control on last slide and 'prev' control on first 22 controls: true, // true, false - previous and next controls 23 speed: 800, // integer - in ms, duration of time slide transitions will occupy 24 easing: 'swing', // used with jquery.easing.1.3.js - see http://gsgd.co.uk/sandbox/jquery/easing/ for available options 25 pager: false, // true / false - display a pager 26 pagerSelector: null, // jQuery selector - element to contain the pager. ex: '#pager' 27 pagerType: 'full', // 'full', 'short' - if 'full' pager displays 1,2,3... if 'short' pager displays 1 / 4 28 pagerLocation: 'bottom', // 'bottom', 'top' - location of pager 29 pagerShortSeparator: '/', // string - ex: 'of' pager would display 1 of 4 30 pagerActiveClass: 'pager-active', // string - classname attached to the active pager link 31 nextText: 'next', // string - text displayed for 'next' control 32 nextImage: '', // string - filepath of image used for 'next' control. ex: 'images/next.jpg' 33 nextSelector: null, // jQuery selector - element to contain the next control. ex: '#next' 34 prevText: 'prev', // string - text displayed for 'previous' control 35 prevImage: '', // string - filepath of image used for 'previous' control. ex: 'images/prev.jpg' 36 prevSelector: null, // jQuery selector - element to contain the previous control. ex: '#next' 37 captions: false, // true, false - display image captions (reads the image 'title' tag) 38 captionsSelector: null, // jQuery selector - element to contain the captions. ex: '#captions' 39 auto: false, // true, false - make slideshow change automatically 40 autoDirection: 'next', // 'next', 'prev' - direction in which auto show will traverse 41 autoControls: false, // true, false - show 'start' and 'stop' controls for auto show 42 autoControlsSelector: null, // jQuery selector - element to contain the auto controls. ex: '#auto-controls' 43 autoStart: true, // true, false - if false show will wait for 'start' control to activate 44 autoHover: false, // true, false - if true show will pause on mouseover 45 autoDelay: 0, // integer - in ms, the amount of time before starting the auto show 46 pause: 8000, // integer - in ms, the duration between each slide transition 47 startText: 'start', // string - text displayed for 'start' control 48 startImage: '', // string - filepath of image used for 'start' control. ex: 'images/start.jpg' 49 stopText: 'stop', // string - text displayed for 'stop' control 50 stopImage: '', // string - filepath of image used for 'stop' control. ex: 'images/stop.jpg' 51 ticker: false, // true, false - continuous motion ticker mode (think news ticker) 52 // note: autoControls, autoControlsSelector, and autoHover apply to ticker! 53 tickerSpeed: 5000, // float - use value between 1 and 5000 to determine ticker speed - the smaller the value the faster the ticker speed 54 tickerDirection: 'next', // 'next', 'prev' - direction in which ticker show will traverse 55 tickerHover: false, // true, false - if true ticker will pause on mouseover 56 wrapperClass: 'bx-wrapper', // string - classname attached to the slider wraper 57 startingSlide: 0, // integer - show will start on specified slide. note: slides are zero based! 58 displaySlideQty: 1, // integer - number of slides to display at once 59 moveSlideQty: 1, // integer - number of slides to move at once 60 randomStart: false, // true, false - if true show will start on a random slide 61 onBeforeSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlOb
61ject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 62 onAfterSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 63 onLastSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 64 onFirstSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 65 onNextSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 66 onPrevSlide: function(){}, // function(currentSlideNumber, totalSlideQty, currentSlideHtmlObject) - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 67 buildPager: null // function(slideIndex, slideHtmlObject){ return string; } - advanced use only! see the tutorial here: http://bxslider.com/custom-pager 68 } 69 70 var options = $.extend(defaults, options); 71 72 // cache the base element 73 var base = this; 74 // initialize (and localize) all variables 75 var $parent = ''; 76 var $origElement = ''; 77 var $children = ''; 78 var $outerWrapper = ''; 79 var $firstChild = ''; 80 var childrenWidth = ''; 81 var childrenOuterWidth = ''; 82 var wrapperWidth = ''; 83 var wrapperHeight = ''; 84 var $pager = ''; 85 var interval = ''; 86 var $autoControls = ''; 87 var $stopHtml = ''; 88 var $startContent = ''; 89 var $stopContent = ''; 90 var autoPlaying = true; 91 var loaded = false; 92 var childrenMaxWidth = 0; 93 var childrenMaxHeight = 0; 94 var currentSlide = 0; 95 var origLeft = 0; 96 var origTop = 0; 97 var origShowWidth = 0; 98 var origShowHeight = 0; 99 var tickerLeft = 0; 100 var tickerTop = 0; 101 var isWorking = false; 102 103 var firstSlide = 0; 104 var lastSlide = $children.length - 1; 105 106 107 // PUBLIC FUNCTIONS 108 109 /** 110 * Go to specified slide 111 */ 112 this.goToSlide = function(number, stopAuto){ 113 if(!isWorking){ 114 isWorking = true; 115 // set current slide to argument 116 currentSlide = number; 117 options.onBeforeSlide(currentSlide, $children.length, $children.eq(currentSlide)); 118 // check if stopAuto argument is supplied 119 if(typeof(stopAuto) == 'undefined'){ 120 var stopAuto = true; 121 } 122 if(stopAuto){ 123 // if show is auto playing, stop it 124 if(options.auto){ 125 base.stopShow(true); 126 } 127 } 128 slide = number; 129 // check for first slide callback 130 if(slide == firstSlide){ 131 options.onFirstSlide(currentSlide, $children.length, $children.eq(currentSlide)); 132 } 133 // check for last slide callback 134 if(slide == lastSlide){ 135 options.onLastSlide(currentSlide, $children.length, $children.eq(currentSlide)); 136 } 137 // horizontal 138 if(options.mode == 'horizontal'){ 139 $parent.animate({'left': '-'+getSlidePosition(slide, 'left')+'px'}, options.speed, options.easing, function(){ 140 isWorking = false; 141 // perform the callback function 142 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 143 }); 144 // vertical 145 }else if(options.mode == 'vertical'){ 146 $parent.animate({'top': '-'+getSlidePosition(slide, 'top')+'px'}, options.speed, options.easing, function(){ 147 isWorking = false; 148 // perform the callback function 149 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 150 }); 151 // fade 152 }else if(options.mode == 'fade'){ 153 setChildrenFade(); 154 } 155 // check to remove controls on last/first slide 156 checkEndControls(); 157 // accomodate multi slides 158 if(options.moveSlideQty > 1){ 159 number = Math.floor(number / options.moveSlideQty); 160 } 161 // make the current slide active 162 makeSlideActive(number); 163 // display the caption 164 showCaptions(); 165 } 166 } 167 168 /**
169 * Go to next slide 170 */ 171 this.goToNextSlide = function(stopAuto){ 172 // check if stopAuto argument is supplied 173 if(typeof(stopAuto) == 'undefined'){ 174 var stopAuto = true; 175 } 176 if(stopAuto){ 177 // if show is auto playing, stop it 178 if(options.auto){ 179 base.stopShow(true); 180 } 181 } 182 // makes slideshow finite 183 if(!options.infiniteLoop){ 184 if(!isWorking){ 185 var slideLoop = false; 186 // make current slide the old value plus moveSlideQty 187 currentSlide = (currentSlide + (options.moveSlideQty)); 188 // if current slide has looped on itself 189 if(currentSlide <= lastSlide){ 190 checkEndControls(); 191 // next slide callback 192 options.onNextSlide(currentSlide, $children.length, $children.eq(currentSlide)); 193 // move to appropriate slide 194 base.goToSlide(currentSlide); 195 }else{ 196 currentSlide -= options.moveSlideQty; 197 } 198 } // end if(!isWorking) 199 }else{ 200 if(!isWorking){ 201 isWorking = true; 202 var slideLoop = false; 203 // make current slide the old value plus moveSlideQty 204 currentSlide = (currentSlide + options.moveSlideQty); 205 // if current slide has looped on itself 206 if(currentSlide > lastSlide){ 207 currentSlide = currentSlide % $children.length; 208 slideLoop = true; 209 } 210 // next slide callback 211 options.onNextSlide(currentSlide, $children.length, $children.eq(currentSlide)); 212 // slide before callback 213 options.onBeforeSlide(currentSlide, $children.length, $children.eq(currentSlide)); 214 if(options.mode == 'horizontal'){ 215 // get the new 'left' property for $parent 216 var parentLeft = (options.moveSlideQty * childrenOuterWidth); 217 // animate to the new 'left' 218 $parent.animate({'left': '-='+parentLeft+'px'}, options.speed, options.easing, function(){ 219 isWorking = false; 220 // if its time to loop, reset the $parent 221 if(slideLoop){ 222 $parent.css('left', '-'+getSlidePosition(currentSlide, 'left')+'px'); 223 } 224 // perform the callback function 225 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 226 }); 227 }else if(options.mode == 'vertical'){ 228 // get the new 'left' property for $parent 229 var parentTop = (options.moveSlideQty * childrenMaxHeight); 230 // animate to the new 'left' 231 $parent.animate({'top': '-='+parentTop+'px'}, options.speed, options.easing, function(){ 232 isWorking = false; 233 // if its time to loop, reset the $parent 234 if(slideLoop){ 235 $parent.css('top', '-'+getSlidePosition(currentSlide, 'top')+'px'); 236 } 237 // perform the callback function 238 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 239 }); 240 }else if(options.mode == 'fade'){ 241 setChildrenFade(); 242 } 243 // make the current slide active 244 if(options.moveSlideQty > 1){ 245 makeSlideActive(Math.ceil(currentSlide / options.moveSlideQty)); 246 }else{ 247 makeSlideActive(currentSlide); 248 } 249 // display the caption 250 showCaptions(); 251 } // end if(!isWorking) 252 253 } 254 } // end function 255 256 /** 257 * Go to previous slide 258 */ 259 this.goToPreviousSlide = function(stopAuto){ 260 // check if stopAuto argument is supplied 261 if(typeof(stopAuto) == 'undefined'){ 262 var stopAuto = true; 263 } 264 if(stopAuto){ 265 // if show is auto playing, stop it 266 if(options.auto){ 267 base.stopShow(true); 268 } 269 } 270 // makes slideshow finite 271 if(!options.infiniteLoop){ 272 if(!isWorking){ 273 var slideLoop = false; 274 // make current slide the old value plus moveSlideQty 275 currentSlide = currentSlide - options.moveSlideQty; 276 // if current slide has looped on itself 277 if(currentSlide < 0){ 278 currentSlide = 0; 279 // if specified, hide the control on the last slide 280 if(options.hideControlOnEnd){ 281 $('.bx-prev', $outerWrapper).hide(); 282 } 283 } 284 checkEndControls(); 285 // next slide callback 286 options.onPrevSlide(currentSlide, $children.length, $children.eq(currentSlide)); 287 // move to appropriate slide 288 base.goToSlide(currentSlide); 289 } 290 }else{ 291 if(!isWorking){ 292 isWorking = true; 293 var slideLoop = false; 294 // make current slide the old value plus moveSlideQty 295 currentSlide = (currentSlide - (options.moveSlideQty)); 296 // if current slide has looped on itself
297 if(currentSlide < 0){ 298 negativeOffset = (currentSlide % $children.length); 299 if(negativeOffset == 0){ 300 currentSlide = 0; 301 }else{ 302 currentSlide = ($children.length) + negativeOffset; 303 } 304 slideLoop = true; 305 } 306 // next slide callback 307 options.onPrevSlide(currentSlide, $children.length, $children.eq(currentSlide)); 308 // slide before callback 309 options.onBeforeSlide(currentSlide, $children.length, $children.eq(currentSlide)); 310 if(options.mode == 'horizontal'){ 311 // get the new 'left' property for $parent 312 var parentLeft = (options.moveSlideQty * childrenOuterWidth); 313 // animate to the new 'left' 314 $parent.animate({'left': '+='+parentLeft+'px'}, options.speed, options.easing, function(){ 315 isWorking = false; 316 // if its time to loop, reset the $parent 317 if(slideLoop){ 318 $parent.css('left', '-'+getSlidePosition(currentSlide, 'left')+'px'); 319 } 320 // perform the callback function 321 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 322 }); 323 }else if(options.mode == 'vertical'){ 324 // get the new 'left' property for $parent 325 var parentTop = (options.moveSlideQty * childrenMaxHeight); 326 // animate to the new 'left' 327 $parent.animate({'top': '+='+parentTop+'px'}, options.speed, options.easing, function(){ 328 isWorking = false; 329 // if its time to loop, reset the $parent 330 if(slideLoop){ 331 $parent.css('top', '-'+getSlidePosition(currentSlide, 'top')+'px'); 332 } 333 // perform the callback function 334 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 335 }); 336 }else if(options.mode == 'fade'){ 337 setChildrenFade(); 338 } 339 // make the current slide active 340 if(options.moveSlideQty > 1){ 341 makeSlideActive(Math.ceil(currentSlide / options.moveSlideQty)); 342 }else{ 343 makeSlideActive(currentSlide); 344 } 345 // display the caption 346 showCaptions(); 347 } // end if(!isWorking) 348 } 349 } // end function 350 351 /** 352 * Go to first slide 353 */ 354 this.goToFirstSlide = function(stopAuto){ 355 // check if stopAuto argument is supplied 356 if(typeof(stopAuto) == 'undefined'){ 357 var stopAuto = true; 358 } 359 base.goToSlide(firstSlide, stopAuto); 360 } 361 362 /** 363 * Go to last slide 364 */ 365 this.goToLastSlide = function(){ 366 // check if stopAuto argument is supplied 367 if(typeof(stopAuto) == 'undefined'){ 368 var stopAuto = true; 369 } 370 base.goToSlide(lastSlide, stopAuto); 371 } 372 373 /** 374 * Get the current slide 375 */ 376 this.getCurrentSlide = function(){ 377 return currentSlide; 378 } 379 380 /** 381 * Get the total slide count 382 */ 383 this.getSlideCount = function(){ 384 return $children.length; 385 } 386 387 /** 388 * Stop the slideshow 389 */ 390 this.stopShow = function(changeText){ 391 clearInterval(interval); 392 // check if changeText argument is supplied 393 if(typeof(changeText) == 'undefined'){ 394 var changeText = true; 395 } 396 if(changeText && options.autoControls){ 397 $autoControls.html($startContent).removeClass('stop').addClass('start'); 398 autoPlaying = false; 399 } 400 } 401 402 /** 403 * Start the slideshow 404 */ 405 this.startShow = function(changeText){ 406 // check if changeText argument is supplied 407 if(typeof(changeText) == 'undefined'){ 408 var changeText = true; 409 } 410 setAutoInterval(); 411 if(changeText && options.autoControls){ 412 $autoControls.html($stopContent).removeClass('start').addClass('stop'); 413 autoPlaying = true; 414 } 415 } 416 417 /** 418 * Stops the ticker 419 */ 420 this.stopTicker = function(changeText){ 421 $parent.stop(); 422 // check if changeText argument is supplied 423 if(typeof(changeText) == 'undefined'){ 424 var changeText = true; 425 } 426 if(changeText && options.ticker){ 427 $autoControls.html($startContent).removeClass('stop').addClass('start'); 428 autoPlaying = false; 429 } 430 } 431 432 /** 433 * Starts the ticker 434 */
435 this.startTicker = function(changeText){ 436 if(options.mode == 'horizontal'){ 437 if(options.tickerDirection == 'next'){ 438 // get the 'left' property where the ticker stopped 439 var stoppedLeft = parseInt($parent.css('left')); 440 // calculate the remaining distance the show must travel until the loop 441 var remainingDistance = (origShowWidth + stoppedLeft) + $children.eq(0).width(); 442 }else if(options.tickerDirection == 'prev'){ 443 // get the 'left' property where the ticker stopped 444 var stoppedLeft = -parseInt($parent.css('left')); 445 // calculate the remaining distance the show must travel until the loop 446 var remainingDistance = (stoppedLeft) - $children.eq(0).width(); 447 } 448 // calculate the speed ratio to seamlessly finish the loop 449 var finishingSpeed = (remainingDistance * options.tickerSpeed) / origShowWidth; 450 // call the show 451 moveTheShow(tickerLeft, remainingDistance, finishingSpeed); 452 }else if(options.mode == 'vertical'){ 453 if(options.tickerDirection == 'next'){ 454 // get the 'top' property where the ticker stopped 455 var stoppedTop = parseInt($parent.css('top')); 456 // calculate the remaining distance the show must travel until the loop 457 var remainingDistance = (origShowHeight + stoppedTop) + $children.eq(0).height(); 458 }else if(options.tickerDirection == 'prev'){ 459 // get the 'left' property where the ticker stopped 460 var stoppedTop = -parseInt($parent.css('top')); 461 // calculate the remaining distance the show must travel until the loop 462 var remainingDistance = (stoppedTop) - $children.eq(0).height(); 463 } 464 // calculate the speed ratio to seamlessly finish the loop 465 var finishingSpeed = (remainingDistance * options.tickerSpeed) / origShowHeight; 466 // call the show 467 moveTheShow(tickerTop, remainingDistance, finishingSpeed); 468 // check if changeText argument is supplied 469 if(typeof(changeText) == 'undefined'){ 470 var changeText = true; 471 } 472 if(changeText && options.ticker){ 473 $autoControls.html($stopContent).removeClass('start').addClass('stop'); 474 autoPlaying = true; 475 } 476 } 477 } 478 479 /** 480 * Initialize a new slideshow 481 */ 482 this.initShow = function(){ 483 484 // reinitialize all variables 485 // base = this; 486 $parent = $(this); 487 $origElement = $parent.clone(); 488 $children = $parent.children(); 489 $outerWrapper = ''; 490 $firstChild = $parent.children(':first'); 491 childrenWidth = $firstChild.width(); 492 childrenMaxWidth = 0; 493 childrenOuterWidth = $firstChild.outerWidth(); 494 childrenMaxHeight = 0; 495 wrapperWidth = getWrapperWidth(); 496 wrapperHeight = getWrapperHeight(); 497 isWorking = false; 498 $pager = ''; 499 currentSlide = 0; 500 origLeft = 0; 501 origTop = 0; 502 interval = ''; 503 $autoControls = ''; 504 $stopHtml = ''; 505 $startContent = ''; 506 $stopContent = ''; 507 autoPlaying = true; 508 loaded = false; 509 origShowWidth = 0; 510 origShowHeight = 0; 511 tickerLeft = 0; 512 tickerTop = 0; 513 514 firstSlide = 0; 515 lastSlide = $children.length - 1; 516 517 // get the largest child's height and width 518 $children.each(function(index) { 519 if($(this).outerHeight() > childrenMaxHeight){ 520 childrenMaxHeight = $(this).outerHeight(); 521 } 522 if($(this).outerWidth() > childrenMaxWidth){ 523 childrenMaxWidth = $(this).outerWidth(); 524 } 525 }); 526 527 // get random slide number 528 if(options.randomStart){ 529 var randomNumber = Math.floor(Math.random() * $children.length); 530 currentSlide = randomNumber; 531 origLeft = childrenOuterWidth * (options.moveSlideQty + randomNumber); 532 origTop = childrenMaxHeight * (options.moveSlideQty + randomNumber); 533 // start show at specific slide 534 }else{ 535 currentSlide = options.startingSlide; 536 origLeft = childrenOuterWidth * (options.moveSlideQty + options.startingSlide); 537 origTop = childrenMaxHeight * (options.moveSlideQty + options.startingSlide); 538 } 539 540 // set initial css 541 initCss(); 542 543 // check to show pager 544 if(options.pager && !options.ticker){ 545 if(options.pagerType == 'full'){ 546 showPager('full'); 547 }else if(options.pagerType == 'short'){ 548 showPager('short'); 549 } 550 } 551 552 // check to show controls 553 if(options.controls && !options.ticker){ 554 setControlsVars(); 555 } 556 557 // check if auto 558 if(options.auto || options.ticker){ 559 // check if auto controls are displayed 560 if(options.autoControls){ 561 setAutoControlsVars(); 562 } 563 // check if show should auto start 564 if(options.autoStart){ 565 // check if autostart should delay 566 setTimeout(function(){ 567 base.startShow(true); 568 }, options.autoDelay); 569 }else{ 570 base.stopShow(true); 571 } 572 // check if show should pause on hover 573 if(options.autoHover && !options.ticker){ 574 setAutoHover(); 575 } 576 } 577 // make the starting slide active 578 if(options.moveSlideQty > 1){ 579 makeSlideActive(Math.ceil(currentSlide / options.moveSlideQty)); 580 }else{ 581 makeSlideActive(currentSlide); 582 } 583 // check for finite show and if controls should be hidden
584 checkEndControls(); 585 // show captions 586 if(options.captions){ 587 showCaptions(); 588 } 589 // perform the callback function 590 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 591 } 592 593 /** 594 * Destroy the current slideshow 595 */ 596 this.destroyShow = function(){ 597 // stop the auto show 598 clearInterval(interval); 599 // remove any controls / pagers that have been appended 600 $('.bx-next, .bx-prev, .bx-pager, .bx-auto', $outerWrapper).remove(); 601 // unwrap all bx-wrappers 602 $parent.unwrap().unwrap().removeAttr('style'); 603 // remove any styles that were appended 604 $parent.children().removeAttr('style').not('.pager').remove(); 605 // remove any childrent that were appended 606 $children.removeClass('pager'); 607 608 } 609 610 /** 611 * Reload the current slideshow 612 */ 613 this.reloadShow = function(){ 614 base.destroyShow(); 615 base.initShow(); 616 } 617 618 // PRIVATE FUNCTIONS 619 620 /** 621 * Creates all neccessary styling for the slideshow 622 */ 623 function initCss(){ 624 // layout the children 625 setChildrenLayout(options.startingSlide); 626 // CSS for horizontal mode 627 if(options.mode == 'horizontal'){ 628 // wrap the <ul> in div that acts as a window and make the <ul> uber wide 629 $parent 630 .wrap('<div class="'+options.wrapperClass+'" style="width:'+wrapperWidth+'px; position:relative;"></div>') 631 .wrap('<div class="bx-window" style="position:relative; overflow:hidden; width:'+wrapperWidth+'px;"></div>') 632 .css({ 633 width: '999999px', 634 position: 'relative', 635 left: '-'+(origLeft)+'px' 636 }); 637 $parent.children().css({ 638 width: childrenWidth, 639 'float': 'left', 640 listStyle: 'none' 641 }); 642 $outerWrapper = $parent.parent().parent(); 643 $children.addClass('pager'); 644 // CSS for vertical mode 645 }else if(options.mode == 'vertical'){ 646 // wrap the <ul> in div that acts as a window and make the <ul> uber tall 647 $parent 648 .wrap('<div class="'+options.wrapperClass+'" style="width:'+childrenMaxWidth+'px; position:relative;"></div>') 649 .wrap('<div class="bx-window" style="width:'+childrenMaxWidth+'px; height:'+wrapperHeight+'px; position:relative; overflow:hidden;"></div>') 650 .css({ 651 height: '999999px', 652 position: 'relative', 653 top: '-'+(origTop)+'px' 654 }); 655 $parent.children().css({ 656 listStyle: 'none', 657 height: childrenMaxHeight 658 }); 659 $outerWrapper = $parent.parent().parent(); 660 $children.addClass('pager'); 661 // CSS for fade mode 662 }else if(options.mode == 'fade'){ 663 // wrap the <ul> in div that acts as a window 664 $parent 665 .wrap('<div class="'+options.wrapperClass+'" style="width:'+childrenMaxWidth+'px; position:relative;"></div>') 666 .wrap('<div class="bx-window" style="height:'+childrenMaxHeight+'px; width:'+childrenMaxWidth+'px; position:relative; overflow:hidden;"></div>'); 667 $parent.children().css({ 668 listStyle: 'none', 669 position: 'absolute', 670 top: 0, 671 left: 0, 672 zIndex: 98 673 }); 674 $outerWrapper = $parent.parent().parent(); 675 $children.not(':eq('+currentSlide+')').fadeTo(0, 0); 676 $children.eq(currentSlide).css('zIndex', 99); 677 } 678 // if captions = true setup a div placeholder 679 if(options.captions && options.captionsSelector == null){ 680 $outerWrapper.append('<div class="bx-captions"></div>'); 681 } 682 } 683 684 /** 685 * Depending on mode, lays out children in the proper setup 686 */ 687 function setChildrenLayout(){ 688 // lays out children for horizontal or vertical modes 689 if(options.mode == 'horizontal' || options.mode == 'vertical'){ 690 691 // get the children behind 692 var $prependedChildren = getArraySample($children, 0, options.moveSlideQty, 'backward'); 693 694 // add each prepended child to the back of the original element 695 $.each($prependedChildren, function(index) { 696 $parent.prepend($(this)); 697 }); 698 699 // total number of slides to be hidden after the window 700 var totalNumberAfterWindow = ($children.length + options.moveSlideQty) - 1; 701 // number of original slides hidden after the window 702 var pagerExcess = $children.length - options.displaySlideQty; 703 // number of slides to append to the original hidden slides 704 var numberToAppend = totalNumberAfterWindow - pagerExcess; 705 // get the sample of extra slides to append 706 var $appendedChildren = getArraySample($children, 0, numberToAppend, 'forward'); 707 708 if(options.infiniteLoop){ 709 // add each appended child to the front of the original element 710 $.each($appendedChildren, function(index) { 711 $parent.append($(this)); 712 });
713 } 714 } 715 } 716 717 /** 718 * Sets all variables associated with the controls 719 */ 720 function setControlsVars(){ 721 // check if text or images should be used for controls 722 // check "next" 723 if(options.nextImage != ''){ 724 nextContent = options.nextImage; 725 nextType = 'image'; 726 }else{ 727 nextContent = options.nextText; 728 nextType = 'text'; 729 } 730 // check "prev" 731 if(options.prevImage != ''){ 732 prevContent = options.prevImage; 733 prevType = 'image'; 734 }else{ 735 prevContent = options.prevText; 736 prevType = 'text'; 737 } 738 // show the controls 739 showControls(nextType, nextContent, prevType, prevContent); 740 } 741 742 /** 743 * Puts slideshow into auto mode 744 * 745 * @param int pause number of ms the slideshow will wait between slides 746 * @param string direction 'forward', 'backward' sets the direction of the slideshow (forward/backward) 747 * @param bool controls determines if start/stop controls will be displayed 748 */ 749 function setAutoInterval(){ 750 if(options.auto){ 751 // finite loop 752 if(!options.infiniteLoop){ 753 if(options.autoDirection == 'next'){ 754 interval = setInterval(function(){ 755 currentSlide += options.moveSlideQty; 756 // if currentSlide has exceeded total number 757 if(currentSlide > lastSlide){ 758 currentSlide = currentSlide % $children.length; 759 } 760 base.goToSlide(currentSlide, false); 761 }, options.pause); 762 }else if(options.autoDirection == 'prev'){ 763 interval = setInterval(function(){ 764 currentSlide -= options.moveSlideQty; 765 // if currentSlide is smaller than zero 766 if(currentSlide < 0){ 767 negativeOffset = (currentSlide % $children.length); 768 if(negativeOffset == 0){ 769 currentSlide = 0; 770 }else{ 771 currentSlide = ($children.length) + negativeOffset; 772 } 773 } 774 base.goToSlide(currentSlide, false); 775 }, options.pause); 776 } 777 // infinite loop 778 }else{ 779 if(options.autoDirection == 'next'){ 780 interval = setInterval(function(){ 781 base.goToNextSlide(false); 782 }, options.pause); 783 }else if(options.autoDirection == 'prev'){ 784 interval = setInterval(function(){ 785 base.goToPreviousSlide(false); 786 }, options.pause); 787 } 788 } 789 790 }else if(options.ticker){ 791 792 options.tickerSpeed *= 10; 793 794 // get the total width of the original show 795 $('.pager', $outerWrapper).each(function(index) { 796 origShowWidth += $(this).width(); 797 origShowHeight += $(this).height(); 798 }); 799 800 // if prev start the show from the last slide 801 if(options.tickerDirection == 'prev' && options.mode == 'horizontal'){ 802 $parent.css('left', '-'+(origShowWidth+origLeft)+'px'); 803 }else if(options.tickerDirection == 'prev' && options.mode == 'vertical'){ 804 $parent.css('top', '-'+(origShowHeight+origTop)+'px'); 805 } 806 807 if(options.mode == 'horizontal'){ 808 // get the starting left position 809 tickerLeft = parseInt($parent.css('left')); 810 // start the ticker 811 moveTheShow(tickerLeft, origShowWidth, options.tickerSpeed); 812 }else if(options.mode == 'vertical'){ 813 // get the starting top position 814 tickerTop = parseInt($parent.css('top')); 815 // start the ticker 816 moveTheShow(tickerTop, origShowHeight, options.tickerSpeed); 817 } 818 819 // check it tickerHover applies 820 if(options.tickerHover){ 821 setTickerHover(); 822 } 823 } 824 } 825 826 function moveTheShow(leftCss, distance, speed){ 827 // if horizontal 828 if(options.mode == 'horizontal'){ 829 // if next 830 if(options.tickerDirection == 'next'){ 831 $parent.animate({'left': '-='+distance+'px'}, speed, 'linear', function(){ 832 $parent.css('left', leftCss); 833 moveTheShow(leftCss, origShowWidth, options.tickerSpeed); 834 }); 835 // if prev 836 }else if(options.tickerDirection == 'prev'){ 837 $parent.animate({'left': '+='+distance+'px'}, speed, 'linear', function(){ 838 $parent.css('left', leftCss); 839 moveTheShow(leftCss, origShowWidth, options.tickerSpeed); 840 });
841 } 842 // if vertical 843 }else if(options.mode == 'vertical'){ 844 // if next 845 if(options.tickerDirection == 'next'){ 846 $parent.animate({'top': '-='+distance+'px'}, speed, 'linear', function(){ 847 $parent.css('top', leftCss); 848 moveTheShow(leftCss, origShowHeight, options.tickerSpeed); 849 }); 850 // if prev 851 }else if(options.tickerDirection == 'prev'){ 852 $parent.animate({'top': '+='+distance+'px'}, speed, 'linear', function(){ 853 $parent.css('top', leftCss); 854 moveTheShow(leftCss, origShowHeight, options.tickerSpeed); 855 }); 856 } 857 } 858 } 859 860 /** 861 * Sets all variables associated with the controls 862 */ 863 function setAutoControlsVars(){ 864 // check if text or images should be used for controls 865 // check "start" 866 if(options.startImage != ''){ 867 startContent = options.startImage; 868 startType = 'image'; 869 }else{ 870 startContent = options.startText; 871 startType = 'text'; 872 } 873 // check "stop" 874 if(options.stopImage != ''){ 875 stopContent = options.stopImage; 876 stopType = 'image'; 877 }else{ 878 stopContent = options.stopText; 879 stopType = 'text'; 880 } 881 // show the controls 882 showAutoControls(startType, startContent, stopType, stopContent); 883 } 884 885 /** 886 * Handles hover events for auto shows 887 */ 888 function setAutoHover(){ 889 // hover over the slider window 890 $outerWrapper.find('.bx-window').hover(function() { 891 if(autoPlaying){ 892 base.stopShow(false); 893 } 894 }, function() { 895 if(autoPlaying){ 896 base.startShow(false); 897 } 898 }); 899 } 900 901 /** 902 * Handles hover events for ticker mode 903 */ 904 function setTickerHover(){ 905 // on hover stop the animation 906 $parent.hover(function() { 907 if(autoPlaying){ 908 base.stopTicker(false); 909 } 910 }, function() { 911 if(autoPlaying){ 912 base.startTicker(false); 913 } 914 }); 915 } 916 917 /** 918 * Handles fade animation 919 */ 920 function setChildrenFade(){ 921 // fade out any other child besides the current 922 $children.not(':eq('+currentSlide+')').fadeTo(options.speed, 0).css('zIndex', 98); 923 // fade in the current slide 924 $children.eq(currentSlide).css('zIndex', 99).fadeTo(options.speed, 1, function(){ 925 isWorking = false; 926 // ie fade fix 927 if(jQuery.browser.msie){ 928 $children.eq(currentSlide).get(0).style.removeAttribute('filter'); 929 } 930 // perform the callback function 931 options.onAfterSlide(currentSlide, $children.length, $children.eq(currentSlide)); 932 }); 933 }; 934 935 /** 936 * Makes slide active 937 */ 938 function makeSlideActive(number){ 939 if(options.pagerType == 'full' && options.pager){ 940 // remove all active classes 941 $('a', $pager).removeClass(options.pagerActiveClass); 942 // assign active class to appropriate slide 943 $('a', $pager).eq(number).addClass(options.pagerActiveClass); 944 }else if(options.pagerType == 'short' && options.pager){ 945 $('.bx-pager-current', $pager).html(currentSlide+1); 946 } 947 } 948 949 /** 950 * Displays next/prev controls 951 * 952 * @param string nextType 'image', 'text' 953 * @param string nextContent if type='image', specify a filepath to the image. if type='text', specify text. 954 * @param string prevType 'image', 'text' 955 * @param string prevContent if type='image', specify a filepath to the image. if type='text', specify text. 956 */ 957 function showControls(nextType, nextContent, prevType, prevContent){ 958 // create pager html elements 959 var $nextHtml = $('<a href="" class="bx-next"></a>'); 960 var $prevHtml = $('<a href="" class="bx-prev"></a>'); 961 // check if next is 'text' or 'image' 962 if(nextType == 'text'){ 963 $nextHtml.html(nextContent); 964 }else{ 965 $nextHtml.html('<img src="'+nextContent+'" />'); 966 } 967 // check if prev is 'text' or 'image' 968 if(prevType == 'text'){ 969 $prevHtml.html(prevContent); 970 }else{ 971 $prevHtml.html('<img src="'+prevContent+'" />'); 972 } 973 // check if user supplied a selector to populate next control 974 if(options.prevSelector){ 975 $(options.prevSelector).append($prevHtml); 976 }else{ 977 $outerWrapper.append($prevHtml); 978 } 979 // check if user supplied a selector to populate next control 980 if(options.nextSelector){ 981 $(options.nextSelector).append($nextHtml); 982 }else{ 983 $outerWrapper.append($nextHtml); 984 } 985 // click next control 986 $nextHtml.click(function() { 987 base.goToNextSlide(); 988 return false; 989 }); 990 // click prev control 991 $prevHtml.click(function() { 992 base.goToPreviousSlide(); 993 return false; 994 }); 995 } 996 997 /** 998 * Displays the pager 999 * 1000 * @param string type 'full', 'short' 1001 */ 1002 function showPager(type){ 1003 // sets up logic for finite multi slide shows 1004 var pagerQty = $children.length; 1005 // if we are moving more than one at a time and we have a finite loop 1006 if(options.moveSlideQty > 1){ 1007 // if slides create an odd number of pages 1008 if($children.length % options.moveSlideQty != 0){ 1009 // pagerQty = $children.length / options.moveSlideQty + 1; 1010 pagerQty = Math.ceil($children.length / options.moveSlideQty); 1011 // if slides create an even number of pages 1012 }else{ 1013 pagerQty = $children.length / options.moveSlideQty; 1014 } 1015 } 1016 var pagerString = ''; 1017 // check if custom build function was supplied 1018 if(options.buildPager){ 1019 for(var i=0; i<pagerQty; i++){ 1020 pagerString += options.buildPager(i, $children.eq(i * options.moveSlideQty)); 1021 } 1022 1023 // if not, use default pager 1024 }else if(type == 'full'){ 1025 // build the full pager 1026 for(var i=1; i<=pagerQty; i++){ 1027 pagerString += '<a href="" class="pager-link pager-'+i+'">'+i+'</a>'; 1028 } 1029 }else if(type == 'short') { 1030 // build the short pager 1031 pagerString = '<span class="bx-pager-current">'+(options.startingSlide+1)+'</span> '+options.pagerShortSeparator+' <span class="bx-pager-total">'+$children.length+'</span>'; 1032 } 1033 // check if user supplied a pager selector 1034 if(options.pagerSelector){ 1035 $(options.pagerSelector).append(pagerString); 1036 $pager = $(options.pagerSelector); 1037 }else{
1038 var $pagerContainer = $('<div class="bx-pager"></div>'); 1039 $pagerContainer.append(pagerString); 1040 // attach the pager to the DOM 1041 if(options.pagerLocation == 'top'){ 1042 $outerWrapper.prepend($pagerContainer); 1043 }else if(options.pagerLocation == 'bottom'){ 1044 $outerWrapper.append($pagerContainer); 1045 } 1046 // cache the pager element 1047 $pager = $('.bx-pager', $outerWrapper); 1048 } 1049 $pager.children().click(function() { 1050 // only if pager is full mode 1051 if(options.pagerType == 'full'){ 1052 // get the index from the link 1053 var slideIndex = $pager.children().index(this); 1054 // accomodate moving more than one slide 1055 if(options.moveSlideQty > 1){ 1056 slideIndex *= options.moveSlideQty; 1057 } 1058 base.goToSlide(slideIndex); 1059 } 1060 return false; 1061 }); 1062 } 1063 1064 /** 1065 * Displays captions 1066 */ 1067 function showCaptions(){ 1068 // get the title from each image 1069 var caption = $('img', $children.eq(currentSlide)).attr('title'); 1070 // if the caption exists 1071 if(caption != ''){ 1072 // if user supplied a selector 1073 if(options.captionsSelector){ 1074 $(options.captionsSelector).html(caption); 1075 }else{ 1076 $('.bx-captions', $outerWrapper).html(caption); 1077 } 1078 }else{ 1079 // if user supplied a selector 1080 if(options.captionsSelector){ 1081 $(options.captionsSelector).html(' '); 1082 }else{ 1083 $('.bx-captions', $outerWrapper).html(' '); 1084 } 1085 } 1086 } 1087 1088 /** 1089 * Displays start/stop controls for auto and ticker mode 1090 * 1091 * @param string type 'image', 'text' 1092 * @param string next [optional] if type='image', specify a filepath to the image. if type='text', specify text. 1093 * @param string prev [optional] if type='image', specify a filepath to the image. if type='text', specify text. 1094 */ 1095 function showAutoControls(startType, startContent, stopType, stopContent){ 1096 // create pager html elements 1097 $autoControls = $('<a href="" class="bx-start"></a>'); 1098 // check if start is 'text' or 'image' 1099 if(startType == 'text'){ 1100 $startContent = startContent; 1101 }else{ 1102 $startContent = '<img src="'+startContent+'" />'; 1103 } 1104 // check if stop is 'text' or 'image' 1105 if(stopType == 'text'){ 1106 $stopContent = stopContent; 1107 }else{ 1108 $stopContent = '<img src="'+stopContent+'" />'; 1109 } 1110 // check if user supplied a selector to populate next control 1111 if(options.autoControlsSelector){ 1112 $(options.autoControlsSelector).append($autoControls); 1113 }else{ 1114 $outerWrapper.append('<div class="bx-auto"></div>'); 1115 $('.bx-auto', $outerWrapper).html($autoControls); 1116 } 1117 1118 // click start control 1119 $autoControls.click(function() { 1120 if(options.ticker){ 1121 if($(this).hasClass('stop')){ 1122 base.stopTicker(); 1123 }else if($(this).hasClass('start')){ 1124 base.startTicker(); 1125 } 1126 }else{ 1127 if($(this).hasClass('stop')){ 1128 base.stopShow(true); 1129 }else if($(this).hasClass('start')){ 1130 base.startShow(true); 1131 } 1132 } 1133 return false; 1134 }); 1135 1136 } 1137 1138 /** 1139 * Checks if show is in finite mode, and if slide is either first or last, then hides the respective control 1140 */ 1141 function checkEndControls(){ 1142 if(!options.infiniteLoop && options.hideControlOnEnd){ 1143 // check previous 1144 if(currentSlide == firstSlide){ 1145 $('.bx-prev', $outerWrapper).hide(); 1146 }else{ 1147 $('.bx-prev', $outerWrapper).show(); 1148 } 1149 // check next 1150 if(currentSlide == lastSlide){ 1151 $('.bx-next', $outerWrapper).hide(); 1152 }else{ 1153 $('.bx-next', $outerWrapper).show(); 1154 } 1155 } 1156 } 1157 1158 /** 1159 * Returns the left offset of the slide from the parent container 1160 */ 1161 function getSlidePosition(number, side){ 1162 if(side == 'left'){ 1163 var position = $('.pager', $outerWrapper).eq(number).position().left; 1164 }else if(side == 'top'){ 1165 var position = $('.pager', $outerWrapper).eq(number).position().top; 1166 } 1167 return position; 1168 } 1169 1170 /** 1171 * Returns the width of the wrapper 1172 */ 1173 function getWrapperWidth(){
1174 var wrapperWidth = $firstChild.outerWidth() * options.displaySlideQty; 1175 return wrapperWidth; 1176 } 1177 1178 /** 1179 * Returns the height of the wrapper 1180 */ 1181 function getWrapperHeight(){ 1182 // if displaying multiple slides, multiple wrapper width by number of slides to display 1183 var wrapperHeight = $firstChild.outerHeight() * options.displaySlideQty; 1184 return wrapperHeight; 1185 } 1186 1187 /** 1188 * Returns a sample of an arry and loops back on itself if the end of the array is reached 1189 * 1190 * @param array array original array the sample is derived from 1191 * @param int start array index sample will start 1192 * @param int length number of items in the sample 1193 * @param string direction 'forward', 'backward' direction the loop should travel in the array 1194 */ 1195 function getArraySample(array, start, length, direction){ 1196 // initialize empty array 1197 var sample = []; 1198 // clone the length argument 1199 var loopLength = length; 1200 // determines when the empty array should start being populated 1201 var startPopulatingArray = false; 1202 // reverse the array if direction = 'backward' 1203 if(direction == 'backward'){ 1204 array = $.makeArray(array); 1205 array.reverse(); 1206 } 1207 // loop through original array until the length argument is met 1208 while(loopLength > 0){ 1209 // loop through original array 1210 $.each(array, function(index, val) { 1211 // check if length has been met 1212 if(loopLength > 0){ 1213 // don't do anything unless first index has been reached 1214 if(!startPopulatingArray){ 1215 // start populating empty array 1216 if(index == start){ 1217 startPopulatingArray = true; 1218 // add element to array 1219 sample.push($(this).clone()); 1220 // decrease the length clone variable 1221 loopLength--; 1222 } 1223 }else{ 1224 // add element to array 1225 sample.push($(this).clone()); 1226 // decrease the length clone variable 1227 loopLength--; 1228 } 1229 // if length has been met, break loose 1230 }else{ 1231 return false; 1232 } 1233 }); 1234 } 1235 return sample; 1236 } 1237 1238 this.each(function(){ 1239 // make sure the element has children 1240 if($(this).children().length > 0){ 1241 base.initShow(); 1242 } 1243 }); 1244 1245 return this; 1246 } 1247 1248 jQuery.fx.prototype.cur = function(){ 1249 if ( this.elem[this.prop] != null && (!this.elem.style || this.elem.style[this.prop] == null) ) { 1250 return this.elem[ this.prop ]; 1251 } 1252 1253 var r = parseFloat( jQuery.css( this.elem, this.prop ) ); 1254 // return r && r > -10000 ? r : 0; 1255 return r; 1256 } 1257 1258 1259})(jQuery); 1260
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.