vendor: 6,177 bytes, lines 1-155
1/** 2 * jQuery.marquee - scrolling text like old marquee element 3 * @author Aamir Afridi - aamirafridi(at)gmail(dot)com / http://aamirafridi.com/jquery/jquery-marquee-plugin 4 */ 5;(function(factory) { 6 'use strict'; 7 if (typeof define === 'function' && define.amd) { 8 define(['jquery'], factory); 9 } else if (typeof exports !== 'undefined') { 10 module.exports = factory(require('jquery')); 11 } else { 12 factory(jQuery); 13 } 14})(function($) { 15 $.fn.marquee = function(options) { 16 return this.each(function() { 17 // Extend the options if any provided 18 var o = $.extend({}, $.fn.marquee.defaults, options), 19 $this = $(this), 20 $marqueeWrapper, containerWidth, animationCss, verticalDir, elWidth, 21 loopCount = 3, 22 playState = 'animation-play-state', 23 css3AnimationIsSupported = false, 24 25 // Private methods 26 _prefixedEvent = function(element, type, callback) { 27 var pfx = ["webkit", "moz", "MS", "o", ""]; 28 for (var p = 0; p < pfx.length; p++) { 29 if (!pfx[p]) type = type.toLowerCase(); 30 element.addEventListener(pfx[p] + type, callback, false); 31 } 32 }, 33 34 _objToString = function(obj) { 35 var tabjson = []; 36 for (var p in obj) { 37 if (obj.hasOwnProperty(p)) { 38 tabjson.push(p + ':' + obj[p]); 39 } 40 } 41 tabjson.push(); 42 return '{' + tabjson.join(',') + '}'; 43 }, 44 45 _startAnimationWithDelay = function() { 46 $this.timer = setTimeout(animate, o.delayBeforeStart); 47 }, 48 49 // Public methods 50 methods = { 51 pause: function() { 52 if (css3AnimationIsSupported && o.allowCss3Support) { 53 $marqueeWrapper.css(playState, 'paused'); 54 } else { 55 // pause using pause plugin 56 if ($.fn.pause) { 57 $marqueeWrapper.pause(); 58 } 59 } 60 // save the status 61 $this.data('runningStatus', 'paused'); 62 // fire event 63 $this.trigger('paused'); 64 }, 65 66 resume: function() { 67 // resume using css3 68 if (css3AnimationIsSupported && o.allowCss3Support) { 69 $marqueeWrapper.css(playState, 'running'); 70 } else { 71 // resume using pause plugin 72 if ($.fn.resume) { 73 $marqueeWrapper.resume(); 74 } 75 } 76 // save the status 77 $this.data('runningStatus', 'resumed'); 78 // fire event 79 $this.trigger('resumed'); 80 }, 81 82 toggle: function() { 83 methods[$this.data('runningStatus') === 'resumed' ? 'pause' : 'resume'](); 84 }, 85 86 destroy: function() { 87 // Clear timer 88 clearTimeout($this.timer); 89 // Unbind all events 90 $this.find("*").addBack().off(); 91 // Just unwrap the elements that has been added using this plugin 92 $this.html($this.find('.js-marquee:first').html()); 93 } 94 }; 95 96 // Check for methods 97 if (typeof options === 'string') { 98 if ($.isFunction(methods[options])) { 99 // Following two IF statements to support public methods 100 if (!$marqueeWrapper) { 101 $marqueeWrapper = $this.find('.js-marquee-wrapper'); 102 } 103 if ($this.data('css3AnimationIsSupported') === true) { 104 css3AnimationIsSupported = true; 105 } 106 methods[options](); 107 } 108 return; 109 } 110 111 /* Check if element has data attributes. They have top priority 112 For details https://twitter.com/aamirafridi/status/403848044069679104 - Can't find a better solution :/ 113 jQuery 1.3.2 doesn't support $.data().KEY hence writting the following */ 114 var dataAttributes = {}, 115 attr; 116 $.each(o, function(key) { 117 // Check if element has this data attribute 118 attr = $this.attr('data-' + key); 119 if (typeof attr !== 'undefined') { 120 // Now check if value is boolean or not 121 switch (attr) { 122 case 'true': 123 attr = true; 124 break; 125 case 'false': 126 attr = false; 127 break; 128 } 129 o[key] = attr; 130 } 131 }); 132 133 // Reintroduce speed as an option. It calculates duration as a factor of the container width 134 // measured in pixels per second. 135 if (o.speed) { 136 o.duration = parseInt($this.width(), 10) / o.speed * 1000; 137 } 138 139 // Shortcut to see if direction is upward or downward 140 verticalDir = o.direction === 'up' || o.direction === 'down'; 141 142 // no gap if not duplicated 143 o.gap = o.duplicated ? parseInt(o.gap) : 0; 144 145 // wrap inner content into a div 146 $this.wrapInner('<div class="js-marquee"></div>'); 147 148 // Make copy of the element 149 var $el = $this.find('.js-marquee').css({ 150 'margin-right': o.gap, 151 'float': 'left' 152 }); 153 154 if (o.duplicated) { 155
155$el.clone(true).appendTo($this);
vendor: 16,823 bytes, lines 155-485
155 156 } 157 158 // wrap both inner elements into one div 159 $this.wrapInner('<div style="width:100000px" class="js-marquee-wrapper"></div>'); 160 161 // Save the reference of the wrapper 162 $marqueeWrapper = $this.find('.js-marquee-wrapper'); 163 164 // If direction is up or down, get the height of main element 165 if (verticalDir) { 166 var containerHeight = $this.height(); 167 $marqueeWrapper.removeAttr('style'); 168 $this.height(containerHeight); 169 170 // Change the CSS for js-marquee element 171 $this.find('.js-marquee').css({ 172 'float': 'none', 173 'margin-bottom': o.gap, 174 'margin-right': 0 175 }); 176 177 // Remove bottom margin from 2nd element if duplicated 178 if (o.duplicated) { 179 $this.find('.js-marquee:last').css({ 180 'margin-bottom': 0 181 }); 182 } 183 184 var elHeight = $this.find('.js-marquee:first').height() + o.gap; 185 186 // adjust the animation duration according to the text length 187 if (o.startVisible && !o.duplicated) { 188 // Compute the complete animation duration and save it for later reference 189 // formula is to: (Height of the text node + height of the main container / Height of the main container) * duration; 190 o._completeDuration = ((parseInt(elHeight, 10) + parseInt(containerHeight, 10)) / parseInt(containerHeight, 10)) * o.duration; 191 192 // formula is to: (Height of the text node / height of the main container) * duration 193 o.duration = (parseInt(elHeight, 10) / parseInt(containerHeight, 10)) * o.duration; 194 } else { 195 // formula is to: (Height of the text node + height of the main container / Height of the main container) * duration; 196 o.duration = ((parseInt(elHeight, 10) + parseInt(containerHeight, 10)) / parseInt(containerHeight, 10)) * o.duration; 197 } 198 199 } else { 200 // Save the width of the each element so we can use it in animation 201 elWidth = $this.find('.js-marquee:first').width() + o.gap; 202 203 // container width 204 containerWidth = $this.width(); 205 206 // adjust the animation duration according to the text length 207 if (o.startVisible && !o.duplicated) { 208 // Compute the complete animation duration and save it for later reference 209 // formula is to: (Width of the text node + width of the main container / Width of the main container) * duration; 210 o._completeDuration = ((parseInt(elWidth, 10) + parseInt(containerWidth, 10)) / parseInt(containerWidth, 10)) * o.duration; 211 212 // (Width of the text node / width of the main container) * duration 213 o.duration = (parseInt(elWidth, 10) / parseInt(containerWidth, 10)) * o.duration; 214 } else { 215 // formula is to: (Width of the text node + width of the main container / Width of the main container) * duration; 216 o.duration = ((parseInt(elWidth, 10) + parseInt(containerWidth, 10)) / parseInt(containerWidth, 10)) * o.duration; 217 } 218 } 219 220 // if duplicated then reduce the duration 221 if (o.duplicated) { 222 o.duration = o.duration / 2; 223 } 224 225 if (o.allowCss3Support) { 226 var elm = document.body || document.createElement('div'), 227 animationName = 'marqueeAnimation-' + Math.floor(Math.random() * 10000000), 228 domPrefixes = 'Webkit Moz O ms Khtml'.split(' '), 229 animationString = 'animation', 230 animationCss3Str = '', 231 keyframeString = ''; 232 233 // Check css3 support 234 if (elm.style.animation !== undefined) { 235 keyframeString = '@keyframes ' + animationName + ' '; 236 css3AnimationIsSupported = true; 237 } 238 239 if (css3AnimationIsSupported === false) { 240 for (var i = 0; i < domPrefixes.length; i++) { 241 if (elm.style[domPrefixes[i] + 'AnimationName'] !== undefined) { 242 var prefix = '-' + domPrefixes[i].toLowerCase() + '-'; 243 animationString = prefix + animationString; 244 playState = prefix + playState; 245 keyframeString = '@' + prefix + 'keyframes ' + animationName + ' '; 246 css3AnimationIsSupported = true; 247 break; 248 } 249 } 250 } 251 252 if (css3AnimationIsSupported) { 253 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's ' + o.delayBeforeStart / 1000 + 's infinite ' + o.css3easing; 254 $this.data('css3AnimationIsSupported', true); 255 } 256 } 257 258 var _rePositionVertically = function() { 259 $marqueeWrapper.css('transform', 'translateY(' + (o.direction === 'up' ? containerHeight + 'px' : '-' + elHeight + 'px') + ')'); 260 }, 261 _rePositionHorizontally = function() { 262 $marqueeWrapper.css('transform', 'translateX(' + (o.direction === 'left' ? containerWidth + 'px' : '-' + elWidth + 'px') + ')'); 263 }; 264 265 // if duplicated option is set to true than position the wrapper 266 if (o.duplicated) { 267 if (verticalDir) { 268 if (o.startVisible) { 269 $marqueeWrapper.css('transform', 'translateY(0)'); 270 } else { 271 $marqueeWrapper.css('transform', 'translateY(' + (o.direction === 'up' ? containerHeight + 'px' : '-' + ((elHeight * 2) - o.gap) + 'px') + ')'); 272 } 273 } else { 274 if (o.startVisible) { 275 $marqueeWrapper.css('transform', 'translateX(0)'); 276 } else { 277 $marqueeWrapper.css('transform', 'translateX(' + (o.direction === 'left' ? containerWidth + 'px' : '-' + ((elWidth * 2) - o.gap) + 'px') + ')'); 278 } 279 } 280 281 // If the text starts out visible we can skip the two initial loops 282 if (!o.startVisible) { 283 loopCount = 1; 284 } 285 } else if (o.startVisible) { 286 // We only have two different loops if marquee is duplicated and starts visible 287 loopCount = 2; 288 } else { 289 if (verticalDir) { 290 _rePositionVertically(); 291 } else { 292 _rePositionHorizontally(); 293 } 294 } 295 296 // Animate recursive method 297 var animate = function() { 298 if (o.duplicated) { 299 // When duplicated, the first loop will be scroll longer so double the duration 300 if (loopCount === 1) { 301 o._originalDuration = o.duration; 302 if (verticalDir) { 303 o.duration = o.direction === 'up' ? o.duration + (containerHeight / ((elHeight) / o.duration)) : o.duration * 2; 304 } else { 305 o.duration = o.direction === 'left' ? o.duration + (containerWidth / ((elWidth) / o.duration)) : o.duration * 2; 306 } 307 // Adjust the css3 animation as well 308 if (animationCss3Str) { 309 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's ' + o.delayBeforeStart / 1000 + 's ' + o.css3easing; 310 } 311 loopCount++; 312 } 313 // On 2nd loop things back to normal, normal duration for the rest of animations 314 else if (loopCount === 2) { 315 o.duration = o._originalDuration; 316 // Adjust the css3 animation as well 317 if (animationCss3Str) { 318 animationName = animationName + '0'; 319 keyframeString = $.trim(keyframeString) + '0 '; 320 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's 0s infinite ' + o.css3easing; 321 } 322 loopCount++; 323 } 324 } 325 326 if (verticalDir) { 327 if (o.duplicated) { 328 329 // Adjust the starting point of animation only when first loops finishes 330 if (loopCount > 2) { 331 $marqueeWrapper.css('transform', 'translateY(' + (o.direction === 'up' ? 0 : '-' + elHeight + 'px') + ')'); 332 } 333 334 animationCss = { 335 'transform': 'translateY(' + (o.direction === 'up' ? '-' + elHeight + 'px' : 0) + ')' 336 }; 337 } else if (o.startVisible) { 338 // This loop moves the marquee out of the container 339 if (loopCount === 2) { 340 // Adjust the css3 animation as well 341 if (animationCss3Str) { 342 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's ' + o.delayBeforeStart / 1000 + 's ' + o.css3easing; 343 } 344 animationCss = { 345 'transform': 'translateY(' + (o.direction === 'up' ? '-' + elHeight + 'px' : containerHeight + 'px') + ')' 346 }; 347 loopCount++; 348 } else if (loopCount === 3) { 349 // Set the duration for the animation that will run forever 350 o.duration = o._completeDuration; 351 // Adjust the css3 animation as well 352 if (animationCss3Str) { 353 animationName = animationName + '0'; 354 keyframeString = $.trim(keyframeString) + '0 '; 355 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's 0s infinite ' + o.css3easing; 356 } 357 _rePositionVertically(); 358 } 359 } else { 360 _rePositionVertically(); 361 animationCss = { 362 'transform': 'translateY(' + (o.direction === 'up' ? '-' + ($marqueeWrapper.height()) + 'px' : containerHeight + 'px') + ')' 363 }; 364 } 365 } else { 366 if (o.duplicated) { 367 368 // Adjust the starting point of animation only when first loops finishes 369 if (loopCount > 2) { 370 $marqueeWrapper.css('transform', 'translateX(' + (o.direction === 'left' ? 0 : '-' + elWidth + 'px') + ')'); 371 } 372 373 animationCss = { 374 'transform': 'translateX(' + (o.direction === 'left' ? '-' + elWidth + 'px' : 0) + ')' 375 }; 376 377 } else if (o.startVisible) { 378 // This loop moves the marquee out of the container 379 if (loopCount === 2) { 380 // Adjust the css3 animation as well 381 if (animationCss3Str) { 382 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's ' + o.delayBeforeStart / 1000 + 's ' + o.css3easing; 383 } 384 animationCss = { 385 'transform': 'translateX(' + (o.direction === 'left' ? '-' + elWidth + 'px' : containerWidth + 'px') + ')' 386 }; 387 loopCount++; 388 } else if (loopCount === 3) { 389 // Set the duration for the animation that will run forever 390 o.duration = o._completeDuration; 391 // Adjust the css3 animation as well 392 if (animationCss3Str) { 393 animationName = animationName + '0'; 394 keyframeString = $.trim(keyframeString) + '0 '; 395 animationCss3Str = animationName + ' ' + o.duration / 1000 + 's 0s infinite ' + o.css3easing; 396 } 397 _rePositionHorizontally(); 398 } 399 } else { 400 _rePositionHorizontally(); 401 animationCss = { 402 'transform': 'translateX(' + (o.direction === 'left' ? '-' + elWidth + 'px' : containerWidth + 'px') + ')' 403 }; 404 } 405 } 406 407 // fire event 408 $this.trigger('beforeStarting'); 409 410 // If css3 support is available than do it with css3, otherwise use jQuery as fallback 411 if (css3AnimationIsSupported) { 412 // Add css3 animation to the element 413 $marqueeWrapper.css(animationString, animationCss3Str); 414 var keyframeCss = keyframeString + ' { 100% ' + _objToString(animationCss) + '}', 415 $styles = $marqueeWrapper.find('style'); 416 417 // Now add the keyframe animation to the marquee element 418 if ($styles.length !== 0) { 419 // Bug fixed for jQuery 1.3.x - Instead of using .last(), use following 420 $styles.filter(":last").html(keyframeCss); 421 } else { 422 $('head').append('<style>' + keyframeCss + '</style>'); 423 } 424 425 // Animation iteration event 426 _prefixedEvent($marqueeWrapper[0], "AnimationIteration", function() { 427 $this.trigger('finished'); 428 }); 429 // Animation stopped 430 _prefixedEvent($marqueeWrapper[0], "AnimationEnd", function() { 431 animate(); 432 $this.trigger('finished'); 433 }); 434 435 } else { 436 // Start animating 437 $marqueeWrapper.animate(animationCss, o.duration, o.easing, function() { 438 // fire event 439 $this.trigger('finished'); 440 // animate again 441 if (o.pauseOnCycle) { 442 _startAnimationWithDelay(); 443 } else { 444 animate(); 445 } 446 }); 447 } 448 // save the status 449 $this.data('runningStatus', 'resumed'); 450 }; 451 452 // bind pause and resume events 453 $this.on('pause', methods.pause); 454 $this.on('resume', methods.resume); 455 456 if (o.pauseOnHover) { 457 $this.on('mouseenter', methods.pause); 458 $this.on('mouseleave', methods.resume); 459 } 460 461 // If css3 animation is supported than call animate method at once 462 if (css3AnimationIsSupported && o.allowCss3Support) { 463 animate(); 464 } else { 465 // Starts the recursive method 466 _startAnimationWithDelay(); 467 } 468 469 }); 470 }; // End of Plugin 471 // Public: plugin defaults options 472 $.fn.marquee.defaults = { 473 // If you wish to always animate using jQuery 474 allowCss3Support: true, 475 // works when allowCss3Support is set to true - for full list see http://www.w3.org/TR/2013/WD-css3-transitions-20131119/#transition-timing-function 476 css3easing: 'linear', 477 // requires jQuery easing plugin. Default is 'linear' 478 easing: 'linear', 479 // pause time before the next animation turn in milliseconds 480 delayBeforeStart: 1000, 481 // 'left', 'right', 'up' or 'down' 482 direction: 'left', 483 // true or false - should the marquee be duplicated to show an effect of continues flow 484 duplicated: false, 485 //
485duration in milliseconds of the marquee in milliseconds 486 duration: 5000, 487 // Speed allows you to set a relatively constant marquee speed regardless of the width of the containing element. Speed is measured in pixels per second. 488 speed: 0, 489 // gap in pixels between the tickers 490 gap: 20, 491 // on cycle pause the marquee 492 pauseOnCycle: false, 493 // on hover pause the marquee - using jQuery plugin https://github.com/tobia/Pause 494 pauseOnHover: false, 495 // the marquee is visible initially positioned next to the border towards it will be moving 496 startVisible: false 497 }; 498});
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.