From 86dc27f4d94888cb34c41bea51c21264266970fb Mon Sep 17 00:00:00 2001 From: aFarkas Date: Sat, 31 Jan 2015 18:21:08 +0100 Subject: [PATCH] extend bgset plugin to support art direction (see #47) --- lazysizes.js | 56 ++++++++-------- lazysizes.min.js | 4 +- plugins/bgset/README.md | 28 +++++++- plugins/bgset/ls.bgset.js | 72 ++++++++++++++++----- plugins/bgset/ls.bgset.min.js | 4 +- plugins/custommedia/ls.custommedia.min.js | 2 +- plugins/include/ls.include.min.js | 2 +- plugins/optimumx/ls.optimumx.min.js | 2 +- plugins/print/ls.print.min.js | 2 +- plugins/rias/ls.rias.min.js | 2 +- plugins/scrollintent/ls.scrollintent.min.js | 2 +- plugins/unveilhooks/ls.unveilhooks.min.js | 2 +- 12 files changed, 119 insertions(+), 59 deletions(-) diff --git a/lazysizes.js b/lazysizes.js index 248a100c..6da98bbd 100644 --- a/lazysizes.js +++ b/lazysizes.js @@ -303,49 +303,45 @@ srcset = elem.getAttribute(lazySizesConfig.srcsetAttr); src = elem.getAttribute(lazySizesConfig.srcAttr); - firesLoad = event.details.firesLoad || (('src' in elem) && (srcset || src)); + if(isImg) { + parent = elem.parentNode; + isPicture = regPicture.test(parent.nodeName || ''); + } + + firesLoad = event.details.firesLoad || (('src' in elem) && (srcset || src || isPicture)); if(firesLoad){ isLoading++; addRemoveLoadEvents(elem, resetPreloading, true); clearTimeout(resetPreloadingTimer); resetPreloadingTimer = setTimeout(resetPreloading, 3000); - - if(isImg) { - parent = elem.parentNode; - isPicture = regPicture.test(parent.nodeName || ''); - } } - if(srcset || src){ - - if(isPicture){ - sources = parent.getElementsByTagName('source'); - for(i = 0, len = sources.length; i < len; i++){ - if( (customMedia = lazySizesConfig.customMedia[sources[i].getAttribute('media')]) ){ - sources[i].setAttribute('media', customMedia); - } - sourceSrcset = sources[i].getAttribute(lazySizesConfig.srcsetAttr); - if(sourceSrcset){ - sources[i].setAttribute('srcset', sourceSrcset); - } + if(isPicture){ + sources = parent.getElementsByTagName('source'); + for(i = 0, len = sources.length; i < len; i++){ + if( (customMedia = lazySizesConfig.customMedia[sources[i].getAttribute('media')]) ){ + sources[i].setAttribute('media', customMedia); + } + sourceSrcset = sources[i].getAttribute(lazySizesConfig.srcsetAttr); + if(sourceSrcset){ + sources[i].setAttribute('srcset', sourceSrcset); } } + } - if(srcset){ - - elem.setAttribute('srcset', srcset); + if(srcset){ + elem.setAttribute('srcset', srcset); - if(fixChrome && sizes){ - elem.removeAttribute('src'); - } + if(fixChrome && sizes){ + elem.removeAttribute('src'); + } - } else if(src){ - if(regIframe.test(elem.nodeName)){ - changeIframeSrc(elem, src); - } else { - elem.setAttribute('src', src); - } + } else if(src){ + if(regIframe.test(elem.nodeName)){ + changeIframeSrc(elem, src); + } else { + elem.setAttribute('src', src); } } diff --git a/lazysizes.min.js b/lazysizes.min.js index 0d5d41e2..ee1f56d1 100644 --- a/lazysizes.min.js +++ b/lazysizes.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ -!function(a,b){a.lazySizes=b(a,a.document),"function"==typeof define&&define.amd&&define(a.lazySizes)}(window,function(a,b){"use strict";if(b.getElementsByClassName){var c,d=b.documentElement,e=/^picture$/i,f=["load","error","lazyincluded","_lazyloaded"],g=function(a,b){var c=new RegExp("(\\s|^)"+b+"(\\s|$)");return a.className.match(c)&&c},h=function(a,b){g(a,b)||(a.className+=" "+b)},i=function(a,b){var c;(c=g(a,b))&&(a.className=a.className.replace(c," "))},j=function(a,b,c){var d=c?"addEventListener":"removeEventListener";c&&j(a,b),f.forEach(function(c){a[d](c,b)})},k=function(a,c,d){var e=b.createEvent("Event");return e.initEvent(c,!0,!0),e.details=d||{},a.dispatchEvent(e),e},l=function(b,c){var d,e;a.HTMLPictureElement||(a.picturefill?picturefill({reevaluate:!0,reparse:!0,elements:[b]}):a.respimage?(c&&(e=c.srcset&&"srcset"||c.src&&"src")&&(d=b[respimage._.ns],d&&d[e]!=c[e]&&b.getAttribute(e)==c[e]&&(d[e]=void 0)),respimage({reparse:!0,elements:[b]})):c&&c.src&&(b.src=c.src))},m=function(a,b){return getComputedStyle(a,null)[b]},n=function(a,d){for(var e=a.offsetWidth;eK||!a.target)&&(K=0)},N=function(a,c){var e,f=a,g="hidden"!=m(a,"visibility");for(v-=c,y+=c,w-=c,x+=c;g&&(f=f.offsetParent)&&f!=d&&f!=b.body;)g=p&&4>K||(m(f,"opacity")||1)>0,g&&"visible"!=m(f,"overflow")&&(e=f.getBoundingClientRect(),g=x>e.left-1&&we.top-1&&vm&&f[m];m++,L++)if((i=f[m].getAttribute("data-expand"))&&(e=1*i)||(e=H),!(K>6&&(!i||"src"in f[m])))if(K>3&&e>E&&(e=E),j!==e&&(t=innerWidth+e,u=innerHeight+e,h=-1*e,j=e),a=f[m].getBoundingClientRect(),(y=a.bottom)>=h&&(v=a.top)<=u&&(x=a.right)>=h&&(w=a.left)<=t&&(y||x||w||v)&&(p&&H==F&&3>K&&4>J&&!i||N(f[m],e)))L--,l+=2,S(f[m]),d=!0;else{if(!s&&Date.now()-l>3)return L++,s=!0,void P();!d&&p&&!b&&3>K&&4>J&&(g[0]||c.preloadAfterLoad)&&(g[0]||!i&&(y||x||w||v||"auto"!=f[m].getAttribute(c.sizesAttr)))&&(b=g[0]||f[m])}L=0,s=!1,J++,G>H&&2>K&&J>4?(H=G,J=0,P()):H!=F&&(H=F),b&&!d&&S(b)}},P=o(O),Q=function(a){h(a.target,c.loadedClass),i(a.target,c.loadingClass),j(a.target,Q)},R=function(a,b){try{a.contentWindow.location.replace(b)}catch(c){a.setAttribute("src",b)}},S=function(a,b){var d,f,g,m,n,o,s,t,u,v,w,x=a.currentSrc||a.src,y=C.test(a.nodeName),z=a.getAttribute(c.sizesAttr)||a.getAttribute("sizes"),E="auto"==z;if(!E&&(B||p)||!y||!x||a.complete){if(!(u=k(a,"lazybeforeunveil",{force:!!b})).defaultPrevented){if(z&&(E?q.updateElem(a,!0):a.setAttribute("sizes",z)),o=a.getAttribute(c.srcsetAttr),n=a.getAttribute(c.srcAttr),v=u.details.firesLoad||"src"in a&&(o||n),v&&(K++,j(a,M,!0),clearTimeout(r),r=setTimeout(M,3e3),y&&(s=a.parentNode,t=e.test(s.nodeName||""))),o||n){if(t)for(d=s.getElementsByTagName("source"),f=0,g=d.length;g>f;f++)(w=c.customMedia[d[f].getAttribute("media")])&&d[f].setAttribute("media",w),m=d[f].getAttribute(c.srcsetAttr),m&&d[f].setAttribute("srcset",m);o?(a.setAttribute("srcset",o),A&&z&&a.removeAttribute("src")):n&&(D.test(a.nodeName)?R(a,n):a.setAttribute("src",n))}c.addClasses&&(h(a,c.loadingClass),j(a,Q,!0))}setTimeout(function(){"auto"==z&&h(a,c.autosizesClass),(o||t)&&l(a,{srcset:o,src:n}),i(a,c.lazyClass),(!v||a.complete&&x==(a.currentSrc||a.src))&&(v&&M(u),c.addClasses&&Q(u)),a=null})}},T=function(){n&&!I&&(F=Math.max(Math.min(c.expand||c.threshold||120,300),9),G=4*F),I=!0},U=function(){n=!0,I=!1},V=function(){p=!0,U(),P(!0)},W=function(){f=b.getElementsByClassName(c.lazyClass),g=b.getElementsByClassName(c.lazyClass+" "+c.preloadClass),c.scroll&&addEventListener("scroll",P,!0),addEventListener("resize",function(){I=!1,P()}),a.MutationObserver?new MutationObserver(P).observe(d,{childList:!0,subtree:!0,attributes:!0}):(d.addEventListener("DOMNodeInserted",P,!0),d.addEventListener("DOMAttrModified",P,!0)),addEventListener("hashchange",P,!0),["transitionstart","transitionend","load","focus","mouseover","animationend","click"].forEach(function(a){b.addEventListener(a,P,!0)}),(p=/d$|^c/.test(b.readyState))||(addEventListener("load",V),b.addEventListener("DOMContentLoaded",P)),setTimeout(U,666),P()};return{init:W,checkElems:P,unveil:S}}(),q=function(){var a,d=function(a,b){var c,d,f,g,h,i=a.parentNode;if(i&&(c=n(a,i),h=k(a,"lazybeforesizes",{width:c,dataAttr:!!b}),!h.defaultPrevented&&(c=h.details.width,c&&c!==a._lazysizesWidth))){if(a._lazysizesWidth=c,c+="px",a.setAttribute("sizes",c),e.test(i.nodeName||""))for(d=i.getElementsByTagName("source"),f=0,g=d.length;g>f;f++)d[f].setAttribute("sizes",c);h.details.dataAttr||l(a,h.details)}},f=function(){var b,c=a.length;if(c)for(b=0;c>b;b++)d(a[b])},g=o(f),h=function(){a=b.getElementsByClassName(c.autosizesClass),addEventListener("resize",g)};return{init:h,checkElems:g,updateElem:d}}(),r=function(){r.i||(r.i=!0,q.init(),p.init())};return function(){var b,d={lazyClass:"lazyload",loadedClass:"lazyloaded",loadingClass:"lazyloading",preloadClass:"lazypreload",scroll:!0,autosizesClass:"lazyautosizes",srcAttr:"data-src",srcsetAttr:"data-srcset",sizesAttr:"data-sizes",addClasses:!0,minSize:50,customMedia:{},init:!0};c=a.lazySizesConfig||{};for(b in d)b in c||(c[b]=d[b]);a.lazySizesConfig=c,d.init&&setTimeout(r)}(),{cfg:c,autoSizer:q,loader:p,init:r,updateAllSizes:q.updateElems,updateAllLazy:p.checkElems,unveilLazy:p.unveil,uS:q.updateElem,uP:l,aC:h,rC:i,hC:g,fire:k,gW:n}}}); \ No newline at end of file +!function(a,b){a.lazySizes=b(a,a.document),"function"==typeof define&&define.amd&&define(a.lazySizes)}(window,function(a,b){"use strict";if(b.getElementsByClassName){var c,d=b.documentElement,e=/^picture$/i,f=["load","error","lazyincluded","_lazyloaded"],g=function(a,b){var c=new RegExp("(\\s|^)"+b+"(\\s|$)");return a.className.match(c)&&c},h=function(a,b){g(a,b)||(a.className+=" "+b)},i=function(a,b){var c;(c=g(a,b))&&(a.className=a.className.replace(c," "))},j=function(a,b,c){var d=c?"addEventListener":"removeEventListener";c&&j(a,b),f.forEach(function(c){a[d](c,b)})},k=function(a,c,d){var e=b.createEvent("Event");return e.initEvent(c,!0,!0),e.details=d||{},a.dispatchEvent(e),e},l=function(b,c){var d,e;a.HTMLPictureElement||(a.picturefill?picturefill({reevaluate:!0,reparse:!0,elements:[b]}):a.respimage?(c&&(e=c.srcset&&"srcset"||c.src&&"src")&&(d=b[respimage._.ns],d&&d[e]!=c[e]&&b.getAttribute(e)==c[e]&&(d[e]=void 0)),respimage({reparse:!0,elements:[b]})):c&&c.src&&(b.src=c.src))},m=function(a,b){return getComputedStyle(a,null)[b]},n=function(a,d){for(var e=a.offsetWidth;eK||!a.target)&&(K=0)},N=function(a,c){var e,f=a,g="hidden"!=m(a,"visibility");for(v-=c,y+=c,w-=c,x+=c;g&&(f=f.offsetParent)&&f!=d&&f!=b.body;)g=p&&4>K||(m(f,"opacity")||1)>0,g&&"visible"!=m(f,"overflow")&&(e=f.getBoundingClientRect(),g=x>e.left-1&&we.top-1&&vm&&f[m];m++,L++)if((i=f[m].getAttribute("data-expand"))&&(e=1*i)||(e=H),!(K>6&&(!i||"src"in f[m])))if(K>3&&e>E&&(e=E),j!==e&&(t=innerWidth+e,u=innerHeight+e,h=-1*e,j=e),a=f[m].getBoundingClientRect(),(y=a.bottom)>=h&&(v=a.top)<=u&&(x=a.right)>=h&&(w=a.left)<=t&&(y||x||w||v)&&(p&&H==F&&3>K&&4>J&&!i||N(f[m],e)))L--,l+=2,S(f[m]),d=!0;else{if(!s&&Date.now()-l>3)return L++,s=!0,void P();!d&&p&&!b&&3>K&&4>J&&(g[0]||c.preloadAfterLoad)&&(g[0]||!i&&(y||x||w||v||"auto"!=f[m].getAttribute(c.sizesAttr)))&&(b=g[0]||f[m])}L=0,s=!1,J++,G>H&&2>K&&J>4?(H=G,J=0,P()):H!=F&&(H=F),b&&!d&&S(b)}},P=o(O),Q=function(a){h(a.target,c.loadedClass),i(a.target,c.loadingClass),j(a.target,Q)},R=function(a,b){try{a.contentWindow.location.replace(b)}catch(c){a.setAttribute("src",b)}},S=function(a,b){var d,f,g,m,n,o,s,t,u,v,w,x=a.currentSrc||a.src,y=C.test(a.nodeName),z=a.getAttribute(c.sizesAttr)||a.getAttribute("sizes"),E="auto"==z;if(!E&&(B||p)||!y||!x||a.complete){if(!(u=k(a,"lazybeforeunveil",{force:!!b})).defaultPrevented){if(z&&(E?q.updateElem(a,!0):a.setAttribute("sizes",z)),o=a.getAttribute(c.srcsetAttr),n=a.getAttribute(c.srcAttr),y&&(s=a.parentNode,t=e.test(s.nodeName||"")),v=u.details.firesLoad||"src"in a&&(o||n||t),v&&(K++,j(a,M,!0),clearTimeout(r),r=setTimeout(M,3e3)),t)for(d=s.getElementsByTagName("source"),f=0,g=d.length;g>f;f++)(w=c.customMedia[d[f].getAttribute("media")])&&d[f].setAttribute("media",w),m=d[f].getAttribute(c.srcsetAttr),m&&d[f].setAttribute("srcset",m);o?(a.setAttribute("srcset",o),A&&z&&a.removeAttribute("src")):n&&(D.test(a.nodeName)?R(a,n):a.setAttribute("src",n)),c.addClasses&&(h(a,c.loadingClass),j(a,Q,!0))}setTimeout(function(){"auto"==z&&h(a,c.autosizesClass),(o||t)&&l(a,{srcset:o,src:n}),i(a,c.lazyClass),(!v||a.complete&&x==(a.currentSrc||a.src))&&(v&&M(u),c.addClasses&&Q(u)),a=null})}},T=function(){n&&!I&&(F=Math.max(Math.min(c.expand||c.threshold||120,300),9),G=4*F),I=!0},U=function(){n=!0,I=!1},V=function(){p=!0,U(),P(!0)},W=function(){f=b.getElementsByClassName(c.lazyClass),g=b.getElementsByClassName(c.lazyClass+" "+c.preloadClass),c.scroll&&addEventListener("scroll",P,!0),addEventListener("resize",function(){I=!1,P()}),a.MutationObserver?new MutationObserver(P).observe(d,{childList:!0,subtree:!0,attributes:!0}):(d.addEventListener("DOMNodeInserted",P,!0),d.addEventListener("DOMAttrModified",P,!0)),addEventListener("hashchange",P,!0),["transitionstart","transitionend","load","focus","mouseover","animationend","click"].forEach(function(a){b.addEventListener(a,P,!0)}),(p=/d$|^c/.test(b.readyState))||(addEventListener("load",V),b.addEventListener("DOMContentLoaded",P)),setTimeout(U,666),P()};return{init:W,checkElems:P,unveil:S}}(),q=function(){var a,d=function(a,b){var c,d,f,g,h,i=a.parentNode;if(i&&(c=n(a,i),h=k(a,"lazybeforesizes",{width:c,dataAttr:!!b}),!h.defaultPrevented&&(c=h.details.width,c&&c!==a._lazysizesWidth))){if(a._lazysizesWidth=c,c+="px",a.setAttribute("sizes",c),e.test(i.nodeName||""))for(d=i.getElementsByTagName("source"),f=0,g=d.length;g>f;f++)d[f].setAttribute("sizes",c);h.details.dataAttr||l(a,h.details)}},f=function(){var b,c=a.length;if(c)for(b=0;c>b;b++)d(a[b])},g=o(f),h=function(){a=b.getElementsByClassName(c.autosizesClass),addEventListener("resize",g)};return{init:h,checkElems:g,updateElem:d}}(),r=function(){r.i||(r.i=!0,q.init(),p.init())};return function(){var b,d={lazyClass:"lazyload",loadedClass:"lazyloaded",loadingClass:"lazyloading",preloadClass:"lazypreload",scroll:!0,autosizesClass:"lazyautosizes",srcAttr:"data-src",srcsetAttr:"data-srcset",sizesAttr:"data-sizes",addClasses:!0,minSize:50,customMedia:{},init:!0};c=a.lazySizesConfig||{};for(b in d)b in c||(c[b]=d[b]);a.lazySizesConfig=c,d.init&&setTimeout(r)}(),{cfg:c,autoSizer:q,loader:p,init:r,updateAllSizes:q.updateElems,updateAllLazy:p.checkElems,unveilLazy:p.unveil,uS:q.updateElem,uP:l,aC:h,rC:i,hC:g,fire:k,gW:n}}}); \ No newline at end of file diff --git a/plugins/bgset/README.md b/plugins/bgset/README.md index 6bafb633..effe838d 100644 --- a/plugins/bgset/README.md +++ b/plugins/bgset/README.md @@ -1,6 +1,6 @@ #lazysizes bgset extension -This simple and small plugin allows you to define multiple background images with a width descriptor, similar to how ``img[srcset]`` works. +This simple and small plugin allows you to define multiple background images with a width descriptor, similar to how ``img[srcset]`` works as also art directed images using media queries. The extension will then load the best image size for the current viewport and device. In case the browser does not support responsive images natively either picturefill or respimage has to be used: @@ -18,9 +18,33 @@ The extension will then load the best image size for the current viewport and de -
+
``` +To use this feature each set has to be separated using the ``" | "`` signs and the media query has to be added after the set inside of square bracket. + +Also the ``customMedia`` can be optionally used to separate the media queries implementation from the markup. + +```html + + +
+``` + +Of course also resolution switching and art direction can be combined: + +```html +
+``` + Here you find a [small bgset demo](http://jsfiddle.net/trixta/bfqqnosp/embedded/result/). diff --git a/plugins/bgset/ls.bgset.js b/plugins/bgset/ls.bgset.js index 000977f0..971502ec 100644 --- a/plugins/bgset/ls.bgset.js +++ b/plugins/bgset/ls.bgset.js @@ -2,22 +2,71 @@ 'use strict'; if(!window.addEventListener){return;} - var proxyWidth = function(elem, image){ + var regSplitSet = /\s*\|\s+|\s+\|\s*/g; + var regSource = /^(.+?)(?:\s+\[\s*(.+?)\s*\])?$/; + + var proxyWidth = function(elem){ var width = lazySizes.gW(elem, elem.parentNode); if(!elem._lazysizesWidth || width > elem._lazysizesWidth){ - image.setAttribute('sizes', width+'px'); elem._lazysizesWidth = width; } return elem._lazysizesWidth; }; + var createPicture = function(sets, elem, img){ + var picture = document.createElement('picture'); + var sizes = elem.getAttribute(lazySizesConfig.sizesAttr); + + sets = sets.split(regSplitSet); + + picture.style.display = 'none'; + img.className = lazySizesConfig.lazyClass; + + if(sets.length == 1 && !sizes){ + sizes = 'auto'; + } + + sets.forEach(function(set){ + var source = document.createElement('source'); + + if(sizes && sizes != 'auto'){ + source.setAttribute('sizes', sizes); + } + + if(set.match(regSource)){ + source.setAttribute(lazySizesConfig.srcsetAttr, RegExp.$1); + if(RegExp.$2){ + source.setAttribute('media', RegExp.$2); + } + } + picture.appendChild(source); + }); + + if(sizes){ + img.setAttribute(lazySizesConfig.sizesAttr, sizes); + if(sizes == 'auto'){ + Object.defineProperty(img, '_lazybgset', { + value: elem, + writable: true + }); + } + } + + picture.appendChild(img); + + elem.appendChild(picture); + + elem.removeAttribute(lazySizesConfig.sizesAttr); + + }; + addEventListener('lazybeforeunveil', function(e){ var set, image, load, init, elem; if(e.defaultPrevented || !(set = e.target.getAttribute('data-bgset'))){return;} - image = document.createElement('img'); + elem = e.target; - proxyWidth(elem, image); + image = document.createElement('img'); load = function(evt){ var bg = evt.type == 'load' ? image.currentSrc || image.src : false; @@ -40,22 +89,13 @@ image.addEventListener('load', load); image.addEventListener('error', load); - image.setAttribute('srcset', set); - image.style.display = 'none'; - image.className = lazySizes.cfg.autosizesClass; - - Object.defineProperty(image, '_lazybgset', { - value: elem, - writable: true - }); - - elem.appendChild(image); + createPicture(set, elem, image); - lazySizes.uP(image); + lazySizes.loader.unveil(image); }); addEventListener('lazybeforesizes', function(e){ if(e.defaultPrevented || !e.target._lazybgset){return;} - e.details.width = proxyWidth(e.target._lazybgset, e.target); + e.details.width = proxyWidth(e.target._lazybgset); }); })(); diff --git a/plugins/bgset/ls.bgset.min.js b/plugins/bgset/ls.bgset.min.js index b746f42f..cd7120d1 100644 --- a/plugins/bgset/ls.bgset.min.js +++ b/plugins/bgset/ls.bgset.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ -!function(){"use strict";if(window.addEventListener){var a=function(a,b){var c=lazySizes.gW(a,a.parentNode);return(!a._lazysizesWidth||c>a._lazysizesWidth)&&(b.setAttribute("sizes",c+"px"),a._lazysizesWidth=c),a._lazysizesWidth};addEventListener("lazybeforeunveil",function(b){var c,d,e,f,g;!b.defaultPrevented&&(c=b.target.getAttribute("data-bgset"))&&(d=document.createElement("img"),g=b.target,a(g,d),e=function(a){var c="load"==a.type?d.currentSrc||d.src:!1;c&&(g.style.backgroundImage="url("+c+")"),f||(lazySizes.fire(g,"_lazyloaded"),b&&b.details&&(b.details.firesLoad=!1),f=!0,b=null)},b.details.firesLoad=!0,d.addEventListener("load",e),d.addEventListener("error",e),d.setAttribute("srcset",c),d.style.display="none",d.className=lazySizes.cfg.autosizesClass,Object.defineProperty(d,"_lazybgset",{value:g,writable:!0}),g.appendChild(d),lazySizes.uP(d))}),addEventListener("lazybeforesizes",function(b){!b.defaultPrevented&&b.target._lazybgset&&(b.details.width=a(b.target._lazybgset,b.target))})}}(); \ No newline at end of file +!function(){"use strict";if(window.addEventListener){var a=/\s*\|\s+|\s+\|\s*/g,b=/^(.+?)(?:\s+\[\s*(.+?)\s*\])?$/,c=function(a){var b=lazySizes.gW(a,a.parentNode);return(!a._lazysizesWidth||b>a._lazysizesWidth)&&(a._lazysizesWidth=b),a._lazysizesWidth},d=function(c,d,e){var f=document.createElement("picture"),g=d.getAttribute(lazySizesConfig.sizesAttr);c=c.split(a),f.style.display="none",e.className=lazySizesConfig.lazyClass,1!=c.length||g||(g="auto"),c.forEach(function(a){var c=document.createElement("source");g&&"auto"!=g&&c.setAttribute("sizes",g),a.match(b)&&(c.setAttribute(lazySizesConfig.srcsetAttr,RegExp.$1),RegExp.$2&&c.setAttribute("media",RegExp.$2)),f.appendChild(c)}),g&&(e.setAttribute(lazySizesConfig.sizesAttr,g),"auto"==g&&Object.defineProperty(e,"_lazybgset",{value:d,writable:!0})),f.appendChild(e),d.appendChild(f),d.removeAttribute(lazySizesConfig.sizesAttr)};addEventListener("lazybeforeunveil",function(a){var b,c,e,f,g;!a.defaultPrevented&&(b=a.target.getAttribute("data-bgset"))&&(g=a.target,c=document.createElement("img"),e=function(b){var d="load"==b.type?c.currentSrc||c.src:!1;d&&(g.style.backgroundImage="url("+d+")"),f||(lazySizes.fire(g,"_lazyloaded"),a&&a.details&&(a.details.firesLoad=!1),f=!0,a=null)},a.details.firesLoad=!0,c.addEventListener("load",e),c.addEventListener("error",e),d(b,g,c),lazySizes.loader.unveil(c))}),addEventListener("lazybeforesizes",function(a){!a.defaultPrevented&&a.target._lazybgset&&(a.details.width=c(a.target._lazybgset))})}}(); \ No newline at end of file diff --git a/plugins/custommedia/ls.custommedia.min.js b/plugins/custommedia/ls.custommedia.min.js index f998cdda..73486e5f 100644 --- a/plugins/custommedia/ls.custommedia.min.js +++ b/plugins/custommedia/ls.custommedia.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ !function(a){"use strict";var b=document.documentElement,c=function(){a.lazySizes&&!lazySizes.getCustomMedias&&(lazySizes.getCustomMedias=function(){var a=/['"]/g,b=/\s*\|\s*/g,c=/^([a-z0-9_-]+)\s*:\s*(.+)$/i,d=function(b,c){return(getComputedStyle(b,c).getPropertyValue("content")||"none").replace(a,"").trim()},e=function(a,d){a.split(b).forEach(function(a){a.match(c)&&(d[RegExp.$1]=RegExp.$2)})};return function(a,b){return a=a||{},b=b||document.querySelector("html"),e(d(b,":before"),a),e(d(b,":after"),a),a}}(),lazySizes.getCustomMedias(lazySizes.cfg.customMedia),b.removeEventListener("lazybeforeunveil",c))};a.addEventListener&&b.addEventListener("lazybeforeunveil",c),c(),setTimeout(c)}(window); \ No newline at end of file diff --git a/plugins/include/ls.include.min.js b/plugins/include/ls.include.min.js index b194e4cd..fb283af5 100644 --- a/plugins/include/ls.include.min.js +++ b/plugins/include/ls.include.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ !function(a,b){"use strict";function c(a){a.match(z)?this.urls[RegExp.$1]=t.map[RegExp.$2]||RegExp.$2:this.urls.include=t.map[a]||a}function d(a){var b,d,e;return a=a.trim(),a=t.map[a]||a,d=a.match(A),d?(e=RegExp.$1,b={condition:s.include.conditions[RegExp.$3]||RegExp.$2||null,name:RegExp.$3}):(e=a,b={condition:null,name:""}),b.urls={},(t.map[e]||e).split(y).forEach(c,b),!b.urls.include&&b.urls.amd&&(this.saved=!0,b.initial=this),b}function e(a){var b,c,e=a.getAttribute("data-include")||"",f=a.lazyInclude;return f&&f.str==e||(c={saved:!1,content:null},f={str:e,candidates:(t.map[e]||e).split(w).map(d,c)},!(b=f.candidates.length)||f.candidates[b-1].condition?(c.saved=!0,f.candidates.push({urls:{},condition:null,name:"initial",content:c})):c.saved&&1==f.candidates.length&&(c.saved=!1),f.initialContent=c,c.saved&&(c.content=a.innerHTML),a.lazyInclude=f,f.candidates.length>1?lazySizes.aC(a,"lazyconditionalinclude"):lazySizes.rC(a,"lazyconditionalinclude")),f}function f(b,c){var d=!c.condition;return c.condition&&(g(),v[c.name]?d=!0:a.matchMedia&&"string"==typeof c.condition?d=(matchMedia(c.condition)||{}).matches:"function"==typeof c.condition&&(d=c.condition(b,c))),d}function g(){var a;v||(u||(u=b.querySelector(t.contentElement)),u?(a=(getComputedStyle(u,":after").getPropertyValue("content")||"none").replace(B,""),v={},a&&(v[a]=1),a=(getComputedStyle(u,":before").getPropertyValue("content")||"none").replace(B,""),a&&(v[a]=1)):v={})}function h(a){var b,c,d=a.lazyInclude;if(d&&d.candidates)for(b=0;b=200&&300>h||304===h:!0,oldCandidate:g,insert:!0,resetHTML:j},l={target:b,details:k};c.modules=f,g&&g.modules&&(g.modules.forEach(n,l),g.modules=null,k.resetHTML&&null==k.content&&c.initial&&c.initial.saved&&(k.content=c.initial.content)),f.forEach(m,l),d=lazySizes.fire(b,"lazyincludeloaded",k),k.insert&&k.isSuccess&&!d.defaultPrevented&&null!=k.content&&k.content!=b.innerHTML&&(a.jQuery?jQuery(b).html(k.content):b.innerHTML=k.content),E.d(),f.forEach(o,l),setTimeout(function(){lazySizes.fire(b,"lazyincluded",k)}),e=null,f=null},b.lazyInclude.current=c,b.setAttribute("data-currentinclude",c.name),c.urls.css&&l(c.urls.css),null==h.content&&c.urls.include?i(h,function(a){e=a,f&&d()}):e=h,c.urls.amd?j(c.urls.amd,function(a){f=a,e&&d()}):f=[],void(e&&f&&d()))}function q(a){var b,c=e(a);return c.candidates.length&&C.contains(a)?(b=h(a),b&&p(a,b),!0):void 0}function r(a){!a.defaultPrevented&&a.target.getAttribute("data-include")&&(E.q(a.target),a.details.firesLoad=!0)}if(b.getElementsByClassName){var s,t,u,v,w=/\s*,+\s+/,x={},y=/\s+/,z=/^(amd|css)\:(.+)/i,A=/(.+)\s+(\(\s*(.+)\s*\))/,B=/['"]/g,C=b.documentElement,D=b.getElementsByClassName("lazyconditionalinclude"),E=function(){var a=2,b=3,c=a,d=0,e=0,f=[],g=function(){var a,b=function(){f.length&&(d=0,f.d())};return function(){clearTimeout(a),a=setTimeout(b,999)}}();return{q:function(a){var h=null==a.getAttribute("data-lazyqueue");h&&(e++,c=b),d>c?f[h?"unshift":"push"](a):q(a)&&(d++,g())},d:function(){if(d&&d--,e>0&&(e--,e||(c=a)),!(d>c)){for(;f.length;)if(q(f.shift())){d++;break}g()}}}}(),F=function(){var a,b=function(){for(var a=0,b=D.length;b>a;a++)!lazySizes.hC(D[a],s.lazyClass)&&h(D[a])&&lazySizes.aC(D[a],s.lazyClass)};return function(c){clearTimeout(a),v=null,a=setTimeout(b,"resize"==c.type?31:0)}}();s=a.lazySizes&&lazySizes.cfg||a.lazySizesConfig,s||(s={},a.lazySizesConfig=s),s.include||(s.include={}),t=s.include,t.contentElement||(t.contentElement="html"),t.conditions||(t.conditions={}),t.map||(t.map={}),"preloadAfterLoad"in s||(s.preloadAfterLoad=!0),addEventListener("lazybeforeunveil",r,!1),addEventListener("resize",F,!1),addEventListener("lazyrefreshincludes",F,!1)}}(window,document); \ No newline at end of file diff --git a/plugins/optimumx/ls.optimumx.min.js b/plugins/optimumx/ls.optimumx.min.js index 433ac852..6aa4401e 100644 --- a/plugins/optimumx/ls.optimumx.min.js +++ b/plugins/optimumx/ls.optimumx.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ !function(a,b){"use strict";function c(a,b){return a.w-b.w}function d(a){var b={srcset:a.getAttribute(lazySizes.cfg.srcsetAttr)||""},d=l(b.srcset);return Object.defineProperty(a,"_lazyOptimumx",{value:b,writable:!0}),b.cands=d,b.index=0,b.dirty=!1,d[0]&&d[0].w?(d.sort(c),b.cSrcset=[d[0].c]):(b.cSrcset=b.srcset?[b.srcset]:[],b.cands=[]),b}function e(a){var b,c,e,f=a.parentNode||{},g=d(a);if(g.isImg=!0,m.test(f.nodeName||""))for(g.picture=!0,b=f.getElementsByTagName("source"),c=0,e=b.length;e>c;c++)d(b[c]).isImg=!1;return g}function f(a,b,c){var d,e;return a&&a.w?a.w>c?!1:(d=1-a.w/c,e=b/c-1,0>e-d):!0}function g(a,b){var c,d;for(c=a.index+1;c=f.cands.length&&(a.removeAttribute("data-optimumx"),a.removeAttribute("data-maxdpr"))),e):void 0}function i(a){var b=a.getAttribute("data-optimumx")||a.getAttribute("data-maxdpr");return b&&(b="auto"==b?j.getOptimumX(a):parseFloat(b,10)),b}var j,k,l,m=/^picture$/i,n=b.documentElement;l=function(){var a,b=/(([^,\s].[^\s]+)\s+(\d+)w)/g,c=/\s+\d+h/g,d=function(b,c,d,e){a.push({c:c,u:d,w:1*e})};return function(e){return a=[],e.replace(c,"").replace(b,d),a}}(),j=a.lazySizes&&lazySizes.cfg||a.lazySizesConfig,j||(j={},a.lazySizesConfig=j),"function"!=typeof j.getOptimumX&&(j.getOptimumX=function(){var b=a.devicePixelRatio;return b>2.4?b*=.63:b>1.9?b*=.8:b>1.4&&(b*=.9),Math.min(Math.round(100*b)/100,2)}),k=function(){a.lazySizes&&!a.lazySizes.getOptimumX&&(lazySizes.getX=i,lazySizes.pWS=l,n.removeEventListener("lazybeforeunveil",k))},n.addEventListener("lazybeforeunveil",k),setTimeout(k),a.devicePixelRatio&&(addEventListener("lazybeforesizes",function(b){var c,d,f,g,j,k,l,m;if(!(b.defaultPrevented||!(c=i(b.target))||c>=a.devicePixelRatio)&&(d=b.target._lazyOptimumx||e(b.target),f=b.details.width*c,f&&(d.width||0)l;l++)h(k[l],f,g);b.details.srcset=h(b.target,f,g)}}),addEventListener("lazybeforeunveil",function(a){a.target._lazyOptimumx&&(a.target._lazyOptimumx=null)}))}(window,document); \ No newline at end of file diff --git a/plugins/print/ls.print.min.js b/plugins/print/ls.print.min.js index e5bbdfac..3f484d9a 100644 --- a/plugins/print/ls.print.min.js +++ b/plugins/print/ls.print.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ !function(a){"use strict";var b,c,d,e;a.addEventListener&&(b=a.lazySizes&&lazySizes.cfg||a.lazySizesConfig||{},c=b.lazyClass||"lazyload",d=function(){var b,d;if("string"==typeof c&&(c=document.getElementsByClassName(c)),a.lazySizes)for(b=0,d=c.length;d>b;b++)lazySizes.unveilLazy(c[b])},addEventListener("beforeprint",d,!1),!("onbeforeprint"in a)&&a.matchMedia&&(e=matchMedia("print"))&&e.addListener&&e.addListener(function(){e.matches&&d()}))}(window); \ No newline at end of file diff --git a/plugins/rias/ls.rias.min.js b/plugins/rias/ls.rias.min.js index 1f98fa78..4fe27aec 100644 --- a/plugins/rias/ls.rias.min.js +++ b/plugins/rias/ls.rias.min.js @@ -1,3 +1,3 @@ -/*! lazysizes - v0.9.0-RC2 - 2015-01-30 +/*! lazysizes - v0.9.0-RC2 - 2015-01-31 Licensed MIT */ !function(a,b){"use strict";function c(a,b){var c,d,e,f;d=a.parentNode,f={isPicture:!(!d||!l.test(d.nodeName||""))},e=function(b,c){var d=a.getAttribute("data-"+b);if(null!=d){if("true"==d)d=!0;else if("false"==d)d=!1;else if(k.test(d))d=parseFloat(d);else if("function"==typeof i[b])d=i[b](a,d);else if(o.test(d))try{d=JSON.parse(d)}catch(e){}f[b]=d}else b in i&&"function"!=typeof i[b]?f[b]=i[b]:c&&"function"==typeof i[b]&&(f[b]=i[b](a,d))};for(c in i)e(c);return b.replace(n,function(a,b){b in f||e(b,!0)}),f}function d(a,b){var c=[],d=function(a,c){return j[typeof b[c]]?b[c]:a};return c.srcset=[],b.absUrl&&(q.setAttribute("href",a),a=q.href),a=((b.prefix||"")+a+(b.postfix||"")).replace(n,d),b.widths.forEach(function(d){var e={u:a.replace(m,b.widthmap[d]||d),w:d};c.push(e),c.srcset.push(e.c=e.u+" "+d+"w")}),c}function e(a,b,c){a&&(a=d(a,b),a.isPicture=b.isPicture,c.setAttribute(h.srcsetAttr,a.srcset.join(", ")),Object.defineProperty(c,"_lazyrias",{value:a,writable:!0}))}function f(a,b){var d=c(a,b);return i.modifyOptions.call(a,{target:a,details:d}),lazySizes.fire(a,"lazyriasmodifyoptions",d),d}function g(a){return a.getAttribute(a.getAttribute("data-srcattr")||i.srcAttr)||a.getAttribute(h.srcsetAttr)||a.getAttribute(h.srcAttr)||""}if(b.addEventListener){var h,i,j={string:1,number:1},k=/^\-*\+*\d+\.*\d*$/,l=/^picture$/i,m=/\s*\{\s*width\s*\}\s*/i,n=/\s*\{\s*([a-z0-9]+)\s*\}\s*/gi,o=/^\[.*\]|\{.*\}$/,p=/^(?:auto|\d+(px)?)$/,q=b.createElement("a");!function(){var b,c=function(){},d={prefix:"",postfix:"",srcAttr:"data-src",absUrl:!1,modifyOptions:c,widthmap:{}};h=a.lazySizes&&lazySizes.cfg||a.lazySizesConfig,h||(h={},a.lazySizesConfig=h),h.rias||(h.rias={}),i=h.rias,"widths"in i||(i.widths=[],function(a){var b,c=0;for(a.push(96);!b||2800>b;)c+=10,c>60&&(c+=10),b=16*c,a.push(b)}(i.widths));for(b in d)b in i||(i[b]=d[b])}(),addEventListener("lazybeforeunveil",function(a){var b,c,d,j,k,l,n,o,q;if(b=a.target,!a.defaultPrevented&&(c=g(b))&&!i.disabled&&(q=b.getAttribute(h.sizesAttr)||b.getAttribute("sizes"))&&p.test(q)){if(d=f(b,c),m.test(c)||m.test(d.prefix)||m.test(d.postfix)){if(d.isPicture&&(j=b.parentNode))for(k=j.getElementsByTagName("source"),l=0,n=k.length;n>l;l++)o=g(k[l]),e(o,d,k[l]);e(c,d,b)}"auto"!=q&&r({target:b,details:{width:parseInt(q,10)}})}});var r=function(){var c=function(a,b,c,d){return Math.abs(b.w-d.w)g;g++)if(d(f[g])&&!f[g].getAttribute("type")&&(!(i=f[g].getAttribute("media"))||(matchMedia(i)||{}).matches)){j=f[g]._lazyrias;break}return(!j.w||j.w