1/* 2 * jQuery Orbit Plugin 1.2.3 3 * www.ZURB.com/playground 4 * Copyright 2010, ZURB 5 * Free to use under the MIT license. 6 * http://www.opensource.org/licenses/mit-license.php 7*/ 8 9 10(function($) { 11 12 $.fn.orbit = function(options) { 13 14 //Defaults to extend options 15 var defaults = { 16 animation: 'horizontal-push', // fade, horizontal-slide, vertical-slide, horizontal-push 17 animationSpeed: 600, // how fast animtions are 18 timer: true, // true or false to have the timer 19 advanceSpeed: 7000, // if timer is enabled, time between transitions 20 pauseOnHover: false, // if you hover pauses the slider 21 startClockOnMouseOut: true, // if clock should start on MouseOut 22 startClockOnMouseOutAfter: 7000, // how long after MouseOut should the timer start again 23 directionalNav: true, // manual advancing directional navs 24 captions: true, // do you want captions? 25 captionAnimation: 'fade', // fade, slideOpen, none 26 captionAnimationSpeed:7000, // if so how quickly should they animate in 27 bullets: false, // true or false to activate the bullet navigation 28 bulletThumbs: false, // thumbnails for the bullets 29 bulletThumbLocation: '', // location from this file where thumbs will be 30 afterSlideChange: function(){} // empty function 31 }; 32 33 //Extend those options 34 var options = $.extend(defaults, options); 35 36 return this.each(function() { 37 38// ============== 39// ! SETUP 40// ============== 41 42 //Global Variables 43 var activeSlide = 0, 44 numberSlides = 0, 45 orbitWidth, 46 orbitHeight, 47 locked; 48 49 //Initialize 50 var orbit = $(this).addClass('orbit'), 51 orbitWrapper = orbit.wrap('<div class="orbit-wrapper" />').parent(); 52 orbit.add(orbitWidth).width('1px').height('1px'); 53 54 //Collect all slides and set slider size of largest image 55 var slides = orbit.children('img, a, div'); 56 slides.each(function() { 57 var _slide = $(this), 58 _slideWidth = _slide.width(), 59 _slideHeight = _slide.height(); 60 if(_slideWidth > orbit.width()) { 61 orbit.add(orbitWrapper).width(_slideWidth); 62 orbitWidth = orbit.width(); 63 } 64 if(_slideHeight > orbit.height()) { 65 orbit.add(orbitWrapper).height(_slideHeight); 66 orbitHeight = orbit.height(); 67 } 68 numberSlides++; 69 }); 70 71 //Animation locking functions 72 function unlock() { 73 locked = false; 74 } 75 function lock() { 76 locked = true; 77 } 78 79 //If there is only a single slide remove nav, timer and bullets 80 if(slides.length == 1) { 81 options.directionalNav = false; 82 options.timer = false; 83 options.bullets = false; 84 } 85 86 //Set initial front photo z-index and fades it in 87 slides.eq(activeSlide) 88 .css({"z-index" : 3}) 89 .fadeIn(function() { 90 //brings in all other slides IF css declares a display: none 91 slides.css({"display":"block"}) 92 }); 93 94// ============== 95// ! TIMER 96// ============== 97 98 //Timer Execution 99 function startClock() { 100 if(!options.timer || options.timer == 'false') { 101 return false; 102 //if timer is hidden, don't need to do crazy calculations 103 } else if(timer.is(':hidden')) { 104 clock = setInterval(function(e){ 105 shift("next"); 106 }, options.advanceSpeed); 107 //if timer is visible and working, let's do some math 108 } else { 109 timerRunning = true; 110 pause.removeClass('active') 111 clock = setInterval(function(e){ 112 var degreeCSS = "rotate("+degrees+"deg)" 113 degrees += 2 114 rotator.css({ 115 "-webkit-transform": degreeCSS, 116 "-moz-transform": degreeCSS, 117 "-o-transform": degreeCSS 118 }); 119 if(degrees > 180) { 120 rotator.addClass('move'); 121 mask.addClass('move'); 122 } 123 if(degrees > 360) { 124 rotator.removeClass('move'); 125 mask.removeClass('move'); 126 degrees = 0; 127 shift("next"); 128 } 129 }, options.advanceSpeed/180); 130 } 131 } 132 function stopClock() { 133 if(!options.timer || options.timer == 'false') { return false; } else { 134 timerRunning = false;
135 clearInterval(clock); 136 pause.addClass('active'); 137 } 138 } 139 140 //Timer Setup 141 if(options.timer) { 142 var timerHTML = '<div class="timer"><span class="mask"><span class="rotator"></span></span><span class="pause"></span></div>' 143 orbitWrapper.append(timerHTML); 144 var timer = orbitWrapper.children('div.timer'), 145 timerRunning; 146 if(timer.length != 0) { 147 var rotator = $('div.timer span.rotator'), 148 mask = $('div.timer span.mask'), 149 pause = $('div.timer span.pause'), 150 degrees = 0, 151 clock; 152 startClock(); 153 timer.click(function() { 154 if(!timerRunning) { 155 startClock(); 156 } else { 157 stopClock(); 158 } 159 }); 160 if(options.startClockOnMouseOut){ 161 var outTimer; 162 orbitWrapper.mouseleave(function() { 163 outTimer = setTimeout(function() { 164 if(!timerRunning){ 165 startClock(); 166 } 167 }, options.startClockOnMouseOutAfter) 168 }) 169 orbitWrapper.mouseenter(function() { 170 clearTimeout(outTimer); 171 }) 172 } 173 } 174 } 175 176 //Pause Timer on hover 177 if(options.pauseOnHover) { 178 orbitWrapper.mouseenter(function() { 179 stopClock(); 180 }); 181 } 182 183// ============== 184// ! CAPTIONS 185// ============== 186 187 //Caption Setup 188 if(options.captions) { 189 var captionHTML = '<div class="orbit-caption"></div>'; 190 orbitWrapper.append(captionHTML); 191 var caption = orbitWrapper.children('.orbit-caption'); 192 setCaption(); 193 } 194 195 //Caption Execution 196 function setCaption() { 197 if(!options.captions || options.captions =="false") { 198 return false; 199 } else { 200 var _captionLocation = slides.eq(activeSlide).data('caption'); //get ID from rel tag on image 201 _captionHTML = $(_captionLocation).html(); //get HTML from the matching HTML entity 202 //Set HTML for the caption if it exists 203 if(_captionHTML) { 204 caption 205 .attr('id',_captionLocation) // Add ID caption 206 .html(_captionHTML); // Change HTML in Caption 207 //Animations for Caption entrances 208 if(options.captionAnimation == 'none') { 209 caption.show(); 210 } 211 if(options.captionAnimation == 'fade') { 212 caption.fadeIn(options.captionAnimationSpeed); 213 } 214 if(options.captionAnimation == 'slideOpen') { 215 caption.slideDown(options.captionAnimationSpeed); 216 } 217 } else { 218 //Animations for Caption exits 219 if(options.captionAnimation == 'none') { 220 caption.hide(); 221 } 222 if(options.captionAnimation == 'fade') { 223 caption.fadeOut(options.captionAnimationSpeed); 224 } 225 if(options.captionAnimation == 'slideOpen') { 226 caption.slideUp(options.captionAnimationSpeed); 227 } 228 } 229 } 230 } 231 232 233// ================== 234// ! DIRECTIONAL NAV 235// ================== 236 237 //DirectionalNav { rightButton --> shift("next"), leftButton --> shift("prev"); 238 if(options.directionalNav) { 239 if(options.directionalNav == "false") { return false; } 240 var directionalNavHTML = '<div class="slider-nav"><span class="right">Right</span><span class="left">Left</span></div>'; 241 orbitWrapper.append(directionalNavHTML); 242 var leftBtn = orbitWrapper.children('div.slider-nav').children('span.left'), 243 rightBtn = orbitWrapper.children('div.slider-nav').children('span.right'); 244 leftBtn.click(function() { 245 stopClock(); 246 shift("prev"); 247 }); 248 rightBtn.click(function() { 249 stopClock(); 250 shift("next") 251 }); 252 } 253 254 255 256// ================== 257// ! BULLET NAV 258// ================== 259 260 //Bullet Nav Setup 261 if(options.bullets) { 262 var bulletHTML = '<ul class="orbit-bullets"></ul>'; 263 orbitWrapper.append(bulletHTML); 264 var bullets = orbitWrapper.children('ul.orbit-bullets'); 265 for(i=0; i<numberSlides; i++) { 266 var liMarkup = $('<li>'+'<p class="mainVisualBtn0'+(i+1)+'"><span>'+(i+1)+'</span></p>'+'</li>'); 267 if(options.bulletThumbs) { 268 var thumbName = slides.eq(i).data('thumb'); 269 if(thumbName) { 270 var liMarkup = $('<li class="has-thumb">'+i+'</li>') 271 liMarkup.css({"background" : "url("+options.bulletThumbLocation+thumbName+") no-repeat"}); 272 } 273 } 274 orbitWrapper.children('ul.orbit-bullets').append(liMarkup); 275 liMarkup.data('index',i); 276 liMarkup.click(function() { 277 stopClock(); 278 shift($(this).data('index')); 279 }); 280 } 281 setActiveBullet(); 282 } 283 284 //Bullet Nav Execution 285 function setActiveBullet() { 286 if(!options.bullets) { return false; } else { 287 bullets.children('li').removeClass('active').eq(activeSlide).addClass('active'); 288 } 289 } 290 291 292 293// ==================== 294// ! SHIFT ANIMATIONS 295// ==================== 296 297 //Animating the shift! 298 function shift(direction) { 299 //remember previous activeSlide 300 var prevActiveSlide = activeSlide, 301 slideDirection = direction; 302 //exit function if bullet clicked is same as the current image 303 if(prevActiveSlide == slideDirection) { return false; } 304 //reset Z & Unlock 305 function resetAndUnlock() { 306 slides 307 .eq(prevActiveSlide) 308 .css({"z-index" : 1}); 309 unlock(); 310 options.afterSlideChange.call(this); 311 } 312 if(slides.length == "1") { return false; } 313 if(!locked) { 314 lock(); 315 //deduce the proper activeImage 316 if(direction == "next") { 317 activeSlide++ 318 if(activeSlide == numberSlides) { 319 activeSlide = 0; 320 } 321 } else if(direction == "prev") { 322 activeSlide--
323 if(activeSlide < 0) { 324 activeSlide = numberSlides-1; 325 } 326 } else { 327 activeSlide = direction; 328 if (prevActiveSlide < activeSlide) { 329 slideDirection = "next"; 330 } else if (prevActiveSlide > activeSlide) { 331 slideDirection = "prev" 332 } 333 } 334 //set to correct bullet 335 setActiveBullet(); 336 337 //set previous slide z-index to one below what new activeSlide will be 338 slides 339 .eq(prevActiveSlide) 340 .css({"z-index" : 2}); 341 342 //fade 343 if(options.animation == "fade") { 344 slides 345 .eq(activeSlide) 346 .css({"opacity" : 0, "z-index" : 3}) 347 .animate({"opacity" : 1}, options.animationSpeed, resetAndUnlock); 348 } 349 //horizontal-slide 350 if(options.animation == "horizontal-slide") { 351 if(slideDirection == "next") { 352 slides 353 .eq(activeSlide) 354 .css({"left": orbitWidth, "z-index" : 3}) 355 .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); 356 } 357 if(slideDirection == "prev") { 358 slides 359 .eq(activeSlide) 360 .css({"left": -orbitWidth, "z-index" : 3}) 361 .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); 362 } 363 } 364 //vertical-slide 365 if(options.animation == "vertical-slide") { 366 if(slideDirection == "prev") { 367 slides 368 .eq(activeSlide) 369 .css({"top": orbitHeight, "z-index" : 3}) 370 .animate({"top" : 0}, options.animationSpeed, resetAndUnlock); 371 } 372 if(slideDirection == "next") { 373 slides 374 .eq(activeSlide) 375 .css({"top": -orbitHeight, "z-index" : 3}) 376 .animate({"top" : 0}, options.animationSpeed, resetAndUnlock); 377 } 378 } 379 //push-over 380 if(options.animation == "horizontal-push") { 381 if(slideDirection == "next") { 382 slides 383 .eq(activeSlide) 384 .css({"left": orbitWidth, "z-index" : 3}) 385 .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); 386 slides 387 .eq(prevActiveSlide) 388 .animate({"left" : -orbitWidth}, options.animationSpeed); 389 } 390 if(slideDirection == "prev") { 391 slides 392 .eq(activeSlide) 393 .css({"left": -orbitWidth, "z-index" : 3}) 394 .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); 395 slides 396 .eq(prevActiveSlide) 397 .animate({"left" : orbitWidth}, options.animationSpeed); 398 } 399 } 400 setCaption(); 401 } //lock 402 }//orbit function 403 });//each call 404 }//orbit plugin call 405})(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.