diff --git a/js/inline-loader.asset.php b/js/inline-loader.asset.php index 7ce9404f..93c70036 100644 --- a/js/inline-loader.asset.php +++ b/js/inline-loader.asset.php @@ -1 +1 @@ - array(), 'version' => '2814799d655f563dcef8'); + array(), 'version' => '007ec7db37693c504126'); diff --git a/js/inline-loader.js b/js/inline-loader.js index 2c932cdd..b07eff28 100644 --- a/js/inline-loader.js +++ b/js/inline-loader.js @@ -1 +1 @@ -!function(){const e={deviceDensity:window.devicePixelRatio?window.devicePixelRatio:"auto",density:null,config:CLDLB||{},lazyThreshold:0,enabled:!1,sizeBands:[],iObserver:null,pObserver:null,rObserver:null,aboveFold:!0,minPlaceholderThreshold:500,bind(e){e.CLDbound=!0,this.enabled||this._init();const t=e.dataset.size.split(" ");e.originalWidth=t[0],e.originalHeight=t[1],this.pObserver?(this.aboveFold&&this.inInitialView(e)?this.buildImage(e):(this.pObserver.observe(e),this.iObserver.observe(e)),e.addEventListener("error",t=>{e.srcset="",e.src='data:image/svg+xml;utf8,%26%23x26A0%3B︎',this.rObserver.unobserve(e)})):this.setupFallback(e)},buildImage(e){e.dataset.srcset?(e.cld_loaded=!0,e.srcset=e.dataset.srcset):(e.src=this.getSizeURL(e),e.dataset.responsive&&this.rObserver.observe(e))},inInitialView(e){const t=e.getBoundingClientRect();return this.aboveFold=t.top{if(i<=e.originalWidth){let s=this.getSizeURL(e,i,!0)+` ${i}w`;-1===t.indexOf(s)&&t.push(s)}}),e.srcset=t.join(","),e.sizes=`(max-width: ${e.originalWidth}px) 100vw, ${e.originalWidth}px`},_init(){this.enabled=!0,this._calcThreshold(),this._getDensity();let e=parseInt(this.config.max_width);const t=parseInt(this.config.min_width),i=parseInt(this.config.pixel_step);for(;e-i>=t;)e-=i,this.sizeBands.push(e);"undefined"!=typeof IntersectionObserver&&this._setupObservers(),this.enabled=!0},_setupObservers(){const e={rootMargin:this.lazyThreshold+"px 0px "+this.lazyThreshold+"px 0px"},t=this.minPlaceholderThreshold<2*this.lazyThreshold?2*this.lazyThreshold:this.minPlaceholderThreshold,i={rootMargin:t+"px 0px "+t+"px 0px"};this.rObserver=new ResizeObserver((e,t)=>{e.forEach(e=>{e.target.cld_loaded&&e.contentRect.width>=e.target.cld_loaded&&(e.target.src=this.getSizeURL(e.target))})}),this.iObserver=new IntersectionObserver((e,t)=>{e.forEach(e=>{e.isIntersecting&&(this.buildImage(e.target),t.unobserve(e.target),this.pObserver.unobserve(e.target))})},e),this.pObserver=new IntersectionObserver((e,t)=>{e.forEach(e=>{e.isIntersecting&&(e.target.src=this.getPlaceholderURL(e.target),t.unobserve(e.target))})},i)},_calcThreshold(){const e=this.config.lazy_threshold.replace(/[^0-9]/g,"");let t=0;switch(this.config.lazy_threshold.replace(/[0-9]/g,"").toLowerCase()){case"em":t=parseFloat(getComputedStyle(document.body).fontSize)*e;break;case"rem":t=parseFloat(getComputedStyle(document.documentElement).fontSize)*e;break;case"vh":t=window.innerHeight/e*100;break;default:t=e}this.lazyThreshold=parseInt(t,10)},_getDensity(){let e=this.config.dpr?this.config.dpr.replace("X",""):"off";if("off"===e)return this.density=1,1;let t=this.deviceDensity;"max"!==e&&"auto"!==t&&(e=parseFloat(e),t=t>Math.ceil(e)?e:t),this.density=t},scaleWidth(e,t,i){const s=parseInt(this.config.max_width),r=Math.round(s/i);if(!t){t=e.width;let a=Math.round(t/i);for(;-1===this.sizeBands.indexOf(t)&&as&&(t=s),e.originalWidthe.dataset.seo&&"upload"===e.dataset.delivery?"images":"image/"+e.dataset.delivery,getSizeURL(e,t){const i=this.scaleSize(e,t,!0);return[this.config.base_url,this.getDeliveryMethod(e),"upload"===e.dataset.delivery?i.transformation:"",e.dataset.transformations,"v"+e.dataset.version,e.dataset.publicId+"?_i=AA"].filter(this.empty).join("/")},getPlaceholderURL(e){e.cld_placehold=!0;const t=this.scaleSize(e,null,!1);return[this.config.base_url,this.getDeliveryMethod(e),t.transformation,this.config.placeholder,e.dataset.publicId].filter(this.empty).join("/")},empty:e=>void 0!==e&&0!==e.length};window.CLDBind=t=>{t.CLDbound||e.bind(t)},window.initFallback=()=>{[...document.querySelectorAll('img[data-cloudinary="lazy"]')].forEach(e=>{CLDBind(e)})},window.addEventListener("load",()=>{initFallback()}),document.querySelector('script[src*="?cloudinary_lazy_load_loader"]')&&initFallback()}(); \ No newline at end of file +!function(){const e={deviceDensity:window.devicePixelRatio?window.devicePixelRatio:"auto",density:null,config:CLDLB||{},lazyThreshold:0,enabled:!1,sizeBands:[],iObserver:null,pObserver:null,rObserver:null,aboveFold:!0,minPlaceholderThreshold:500,bind(e){e.CLDbound=!0,this.enabled||this._init();const t=e.dataset.size.split(" ");e.originalWidth=t[0],e.originalHeight=t[1],this.pObserver?(this.aboveFold&&this.inInitialView(e)?this.buildImage(e):(this.pObserver.observe(e),this.iObserver.observe(e)),e.addEventListener("error",t=>{e.srcset="",e.src='data:image/svg+xml;utf8,%26%23x26A0%3B︎',this.rObserver.unobserve(e)})):this.setupFallback(e)},buildImage(e){e.dataset.srcset?(e.cld_loaded=!0,e.srcset=e.dataset.srcset):(e.src=this.getSizeURL(e),e.dataset.responsive&&this.rObserver.observe(e))},inInitialView(e){const t=e.getBoundingClientRect();return this.aboveFold=t.top{if(i<=e.originalWidth){let s=this.getSizeURL(e,i,!0)+` ${i}w`;-1===t.indexOf(s)&&t.push(s)}}),e.srcset=t.join(","),e.sizes=`(max-width: ${e.originalWidth}px) 100vw, ${e.originalWidth}px`},_init(){this.enabled=!0,this._calcThreshold(),this._getDensity();let e=parseInt(this.config.max_width);const t=parseInt(this.config.min_width),i=parseInt(this.config.pixel_step);for(;e-i>=t;)e-=i,this.sizeBands.push(e);"undefined"!=typeof IntersectionObserver&&this._setupObservers(),this.enabled=!0},_setupObservers(){const e={rootMargin:this.lazyThreshold+"px 0px "+this.lazyThreshold+"px 0px"},t=this.minPlaceholderThreshold<2*this.lazyThreshold?2*this.lazyThreshold:this.minPlaceholderThreshold,i={rootMargin:t+"px 0px "+t+"px 0px"};this.rObserver=new ResizeObserver((e,t)=>{e.forEach(e=>{e.target.cld_loaded&&e.contentRect.width>=e.target.cld_loaded&&(e.target.src=this.getSizeURL(e.target))})}),this.iObserver=new IntersectionObserver((e,t)=>{e.forEach(e=>{e.isIntersecting&&(this.buildImage(e.target),t.unobserve(e.target),this.pObserver.unobserve(e.target))})},e),this.pObserver=new IntersectionObserver((e,t)=>{e.forEach(e=>{e.isIntersecting&&(e.target.src=this.getPlaceholderURL(e.target),t.unobserve(e.target))})},i)},_calcThreshold(){const e=this.config.lazy_threshold.replace(/[^0-9]/g,"");let t=0;switch(this.config.lazy_threshold.replace(/[0-9]/g,"").toLowerCase()){case"em":t=parseFloat(getComputedStyle(document.body).fontSize)*e;break;case"rem":t=parseFloat(getComputedStyle(document.documentElement).fontSize)*e;break;case"vh":t=window.innerHeight/e*100;break;default:t=e}this.lazyThreshold=parseInt(t,10)},_getDensity(){let e=this.config.dpr?this.config.dpr.replace("X",""):"off";if("off"===e)return this.density=1,1;let t=this.deviceDensity;"auto"!==t&&(t=Math.round(2*t)/2),"max"!==e&&"auto"!==t&&(e=parseFloat(e),e=Math.round(2*e)/2,t=t>Math.ceil(e)?e:t),this.density=t},scaleWidth(e,t,i){const s=parseInt(this.config.max_width),r=Math.round(s/i);if(!t){t=e.width;let a=Math.round(t/i);for(;-1===this.sizeBands.indexOf(t)&&as&&(t=s),e.originalWidthe.dataset.seo&&"upload"===e.dataset.delivery?"images":"image/"+e.dataset.delivery,getSizeURL(e,t){const i=this.scaleSize(e,t,!0);return[this.config.base_url,this.getDeliveryMethod(e),"upload"===e.dataset.delivery?i.transformation:"",e.dataset.transformations,"v"+e.dataset.version,e.dataset.publicId+"?_i=AA"].filter(this.empty).join("/")},getPlaceholderURL(e){e.cld_placehold=!0;const t=this.scaleSize(e,null,!1);return[this.config.base_url,this.getDeliveryMethod(e),t.transformation,this.config.placeholder,e.dataset.publicId].filter(this.empty).join("/")},empty:e=>void 0!==e&&0!==e.length};window.CLDBind=t=>{t.CLDbound||e.bind(t)},window.initFallback=()=>{[...document.querySelectorAll('img[data-cloudinary="lazy"]')].forEach(e=>{CLDBind(e)})},window.addEventListener("load",()=>{initFallback()}),document.querySelector('script[src*="?cloudinary_lazy_load_loader"]')&&initFallback()}(); \ No newline at end of file diff --git a/js/lazy-load.asset.php b/js/lazy-load.asset.php index 8bd63baf..9e10e59b 100644 --- a/js/lazy-load.asset.php +++ b/js/lazy-load.asset.php @@ -1 +1 @@ - array(), 'version' => 'ded1dd3da3fe93cb64da'); + array(), 'version' => '55e7765755171c4d412c'); diff --git a/js/lazy-load.js b/js/lazy-load.js index 0a9e7a75..be38d364 100644 --- a/js/lazy-load.js +++ b/js/lazy-load.js @@ -1 +1 @@ -!function(){const t={deviceDensity:window.devicePixelRatio?window.devicePixelRatio:"auto",density:null,images:[],throttle:!1,config:CLDLB||{},lazyThreshold:0,_init(){this._calcThreshold(),[...document.images].forEach(t=>{if(!t.dataset.publicId)return;const i=t.dataset.size.split(" ");t.originalWidth=i[0],t.originalHeight=i[1],i[2]&&(t.crop=i[2]),this.images.push(t),t.addEventListener("error",i=>{t.src='data:image/svg+xml;utf8,%26%23x26A0%3B︎';const e=this.images.indexOf(t);this.images.splice(e,1)})}),window.addEventListener("resize",()=>{this._throttle(this._build.bind(this),100,!0)}),window.addEventListener("scroll",()=>{this._throttle(this._build.bind(this),100,!1)}),setTimeout(()=>this._build(),0)},_calcThreshold(){const t=this.config.lazy_threshold.replace(/[^0-9]/g,"");let i=0;switch(this.config.lazy_threshold.replace(/[0-9]/g,"").toLowerCase()){case"em":i=parseFloat(getComputedStyle(document.body).fontSize)*t;break;case"rem":i=parseFloat(getComputedStyle(document.documentElement).fontSize)*t;break;case"vh":i=window.innerHeight/t*100;break;default:i=t}this.lazyThreshold=window.innerHeight+parseInt(i,10)},_getDensity(){if(this.density)return this.density;let t=this.config.dpr?this.config.dpr.replace("X",""):"off";if("off"===t)return this.density=1,1;let i=this.deviceDensity;return"max"!==t&&"auto"!==i&&(t=parseFloat(t),i=i>Math.ceil(t)?t:i),this.density=i,i},_throttle(t,i,e){this.throttle||setTimeout(()=>{t(e),this.throttle=!1},i)},_build(t){this.images.forEach(i=>{!t&&i.cld_loaded||this.buildSize(i)})},_shouldRebuild(t){const i=this.scaleWidth(t),e=t.getBoundingClientRect(),s="auto"!==this.density?this._getDensity():1;return e.topt.naturalWidth/s||!t.cld_loaded)},_shouldPlacehold(t){const i=this.scaleWidth(t),e=t.getBoundingClientRect(),s="auto"!==this.density?this._getDensity():1;return this.config.placeholder&&!t.cld_loaded&&e.top<2*this.lazyThreshold&&(i>t.naturalWidth/s||!t.cld_placehold)},scaleWidth(t){const i=this.config.pixel_step,e=Math.floor((t.originalWidth-t.width)/i);let s=t.originalWidth-i*e;return s>t.originalWidth?s=t.originalWidth:this.config.max_widths&&(s=this.config.min_width),s},scaleSize(t,i){const e=(t.originalWidth/t.originalHeight).toFixed(3),s=(t.width/t.height).toFixed(3),o=this.scaleWidth(t),h=[];t.width!==t.originalWidth&&h.push(e===s?"c_scale":"c_fill,g_auto");const a=Math.round(o/s);if(h.push("w_"+o),h.push("h_"+a),i){const t=this._getDensity();1!==t&&h.push("dpr_"+t)}return{transformation:h.join(","),nameExtension:o+"x"+a}},buildSize(t){this._shouldRebuild(t)?t.dataset.srcset?(t.cld_loaded=!0,t.srcset=t.dataset.srcset):t.src=this.getSizeURL(t):this._shouldPlacehold(t)&&(t.src=this.getPlaceholderURL(t))},getSizeURL(t){t.cld_loaded=!0;const i=this.scaleSize(t,!0),e="auto"!==this.config.image_format&&"none"!==this.config.image_format?this.config.image_format:t.dataset.format,s=t.dataset.publicId.split("/").pop();return[this.config.base_url,"images",i.transformation,t.dataset.transformations,t.dataset.publicId,s+"-"+i.nameExtension+"."+e+"?_i=AA"].filter(this.empty).join("/")},getPlaceholderURL(t){t.cld_placehold=!0;const i=this.scaleSize(t,!1);return[this.config.base_url,"images",i.transformation,this.config.placeholder,t.dataset.publicId,"placeholder"].filter(this.empty).join("/")},empty:t=>0!==t.length};window.addEventListener("load",()=>{t._init()})}(); \ No newline at end of file +!function(){const t={deviceDensity:window.devicePixelRatio?window.devicePixelRatio:"auto",density:null,images:[],throttle:!1,config:CLDLB||{},lazyThreshold:0,_init(){this._calcThreshold(),[...document.images].forEach(t=>{if(!t.dataset.publicId)return;const i=t.dataset.size.split(" ");t.originalWidth=i[0],t.originalHeight=i[1],i[2]&&(t.crop=i[2]),this.images.push(t),t.addEventListener("error",i=>{t.src='data:image/svg+xml;utf8,%26%23x26A0%3B︎';const e=this.images.indexOf(t);this.images.splice(e,1)})}),window.addEventListener("resize",()=>{this._throttle(this._build.bind(this),100,!0)}),window.addEventListener("scroll",()=>{this._throttle(this._build.bind(this),100,!1)}),setTimeout(()=>this._build(),0)},_calcThreshold(){const t=this.config.lazy_threshold.replace(/[^0-9]/g,"");let i=0;switch(this.config.lazy_threshold.replace(/[0-9]/g,"").toLowerCase()){case"em":i=parseFloat(getComputedStyle(document.body).fontSize)*t;break;case"rem":i=parseFloat(getComputedStyle(document.documentElement).fontSize)*t;break;case"vh":i=window.innerHeight/t*100;break;default:i=t}this.lazyThreshold=window.innerHeight+parseInt(i,10)},_getDensity(){if(this.density)return this.density;let t=this.config.dpr?this.config.dpr.replace("X",""):"off";if("off"===t)return this.density=1,1;let i=this.deviceDensity;return"auto"!==i&&(i=Math.round(2*i)/2),"max"!==t&&"auto"!==i&&(t=parseFloat(t),t=Math.round(2*t)/2,i=i>Math.ceil(t)?t:i),this.density=i,i},_throttle(t,i,e){this.throttle||setTimeout(()=>{t(e),this.throttle=!1},i)},_build(t){this.images.forEach(i=>{!t&&i.cld_loaded||this.buildSize(i)})},_shouldRebuild(t){const i=this.scaleWidth(t),e=t.getBoundingClientRect(),s="auto"!==this.density?this._getDensity():1;return e.topt.naturalWidth/s||!t.cld_loaded)},_shouldPlacehold(t){const i=this.scaleWidth(t),e=t.getBoundingClientRect(),s="auto"!==this.density?this._getDensity():1;return this.config.placeholder&&!t.cld_loaded&&e.top<2*this.lazyThreshold&&(i>t.naturalWidth/s||!t.cld_placehold)},scaleWidth(t){const i=this.config.pixel_step,e=Math.floor((t.originalWidth-t.width)/i);let s=t.originalWidth-i*e;return s>t.originalWidth?s=t.originalWidth:this.config.max_widths&&(s=this.config.min_width),s},scaleSize(t,i){const e=(t.originalWidth/t.originalHeight).toFixed(3),s=(t.width/t.height).toFixed(3),o=this.scaleWidth(t),a=[];t.width!==t.originalWidth&&a.push(e===s?"c_scale":"c_fill,g_auto");const h=Math.round(o/s);if(a.push("w_"+o),a.push("h_"+h),i){const t=this._getDensity();1!==t&&a.push("dpr_"+t)}return{transformation:a.join(","),nameExtension:o+"x"+h}},buildSize(t){this._shouldRebuild(t)?t.dataset.srcset?(t.cld_loaded=!0,t.srcset=t.dataset.srcset):t.src=this.getSizeURL(t):this._shouldPlacehold(t)&&(t.src=this.getPlaceholderURL(t))},getSizeURL(t){t.cld_loaded=!0;const i=this.scaleSize(t,!0),e="auto"!==this.config.image_format&&"none"!==this.config.image_format?this.config.image_format:t.dataset.format,s=t.dataset.publicId.split("/").pop();return[this.config.base_url,"images",i.transformation,t.dataset.transformations,t.dataset.publicId,s+"-"+i.nameExtension+"."+e+"?_i=AA"].filter(this.empty).join("/")},getPlaceholderURL(t){t.cld_placehold=!0;const i=this.scaleSize(t,!1);return[this.config.base_url,"images",i.transformation,this.config.placeholder,t.dataset.publicId,"placeholder"].filter(this.empty).join("/")},empty:t=>0!==t.length};window.addEventListener("load",()=>{t._init()})}(); \ No newline at end of file diff --git a/src/js/inline-loader.js b/src/js/inline-loader.js index 18a54019..e846e837 100644 --- a/src/js/inline-loader.js +++ b/src/js/inline-loader.js @@ -151,11 +151,20 @@ const CloudinaryLoader = { return 1; } let deviceDensity = this.deviceDensity; + + // Round to nearest 0.5 to reduce URL variations + if ( 'auto' !== deviceDensity ) { + deviceDensity = Math.round( deviceDensity * 2 ) / 2; + } + if ( 'max' !== maxDensity && 'auto' !== deviceDensity ) { maxDensity = parseFloat( maxDensity ); + + // Round maxDensity to nearest 0.5 to maintain consistency + maxDensity = Math.round( maxDensity * 2 ) / 2; deviceDensity = deviceDensity > Math.ceil( maxDensity ) ? maxDensity diff --git a/src/js/lazy-load.js b/src/js/lazy-load.js index 34807a5e..52da41a0 100644 --- a/src/js/lazy-load.js +++ b/src/js/lazy-load.js @@ -73,11 +73,19 @@ const LazyLoad = { return 1; } let deviceDensity = this.deviceDensity; + + // Round to nearest 0.5 to reduce URL variations + if ( 'auto' !== deviceDensity ) { + deviceDensity = Math.round( deviceDensity * 2 ) / 2; + } + if ( 'max' !== maxDensity && 'auto' !== deviceDensity ) { maxDensity = parseFloat( maxDensity ); + // Round maxDensity to nearest 0.5 to maintain consistency + maxDensity = Math.round( maxDensity * 2 ) / 2; deviceDensity = deviceDensity > Math.ceil( maxDensity ) ? maxDensity