1rrequire( ["extensions"], function () { 2 3 var SPACER = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=='; 4 var OBJECTFIT = "objectFit" in document.body.style; 5 var elements, index, len, el, visible, canvas, fn; 6 if ( document && document.querySelectorAll ) { 7 // Wire up the onvisible events. 8 elements = document.querySelectorAll( "[data-onvisible]" ); 9 index = 0; 10 len = elements && elements.length; 11 while ( index < len ) { 12 el = elements[index++]; 13 visible = el.getAttribute( 'data-onvisible' ); 14 if ( visible ) { 15 $( el ).onvisible( visible, 0.33 ); 16 } 17 } 18 19 // Wire up the canvasbg events. 20 elements = document.querySelectorAll( "[data-canvasbg]" ); 21 index = 0; 22 len = elements && elements.length; 23 while ( index < len ) { 24 el = elements[index++]; 25 canvas = el.getAttribute( 'data-canvasbg' ); 26 if ( canvas ) { 27 fn = function () { 28 $( this ).canvasbg(); 29 }.bind( el ); 30 rrequire( ['/includes/js/canvasbg-' + canvas.toLowerCase() + '.js', "a/canvasbg"], fn ); 31 } 32 } 33 } 34 35 // Look for all images set to lazy-load and set them to be shown on visible. 36 function LazyLoad() { 37 var els, img, 38 pictures = []; 39 40 // Find all elements with the data-src attribute. 41 els = document.querySelectorAll( "img[data-src],img[data-bg],video[data-src],source[data-src]" ); 42 for ( var i = 0; i < els.length; i++ ) { 43 img = els[i]; 44 45 // If we have a parent picture element, we'll fire this once per picture. 46 if ( img.parentNode.nodeName.toLowerCase() === 'picture' ) { 47 img = img.parentNode; 48 if ( pictures.indexOf( img ) >= 0 ) { 49 continue; 50 } else { 51 pictures.push( img ); 52 } 53 } 54 55 // When the image is about to be visible, cause the source to be set. 56 $( img ).onvisible( LoadSrc, -0.99 ); 57 } 58 } 59 60 // Load the source of a single asset. 61 function LoadSrc() { 62 var img, el, 63 src = this.getAttribute( 'data-src' ), 64 bg = this.getAttribute( 'data-bg' ), 65 node = ( this.nodeName || "" ).toLowerCase(); 66 67 switch ( node ) { 68 case 'img': 69 if ( bg ) { 70 // Set the background. 71 this.style.backgroundImage = "url('" + bg + "')"; 72 } else if ( src ) { 73 // Standard image source. 74 this.setAttribute( 'src', src ); 75 // Note the image for the 'complete' property. 76 img = this; 77 } 78 this.removeAttribute( 'data-src' ); 79 this.removeAttribute( 'data-bg' ); 80 break; 81 case 'video': 82 // A video with a data-src applies to the poster attribute. 83 if ( src ) { 84 this.setAttribute( 'poster', src ); 85 } 86 this.removeAttribute( 'data-src' ); 87 break; 88 case 'picture': 89 // If we have a picture, fix the data-src attributes of all child elements at the same time. 90 for ( var i = 0; i < this.children.length; i++ ) { 91 el = this.children[i]; 92 src = el.getAttribute( 'data-src' ); 93 el.removeAttribute( 'data-src' ); 94 if ( ( el.nodeName || "" ).toLowerCase() == 'img' ) { 95 // Note the image for the 'complete' property. 96 img = el; 97 if ( src ) { 98 // Set the src. 99 if ( OBJECTFIT ) { 100 img.setAttribute( 'src', src ); 101 } else { 102 // Set the image as a background. 103 img.style.backgroundImage = "url('" + src + "')"; 104 // Null out the image so we create a placeholder for load detection. 105 img = null; 106 } 107 } 108 } else if ( src ) { 109 // Set the srcset. 110 el.setAttribute( 'srcset', src ); 111 } 112 } 113 break; 114 } 115 116 if ( !img ) { 117 // Create a placeholder img to track when the image has loaded for the main element. 118 img = document.createElement( 'img' ); 119 img.style.position = 'absolute'; 120 img.style.opacity = 0; 121 img.style.pointerEvents = 'none'; 122 img.style.left = '-100%'; 123 img.style.top = '-100%'; 124 img.$placeholder = true; 125 document.body.appendChild( img ); 126 img.setAttribute( 'src', bg || src || SPACER ); 127 } else if ( img.$loading ) { 128 // Loading events already wired up. 129 return; 130 } 131 132 // Note which element will be getting the loading class. 133 img.$loading = this; 134 135 if ( img.complete ) { 136 // Already loaded, clean it up. 137 DoneLoading.call( img ); 138 } else { 139 // Wire up the event listener. 140 this.classList.add( 'loading' ); 141 img.addEventListener( 'load', DoneLoading ); 142 } 143 } 144 145 // After an image has loaded. 146 function DoneLoading() { 147 // Clean up the data attributes of the original element 148 var el = this.$loading; 149 if ( el ) { 150 delete this.$loading; 151 el.classList.remove( 'loading' ); 152 } else { 153 this.classList.remove( 'loading' ); 154 } 155 // Unbind this event. 156 this.removeEventListener( 'load', DoneLoading ); 157 // If this is a temp placeholder image, remove it from the stage. 158 if ( this.$placeholder ) { 159 delete this.$placeholder; 160 if ( this.parentNode ) { 161 this.parentNode.removeChild( this ); 162 } 163 } 164 } 165 166 LazyLoad(); 167 $( document ).on( 'ajaxifyrender', LazyLoad ); 168 setTimeout( LazyLoad, 1000 ); 169 170 window.register( 'a/bootstrap' ); 171 172} );
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.