1/* 2 * jQuery Nivo Slider v2.4 3 * http://nivo.dev7studios.com 4 * 5 * Copyright 2011, Gilbert Pellegrom 6 * Free to use and abuse under the MIT license. 7 * http://www.opensource.org/licenses/mit-license.php 8 * 9 * May 2010 - Pick random effect from specified set of effects by toronegro 10 * May 2010 - controlNavThumbsFromRel option added by nerd-sh 11 * May 2010 - Do not start nivoRun timer if there is only 1 slide by msielski 12 * April 2010 - controlNavThumbs option added by Jamie Thompson (http://jamiethompson.co.uk) 13 * March 2010 - manualAdvance option added by HelloPablo (http://hellopablo.co.uk) 14 */ 15 16(function($) { 17 18 var NivoSlider = function(element, options){ 19 //Defaults are below 20 var settings = $.extend({}, $.fn.nivoSlider.defaults, options); 21 22 //Useful variables. Play carefully. 23 var vars = { 24 currentSlide: 0, 25 currentImage: '', 26 totalSlides: 0, 27 randAnim: '', 28 running: false, 29 paused: false, 30 stop: false 31 }; 32 33 //Get this slider 34 var slider = $(element); 35 slider.data('nivo:vars', vars); 36 slider.css('position','relative'); 37 slider.addClass('nivoSlider'); 38 39 //Find our slider children 40 var kids = slider.children(); 41 kids.each(function() { 42 var child = $(this); 43 var link = ''; 44 if(!child.is('img')){ 45 if(child.is('a')){ 46 child.addClass('nivo-imageLink'); 47 link = child; 48 } 49 child = child.find('img:first'); 50 } 51 //Get img width & height 52 var childWidth = child.width(); 53 if(childWidth == 0) childWidth = child.attr('width'); 54 var childHeight = child.height(); 55 if(childHeight == 0) childHeight = child.attr('height'); 56 //Resize the slider 57 if(childWidth > slider.width()){ 58 slider.width(childWidth); 59 } 60 if(childHeight > slider.height()){ 61 slider.height(childHeight); 62 } 63 if(link != ''){ 64 link.css('display','none'); 65 } 66 child.css('display','none'); 67 vars.totalSlides++; 68 }); 69 70 //Set startSlide 71 if(settings.startSlide > 0){ 72 if(settings.startSlide >= vars.totalSlides) settings.startSlide = vars.totalSlides - 1; 73 vars.currentSlide = settings.startSlide; 74 } 75 76 //Get initial image 77 if($(kids[vars.currentSlide]).is('img')){ 78 vars.currentImage = $(kids[vars.currentSlide]); 79 } else { 80 vars.currentImage = $(kids[vars.currentSlide]).find('img:first'); 81 } 82 83 //Show initial link 84 if($(kids[vars.currentSlide]).is('a')){ 85 $(kids[vars.currentSlide]).css('display','block'); 86 } 87 88 //Set first background 89 slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat'); 90 91 //Add initial slices 92 for(var i = 0; i < settings.slices; i++){ 93 var sliceWidth = Math.round(slider.width()/settings.slices); 94 if(i == settings.slices-1){ 95 slider.append( 96 $('<div class="nivo-slice"></div>').css({ left:(sliceWidth*i)+'px', width:(slider.width()-(sliceWidth*i))+'px' }) 97 ); 98 } else { 99 slider.append( 100 $('<div class="nivo-slice"></div>').css({ left:(sliceWidth*i)+'px', width:sliceWidth+'px' }) 101 ); 102 } 103 } 104 105 //Create caption 106 slider.append( 107 $('<div class="nivo-caption"><p></p></div>').css({ display:'none', opacity:settings.captionOpacity }) 108 ); 109 //Process initial caption 110 if(vars.currentImage.attr('title') != ''){ 111 var title = vars.currentImage.attr('title'); 112 if(title.substr(0,1) == '#') title = $(title).html(); 113 $('.nivo-caption p', slider).html(title); 114 $('.nivo-caption', slider).fadeIn(settings.animSpeed); 115 } 116 117 //In the words of Super Mario "let's a go!" 118 var timer = 0; 119 if(!settings.manualAdvance && kids.length > 1){ 120 timer = setInterval(function(){ nivoRun(slider, kids, settings, false); }, settings.pauseTime); 121 } 122 123 //Add Direction nav 124 if(settings.directionNav){ 125 slider.append('<div class="nivo-directionNav"><a class="nivo-prevNav">Prev</a><a class="nivo-nextNav">Next</a></div>'); 126 127 //Hide Direction nav 128 if(settings.directionNavHide){ 129 $('.nivo-directionNav', slider).hide(); 130 slider.hover(function(){ 131 $('.nivo-directionNav', slider).show(); 132 }, function(){ 133 $('.nivo-directionNav', slider).hide(); 134 }); 135 } 136 137 $('a.nivo-prevNav', slider).live('click', function(){ 138 if(vars.running) return false;
139 clearInterval(timer); 140 timer = ''; 141 vars.currentSlide-=2; 142 nivoRun(slider, kids, settings, 'prev'); 143 }); 144 145 $('a.nivo-nextNav', slider).live('click', function(){ 146 if(vars.running) return false; 147 clearInterval(timer); 148 timer = ''; 149 nivoRun(slider, kids, settings, 'next'); 150 }); 151 } 152 153 //Add Control nav 154 if(settings.controlNav){ 155 var nivoControl = $('<div class="nivo-controlNav"></div>'); 156 slider.append(nivoControl); 157 for(var i = 0; i < kids.length; i++){ 158 if(settings.controlNavThumbs){ 159 var child = kids.eq(i); 160 if(!child.is('img')){ 161 child = child.find('img:first'); 162 } 163 if (settings.controlNavThumbsFromRel) { 164 nivoControl.append('<a class="nivo-control" rel="'+ i +'"><img src="'+ child.attr('rel') + '" alt="" /></a>'); 165 } else { 166 nivoControl.append('<a class="nivo-control" rel="'+ i +'"><img src="'+ child.attr('src').replace(settings.controlNavThumbsSearch, settings.controlNavThumbsReplace) +'" alt="" /></a>'); 167 } 168 } else { 169 nivoControl.append('<a class="nivo-control" rel="'+ i +'">'+ (i + 1) +'</a>'); 170 } 171 172 } 173 //Set initial active link 174 $('.nivo-controlNav a:eq('+ vars.currentSlide +')', slider).addClass('active'); 175 176 $('.nivo-controlNav a', slider).live('click', function(){ 177 if(vars.running) return false; 178 if($(this).hasClass('active')) return false; 179 clearInterval(timer); 180 timer = ''; 181 slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat'); 182 vars.currentSlide = $(this).attr('rel') - 1; 183 nivoRun(slider, kids, settings, 'control'); 184 }); 185 } 186 187 //Keyboard Navigation 188 if(settings.keyboardNav){ 189 $(window).keypress(function(event){ 190 //Left 191 if(event.keyCode == '37'){ 192 if(vars.running) return false; 193 clearInterval(timer); 194 timer = ''; 195 vars.currentSlide-=2; 196 nivoRun(slider, kids, settings, 'prev'); 197 } 198 //Right 199 if(event.keyCode == '39'){ 200 if(vars.running) return false; 201 clearInterval(timer); 202 timer = ''; 203 nivoRun(slider, kids, settings, 'next'); 204 } 205 }); 206 } 207 208 //For pauseOnHover setting 209 if(settings.pauseOnHover){ 210 slider.hover(function(){ 211 vars.paused = true; 212 clearInterval(timer); 213 timer = ''; 214 }, function(){ 215 vars.paused = false; 216 //Restart the timer 217 if(timer == '' && !settings.manualAdvance){ 218 timer = setInterval(function(){ nivoRun(slider, kids, settings, false); }, settings.pauseTime); 219 } 220 }); 221 } 222 223 //Event when Animation finishes 224 slider.bind('nivo:animFinished', function(){ 225 vars.running = false; 226 //Hide child links 227 $(kids).each(function(){ 228 if($(this).is('a')){ 229 $(this).css('display','none'); 230 } 231 }); 232 //Show current link 233 if($(kids[vars.currentSlide]).is('a')){ 234 $(kids[vars.currentSlide]).css('display','block'); 235 } 236 //Restart the timer 237 if(timer == '' && !vars.paused && !settings.manualAdvance){ 238 timer = setInterval(function(){ nivoRun(slider, kids, settings, false); }, settings.pauseTime); 239 } 240 //Trigger the afterChange callback 241 settings.afterChange.call(this); 242 }); 243 244 // Reset slice width before animations run
245 var resetSliceWidth = function(slider, settings){ 246 var slices = $('.nivo-slice', slider); 247 var i = 0; 248 slices.each(function(){ 249 var slice = $(this); 250 var sliceWidth = Math.round(slider.width()/settings.slices); 251 if(i == settings.slices-1){ 252 slice.css('width', (slider.width()-(sliceWidth*i)) + 'px'); 253 } else { 254 slice.css('width', sliceWidth + 'px'); 255 } 256 i++; 257 }); 258 } 259 260 // Private run method 261 var nivoRun = function(slider, kids, settings, nudge){ 262 //Get our vars 263 var vars = slider.data('nivo:vars'); 264 265 //Trigger the lastSlide callback 266 if(vars && (vars.currentSlide == vars.totalSlides - 1)){ 267 settings.lastSlide.call(this); 268 } 269 270 // Stop 271 if((!vars || vars.stop) && !nudge) return false; 272 273 //Trigger the beforeChange callback 274 settings.beforeChange.call(this); 275 276 //Set current background before change 277 if(!nudge){ 278 slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat'); 279 } else { 280 if(nudge == 'prev'){ 281 slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat'); 282 } 283 if(nudge == 'next'){ 284 slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat'); 285 } 286 } 287 vars.currentSlide++; 288 //Trigger the slideshowEnd callback 289 if(vars.currentSlide == vars.totalSlides){ 290 vars.currentSlide = 0; 291 settings.slideshowEnd.call(this); 292 } 293 if(vars.currentSlide < 0) vars.currentSlide = (vars.totalSlides - 1); 294 //Set vars.currentImage 295 if($(kids[vars.currentSlide]).is('img')){ 296 vars.currentImage = $(kids[vars.currentSlide]); 297 } else { 298 vars.currentImage = $(kids[vars.currentSlide]).find('img:first'); 299 } 300 301 //Set acitve links 302 if(settings.controlNav){ 303 $('.nivo-controlNav a', slider).removeClass('active'); 304 $('.nivo-controlNav a:eq('+ vars.currentSlide +')', slider).addClass('active'); 305 } 306 307 //Process caption 308 if(vars.currentImage.attr('title') != ''){ 309 var title = vars.currentImage.attr('title'); 310 if(title.substr(0,1) == '#') title = $(title).html(); 311 312 if($('.nivo-caption', slider).css('display') == 'block'){ 313 $('.nivo-caption p', slider).fadeOut(settings.animSpeed, function(){ 314 $(this).html(title); 315 $(this).fadeIn(settings.animSpeed); 316 }); 317 } else { 318 $('.nivo-caption p', slider).html(title); 319 } 320 $('.nivo-caption', slider).fadeIn(settings.animSpeed); 321 } else { 322 $('.nivo-caption', slider).fadeOut(settings.animSpeed); 323 } 324 325 //Set new slice backgrounds 326 var i = 0; 327 $('.nivo-slice', slider).each(function(){ 328 var sliceWidth = Math.round(slider.width()/settings.slices); 329 $(this).css({ height:'0px', opacity:'0', 330 background: 'url("'+ vars.currentImage.attr('src') +'") no-repeat -'+ ((sliceWidth + (i * sliceWi
330dth)) - sliceWidth) +'px 0%' }); 331 i++; 332 }); 333 334 if(settings.effect == 'random'){ 335 var anims = new Array('sliceDownRight','sliceDownLeft','sliceUpRight','sliceUpLeft','sliceUpDown','sliceUpDownLeft','fold','fade','slideInRight','slideInLeft'); 336 vars.randAnim = anims[Math.floor(Math.random()*(anims.length + 1))]; 337 if(vars.randAnim == undefined) vars.randAnim = 'fade'; 338 } 339 340 //Run random effect from specified set (eg: effect:'fold,fade') 341 if(settings.effect.indexOf(',') != -1){ 342 var anims = settings.effect.split(','); 343 vars.randAnim = anims[Math.floor(Math.random()*(anims.length))]; 344 if(vars.randAnim == undefined) vars.randAnim = 'fade'; 345 } 346 347 //Run effects 348 vars.running = true; 349 if(settings.effect == 'sliceDown' || settings.effect == 'sliceDownRight' || vars.randAnim == 'sliceDownRight' || 350 settings.effect == 'sliceDownLeft' || vars.randAnim == 'sliceDownLeft'){ 351 var timeBuff = 0; 352 var i = 0; 353 resetSliceWidth(slider, settings); 354 var slices = $('.nivo-slice', slider); 355 if(settings.effect == 'sliceDownLeft' || vars.randAnim == 'sliceDownLeft') slices = $('.nivo-slice', slider)._reverse(); 356 slices.each(function(){ 357 var slice = $(this); 358 slice.css({ 'top': '0px' }); 359 if(i == settings.slices-1){ 360 setTimeout(function(){ 361 slice.animate({ height:'100%', opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); }); 362 }, (100 + timeBuff)); 363 } else { 364 setTimeout(function(){ 365 slice.animate({ height:'100%', opacity:'1.0' }, settings.animSpeed); 366 }, (100 + timeBuff)); 367 } 368 timeBuff += 50; 369 i++; 370 }); 371 } 372 else if(settings.effect == 'sliceUp' || settings.effect == 'sliceUpRight' || vars.randAnim == 'sliceUpRight' || 373 settings.effect == 'sliceUpLeft' || vars.randAnim == 'sliceUpLeft'){ 374 var timeBuff = 0; 375 var i = 0; 376 resetSliceWidth(slider, settings); 377 var slices = $('.nivo-slice', slider); 378 if(settings.effect == 'sliceUpLeft' || vars.randAnim == 'sliceUpLeft') slices = $('.nivo-slice', slider)._reverse(); 379 slices.each(function(){ 380 var slice = $(this); 381 slice.css({ 'bottom': '0px' }); 382 if(i == settings.slices-1){ 383 setTimeout(function(){ 384 slice.animate({ height:'100%', opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); }); 385 }, (100 + timeBuff)); 386 } else { 387 setTimeout(function(){ 388 slice.animate({ height:'100%', opacity:'1.0' }, settings.animSpeed); 389 }, (100 + timeBuff)); 390 } 391 timeBuff += 50; 392 i++; 393 }); 394 } 395 else if(settings.effect == 'sliceUpDown' || settings.effect == 'sliceUpDownRight' || vars.randAnim == 'sliceUpDown' || 396 settings.effect == 'sliceUpDownLeft' || vars.randAnim == 'sliceUpDownLeft'){ 397 var timeBuff = 0; 398 var i = 0; 399 var v = 0; 400 resetSliceWidth(slider, settings); 401 var slices = $('.nivo-slice', slider); 402 if(settings.effect == 'sliceUpDownLeft' || vars.randAnim == 'sliceUpDownLeft') slices = $('.nivo-slice', slider)._reverse(); 403 slices.each(function(){ 404 var slice = $(this); 405 if(i == 0){ 406 slice.css('top','0px'); 407 i++; 408 } else { 409 slice.css('bottom','0px'); 410 i = 0; 411 } 412 413 if(v == settings.slices-1){ 414 setTimeout(function(){ 415 slice.animate({ height:'100%', opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); }); 416 }, (100 + timeBuff)); 417 } else { 418 setTimeout(function(){ 419 slice.animate({ height:'100%', opacity:'1.0' }, settings.animSpeed); 420 }, (100 + timeBuff)); 421 } 422 timeBuff += 50; 423 v++; 424 }); 425 } 426 else if(settings.effect == 'fold' || vars.randAnim == 'fold'){ 427 var timeBuff = 0; 428 var i = 0; 429 resetSliceWidth(slider, settings); 430 $('.nivo-slice', slider).each(function(){ 431 var slice = $(this); 432 var origWidth = slice.width(); 433 slice.css({ top:'0px', height:'100%', width:'0px' }); 434 if(i == settings.slices-1){ 435 setTimeout(function(){ 436 slice.animate({ width:origWidth, opacity:'1.0' }, settings.animSpeed, '', function(){ slider.trigger('nivo:animFinished'); }); 437 }, (100 + timeBuff)); 438 } else { 439 setTimeout(function(){ 440 slice.animate({ width:origWidth, opacity:'1.0' }, settings.animSpeed); 441 }, (100 + timeBuff)); 442 } 443 timeBuff += 50; 444 i++; 445 }); 446 } 447 else if(settings.effect == 'fade' || vars.randAnim == 'fade'){ 448 var firstSlice = $('.nivo-slice:first', slider); 449 firstSlice.css({ 450 'height': '100%', 451 'width': slider.width() + 'px' 452 }); 453 454 firstSlice.animate({ opacity:'1.0' }, (settings.animSpeed*2), '', function(){ slider.trigger('nivo:animFinished'); }); 455 } 456 else if(settings.effect == 'slideInRight' || vars.randAnim == 'slideInRight'){ 457 var firstSlice = $('.nivo-slice:first', slider); 458 firstSlice.css({ 459 'height': '100%', 460 'width': '0px', 461 'opacity': '1' 462 }); 463 464 firstSlice.animate({ width: slider.width() + 'px' }, (settings.animSpeed*2), '', function(){ slider.trigger('nivo:animFinished'); }); 465 } 466 else if(settings.effect == 'slideInLeft' || vars.randAnim == 'slideInLeft'){ 467 var firstSlice = $('.nivo-slice:first', slider); 468 firstSlice.css({ 469 'height': '100%', 470 'width': '0px', 471 'opacity': '1', 472 'left': '', 473 'right': '0px' 474 }); 475 476 firstSlice.animate({ width: slider.width() + 'px' }, (settings.animSpeed*2), '', function(){ 477 // Reset positioning 478 firstSlice.css({ 479 'left': '0px', 480 'right': '' 481 }); 482 slider.trigger('nivo:animFinished'); 483 }); 484 } 485 } 486 487 // For debugging 488 var trace = function(msg){ 489 if (this.console && typeof console.log != "undefined") 490 console.log(msg); 491 } 492 493 // Start / Stop 494 this.stop = function(){
495 if(!$(element).data('nivo:vars').stop){ 496 $(element).data('nivo:vars').stop = true; 497 trace('Stop Slider'); 498 } 499 } 500 501 this.start = function(){ 502 if($(element).data('nivo:vars').stop){ 503 $(element).data('nivo:vars').stop = false; 504 trace('Start Slider'); 505 } 506 } 507 508 //Trigger the afterLoad callback 509 settings.afterLoad.call(this); 510 }; 511 512 $.fn.nivoSlider = function(options) { 513 514 return this.each(function(){ 515 var element = $(this); 516 // Return early if this element already has a plugin instance 517 if (element.data('nivoslider')) return; 518 // Pass options to plugin constructor 519 var nivoslider = new NivoSlider(this, options); 520 // Store plugin object in this element's data 521 element.data('nivoslider', nivoslider); 522 }); 523 524 }; 525 526 //Default settings 527 $.fn.nivoSlider.defaults = { 528 effect: 'random', 529 slices: 15, 530 animSpeed: 500, 531 pauseTime: 3000, 532 startSlide: 0, 533 directionNav: true, 534 directionNavHide: true, 535 controlNav: true, 536 controlNavThumbs: false, 537 controlNavThumbsFromRel: false, 538 controlNavThumbsSearch: '.jpg', 539 controlNavThumbsReplace: '_thumb.jpg', 540 keyboardNav: true, 541 pauseOnHover: true, 542 manualAdvance: false, 543 captionOpacity: 0.8, 544 beforeChange: function(){}, 545 afterChange: function(){}, 546 slideshowEnd: function(){}, 547 lastSlide: function(){}, 548 afterLoad: function(){} 549 }; 550 551 $.fn._reverse = [].reverse; 552 553})(jQuery);
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.