1/* 2 3 Supersized - Fullscreen Slideshow jQuery Plugin 4 Version : 3.2.7 5 Site : www.buildinternet.com/project/supersized 6 7 Author : Sam Dunn 8 Company : One Mighty Roar (www.onemightyroar.com) 9 License : MIT License / GPL License 10 11*/ 12 13(function($){ 14 15 /* Place Supersized Elements 16 ----------------------------*/ 17 $(document).ready(function() { 18 $('body').append('<div id="supersized-loader"></div><ul id="supersized"></ul>'); 19 }); 20 21 22 $.supersized = function(options){ 23 24 /* Variables 25 ----------------------------*/ 26 var el = '#supersized', 27 base = this; 28 // Access to jQuery and DOM versions of element 29 base.$el = $(el); 30 base.el = el; 31 vars = $.supersized.vars; 32 // Add a reverse reference to the DOM object 33 base.$el.data("supersized", base); 34 api = base.$el.data('supersized'); 35 36 base.init = function(){ 37 // Combine options and vars 38 $.supersized.vars = $.extend($.supersized.vars, $.supersized.themeVars); 39 $.supersized.vars.options = $.extend({},$.supersized.defaultOptions, $.supersized.themeOptions, options); 40 base.options = $.supersized.vars.options; 41 42 base._build(); 43 }; 44 45 46 /* Build Elements 47 ----------------------------*/ 48 base._build = function(){ 49 // Add in slide markers 50 var thisSlide = 0, 51 slideSet = '', 52 markers = '', 53 markerContent, 54 thumbMarkers = '', 55 thumbImage; 56 57 while(thisSlide <= base.options.slides.length-1){ 58 //Determine slide link content 59 switch(base.options.slide_links){ 60 case 'num': 61 markerContent = thisSlide +1; 62 break; 63 case 'name': 64 markerContent = base.options.slides[thisSlide].title; 65 break; 66 case 'blank': 67 markerContent = ''; 68 break; 69 } 70 71 slideSet = slideSet+'<li class="slide-'+thisSlide+'"></li>'; 72 73 if(thisSlide == base.options.start_slide-1){ 74 // Slide links 75 if (base.options.slide_links)markers = markers+'<li class="slide-link-'+thisSlide+' current-slide"><a>'+markerContent+'</a></li>'; 76 // Slide Thumbnail Links 77 if (base.options.thumb_links){ 78 base.options.slides[thisSlide].thumb ? thumbImage = base.options.slides[thisSlide].thumb : thumbImage = base.options.slides[thisSlide].image; 79 thumbMarkers = thumbMarkers+'<li class="thumb'+thisSlide+' current-thumb"><img src="'+thumbImage+'"/></li>'; 80 }; 81 }else{ 82 // Slide links 83 if (base.options.slide_links) markers = markers+'<li class="slide-link-'+thisSlide+'" ><a>'+markerContent+'</a></li>'; 84 // Slide Thumbnail Links 85 if (base.options.thumb_links){ 86 base.options.slides[thisSlide].thumb ? thumbImage = base.options.slides[thisSlide].thumb : thumbImage = base.options.slides[thisSlide].image; 87 thumbMarkers = thumbMarkers+'<li class="thumb'+thisSlide+'"><img src="'+thumbImage+'"/></li>'; 88 }; 89 } 90 thisSlide++; 91 } 92 93 if (base.options.slide_links) $(vars.slide_list).html(markers); 94 if (base.options.thumb_links && vars.thumb_tray.length){ 95 $(vars.thumb_tray).append('<ul id="'+vars.thumb_list.replace('#','')+'">'+thumbMarkers+'</ul>'); 96 } 97 98 $(base.el).append(slideSet); 99 100 // Add in thumbnails 101 if (base.options.thumbnail_navigation){ 102 // Load previous thumbnail 103 vars.current_slide - 1 < 0 ? prevThumb = base.options.slides.length - 1 : prevThumb = vars.current_slide - 1; 104 $(vars.prev_thumb).show().html($("<img/>").attr("src", base.options.slides[prevThumb].image)); 105 106 // Load next thumbnail 107 vars.current_slide == base.options.slides.length - 1 ? nextThumb = 0 : nextThumb = vars.current_slide + 1; 108 $(vars.next_thumb).show().html($("<img/>").attr("src", base.options.slides[nextThumb].image)); 109 } 110 111 base._start(); // Get things started 112 }; 113 114 115 /* Initialize 116 ----------------------------*/ 117 base._start = function(){ 118 119 // Determine if starting slide random 120 if (base.options.start_slide){ 121 vars.current_slide = base.options.start_slide - 1; 122 }else{ 123 vars.current_slide = Math.floor(Math.random()*base.options.slides.length); // Generate random slide number 124 } 125 126 // If links should open in new window 127 var linkTarget = base.options.new_window ? ' target="_blank"' : ''; 128 129 // Set slideshow quality (Supported only in FF and IE, no Webkit) 130 if (base.options.performance == 3){ 131 base.$el.addClass('speed'); // Faster transitions 132 } else if ((base.options.performance == 1) || (base.options.performance == 2)){ 133 base.$el.addClass('quality'); // Higher image quality 134 } 135 136 // Shuffle slide order if needed 137 if (base.options.random){ 138 arr = base.options.slides; 139 for(var j, x, i = arr.length; i; j = parseInt(Math.random() * i), x = arr[--i], arr[i] = arr[j], arr[j] = x); // Fisher-Yates shuffle algorithm (jsfromhell.com/array/shuffle) 140 base.options.slides = arr; 141 } 142 143 /*-----Load initial set of images-----*/ 144 145 if (base.options.slides.length > 1){ 146 if(base.options.slides.length > 2){ 147 // Set previous image 148 vars.current_slide - 1 < 0 ? loadPrev = base.options.slides.length - 1 : loadPrev = vars.current_slide - 1; // If slide is 1, load last slide as previous 149 var imageLink = (base.options.slides[loadPrev].url) ? "href='" + base.options.slides[loadPrev].url + "'" : ""; 150 151 var imgPrev = $('<img src="'+base.options.slides[loadPrev].image+'"/>'); 152 var slidePrev = base.el+' li:eq('+loadPrev+')'; 153 imgPrev.appendTo(slidePrev).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading prevslide'); 154 155 imgPrev.load(function(){ 156 $(this).data('origWidth', $(this).width()).data('origHeight', $(this).height()); 157 base.resizeNow(); // Resize background image 158 }); // End Load 159 } 160 } else { 161 // Slideshow turned off if there is only one slide 162 base.options.slideshow = 0; 163 } 164 165 // Set current image 166 imageLink = (api.getField('url')) ? "href='" + api.getField('url') + "'" : ""; 167 var img = $('<img src="'+api.getField('image')+'"/>'); 168 169 var slideCurrent= base.el+' li:eq('+vars.current_slide+')'; 170 img.appendTo(slideCurrent).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading activeslide'); 171 172 img.load(function(){ 173 base._origDim($(this)); 174 base.resizeNow(); // Resize background image 175 base.launch(); 176 if( typeof theme != 'undefined' && typeof theme._init == "function" ) theme._init(); // Load Theme 177 }); 178 179 if (base.options.slides.length > 1){ 180 // Set next image 181 vars.current_slide == base.options.slides.length - 1 ? loadNext = 0 : loadNext = vars.current_slide + 1; // If slide is last, load first slide as next 182 imageLink = (base.options.slides[loadNext].url) ? "href='" + base.options.slides[loadNext].url + "'" : ""; 183 184 var imgNext = $('<img src="'+base.options.slides[loadNext].image+'"/>'); 185 var slideNext = base.el+' li:eq('+loadNext+')'; 186 imgNext.appendTo(slideNext).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading'); 187 188 imgNext.load(function(){ 189 $(this).data('origWidth', $(this).width()).data('origHeight', $(this).height()); 190 base.resizeNow(); // Resize background image 191 }); // End Load 192 } 193 /*-----End load initial images-----*/ 194 195 // Hide elements to be faded in 196 base.$el.css('visibility','hidden'); 197 $('.load-item').hide(); 198 199 }; 200 201 202 /* Launch Supersized 203 ----------------------------*/ 204 base.launch = function(){ 205 206 base.$el.css('visibility','visible'); 207 $('#supersized-loader').remove(); //Hide loading animation 208 209 // Call theme function for before slide transition 210 if( typeof theme != 'undefined' && typeof theme.beforeAnimation == "function" ) theme.beforeAnimation('next'); 211 $('.load-item').show(); 212 213 // Keyboard Navigation 214 if (base.options.keyboard_nav){ 215 $(document.documentElement).keyup(function (event) { 216 217 if(vars.in_animation) return false; // Abort if currently animating 218 if($(document.activeElement).is("input, textarea")) return false; // Abort if active element is an input or a textarea. 219 220 // Left Arrow or Down Arrow 221 if ((event.keyCode == 37) || (event.keyCode == 40)) { 222 clearInterval(vars.slideshow_interval); // Stop slideshow, prevent buildup 223 base.prevSlide(); 224 225 // Right Arrow or Up Arrow 226 } else if ((event.keyCode == 39) || (event.keyCode == 38)) { 227 clearInterval(vars.slideshow_interval); // Stop slideshow, prevent buildup 228 base.nextSlide(); 229 230 // Spacebar 231 } else if (event.keyCode == 32 && !vars.hover_pause) { 232 clearInterval(vars.slideshow_interval); // Stop slideshow, prevent buildup
233 base.playToggle(); 234 } 235 236 }); 237 } 238 239 // Pause when hover on image 240 if (base.options.slideshow && base.options.pause_hover){ 241 $(base.el).hover(function() { 242 if(vars.in_animation) return false; // Abort if currently animating 243 vars.hover_pause = true; // Mark slideshow paused from hover 244 if(!vars.is_paused){ 245 vars.hover_pause = 'resume'; // It needs to resume afterwards 246 base.playToggle(); 247 } 248 }, function() { 249 if(vars.hover_pause == 'resume'){ 250 base.playToggle(); 251 vars.hover_pause = false; 252 } 253 }); 254 } 255 256 if (base.options.slide_links){ 257 // Slide marker clicked 258 $(vars.slide_list+'> li').click(function(){ 259 260 index = $(vars.slide_list+'> li').index(this); 261 targetSlide = index + 1; 262 263 base.goTo(targetSlide); 264 return false; 265 266 }); 267 } 268 269 // Thumb marker clicked 270 if (base.options.thumb_links){ 271 $(vars.thumb_list+'> li').click(function(){ 272 273 index = $(vars.thumb_list+'> li').index(this); 274 targetSlide = index + 1; 275 276 api.goTo(targetSlide); 277 return false; 278 279 }); 280 } 281 282 // Start slideshow if enabled 283 if (base.options.slideshow && base.options.slides.length > 1){ 284 285 // Start slideshow if autoplay enabled 286 if (base.options.autoplay && base.options.slides.length > 1){ 287 vars.slideshow_interval = setInterval(base.nextSlide, base.options.slide_interval); // Initiate slide interval 288 }else{ 289 vars.is_paused = true; // Mark as paused 290 } 291 292 //Prevent navigation items from being dragged 293 $('.load-item img').bind("contextmenu mousedown",function(){ 294 return false; 295 }); 296 297 } 298 299 // Adjust image when browser is resized 300 $(window).resize(function(){ 301 base.resizeNow(); 302 }); 303 304 }; 305 306 307 /* Resize Images 308 ----------------------------*/ 309 base.resizeNow = function(){ 310 311 return base.$el.each(function() { 312 // Resize each image seperately 313 $('img', base.el).each(function(){ 314 315 thisSlide = $(this); 316 var ratio = (thisSlide.data('origHeight')/thisSlide.data('origWidth')).toFixed(2); // Define image ratio 317 318 // Gather browser size 319 var browserwidth = base.$el.width(), 320 browserheight = base.$el.height(), 321 offset; 322 323 /*-----Resize Image-----*/ 324 if (base.options.fit_always){ // Fit always is enabled 325 if ((browserheight/browserwidth) > ratio){ 326 resizeWidth(); 327 } else { 328 resizeHeight(); 329 } 330 }else{ // Normal Resize 331 if ((browserheight <= base.options.min_height) && (browserwidth <= base.options.min_width)){ // If window smaller than minimum width and height 332 333 if ((browserheight/browserwidth) > ratio){ 334 base.options.fit_landscape && ratio < 1 ? resizeWidth(true) : resizeHeight(true); // If landscapes are set to fit 335 } else { 336 base.options.fit_portrait && ratio >= 1 ? resizeHeight(true) : resizeWidth(true); // If portraits are set to fit 337 } 338 339 } else if (browserwidth <= base.options.min_width){ // If window only smaller than minimum width 340 341 if ((browserheight/browserwidth) > ratio){ 342 base.options.fit_landscape && ratio < 1 ? resizeWidth(true) : resizeHeight(); // If landscapes are set to fit 343 } else { 344 base.options.fit_portrait && ratio >= 1 ? resizeHeight() : resizeWidth(true); // If portraits are set to fit 345 } 346 347 } else if (browserheight <= base.options.min_height){ // If window only smaller than minimum height 348 349 if ((browserheight/browserwidth) > ratio){ 350 base.options.fit_landscape && ratio < 1 ? resizeWidth() : resizeHeight(true); // If landscapes are set to fit 351 } else { 352 base.options.fit_portrait && ratio >= 1 ? resizeHeight(true) : resizeWidth(); // If portraits are set to fit 353 } 354 355 } else { // If larger than minimums 356 357 if ((browserheight/browserwidth) > ratio){ 358 base.options.fit_landscape && ratio < 1 ? resizeWidth() : resizeHeight(); // If landscapes are set to fit 359 } else { 360 base.options.fit_portrait && ratio >= 1 ? resizeHeight() : resizeWidth(); // If portraits are set to fit 361 } 362 363 } 364 } 365 /*-----End Image Resize-----*/ 366 367 368 /*-----Resize Functions-----*/ 369 370 function resizeWidth(minimum){ 371 if (minimum){ // If minimum height needs to be considered 372 if(thisSlide.width() < browserwidth || thisSlide.width() < base.options.min_width ){ 373 if (thisSlide.width() * ratio >= base.options.min_height){ 374 thisSlide.width(base.options.min_width); 375 thisSlide.height(thisSlide.width() * ratio); 376 }else{ 377 resizeHeight(); 378 } 379 } 380 }else{ 381 if (base.options.min_height >= browserheight && !base.options.fit_landscape){ // If minimum height needs to be considered 382 if (browserwidth * ratio >= base.options.min_height || (browserwidth * ratio >
382= base.options.min_height && ratio <= 1)){ // If resizing would push below minimum height or image is a landscape 383 thisSlide.width(browserwidth); 384 thisSlide.height(browserwidth * ratio); 385 } else if (ratio > 1){ // Else the image is portrait 386 thisSlide.height(base.options.min_height); 387 thisSlide.width(thisSlide.height() / ratio); 388 } else if (thisSlide.width() < browserwidth) { 389 thisSlide.width(browserwidth); 390 thisSlide.height(thisSlide.width() * ratio); 391 } 392 }else{ // Otherwise, resize as normal 393 thisSlide.width(browserwidth); 394 thisSlide.height(browserwidth * ratio); 395 } 396 } 397 }; 398 399 function resizeHeight(minimum){ 400 if (minimum){ // If minimum height needs to be considered 401 if(thisSlide.height() < browserheight){ 402 if (thisSlide.height() / ratio >= base.options.min_width){ 403 thisSlide.height(base.options.min_height); 404 thisSlide.width(thisSlide.height() / ratio); 405 }else{ 406 resizeWidth(true); 407 } 408 } 409 }else{ // Otherwise, resized as normal 410 if (base.options.min_width >= browserwidth){ // If minimum width needs to be considered 411 if (browserheight / ratio >= base.options.min_width || ratio > 1){ // If resizing would push below minimum width or image is a portrait 412 thisSlide.height(browserheight); 413 thisSlide.width(browserheight / ratio); 414 } else if (ratio <= 1){ // Else the image is landscape
415 thisSlide.width(base.options.min_width); 416 thisSlide.height(thisSlide.width() * ratio); 417 } 418 }else{ // Otherwise, resize as normal 419 thisSlide.height(browserheight); 420 thisSlide.width(browserheight / ratio); 421 } 422 } 423 }; 424 425 /*-----End Resize Functions-----*/ 426 427 if (thisSlide.parents('li').hasClass('image-loading')){ 428 $('.image-loading').removeClass('image-loading'); 429 } 430 431 // Horizontally Center 432 if (base.options.horizontal_center){ 433 $(this).css('left', (browserwidth - $(this).width())/2); 434 } 435 436 // Vertically Center 437 if (base.options.vertical_center){ 438 $(this).css('top', (browserheight - $(this).height())/2); 439 } 440 441 }); 442 443 // Basic image drag and right click protection 444 if (base.options.image_protect){ 445 446 $('img', base.el).bind("contextmenu mousedown",function(){ 447 return false; 448 }); 449 450 } 451 452 return false; 453 454 }); 455 456 }; 457 458 459 /* Next Slide 460 ----------------------------*/ 461 base.nextSlide = function(){ 462 463 if(vars.in_animation || !api.options.slideshow) return false; // Abort if currently animating 464 else vars.in_animation = true; // Otherwise set animation marker 465 466 clearInterval(vars.slideshow_interval); // Stop slideshow 467 468 var slides = base.options.slides, // Pull in slides array 469 liveslide = base.$el.find('.activeslide'); // Find active slide 470 $('.prevslide').removeClass('prevslide'); 471 liveslide.removeClass('activeslide').addClass('prevslide'); // Remove active class & update previous slide 472 473 // Get the slide number of new slide 474 vars.current_slide + 1 == base.options.slides.length ? vars.current_slide = 0 : vars.current_slide++; 475 476 var nextslide = $(base.el+' li:eq('+vars.current_slide+')'), 477 prevslide = base.$el.find('.prevslide'); 478 479 // If hybrid mode is on drop quality for transition 480 if (base.options.performance == 1) base.$el.removeClass('quality').addClass('speed'); 481 482 483 /*-----Load Image-----*/ 484 485 loadSlide = false; 486 487 vars.current_slide == base.options.slides.length - 1 ? loadSlide = 0 : loadSlide = vars.current_slide + 1; // Determine next slide 488 489 var targetList = base.el+' li:eq('+loadSlide+')'; 490 if (!$(targetList).html()){ 491 492 // If links should open in new window 493 var linkTarget = base.options.new_window ? ' target="_blank"' : ''; 494 495 imageLink = (base.options.slides[loadSlide].url) ? "href='" + base.options.slides[loadSlide].url + "'" : ""; // If link exists, build it 496 var img = $('<img src="'+base.options.slides[loadSlide].image+'"/>'); 497 498 img.appendTo(targetList).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading').css('visibility','hidden'); 499 500 img.load(function(){ 501 base._origDim($(this)); 502 base.resizeNow(); 503 }); // End Load 504 }; 505 506 // Update thumbnails (if enabled) 507 if (base.options.thumbnail_navigation == 1){ 508 509 // Load previous thumbnail 510 vars.current_slide - 1 < 0 ? prevThumb = base.options.slides.length - 1 : prevThumb = vars.current_slide - 1; 511 $(vars.prev_thumb).html($("<img/>").attr("src", base.options.slides[prevThumb].image)); 512 513 // Load next thumbnail 514 nextThumb = loadSlide; 515 $(vars.next_thumb).html($("<img/>").attr("src", base.options.slides[nextThumb].image)); 516 517 } 518 519 520 521 /*-----End Load Image-----*/ 522 523 524 // Call theme function for before slide transition 525 if( typeof theme != 'undefined' && typeof theme.beforeAnimation == "function" ) theme.beforeAnimation('next'); 526 527 //Update slide markers 528 if (base.options.slide_links){ 529 $('.current-slide').removeClass('current-slide'); 530 $(vars.slide_list +'> li' ).eq(vars.current_slide).addClass('current-slide'); 531 } 532 533 nextslide.css('visibility','hidden').addClass('activeslide'); // Update active slide 534 535 switch(base.options.transition){ 536 case 0: case 'none': // No transition 537 nextslide.css('visibility','visible'); vars.in_animation = false; base.afterAnimation(); 538 break; 539 case 1: case 'fade': // Fade 540 nextslide.css({opacity : 0, 'visibility': 'visible'}).animate({opacity : 1, avoidTransforms : false}, base.options.transition_speed, function(){ base.afterAnimation(); }); 541 break; 542 case 2: case 'slideTop': // Slide Top 543 nextslide.css({top : -base.$el.height(), 'visibility': 'visible'}).animate({ top:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 544 break; 545 case 3: case 'slideRight': // Slide Right 546 nextslide.css({left : base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 547 break; 548 case 4: case 'slideBottom': // Slide Bottom 549 nextslide.css({top : base.$el.height(), 'visibility': 'visible'}).animate({ top:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 550 break; 551 case 5: case 'slideLeft': // Slide Left 552 nextslide.css({left : -base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 553 break; 554 case 6: case 'carouselRight': // Carousel Right 555 nextslide.css({left : base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 556 liveslide.animate({ left: -base.$el.width(), avoidTransforms : false }, base.options.transition_speed ); 557 break; 558 case 7: case 'carouselLeft': // Carousel Left 559 nextslide.css({left : -base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 560 liveslide.animate({ left: base.$el.width(), avoidTransforms : false }, base.options.transition_speed ); 561 break; 562 } 563 return false; 564 }; 565 566 567 /* Previous Slide 568 ----------------------------*/ 569 base.prevSlide = function(){ 570 571 if(vars.in_animation || !api.options.slideshow) return false; // Abort if currently animating 572 else vars.in_animation = true; // Otherwise set animation marker 573 574 clearInterval(vars.slideshow_interval); // Stop slideshow 575 576 var slides = base.options.slides, // Pull in slides array 577 liveslide = base.$el.find('.activeslide'); // Find active slide 578 $('.prevslide').removeClass('prevslide'); 579 liveslide.removeClass('activeslide').addClass('prevslide'); // Remove active class & update previous slide 580 581 // Get current slide number 582 vars.current_slide == 0 ? vars.current_slide = base.options.slides.length - 1 : vars.current_slide-- ; 583 584 var nextslide = $(base.el+' li:eq('+vars.current_slide+')'), 585 prevslide = base.$el.find('.prevslide'); 586 587 // If hybrid mode is on drop quality for transition 588 if (base.options.performance == 1) base.$el.removeClass('quality').addClass('speed'); 589 590 591 /*-----Load Image-----*/ 592 593 loadSlide = vars.current_slide; 594 595 var targetList = base.el+' li:eq('+loadSlide+')'; 596 if (!$(targetList).html()){ 597 // If links should open in new window 598 var linkTarget = base.options.new_window ? ' target="_blank"' : ''; 599 imageLink = (base.options.slides[loadSlide].url) ? "href='" + base.options.slides[loadSlide].url + "'" : ""; // If link exists, build it 600 var img = $('<img src="'+base.options.slides[loadSlide].image+'"/>'); 601 602 img.appendTo(targetList).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading').css('visibility','hidden'); 603 604 img.load(function(){ 605 base._origDim($(this)); 606 base.resizeNow(); 607 }); // End Load 608 }; 609 610 // Update thumbnails (if enabled) 611 if (base.options.thumbnail_navigation == 1){ 612 613 // Load previous thumbnail 614 //prevThumb = loadSlide; 615 loadSlide == 0 ? prevThumb = base.options.slides.length - 1 : prevThumb = loadSlide - 1; 616 $(vars.prev_thumb).html($("<img/>").attr("src", base.options.slides[prevThumb].image)); 617 618 // Load next thumbnail 619 vars.current_slide == base.options.slides.length - 1 ? nextThumb = 0 : nextThumb = vars.current_slide + 1; 620 $(vars.next_thumb).html($("<img/>").attr("src", base.options.slides[nextThumb].image)); 621 } 622 623 /*-----End Load Image-----*/ 624 625 626 // Call theme function for before slide transition 627 if( typeof theme != 'undefined' && typeof theme.beforeAnimation == "function" ) theme.beforeAnimation('prev'); 628 629 //Update slide markers 630 if (base.options.slide_links){ 631 $('.current-slide').removeClass('current-slide'); 632 $(vars.slide_list +'> li' ).eq(vars.current_slide).addClass('current-slide'); 633 } 634 635 nextslide.css('visibility','hidden').addClass('activeslide'); // Update active slide 636 637 switch(base.options.transition){ 638 case 0: case 'none': // No transition 639 nextslide.css('visibility','visible'); vars.in_animation = false; base.afterAnimation(); 640 break; 641 case 1: case 'fade': // Fade 642 nextslide.css({opacity : 0, 'visibility': 'visible'}).animate({opacity : 1, avoidTransforms : false}, base.options.transition_speed, function(){ base.afterAnimation(); }); 643 break; 644 case 2: case 'slideTop': // Slide Top (reverse) 645 nextslide.css({top : base.$el.height(), 'visibility': 'visible'}).animate({ top:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 646 break; 647 case 3: case 'slideRight': // Slide Right (reverse) 648 nextslide.css({left : -base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 649 break; 650 case 4: case 'slideBottom': // Slide Bottom (reverse) 651 nextslide.css({top : -base.$el.height(), 'visibility': 'visible'}).animate({ top:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 652 break; 653 case 5: case 'slideLeft': // Slide Left (reverse) 654 nextslide.css({left : base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 655 break; 656 case 6: case 'carouselRight': // Carousel Right (reverse) 657 nextslide.css({left : -base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 658 liveslide.css({left : 0}).animate({ left: base.$el.width(), avoidTransforms : false}, base.options.transition_speed ); 659 break; 660 case 7: case 'carouselLeft': // Carousel Left (reverse) 661 nextslide.css({left : base.$el.width(), 'visibility': 'visible'}).animate({ left:0, avoidTransforms : false }, base.options.transition_speed, function(){ base.afterAnimation(); }); 662 liveslide.css({left : 0}).animate({ left: -base.$el.width(), avoidTransforms : false }, base.options.transition_speed ); 663 break; 664 } 665 return false; 666 }; 667 668 669 /* Play/Pause Toggle 670 ----------------------------*/ 671 base.playToggle = function(){ 672 673 if (vars.in_animation || !api.options.slideshow) return false; // Abort if currently animating 674 675 if (vars.is_paused){ 676 677 vars.is_paused = false; 678 679 // Call theme function for play 680 if( typeof theme != 'undefined' && typeof theme.playToggle == "function" ) theme.playToggle('play'); 681 682 // Resume slideshow 683 vars.slideshow_interval = setInterval(base.nextSlide, base.options.slide_interval); 684 685 }else{ 686 687 vars.is_paused = true; 688 689 // Call theme function for pause 690 if( typeof theme != 'undefined' && typeof theme.playToggle == "function" ) theme.playToggle('pause'); 691 692 // Stop slideshow 693 clearInterval(vars.slideshow_interval); 694 695 } 696 697 return false; 698 699 }; 700 701 702 /* Go to specific slide 703 ----------------------------*/ 704 base.goTo = function(targetSlide){ 705 if (vars.in_animation || !api.options.slideshow) return false; // Abort if currently animating 706 707 var totalSlides = base.options.slides.length; 708 709 // If target outside range
710 if(targetSlide < 0){ 711 targetSlide = totalSlides; 712 }else if(targetSlide > totalSlides){ 713 targetSlide = 1; 714 } 715 targetSlide = totalSlides - targetSlide + 1; 716 717 clearInterval(vars.slideshow_interval); // Stop slideshow, prevent buildup 718 719 // Call theme function for goTo trigger 720 if (typeof theme != 'undefined' && typeof theme.goTo == "function" ) theme.goTo(); 721 722 if (vars.current_slide == totalSlides - targetSlide){ 723 if(!(vars.is_paused)){ 724 vars.slideshow_interval = setInterval(base.nextSlide, base.options.slide_interval); 725 } 726 return false; 727 } 728 729 // If ahead of current position 730 if(totalSlides - targetSlide > vars.current_slide ){ 731 732 // Adjust for new next slide 733 vars.current_slide = totalSlides-targetSlide-1; 734 vars.update_images = 'next'; 735 base._placeSlide(vars.update_images); 736 737 //Otherwise it's before current position 738 }else if(totalSlides - targetSlide < vars.current_slide){ 739 740 // Adjust for new prev slide 741 vars.current_slide = totalSlides-targetSlide+1; 742 vars.update_images = 'prev'; 743 base._placeSlide(vars.update_images); 744 745 } 746 747 // set active markers 748 if (base.options.slide_links){ 749 $(vars.slide_list +'> .current-slide').removeClass('current-slide'); 750 $(vars.slide_list +'> li').eq((totalSlides-targetSlide)).addClass('current-slide'); 751 } 752 753 if (base.options.thumb_links){ 754 $(vars.thumb_list +'> .current-thumb').removeClass('current-thumb'); 755 $(vars.thumb_list +'> li').eq((totalSlides-targetSlide)).addClass('current-thumb'); 756 } 757 758 }; 759 760 761 /* Place Slide 762 ----------------------------*/ 763 base._placeSlide = function(place){ 764 765 // If links should open in new window 766 var linkTarget = base.options.new_window ? ' target="_blank"' : ''; 767 768 loadSlide = false; 769 770 if (place == 'next'){ 771 772 vars.current_slide == base.options.slides.length - 1 ? loadSlide = 0 : loadSlide = vars.current_slide + 1; // Determine next slide 773 774 var targetList = base.el+' li:eq('+loadSlide+')'; 775 776 if (!$(targetList).html()){ 777 // If links should open in new window 778 var linkTarget = base.options.new_window ? ' target="_blank"' : ''; 779 780 imageLink = (base.options.slides[loadSlide].url) ? "href='" + base.options.slides[loadSlide].url + "'" : ""; // If link exists, build it 781 var img = $('<img src="'+base.options.slides[loadSlide].image+'"/>'); 782 783 img.appendTo(targetList).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading').css('visibility','hidden'); 784 785 img.load(function(){ 786 base._origDim($(this)); 787 base.resizeNow(); 788 }); // End Load 789 }; 790 791 base.nextSlide(); 792 793 }else if (place == 'prev'){ 794 795 vars.current_slide - 1 < 0 ? loadSlide = base.options.slides.length - 1 : loadSlide = vars.current_slide - 1; // Determine next slide 796 797 var targetList = base.el+' li:eq('+loadSlide+')'; 798 799 if (!$(targetList).html()){ 800 // If links should open in new window 801 var linkTarget = base.options.new_window ? ' target="_blank"' : ''; 802 803 imageLink = (base.options.slides[loadSlide].url) ? "href='" + base.options.slides[loadSlide].url + "'" : ""; // If link exists, build it 804 var img = $('<img src="'+base.options.slides[loadSlide].image+'"/>'); 805 806 img.appendTo(targetList).wrap('<a ' + imageLink + linkTarget + '></a>').parent().parent().addClass('image-loading').css('visibility','hidden'); 807 808 img.load(function(){ 809 base._origDim($(this)); 810 base.resizeNow(); 811 }); // End Load 812 }; 813 base.prevSlide(); 814 } 815 816 }; 817 818 819 /* Get Original Dimensions 820 ----------------------------*/ 821 base._origDim = function(targetSlide){ 822 targetSlide.data('origWidth', targetSlide.width()).data('origHeight', targetSlide.height()); 823 }; 824 825 826 /* After Slide Animation 827 ----------------------------*/ 828 base.afterAnimation = function(){ 829 830 // If hybrid mode is on swap back to higher image quality 831 if (base.options.performance == 1){ 832 base.$el.removeClass('speed').addClass('quality'); 833 } 834 835 // Update previous slide 836 if (vars.update_images){ 837 vars.current_slide - 1 < 0 ? setPrev = base.options.slides.length - 1 : setPrev = vars.current_slide-1; 838 vars.update_images = false; 839 $('.prevslide').removeClass('prevslide'); 840 $(base.el+' li:eq('+setPrev+')').addClass('prevslide'); 841 } 842 843 vars.in_animation = false; 844 845 // Resume slideshow 846 if (!vars.is_paused && base.options.slideshow){ 847 vars.slideshow_interval = setInterval(base.nextSlide, base.options.slide_interval); 848 if (base.options.stop_loop && vars.current_slide == base.options.slides.length - 1 ) base.playToggle(
848); 849 } 850 851 // Call theme function for after slide transition 852 if (typeof theme != 'undefined' && typeof theme.afterAnimation == "function" ) theme.afterAnimation(); 853 854 return false; 855 856 }; 857 858 base.getField = function(field){ 859 return base.options.slides[vars.current_slide][field]; 860 }; 861 862 // Make it go! 863 base.init(); 864 }; 865 866 867 /* Global Variables 868 ----------------------------*/ 869 $.supersized.vars = { 870 871 // Elements 872 thumb_tray : '#thumb-tray', // Thumbnail tray 873 thumb_list : '#thumb-list', // Thumbnail list 874 slide_list : '#slide-list', // Slide link list 875 876 // Internal variables 877 current_slide : 0, // Current slide number 878 in_animation : false, // Prevents animations from stacking 879 is_paused : false, // Tracks paused on/off 880 hover_pause : false, // If slideshow is paused from hover 881 slideshow_interval : false, // Stores slideshow timer 882 update_images : false, // Trigger to update images after slide jump 883 options : {} // Stores assembled options list 884 885 }; 886 887 888 /* Default Options 889 ----------------------------*/ 890 $.supersized.defaultOptions = { 891 892 // Functionality 893 slideshow : 1, // Slideshow on/off 894 autoplay : 1, // Slideshow starts playing automatically 895 start_slide : 1, // Start slide (0 is random) 896 stop_loop : 0, // Stops slideshow on last slide 897 random : 0, // Randomize slide order (Ignores start slide) 898 slide_interval : 5000, // Length between transitions 899 transition : 1, // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left 900 transition_speed : 750, // Speed of transition 901 new_window : 1, // Image links open in new window/tab 902 pause_hover : 0, // Pause slideshow on hover 903 keyboard_nav : 1, // Keyboard navigation on/off 904 performance : 1, // 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit) 905 image_protect : 1, // Disables image dragging and right click with Javascript 906 907 // Size & Position 908 fit_always : 0, // Image will never exceed browser width or height (Ignores min. dimensions) 909 fit_landscape : 0, // Landscape images will not exceed browser width 910 fit_portrait : 1, // Portrait images will not exceed browser height 911 min_width : 0, // Min width allowed (in pixels) 912 min_height : 0, // Min height allowed (in pixels) 913 horizontal_center : 1, // Horizontally center background 914 vertical_center : 1, // Vertically center background 915 916 917 // Components 918 slide_links : 1, // Individual links for each slide (Options: false, 'num', 'name', 'blank') 919 thumb_links : 1, // Individual thumb links for each slide 920 thumbnail_navigation : 0 // Thumbnail navigation 921 922 }; 923 924 $.fn.supersized = function(options){ 925 return this.each(function(){ 926 (new $.supersized(options)); 927 }); 928 }; 929 930})(jQuery); 931
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.