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