vendor: 44,682 bytes, lines 1-1544
1/*! picturefill - v3.0.2 - 2016-02-12 2 * https://scottjehl.github.io/picturefill/ 3 * Copyright (c) 2016 https://github.com/scottjehl/picturefill/blob/master/Authors.txt; Licensed MIT 4 */ 5/*! Gecko-Picture - v1.0 6 * https://github.com/scottjehl/picturefill/tree/3.0/src/plugins/gecko-picture 7 * Firefox's early picture implementation (prior to FF41) is static and does 8 * not react to viewport changes. This tiny module fixes this. 9 */ 10(function(window) { 11 /*jshint eqnull:true */ 12 var ua = navigator.userAgent; 13 14 if ( window.HTMLPictureElement && ((/ecko/).test(ua) && ua.match(/rv\:(\d+)/) && RegExp.$1 < 45) ) { 15 addEventListener("resize", (function() { 16 var timer; 17 18 var dummySrc = document.createElement("source"); 19 20 var fixRespimg = function(img) { 21 var source, sizes; 22 var picture = img.parentNode; 23 24 if (picture.nodeName.toUpperCase() === "PICTURE") { 25 source = dummySrc.cloneNode(); 26 27 picture.insertBefore(source, picture.firstElementChild); 28 setTimeout(function() { 29 picture.removeChild(source); 30 }); 31 } else if (!img._pfLastSize || img.offsetWidth > img._pfLastSize) { 32 img._pfLastSize = img.offsetWidth; 33 sizes = img.sizes; 34 img.sizes += ",100vw"; 35 setTimeout(function() { 36 img.sizes = sizes; 37 }); 38 } 39 }; 40 41 var findPictureImgs = function() { 42 var i; 43 var imgs = document.querySelectorAll("picture > img, img[srcset][sizes]"); 44 for (i = 0; i < imgs.length; i++) { 45 fixRespimg(imgs[i]); 46 } 47 }; 48 var onResize = function() { 49 clearTimeout(timer); 50 timer = setTimeout(findPictureImgs, 99); 51 }; 52 var mq = window.matchMedia && matchMedia("(orientation: landscape)"); 53 var init = function() { 54 onResize(); 55 56 if (mq && mq.addListener) { 57 mq.addListener(onResize); 58 } 59 }; 60 61 dummySrc.srcset = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="; 62 63 if (/^[c|i]|d$/.test(document.readyState || "")) { 64 init(); 65 } else { 66 document.addEventListener("DOMContentLoaded", init); 67 } 68 69 return onResize; 70 })()); 71 } 72})(window); 73 74/*! Picturefill - v3.0.2 75 * http://scottjehl.github.io/picturefill 76 * Copyright (c) 2015 https://github.com/scottjehl/picturefill/blob/master/Authors.txt; 77 * License: MIT 78 */ 79 80(function( window, document, undefined ) { 81 // Enable strict mode 82 "use strict"; 83 84 // HTML shim|v it for old IE (IE9 will still need the HTML video tag workaround) 85 document.createElement( "picture" ); 86 87 var warn, eminpx, alwaysCheckWDescriptor, evalId; 88 // local object for method references and testing exposure 89 var pf = {}; 90 var isSupportTestReady = false; 91 var noop = function() {}; 92 var image = document.createElement( "img" ); 93 var getImgAttr = image.getAttribute; 94 var setImgAttr = image.setAttribute; 95 var removeImgAttr = image.removeAttribute; 96 var docElem = document.documentElement; 97 var types = {}; 98 var cfg = { 99 //resource selection: 100 algorithm: "" 101 }; 102 var srcAttr = "data-pfsrc"; 103 var srcsetAttr = srcAttr + "set"; 104 // ua sniffing is done for undetectable img loading features, 105 // to do some non crucial perf optimizations 106 var ua = navigator.userAgent; 107 var supportAbort = (/rident/).test(ua) || ((/ecko/).test(ua) && ua.match(/rv\:(\d+)/) && RegExp.$1 > 35 ); 108 var curSrcProp = "currentSrc"; 109 var regWDesc = /\s+\+?\d+(e\d+)?w/; 110 var regSize = /(\([^)]+\))?\s*(.+)/; 111 var setOptions = window.picturefillCFG; 112 /** 113 * Shortcut property for https://w3c.github.io/webappsec/specs/mixedcontent/#restricts-mixed-content ( for easy overriding in tests ) 114 */ 115 // baseStyle also used by getEmValue (i.e.: width: 1em is important) 116 var baseStyle = "position:absolute;left:0;visibility:hidden;display:block;padding:0;border:none;font-size:1em;width:1em;overflow:hidden;clip:rect(0px, 0px, 0px, 0px)"; 117 var fsCss = "font-size:100%!important;"; 118 var isVwDirty = true; 119 120 var cssCache = {}; 121 var sizeLengthCache = {}; 122 var DPR = window.devicePixelRatio; 123 var units = { 124 px: 1, 125 "in": 96 126 }; 127 var anchor = document.createElement( "a" ); 128 /** 129 * alreadyRun flag used for setOptions. is it true setOptions will reevaluate 130 * @type {boolean} 131 */ 132 var alreadyRun = false; 133 134 // Reusable, non-"g" Regexes 135 136 // (Don't use \s, to avoid matching non-breaking space.) 137 var regexLeadingSpaces = /^[ \t\n\r\u000c]+/, 138 regexLeadingCommasOrSpaces = /^[, \t\n\r\u000c]+/, 139 regexLeadingNotSpaces = /^[^ \t\n\r\u000c]+/, 140 regexTrailingCommas = /[,]+$/, 141 regexNonNegativeInteger = /^\d+$/, 142 143 // ( Positive or negative or unsigned integers or decimals, without or without exponents. 144 // Must include at least one digit. 145 // According to spec tests any decimal point must be followed by a digit. 146 // No leading plus sign is allowed.) 147 // https://html.spec.whatwg.org/multipage/infrastructure.html#valid-floating-point-number 148 regexFloatingPoint = /^-?(?:[0-9]+|[0-9]*\.[0-9]+)(?:[eE][+-]?[0-9]+)?$/; 149 150 var on = function(obj, evt, fn, capture) { 151 if ( obj.addEventListener ) { 152 obj.addEventListener(evt, fn, capture || false); 153 } else if ( obj.attachEvent ) { 154 obj.attachEvent( "on" + evt, fn); 155 } 156 }; 157 158 /** 159 * simple memoize function: 160 */ 161 162 var memoize = function(fn) { 163 var cache = {}; 164 return function(input) { 165 if ( !(input in cache) ) { 166 cache[ input ] = fn(input); 167 } 168 return cache[ input ]; 169 }; 170 }; 171 172 // UTILITY FUNCTIONS 173 174 // Manual is faster than RegEx 175 // http://jsperf.com/whitespace-character/5 176 function isSpace(c) { 177 return (c === "\u0020" || // space 178 c === "\u0009" || // horizontal tab 179 c === "\u000A" || // new line 180 c === "\u000C" || // form feed 181 c === "\u000D"); // carriage return 182 } 183 184 /** 185 * gets a mediaquery and returns a boolean or gets a css length and returns a number 186 * @param css mediaqueries or css length 187 * @returns {boolean|number} 188 * 189 * based on: https://gist.github.com/jonathantneal/db4f77009b155f083738 190 */ 191 var evalCSS = (function() { 192 193 var regLength = /^([\d\.]+)(em|vw|px)$/; 194 var replace = function() { 195 var args = arguments, index = 0, string = args[0]; 196 while (++index in args) { 197 string = string.replace(args[index], args[++index]); 198 } 199 return string; 200 }; 201 202 var buildStr = memoize(function(css) { 203 204 return "return " + replace((css || "").toLowerCase(), 205 // interpret `and` 206 /\band\b/g, "&&", 207 208 // interpret `,` 209 /,/g, "||", 210 211 // interpret `min-` as >= 212 /min-([a-z-\s]+):/g, "e.$1>=", 213 214 // interpret `max-` as <= 215 /max-([a-z-\s]+):/g, "e.$1<=", 216 217 //calc value 218 /calc([^)]+)/g, "($1)", 219 220 // interpret css values 221 /(\d+[\.]*[\d]*)([a-z]+)/g, "($1 * e.$2)", 222 //make eval less evil 223 /^(?!(e.[a-z]|[0-9\.&=|><\+\-\*\(\)\/])).*/ig, "" 224 ) + ";"; 225 }); 226 227 return function(css, length) { 228 var parsedLength; 229 if (!(css in cssCache)) { 230 cssCache[css] = false; 231 if (length && (parsedLength = css.match( regLength ))) { 232 cssCache[css] = parsedLength[ 1 ] * units[parsedLength[ 2 ]]; 233 } else { 234 /*jshint evil:true */ 235 try{ 236 cssCache[css] = new Function("e", buildStr(css))(units); 237 } catch(e) {} 238 /*jshint evil:false */ 239 } 240 } 241 return cssCache[css]; 242 }; 243 })(); 244 245 var setResolution = function( candidate, sizesattr ) { 246 if ( candidate.w ) { // h = means height: || descriptor.type === 'h' do not handle yet... 247 candidate.cWidth = pf.calcListLength( sizesattr || "100vw" ); 248 candidate.res = candidate.w / candidate.cWidth ; 249 } else { 250 candidate.res = candidate.d; 251 } 252 return candidate; 253 }; 254 255 /** 256 * 257 * @param opt 258 */ 259 var picturefill = function( opt ) { 260 261 if (!isSupportTestReady) {return;} 262 263 var elements, i, plen; 264 265 var options = opt || {}; 266 267 if ( options.elements && options.elements.nodeType === 1 ) { 268 if ( options.elements.nodeName.toUpperCase() === "IMG" ) { 269 options.elements = [ options.elements ]; 270 } else { 271 options.context = options.elements; 272 options.elements = null; 273 } 274 } 275 276 elements = options.elements || pf.qsa( (options.context || document), ( options.reevaluate || options.reselect ) ? pf.sel : pf.selShort ); 277 278 if ( (plen = elements.length) ) { 279 280 pf.setupRun( options ); 281 alreadyRun = true; 282 283 // Loop through all elements 284 for ( i = 0; i < plen; i++ ) { 285 pf.fillImg(elements[ i ], options); 286 } 287 288 pf.teardownRun( options ); 289 } 290 }; 291 292 /** 293 * outputs a warning for the developer 294 * @param {message} 295 * @type {Function} 296 */ 297 warn = ( window.console && console.warn ) ? 298 function( message ) { 299 console.warn( message ); 300 } : 301 noop 302 ; 303 304 if ( !(curSrcProp in image) ) { 305 curSrcProp = "src"; 306 } 307 308 // Add support for standard mime types. 309 types[ "image/jpeg" ] = true; 310 types[ "image/gif" ] = true; 311 types[ "image/png" ] = true; 312 313 function detectTypeSupport( type, typeUri ) { 314 // based on Modernizr's lossless img-webp test 315 // note: asynchronous 316 var image = new window.Image(); 317 image.onerror = function() { 318 types[ type ] = false; 319 picturefill(); 320 }; 321 image.onload = function() { 322 types[ type ] = image.width === 1; 323 picturefill(); 324 }; 325 image.src = typeUri; 326 return "pending"; 327 } 328 329 // test svg support 330 types[ "image/svg+xml" ] = document.implementation.hasFeature( "http://www.w3.org/TR/SVG11/feature#Image", "1.1" ); 331 332 /** 333 * updates the internal vW property with the current viewport width in px 334 */ 335 function updateMetrics() { 336 337 isVwDirty = false; 338 DPR = window.devicePixelRatio; 339 cssCache = {}; 340 sizeLengthCache = {}; 341 342 pf.DPR = DPR || 1; 343 344 units.width = Math.max(window.innerWidth || 0, docElem.clientWidth); 345 units.height = Math.max(window.innerHeight || 0, docElem.clientHeight); 346 347 units.vw = units.width / 100; 348 units.vh = units.height / 100; 349 350 evalId = [ units.height, units.width, DPR ].join("-"); 351 352 units.em = pf.getEmValue(); 353 units.rem = units.em; 354 } 355 356 function chooseLowRes( lowerValue, higherValue, dprValue, isCached ) { 357 var bonusFactor, tooMuch, bonus, meanDensity; 358 359 //experimental 360 if (cfg.algorithm === "saveData" ){ 361 if ( lowerValue > 2.7 ) { 362 meanDensity = dprValue + 1; 363 } else { 364 tooMuch = higherValue - dprValue; 365 bonusFactor = Math.pow(lowerValue - 0.6, 1.5); 366 367 bonus = tooMuch * bonusFactor; 368 369 if (isCached) { 370 bonus += 0.1 * bonusFactor; 371 } 372 373 meanDensity = lowerValue + bonus; 374 } 375 } else { 376 meanDensity = (dprValue > 1) ? 377 Math.sqrt(lowerValue * higherValue) : 378 lowerValue; 379 } 380 381 return meanDensity > dprValue; 382 } 383 384 function applyBestCandidate( img ) { 385 var srcSetCandidates; 386 var matchingSet = pf.getSet( img ); 387 var evaluated = false; 388 if ( matchingSet !== "pending" ) { 389 evaluated = evalId; 390 if ( matchingSet ) { 391 srcSetCandidates = pf.setRes( matchingSet ); 392 pf.applySetCandidate( srcSetCandidates, img ); 393 } 394 } 395 img[ pf.ns ].evaled = evaluated; 396 } 397 398 function ascendingSort( a, b ) { 399 return a.res - b.res; 400 } 401 402 function setSrcToCur( img, src, set ) { 403 var candidate; 404 if ( !set && src ) { 405 set = img[ pf.ns ].sets; 406 set = set && set[set.length - 1]; 407 } 408 409 candidate = getCandidateForSrc(src, set); 410 411 if ( candidate ) { 412 src = pf.makeUrl(src); 413 img[ pf.ns ].curSrc = src; 414 img[ pf.ns ].curCan = candidate; 415 416 if ( !candidate.res ) { 417 setResolution( candidate, candidate.set.sizes ); 418 } 419 } 420 return candidate; 421 } 422 423 function getCandidateForSrc( src, set ) { 424 var i, candidate, candidates; 425 if ( src && set ) { 426 candidates = pf.parseSet( set ); 427 src = pf.makeUrl(src); 428 for ( i = 0; i < candidates.length; i++ ) { 429 if ( src === pf.makeUrl(candidates[ i ].url) ) { 430 candidate = candidates[ i ]; 431 break; 432 } 433 } 434 } 435 return candidate; 436 } 437 438 function getAllSourceElements( picture, candidates ) { 439 var i, len, source, srcset; 440 441 // SPEC mismatch intended for size and perf: 442 // actually only source elements preceding the img should be used 443 // also note: don't use qsa here, because IE8 sometimes doesn't like source as the key part in a selector 444 var sources = picture.getElementsByTagName( "source" ); 445 446 for ( i = 0, len = sources.length; i < len; i++ ) { 447 source = sources[ i ]; 448 source[ pf.ns ] = true; 449 srcset = source.getAttribute( "srcset" ); 450 451 // if source does not have a srcset attribute, skip 452 if ( srcset ) { 453 candidates.push( { 454 srcset: srcset, 455 media: source.getAttribute( "media" ), 456 type: source.getAttribute( "type" ), 457 sizes: source.getAttribute( "sizes" ) 458 } ); 459 } 460 } 461 } 462 463 /** 464 * Srcset Parser 465 * By Alex Bell | MIT License 466 * 467 * @returns Array [{url: _, d: _, w: _, h:_, set:_(????)}, ...] 468 * 469 * Based super duper closely on the reference algorithm at: 470 * https://html.spec.whatwg.org/multipage/embedded-content.html#parse-a-srcset-attribute 471 */ 472 473 // 1. Let input be the value passed to this algorithm. 474 // (TO-DO : Explain what "set" argument is here. Maybe choose a more 475 // descriptive & more searchable name. Since passing the "set" in really has 476 // nothing to do with parsing proper, I would prefer this assignment eventually 477 // go in an external fn.) 478 function parseSrcset(input, set) { 479 480 function collectCharacters(regEx) { 481 var chars, 482 match = regEx.exec(input.substring(pos)); 483 if (match) { 484 chars = match[ 0 ]; 485 pos += chars.length; 486 return chars; 487 } 488 } 489 490 var inputLength = input.length, 491 url, 492 descriptors, 493 currentDescriptor, 494 state, 495 c, 496 497 // 2. Let position be a pointer into input, initially pointing at the start 498 // of the string. 499 pos = 0, 500 501 // 3. Let candidates be an initially empty source set. 502 candidates = []; 503 504 /** 505 * Adds descriptor properties to a candidate, pushes to the candidates array 506 * @return undefined 507 */ 508 // (Declared outside of the while loop so that it's only created once. 509 // (This fn is defined before it is used, in order to pass JSHINT. 510 // Unfortunately this breaks the sequencing of the spec comments. :/ ) 511 function parseDescriptors() { 512 513 // 9. Descriptor parser: Let error be no. 514 var pError = false, 515 516 // 10. Let width be absent. 517 // 11. Let density be absent. 518 // 12. Let future-compat-h be absent. (We're implementing it now as h) 519 w, d, h, i, 520 candidate = {}, 521 desc, lastChar, value, intVal, floatVal; 522 523 // 13. For each descriptor in descriptors, run the appropriate set of steps 524 // from the following list: 525 for (i = 0 ; i < descriptors.length; i++) { 526 desc = descriptors[ i ]; 527 528 lastChar = desc[ desc.length - 1 ]; 529 value = desc.substring(0, desc.length - 1); 530 intVal = parseInt(value, 10); 531 floatVal = parseFloat(value); 532 533 // If the descriptor consists of a valid non-negative integer followed by 534 // a U+0077 LATIN SMALL LETTER W character 535 if (regexNonNegativeInteger.test(value) && (lastChar === "w")) { 536 537 // If width and density are not both absent, then let error be yes. 538 if (w || d) {pError = true;} 539 540 // Apply the rules for parsing non-negative integers to the descriptor. 541 // If the result is zero, let error be yes. 542 // Otherwise, let width be the result. 543 if (intVal === 0) {pError = true;} else {w = intVal;} 544 545 // If the descriptor consists of a valid floating-point number followed by 546 // a U+0078 LATIN SMALL LETTER X character 547 } else if (regexFloatingPoint.test(value) && (lastChar === "x")) { 548 549 // If width, density and future-compat-h are not all absent, then let error 550 // be yes. 551 if (w || d || h) {pError = true;} 552 553 // Apply the rules for parsing floating-point number values to the descriptor. 554 // If the result is less than zero, let error be yes. Otherwise, let density 555 // be the result. 556 if (floatVal < 0) {pError = true;} else {d = floatVal;} 557 558 // If the descriptor consists of a valid non-negative integer followed by 559 // a U+0068 LATIN SMALL LETTER H character 560 } else if (regexNonNegativeInteger.test(value) && (lastChar === "h")) { 561 562 // If height and density are not both absent, then let error be yes. 563 if (h || d) {pError = true;} 564 565 // Apply the rules for parsing non-negative integers to the descriptor. 566 // If the result is zero, let error be yes. Otherwise, let future-compat-h 567 // be the result. 568 if (intVal === 0) {pError = true;} else {h = intVal;} 569 570 // Anything else, Let error be yes. 571 } else {pError = true;} 572 } // (close step 13 for loop) 573 574 // 15. If error is still no, then append a new image source to candidates whose 575 // URL is url, associated with a width width if not absent and a pixel 576 // density density if not absent. Otherwise, there is a parse error. 577 if (!pError) { 578 candidate.url = url; 579 580 if (w) { candidate.w = w;} 581 if (d) { candidate.d = d;} 582 if (h) { candidate.h = h;} 583 if (!h && !d && !w) {candidate.d = 1;} 584 if (candidate.d === 1) {set.has1x = true;} 585 candidate.set = set; 586 587 candidates.push(candidate); 588 } 589 } // (close parseDescriptors fn) 590 591 /** 592 * Tokenizes descriptor properties prior to parsing 593 * Returns undefined. 594 * (Again, this fn is defined before it is used, in order to pass JSHINT. 595 * Unfortunately this breaks the logical sequencing of the spec comments. :/ ) 596 */ 597 function tokenize() { 598 599 // 8.1. Descriptor tokeniser: Skip whitespace 600 collectCharacters(regexLeadingSpaces); 601 602 // 8.2. Let current descriptor be the empty string. 603 currentDescriptor = ""; 604 605 // 8.3. Let state be in descriptor. 606 state = "in descriptor"; 607 608 while (true) { 609 610 // 8.4. Let c be the character at position. 611 c = input.charAt(pos); 612 613 // Do the following depending on the value of state. 614 // For the purpose of this step, "EOF" is a special character representing 615 // that position is past the end of input. 616 617 // In descriptor 618 if (state === "in descriptor") { 619 // Do the following, depending on the value of c: 620 621 // Space character 622 // If current descriptor is not empty, append current descriptor to 623 // descriptors and let current descriptor be the empty string. 624 // Set state to after descriptor. 625 if (isSpace(c)) { 626 if (currentDescriptor) { 627 descriptors.push(currentDescriptor); 628 currentDescriptor = ""; 629 state = "after descriptor"; 630 } 631 632 // U+002C COMMA (,) 633 // Advance position to the next character in input. If current descriptor 634 // is not empty, append current descriptor to descriptors. Jump to the step 635 // labeled descriptor parser. 636 } else if (c === ",") { 637 pos += 1; 638 if (currentDescriptor) { 639 descriptors.push(currentDescriptor); 640 } 641 parseDescriptors(); 642 return; 643 644 // U+0028 LEFT PARENTHESIS (() 645 // Append c to current descriptor. Set state to in parens. 646 } else if (c === "\u0028") { 647 currentDescriptor = currentDescriptor + c; 648 state = "in parens"; 649 650 // EOF 651 // If current descriptor is not empty, append current descriptor to 652 // descriptors. Jump to the step labeled descriptor parser. 653 } else if (c === "") { 654 if (currentDescriptor) { 655 descriptors.push(currentDescriptor); 656 } 657 parseDescriptors(); 658 return; 659 660 // Anything else 661 // Append c to current descriptor. 662 } else { 663 currentDescriptor = currentDescriptor + c; 664 } 665 // (end "in descriptor" 666 667 // In parens 668 } else if (state === "in parens") { 669 670 // U+0029 RIGHT PARENTHESIS ()) 671 // Append c to current descriptor. Set state to in descriptor. 672 if (c === ")") { 673 currentDescriptor = currentDescriptor + c; 674 state = "in descriptor"; 675 676 // EOF 677 // Append current descriptor to descriptors. Jump to the step labeled 678 // descriptor parser. 679 } else if (c === "") { 680 descriptors.push(currentDescriptor); 681 parseDescriptors(); 682 return; 683 684 // Anything else 685 // Append c to current descriptor. 686 } else { 687 currentDescriptor = currentDescriptor + c; 688 } 689 690 // After descriptor 691 } else if (state === "after descriptor") { 692 693 // Do the following, depending on the value of c: 694 // Space character: Stay in this state. 695 if (isSpace(c)) { 696 697 // EOF: Jump to the step labeled descriptor parser. 698 } else if (c === "") { 699 parseDescriptors(); 700 return; 701 702 // Anything else 703 // Set state to in descriptor. Set position to the previous character in input. 704 } else { 705 state = "in descriptor"; 706 pos -= 1; 707 708 } 709 } 710 711 // Advance position to the next character in input. 712 pos += 1; 713 714 // Repeat this step. 715 } // (close while true loop) 716 } 717 718 // 4. Splitting loop: Collect a sequence of characters that are space 719 // characters or U+002C COMMA characters. If any U+002C COMMA characters 720 // were collected, that is a parse error. 721 while (true) { 722 collectCharacters(regexLeadingCommasOrSpaces); 723 724 // 5. If position is past the end of input, return candidates and abort these steps. 725 if (pos >= inputLength) { 726 return candidates; // (we're done, this is the sole return path) 727 } 728 729 // 6. Collect a sequence of characters that are not space characters, 730 // and let that be url. 731 url = collectCharacters(regexLeadingNotSpaces); 732 733 // 7. Let descriptors be a new empty list. 734 descriptors = []; 735 736 // 8. If url ends with a U+002C COMMA character (,), follow these substeps: 737 // (1). Remove all trailing U+002C COMMA characters from url. If this removed 738 // more than one character, that is a parse error. 739 if (url.slice(-1) === ",") { 740 url = url.replace(regexTrailingCommas, ""); 741 // (Jump ahead to step 9 to skip tokenization and just push the candidate). 742 parseDescriptors(); 743 744 // Otherwise, follow these substeps: 745 } else { 746 tokenize(); 747 } // (close else of step 8) 748 749 // 16. Return to the step labeled splitting loop. 750 } // (Close of big while loop.) 751 } 752 753 /* 754 * Sizes Parser 755 * 756 * By Alex Bell | MIT License 757 * 758 * Non-strict but accurate and lightweight JS Parser for the string value <img sizes="here"> 759 * 760 * Reference algorithm at: 761 * https://html.spec.whatwg.org/multipage/embedded-content.html#parse-a-sizes-attribute 762 * 763 * Most comments are copied in directly from the spec 764 * (except for comments in parens). 765 * 766 * Grammar is: 767 * <source-size-list> = <source-size># [ , <source-size-value> ]? | <source-size-value> 768 * <source-size> = <media-condition> <source-size-value> 769 * <source-size-value> = <length> 770 * http://www.w3.org/html/wg/drafts/html/master/embedded-content.html#attr-img-sizes 771 * 772 * E.g. "(max-width: 30em) 100vw, (max-width: 50em) 70vw, 100vw" 773 * or "(min-width: 30em), calc(30vw - 15px)" or just "30vw" 774 * 775 * Returns the first valid <css-length> with a media condition that evaluates to true, 776 * or "100vw" if all valid media conditions evaluate to false. 777 * 778 */ 779 780 function parseSizes(strValue) { 781 782 // (Percentage CSS lengths are not allowed in this case, to avoid confusion: 783 // https://html.spec.whatwg.org/multipage/embedded-content.html#valid-source-size-list 784 // CSS allows a single optional plus or minus sign: 785 // http://www.w3.org/TR/CSS2/syndata.html#numbers 786 // CSS is ASCII case-insensitive: 787 // http://www.w3.org/TR/CSS2/syndata.html#characters ) 788 // Spec allows exponential notation for <number> type: 789 // http://dev.w3.org/csswg/css-values/#numbers 790 var regexCssLengthWithUnits = /^(?:[+-]?[0-9]+|[0-9]*\.[0-9]+)(?:[eE][+-]?[0-9]+)?(?:ch|cm|em|ex|in|mm|pc|pt|px|rem|vh|vmin|vmax|vw)$/i; 791 792 // (This is a quick and lenient test. Because of optional unlimited-depth internal 793 // grouping parens and strict spacing rules, this could get very complicated.) 794 var regexCssCalc = /^calc\((?:[0-9a-z \.\+\-\*\/\(\)]+)\)$/i; 795 796 var i; 797 var unparsedSizesList; 798 var unparsedSizesListLength; 799 var unparsedSize; 800 var lastComponentValue; 801 var size; 802 803 // UTILITY FUNCTIONS 804 805 // (Toy CSS parser. The goals here are: 806 // 1) expansive test coverage without the weight of a full CSS parser. 807 // 2) Avoiding regex wherever convenient. 808 // Quick tests: http://jsfiddle.net/gtntL4gr/3/ 809 // Returns an array of arrays.) 810 function parseComponentValues(str) { 811 var chrctr; 812 var component = ""; 813 var componentArray = []; 814 var listArray = []; 815 var parenDepth = 0; 816 var pos = 0; 817 var inComment = false; 818 819 function pushComponent() { 820 if (component) { 821 componentArray.push(component); 822 component = ""; 823 } 824 } 825 826 function pushComponentArray() { 827 if (componentArray[0]) { 828 listArray.push(componentArray); 829 componentArray = []; 830 } 831 } 832 833 // (Loop forwards from the beginning of the string.) 834 while (true) { 835 chrctr = str.charAt(pos); 836 837 if (chrctr === "") { // ( End of string reached.) 838 pushComponent(); 839 pushComponentArray(); 840 return listArray; 841 } else if (inComment) { 842 if ((chrctr === "*") && (str[pos + 1] === "/")) { // (At end of a comment.) 843 inComment = false; 844 pos += 2; 845 pushComponent(); 846 continue; 847 } else { 848 pos += 1; // (Skip all characters inside comments.) 849 continue; 850 } 851 } else if (isSpace(chrctr)) { 852 // (If previous character in loop was also a space, or if 853 // at the beginning of the string, do not add space char to 854 // component.) 855 if ( (str.charAt(pos - 1) && isSpace( str.charAt(pos - 1) ) ) || !component ) { 856 pos += 1; 857 continue; 858 } else if (parenDepth === 0) { 859 pushComponent(); 860 pos +=1; 861 continue; 862 } else { 863 // (Replace any space character with a plain space for legibility.) 864 chrctr = " "; 865 } 866 } else if (chrctr === "(") { 867 parenDepth += 1; 868 } else if (chrctr === ")") { 869 parenDepth -= 1; 870 } else if (chrctr === ",") { 871 pushComponent(); 872 pushComponentArray(); 873 pos += 1; 874 continue; 875 } else if ( (chrctr === "/") && (str.charAt(pos + 1) === "*") ) { 876 inComment = true; 877 pos += 2; 878 continue; 879 } 880 881 component = component + chrctr; 882 pos += 1; 883 } 884 } 885 886 function isValidNonNegativeSourceSizeValue(s) { 887 if (regexCssLengthWithUnits.test(s) && (parseFloat(s) >= 0)) {return true;} 888 if (regexCssCalc.test(s)) {return true;} 889 // ( http://www.w3.org/TR/CSS2/syndata.html#numbers says: 890 // "-0 is equivalent to 0 and is not a negative number." which means that 891 // unitless zero and unitless negative zero must be accepted as special cases.) 892 if ((s === "0") || (s === "-0") || (s === "+0")) {return true;} 893 return false; 894 } 895 896 // When asked to parse a sizes attribute from an element, parse a 897 // comma-separated list of component values from the value of the element's 898 // sizes attribute (or the empty string, if the attribute is absent), and let 899 // unparsed sizes list be the result. 900 // http://dev.w3.org/csswg/css-syntax/#parse-comma-separated-list-of-component-values 901 902 unparsedSizesList = parseComponentValues(strValue); 903 unparsedSizesListLength = unparsedSizesList.length; 904 905 // For each unparsed size in unparsed sizes list: 906 for (i = 0; i < unparsedSizesListLength; i++) { 907 unparsedSize = unparsedSizesList[i]; 908 909 // 1. Remove all consecutive <whitespace-token>s from the end of unparsed size. 910 // ( parseComponentValues() already omits spaces outside of parens. ) 911 912 // If unparsed size is now empty, that is a parse error; continue to the next 913 // iteration of this algorithm. 914 // ( parseComponentValues() won't push an empty array. ) 915 916 // 2. If the last component value in unparsed size is a valid non-negative 917 // <source-size-value>, let size be its value and remove the component value 918 // from unparsed size. Any CSS function other than the calc() function is 919 // invalid. Otherwise, there is a parse error; continue to the next iteration 920 // of this algorithm. 921 // http://dev.w3.org/csswg/css-syntax/#parse-component-value 922 lastComponentValue = unparsedSize[unparsedSize.length - 1]; 923 924 if (isValidNonNegativeSourceSizeValue(lastComponentValue)) { 925 size = lastComponentValue; 926 unparsedSize.pop(); 927 } else { 928 continue; 929 } 930 931 // 3. Remove all consecutive <whitespace-token>s from the end of unparsed 932 // size. If unparsed size is now empty, return size and exit this algorithm. 933 // If this was not the last item in unparsed sizes list, that is a parse error. 934 if (unparsedSize.length === 0) { 935 return size; 936 } 937 938 // 4. Parse the remaining component values in unparsed size as a 939 // <media-condition>. If it does not parse correctly, or it does parse 940 // correctly but the <media-condition> evaluates to false, continue to the 941 // next iteration of this algorithm. 942 // (Parsing all possible compound media conditions in JS is heavy, complicated, 943 // and the payoff is unclear. Is there ever an situation where the 944 // media condition parses incorrectly but still somehow evaluates to true? 945 // Can we just rely on the browser/polyfill to do it?) 946 unparsedSize = unparsedSize.join(" "); 947 if (!(pf.matchesMedia( unparsedSize ) ) ) { 948 continue; 949 } 950 951 // 5. Return size and exit this algorithm. 952 return size; 953 } 954 955 // If the above algorithm exhausts unparsed sizes list without returning a 956 // size value, return 100vw. 957 return "100vw"; 958 } 959 960 // namespace 961 pf.ns = ("pf" + new Date().getTime()).substr(0, 9); 962 963 // srcset support test 964 pf.supSrcset = "srcset" in image; 965 pf.supSizes = "sizes" in image; 966 pf.supPicture = !!window.HTMLPictureElement; 967 968 // UC browser does claim to support srcset and picture, but not sizes, 969 // this extended test reveals the browser does support nothing 970 if (pf.supSrcset && pf.supPicture && !pf.supSizes) { 971 (function(image2) { 972 image.srcset = "data:,a"; 973 image2.src = "data:,a"; 974 pf.supSrcset = image.complete === image2.complete; 975 pf.supPicture = pf.supSrcset && pf.supPicture; 976 })(document.createElement("img")); 977 } 978 979 // Safari9 has basic support for sizes, but does't expose the `sizes` idl attribute 980 if (pf.supSrcset && !pf.supSizes) { 981 982 (function() { 983 var width2 = "data:image/gif;base64,R0lGODlhAgABAPAAAP///wAAACH5BAAAAAAALAAAAAACAAEAAAICBAoAOw=="; 984 var width1 = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="; 985 var img = document.createElement("img"); 986 var test = function() { 987 var width = img.width; 988 989 if (width === 2) { 990 pf.supSizes = true; 991 } 992 993 alwaysCheckWDescriptor = pf.supSrcset && !pf.supSizes; 994 995 isSupportTestReady = true; 996 // force async 997 setTimeout(picturefill); 998 }; 999 1000 img.onload = test; 1001 img.onerror = test; 1002 img.setAttribute("sizes", "9px"); 1003 1004 img.srcset = width1 + " 1w," + width2 + " 9w"; 1005 img.src = width1; 1006 })(); 1007 1008 } else { 1009 isSupportTestReady = true; 1010 } 1011 1012 // using pf.qsa instead of dom traversing does scale much better, 1013 // especially on sites mixing responsive and non-responsive images 1014 pf.selShort = "picture>img,img[srcset]"; 1015 pf.sel = pf.selShort; 1016 pf.cfg = cfg; 1017 1018 /** 1019 * Shortcut property for `devicePixelRatio` ( for easy overriding in tests ) 1020 */ 1021 pf.DPR = (DPR || 1 ); 1022 pf.u = units; 1023 1024 // container of supported mime types that one might need to qualify before using 1025 pf.types = types; 1026 1027 pf.setSize = noop; 1028 1029 /** 1030 * Gets a string and returns the absolute URL 1031 * @param src 1032 * @returns {String} absolute URL 1033 */ 1034 1035 pf.makeUrl = memoize(function(src) { 1036 anchor.href = src; 1037 return anchor.href; 1038 }); 1039 1040 /** 1041 * Gets a DOM element or document and a selctor and returns the found matches 1042 * Can be extended with jQuery/Sizzle for IE7 support 1043 * @param context 1044 * @param sel 1045 * @returns {NodeList|Array} 1046 */ 1047 pf.qsa = function(context, sel) { 1048 return ( "querySelector" in context ) ? context.querySelectorAll(sel) : []; 1049 }; 1050 1051 /** 1052 * Shortcut method for matchMedia ( for easy overriding in tests ) 1053 * wether native or pf.mMQ is used will be decided lazy on first call 1054 * @returns {boolean} 1055 */ 1056 pf.matchesMedia = function() { 1057 if ( window.matchMedia && (matchMedia( "(min-width: 0.1em)" ) || {}).matches ) { 1058 pf.matchesMedia = function( media ) { 1059 return !media || ( matchMedia( media ).matches ); 1060 }; 1061 } else { 1062 pf.matchesMedia = pf.mMQ; 1063 } 1064 1065 return pf.matchesMedia.apply( this, arguments ); 1066 }; 1067 1068 /** 1069 * A simplified matchMedia implementation for IE8 and IE9 1070 * handles only min-width/max-width with px or em values 1071 * @param media 1072 * @returns {boolean} 1073 */ 1074 pf.mMQ = function( media ) { 1075 return media ? evalCSS(media) : true; 1076 }; 1077 1078 /** 1079 * Returns the calculated length in css pixel from the given sourceSizeValue 1080 * http://dev.w3.org/csswg/css-values-3/#length-value 1081 * intended Spec mismatches: 1082 * * Does not check for invalid use of CSS functions 1083 * * Does handle a computed length of 0 the same as a negative and therefore invalid value 1084 * @param sourceSizeValue 1085 * @returns {Number} 1086 */ 1087 pf.calcLength = function( sourceSizeValue ) { 1088 1089 var value = evalCSS(sourceSizeValue, true) || false; 1090 if (value < 0) { 1091 value = false; 1092 } 1093 1094 return value; 1095 }; 1096 1097 /** 1098 * Takes a type string and checks if its supported 1099 */ 1100 1101 pf.supportsType = function( type ) { 1102 return ( type ) ? types[ type ] : true; 1103 }; 1104 1105 /** 1106 * Parses a sourceSize into mediaCondition (media) and sourceSizeValue (length) 1107 * @param sourceSizeStr 1108 * @returns {*} 1109 */ 1110 pf.parseSize = memoize(function( sourceSizeStr ) { 1111 var match = ( sourceSizeStr || "" ).match(regSize); 1112 return { 1113 media: match && match[1], 1114 length: match && match[2] 1115 }; 1116 }); 1117 1118 pf.parseSet = function( set ) { 1119 if ( !set.cands ) { 1120 set.cands = parseSrcset(set.srcset, set); 1121 } 1122 return set.cands; 1123 }; 1124 1125 /** 1126 * returns 1em in css px for html/body default size 1127 * function taken from respondjs 1128 * @returns {*|number} 1129 */ 1130 pf.getEmValue = function() { 1131 var body; 1132 if ( !eminpx && (body = document.body) ) { 1133 var div = document.createElement( "div" ), 1134 originalHTMLCSS = docElem.style.cssText, 1135 originalBodyCSS = body.style.cssText; 1136 1137 div.style.cssText = baseStyle; 1138 1139 // 1em in a media query is the value of the default font size of the browser 1140 // reset docElem and body to ensure the correct value is returned 1141 docElem.style.cssText = fsCss; 1142 body.style.cssText = fsCss; 1143 1144 body.appendChild( div ); 1145 eminpx = div.offsetWidth; 1146 body.removeChild( div ); 1147 1148 //also update eminpx before returning 1149 eminpx = parseFloat( eminpx, 10 ); 1150 1151 // restore the original values 1152 docElem.style.cssText = originalHTMLCSS; 1153 body.style.cssText = originalBodyCSS; 1154 1155 } 1156 return eminpx || 16; 1157 }; 1158 1159 /** 1160 * Takes a string of sizes and returns the width in pixels as a number 1161 */ 1162 pf.calcListLength = function( sourceSizeListStr ) { 1163 // Split up source size list, ie ( max-width: 30em ) 100%, ( max-width: 50em ) 50%, 33% 1164 // 1165 // or (min-width:30em) calc(30% - 15px) 1166 if ( !(sourceSizeListStr in sizeLengthCache) || cfg.uT ) { 1167 var winningLength = pf.calcLength( parseSizes( sourceSizeListStr ) ); 1168 1169 sizeLengthCache[ sourceSizeListStr ] = !winningLength ? units.width : winningLength; 1170 } 1171 1172 return sizeLengthCache[ sourceSizeListStr ]; 1173 }; 1174 1175 /** 1176 * Takes a candidate object with a srcset property in the form of url/ 1177 * ex. "images/pic-medium.png 1x, images/pic-medium-2x.png 2x" or 1178 * "images/pic-medium.png 400w, images/pic-medium-2x.png 800w" or 1179 * "images/pic-small.png" 1180 * Get an array of image candidates in the form of 1181 * {url: "/foo/bar.png", resolution: 1} 1182 * where resolution is http://dev.w3.org/csswg/css-values-3/#resolution-value 1183 * If sizes is specified, res is calculated 1184 */ 1185 pf.setRes = function( set ) { 1186 var candidates; 1187 if ( set ) { 1188 1189 candidates = pf.parseSet( set ); 1190 1191 for ( var i = 0, len = candidates.length; i < len; i++ ) { 1192 setResolution( candidates[ i ], set.sizes ); 1193 } 1194 } 1195 return candidates; 1196 }; 1197 1198 pf.setRes.res = setResolution; 1199 1200 pf.applySetCandidate = function( candidates, img ) { 1201 if ( !candidates.length ) {return;} 1202 var candidate, 1203 i, 1204 j, 1205 length, 1206 bestCandidate, 1207 curSrc, 1208 curCan, 1209 candidateSrc, 1210 abortCurSrc; 1211 1212 var imageData = img[ pf.ns ]; 1213 var dpr = pf.DPR; 1214 1215 curSrc = imageData.curSrc || img[curSrcProp]; 1216 1217 curCan = imageData.curCan || setSrcToCur(img, curSrc, candidates[0].set); 1218 1219 // if we have a current source, we might either become lazy or give this source some advantage 1220 if ( curCan && curCan.set === candidates[ 0 ].set ) { 1221 1222 // if browser can abort image request and the image has a higher pixel density than needed 1223 // and this image isn't downloaded yet, we skip next part and try to save bandwidth 1224 abortCurSrc = (supportAbort && !img.complete && curCan.res - 0.1 > dpr); 1225 1226 if ( !abortCurSrc ) { 1227 curCan.cached = true; 1228 1229 // if current candidate is "best", "better" or "okay", 1230 // set it to bestCandidate 1231 if ( curCan.res >= dpr ) { 1232 bestCandidate = curCan; 1233 } 1234 } 1235 } 1236 1237 if ( !bestCandidate ) { 1238 1239 candidates.sort( ascendingSort ); 1240 1241 length = candidates.length; 1242 bestCandidate = candidates[ length - 1 ]; 1243 1244 for ( i = 0; i < length; i++ ) { 1245 candidate = candidates[ i ]; 1246 if ( candidate.res >= dpr ) { 1247 j = i - 1; 1248 1249 // we have found the perfect candidate, 1250 // but let's improve this a little bit with some assumptions ;-) 1251 if (candidates[ j ] && 1252 (abortCurSrc || curSrc !== pf.makeUrl( candidate.url )) && 1253 chooseLowRes(candidates[ j ].res, candidate.res, dpr, candidates[ j ].cached)) { 1254 1255 bestCandidate = candidates[ j ]; 1256 1257 } else { 1258 bestCandidate = candidate; 1259 } 1260 break; 1261 } 1262 } 1263 } 1264 1265 if ( bestCandidate ) { 1266 1267 candidateSrc = pf.makeUrl( bestCandidate.url ); 1268 1269 imageData.curSrc = candidateSrc; 1270 imageData.curCan = bestCandidate; 1271 1272 if ( candidateSrc !== curSrc ) { 1273 pf.setSrc( img, bestCandidate ); 1274 } 1275 pf.setSize( img ); 1276 } 1277 }; 1278 1279 pf.setSrc = function( img, bestCandidate ) { 1280 var origWidth; 1281 img.src = bestCandidate.url; 1282 1283 // although this is a specific Safari issue, we don't want to take too much different code paths 1284 if ( bestCandidate.set.type === "image/svg+xml" ) { 1285 origWidth = img.style.width; 1286 img.style.width = (img.offsetWidth + 1) + "px"; 1287 1288 // next line only should trigger a repaint 1289 // if... is only done to trick dead code removal 1290 if ( img.offsetWidth + 1 ) { 1291 img.style.width = origWidth; 1292 } 1293 } 1294 }; 1295 1296 pf.getSet = function( img ) { 1297 var i, set, supportsType; 1298 var match = false; 1299 var sets = img [ pf.ns ].sets; 1300 1301 for ( i = 0; i < sets.length && !match; i++ ) { 1302 set = sets[i]; 1303 1304 if ( !set.srcset || !pf.matchesMedia( set.media ) || !(supportsType = pf.supportsType( set.type )) ) { 1305 continue; 1306 } 1307 1308 if ( supportsType === "pending" ) { 1309 set = supportsType; 1310 } 1311 1312 match = set; 1313 break; 1314 } 1315 1316 return match; 1317 }; 1318 1319 pf.parseSets = function( element, parent, options ) { 1320 var srcsetAttribute, imageSet, isWDescripor, srcsetParsed; 1321 1322 var hasPicture = parent && parent.nodeName.toUpperCase() === "PICTURE"; 1323 var imageData = element[ pf.ns ]; 1324 1325 if ( imageData.src === undefined || options.src ) { 1326 imageData.src = getImgAttr.call( element, "src" ); 1327 if ( imageData.src ) { 1328 setImgAttr.call( element, srcAttr, imageData.src ); 1329 } else { 1330 removeImgAttr.call( element, srcAttr ); 1331 } 1332 } 1333 1334 if ( imageData.srcset === undefined || options.srcset || !pf.supSrcset || element.srcset ) { 1335 srcsetAttribute = getImgAttr.call( element, "srcset" ); 1336 imageData.srcset = srcsetAttribute; 1337 srcsetParsed = true; 1338 } 1339 1340 imageData.sets = []; 1341 1342 if ( hasPicture ) { 1343 imageData.pic = true; 1344 getAllSourceElements( parent, imageData.sets ); 1345 } 1346 1347 if ( imageData.srcset ) { 1348 imageSet = { 1349 srcset: imageData.srcset, 1350 sizes: getImgAttr.call( element, "sizes" ) 1351 }; 1352 1353 imageData.sets.push( imageSet ); 1354 1355 isWDescripor = (alwaysCheckWDescriptor || imageData.src) && regWDesc.test(imageData.srcset || ""); 1356 1357 // add normal src as candidate, if source has no w descriptor 1358 if ( !isWDescripor && imageData.src && !getCandidateForSrc(imageData.src, imageSet) && !imageSet.has1x ) { 1359 imageSet.srcset += ", " + imageData.src; 1360 imageSet.cands.push({ 1361 url: imageData.src, 1362 d: 1, 1363 set: imageSet 1364 }); 1365 } 1366 1367 } else if ( imageData.src ) { 1368 imageData.sets.push( { 1369 srcset: imageData.src, 1370 sizes: null 1371 } ); 1372 } 1373 1374 imageData.curCan = null; 1375 imageData.curSrc = undefined; 1376 1377 // if img has picture or the srcset was removed or has a srcset and does not support srcset at all 1378 // or has a w descriptor (and does not support sizes) set support to false to evaluate 1379 imageData.supported = !( hasPicture || ( imageSet && !pf.supSrcset ) || (isWDescripor && !pf.supSizes) ); 1380 1381 if ( srcsetParsed && pf.supSrcset && !imageData.supported ) { 1382 if ( srcsetAttribute ) { 1383 setImgAttr.call( element, srcsetAttr, srcsetAttribute ); 1384 element.srcset = ""; 1385 } else { 1386 removeImgAttr.call( element, srcsetAttr ); 1387 } 1388 } 1389 1390 if (imageData.supported && !imageData.srcset && ((!imageData.src && element.src) || element.src !== pf.makeUrl(imageData.src))) { 1391 if (imageData.src === null) { 1392 element.removeAttribute("src"); 1393 } else { 1394 element.src = imageData.src; 1395 } 1396 } 1397 1398 imageData.parsed = true; 1399 }; 1400 1401 pf.fillImg = function(element, options) { 1402 var imageData; 1403 var extreme = options.reselect || options.reevaluate; 1404 1405 // expando for caching data on the img 1406 if ( !element[ pf.ns ] ) { 1407 element[ pf.ns ] = {}; 1408 } 1409 1410 imageData = element[ pf.ns ]; 1411 1412 // if the element has already been evaluated, skip it 1413 // unless `options.reevaluate` is set to true ( this, for example, 1414 // is set to true when running `picturefill` on `resize` ). 1415 if ( !extreme && imageData.evaled === evalId ) { 1416 return; 1417 } 1418 1419 if ( !imageData.parsed || options.reevaluate ) { 1420 pf.parseSets( element, element.parentNode, options ); 1421 } 1422 1423 if ( !imageData.supported ) { 1424 applyBestCandidate( element ); 1425 } else { 1426 imageData.evaled = evalId; 1427 } 1428 }; 1429 1430 pf.setupRun = function() { 1431 if ( !alreadyRun || isVwDirty || (DPR !== window.devicePixelRatio) ) { 1432 updateMetrics(); 1433 } 1434 }; 1435 1436 // If picture is supported, well, that's awesome. 1437 if ( pf.supPicture ) { 1438 picturefill = noop; 1439 pf.fillImg = noop; 1440 } else { 1441 1442 // Set up picture polyfill by polling the document 1443 (function() { 1444 var isDomReady; 1445 var regReady = window.attachEvent ? /d$|^c/ : /d$|^c|^i/; 1446 1447 var run = function() { 1448 var readyState = document.readyState || ""; 1449 1450 timerId = setTimeout(run, readyState === "loading" ? 200 : 999); 1451 if ( document.body ) { 1452 pf.fillImgs(); 1453 isDomReady = isDomReady || regReady.test(readyState); 1454 if ( isDomReady ) { 1455 clearTimeout( timerId ); 1456 } 1457 1458 } 1459 }; 1460 1461 var timerId = setTimeout(run, document.body ? 9 : 99); 1462 1463 // Also attach picturefill on resize and readystatechange 1464 // http://modernjavascript.blogspot.com/2013/08/building-better-debounce.html 1465 var debounce = function(func, wait) { 1466 var timeout, timestamp; 1467 var later = function() { 1468 var last = (new Date()) - timestamp; 1469 1470 if (last < wait) { 1471 timeout = setTimeout(later, wait - last); 1472 } else { 1473 timeout = null; 1474 func(); 1475 } 1476 }; 1477 1478 return function() { 1479 timestamp = new Date(); 1480 1481 if (!timeout) { 1482 timeout = setTimeout(later, wait); 1483 } 1484 }; 1485 }; 1486 var lastClientWidth = docElem.clientHeight; 1487 var onResize = function() { 1488 isVwDirty = Math.max(window.innerWidth || 0, docElem.clientWidth) !== units.width || docElem.clientHeight !== lastClientWidth; 1489 lastClientWidth = docElem.clientHeight; 1490 if ( isVwDirty ) { 1491 pf.fillImgs(); 1492 } 1493 }; 1494 1495 on( window, "resize", debounce(onResize, 99 ) ); 1496 on( document, "readystatechange", run ); 1497 })(); 1498 } 1499 1500 pf.picturefill = picturefill; 1501 //use this internally for easy monkey patching/performance testing 1502 pf.fillImgs = picturefill; 1503 pf.teardownRun = noop; 1504 1505 /* expose methods for testing */ 1506 picturefill._ = pf; 1507 1508 window.picturefillCFG = { 1509 pf: pf, 1510 push: function(args) { 1511 var name = args.shift(); 1512 if (typeof pf[name] === "function") { 1513 pf[name].apply(pf, args); 1514 } else { 1515 cfg[name] = args[0]; 1516 if (alreadyRun) { 1517 pf.fillImgs( { reselect: true } ); 1518 } 1519 } 1520 } 1521 }; 1522 1523 while (setOptions && setOptions.length) { 1524 window.picturefillCFG.push(setOptions.shift()); 1525 } 1526 1527 /* expose picturefill */ 1528 window.picturefill = picturefill; 1529 1530 /* expose picturefill */ 1531 if ( typeof module === "object" && typeof module.exports === "object" ) { 1532 // CommonJS, just export 1533 module.exports = picturefill; 1534 } else if ( typeof define === "function" && define.amd ) { 1535 // AMD support 1536 define( "picturefill", function() { return picturefill; } ); 1537 } 1538 1539 // IE8 evals this sync, so it must be the last thing we do 1540 if ( !pf.supPicture ) { 1541 types[ "image/webp" ] = detectTypeSupport("image/webp", "data:image/webp;base64,UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAABBxAR/Q9ERP8DAABWUDggGAAAADABAJ0BKgEAAQADADQlpAADcAD++/1QAA==" ); 1542 } 1543 1544} )( window, document );
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.