https://www.coversandall.co.uk/_next/static/chunks/1351-15cc458609b4690b.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[1351],{91351:(e,t,l)=>{l.d(t,{A:()=>I});var r=l(95155),n=l(12115),a=l(1019),i=l(2582),o=l(1213),s=l(32321),c=l(15239),u=l(10127),d=l(78701),m=l(57599),h=l(48093),f=l(5512),w=l(36219),p=l(35184),x=l(66315);let b=e=>{let t=document.getElementById("thumbnail-container"),l=null==t?void 0:t.children[e];l&&l.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"})},g=e=>{let{galleryData:t,selectedIndex:l,onClose:a,onSelectedChange:i}=e,[o,s]=(0,n.useState)(1),[g,v]=(0,n.useState)(l),y=(0,n.useRef)(null);(0,n.useEffect)(()=>{v(l),b(l)},[l]);let j=(0,n.useCallback)(e=>{(0,x.b)(y.current),v(e),s(1),null==i||i(e),b(e)},[i]),C=e=>"external-video"===e.media_type&&!!e.video_url,N=e=>"video"===e.media_type&&!!e.url,T=()=>s(e=>Math.min(e+.25,3)),k=()=>s(e=>Math.max(e-.25,1)),E=(0,n.useCallback)(e=>{let l=t[g];C(l)||N(l)||(e.preventDefault(),e.deltaY<0?T():k())},[g,t]);if((0,n.useEffect)(()=>{let e=y.current;if(e)return e.addEventListener("wheel",E,{passive:!1}),()=>e.removeEventListener("wheel",E)},[E]),(0,n.useEffect)(()=>{let e=e=>"Escape"===e.key&&a();return window.addEventListener("keydown",e),()=>window.removeEventListener("keydown",e)},[a]),(0,n.useEffect)(()=>()=>(0,x.b)(document.getElementById("pdp-image-preview-modal")),[]),!(null==t?void 0:t.length))return null;let _=t[g],I=C(_)||N(_);return(0,r.jsxs)("div",{id:"pdp-image-preview-modal",ref:y,className:"fixed inset-0 z-[1003] flex flex-col items-center justify-center bg-white",children:[(0,r.jsx)(w.A,{onClick:()=>{(0,x.b)(y.current),a()},className:"absolute top-6 right-6 z-10 rounded-full bg-white/80 p-1 text-gray-800 hover:text-white focus:text-white",title:"Close",children:(0,r.jsx)(u.u,{size:25,weight:"bold"})}),!I&&(0,r.jsxs)("div",{className:"absolute top-10 left-6 z-60 mt-4 flex -translate-y-1/2 flex-col gap-4 text-gray-900",children:[(0,r.jsx)(w.A,{onClick:T,className:"rounded-full bg-white/80 p-1 text-gray-800 transition hover:bg-transparent focus:text-white",title:"Zoom In",children:(0,r.jsx)(d.c,{size:28,weight:"bold"})}),(0,r.jsx)(w.A,{onClick:k,className:"rounded-full bg-white/80 p-1 text-gray-800 transition hover:bg-transparent focus:text-white",title:"Zoom Out",children:(0,r.jsx)(m.Q,{size:28,weight:"bold"})})]}),(0,r.jsx)(w.A,{onClick:()=>{t.length&&j((g-1+t.length)%t.length)},className:"absolute left-0 z-20 rounded-full bg-white/80 p-1 text-gray-800 hover:text-white focus:text-white lg:left-12",title:"Previous",children:(0,r.jsx)(h.e,{size:28,weight:"bold"})}),(0,r.jsx)(w.A,{onClick:()=>{t.length&&j((g+1)%t.length)},className:"absolute right-0 z-20 rounded-full bg-white/80 p-1 text-gray-800 hover:text-white focus:text-white lg:right-12",title:"Next",children:(0,r.jsx)(f.J,{size:28,weight:"bold"})}),(0,r.jsx)("div",{className:"relative flex flex-1 items-center justify-center",children:(0,r.jsx)("div",{className:"relative flex h-[80vh] w-[80vw] items-center justify-center transition-transform duration-300",style:{transform:"scale(".concat(I?1:o,")")},children:C(_)?(0,r.jsx)("iframe",{src:(0,p.$f)(_.video_url),title:"Video ".concat(g+1),className:"absolute inset-0 m-auto h-[43vh] max-h-[400px] w-full max-w-3xl md:h-full md:max-h-none",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0}):N(_)?(0,r.jsx)("video",{src:_.url,className:"absolute inset-0 h-full w-full object-contain",controls:!0,autoPlay:!0,playsInline:!0}):(0,r.jsx)(c.default,{src:_.url,alt:"Preview ".concat(g+1),fill:!0,className:"object-contain select-none",sizes:"(max-width: 768px) 90vw, 80vw",priority:!0})})}),(0,r.jsx)("div",{className:"z-60 w-full bg-white p-4",children:(0,r.jsx)("div",{id:"thumbnail-container",className:"no-scrollbar mx-auto flex max-w-md items-center gap-3 overflow-x-auto scroll-smooth px-4",children:t.map((e,t)=>(0,r.jsx)(w.A,{onClick:()=>j(t),className:"relative flex-shrink-0 rounded-lg border-2 bg-transparent p-0 ".concat(t===g?"border-primary":"border-gray-300"),children:(0,r.jsxs)("div",{className:"relative h-20 w-20 overflow-hidden rounded-lg",children:[(0,r.jsx)(c.default,{src:e.thumb_url||e.url,alt:"Thumbn

1ail ".concat(t+1),fill:!0,className:"object-contain"}),(C(e)||N(e))&&(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center",children:(0,r.jsx)("svg",{className:"h-6 w-6 text-white",fill:"currentColor",viewBox:"0 0 24 24",children:(0,r.jsx)("path",{d:"M8 5v14l11-7z"})})})]})},t))})})]})};var v=l(89690);let y=e=>{let{obj:t,index:l,showUnitPopup:n,measurementValue:a,isValueChanged:i}=e;return(0,r.jsxs)("div",{style:{top:"".concat(100*t.position.y,"%"),left:"".concat(100*t.position.x,"%")},onClick:e=>{e.preventDefault(),e.stopPropagation();let l=t.text;if(!l)return;let r=document.getElementById(l),n=document.getElementById("measurements");if(n&&"true"!==n.getAttribute("aria-expanded")&&n.click(),!r)return;r.scrollIntoView({behavior:"smooth",block:"center"});let a=r instanceof HTMLInputElement?r:r.querySelector("input, textarea, select");if(!a)return;let i=()=>{try{a.focus({preventScroll:!0})}catch(e){a.focus()}if(a instanceof HTMLInputElement||a instanceof HTMLTextAreaElement){var e,t;let l=null!=(t=null==(e=a.value)?void 0:e.length)?t:0;a.setSelectionRange(l,l)}};(a instanceof HTMLInputElement||a instanceof HTMLTextAreaElement)&&a.click(),i(),window.requestAnimationFrame(i),window.setTimeout(i,180)},className:"absolute -mt-[9px] -ml-[7px] h-4 w-4 cursor-pointer",children:[n&&(0,r.jsx)("div",{className:"bg-yellow absolute -top-7 left-2 z-10 block min-h-[18px] min-w-[20px] -translate-x-1/2 rounded-[2px] p-1 text-center text-[10px] leading-[11px] font-medium whitespace-nowrap",children:(0,r.jsxs)("div",{className:"px-1",children:[a(t.text),(0,r.jsx)(v.b,{size:14,weight:"fill",className:"text-yellow absolute right-0 -bottom-2 left-0 mx-auto w-[14px]"})]})}),(0,r.jsx)("div",{className:"flex h-4 w-4 items-center justify-center rounded-full text-[10px] text-white ".concat(i(t.text)),children:l+1})]},t.buttonAttributes.id)};var j=l(77821),C=l(74644),N=l(34339),T=l(31362),k=l(43795);let E=e=>e.media_type===a.CY.EXTERNAL_VIDEO&&e.video_url,_=e=>e.media_type===a.CY.VIDEO&&e.url,I=e=>{let{galleryData:t,imageDimensions:l,displayThumbnail:c,dotsEnable:u,showUnitPopup:d=!1,defaultDimensions:m,className:h,showNavigation:f=!0,frameClassName:w="",imageWrapperClassName:b="",productData:v,isAdminFlow:I,measurementLabel:A,swiperWrapperClassname:z=""}=e,S=(0,o.d4)(e=>e.productDetails.selectedProductMeaurement.dimensions),L=(0,o.d4)(e=>e.productDetails.focusedDimensionField),R=(0,n.useMemo)(()=>t&&t.length>0?t:[k.T6],[t]),D=(0,n.useMemo)(()=>R.slice(0,2).map(e=>"".concat(e.url,"|").concat(e.thumb_url,"|").concat(e.media_type)).join("::"),[R]),M=1===R.length&&!(null==t?void 0:t.length),P=!I&&c&&!M,B=(0,n.useRef)(null),O=(0,n.useRef)(null),V=(0,n.useRef)(!1),F=(0,n.useRef)(null),H=(0,n.useRef)(0),Y=(0,n.useRef)(!1),q=(0,n.useRef)(null),Q=(0,n.useRef)(null),[U,G]=(0,n.useState)(0),[Z,$]=(0,n.useState)(!1),{isDesktop:J}=(0,i.Q)(),K=(0,n.useCallback)(()=>(0,x.b)(B.current),[]),W=(0,n.useCallback)(()=>{(0,x.b)(document.getElementById("pdp-image-preview-modal")),(0,x.b)(B.current)},[]),X=(0,n.useCallback)(function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:800;Y.current=!0,Q.current&&window.clearTimeout(Q.current),Q.current=window.setTimeout(()=>{Y.current=!1,Q.current=null},e)},[]),ee=(0,n.useCallback)(e=>e?{products:{productCategory:Array.isArray(e.category)?e.category.map(e=>e.name).join(" : "):e.category||"",productName:e.name||"NAIDL",productID:e.sku||"NAIDL"}}:null,[]),et=(0,n.useCallback)(function(e){var t,l;let r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"smooth";K(),q.current=null,G(e),H.current=e,F.current&&(window.clearTimeout(F.current),F.current=null),X("auto"===r?500:800),null==(l=O.current)||null==(t=l.scrollToIndex)||t.call(l,e,r)},[K,X]);(0,n.useEffect)(()=>()=>{F.current&&window.clearTimeout(F.current),Q.current&&window.clearTimeout(Q.current)},[]),(0,n.useEffect)(()=>{let e=(e=>{let t=e.findIndex(e=>(null==e?void 0:e.media_type)===a.CY.VECTOR);if(-1===t)return 0;let l=t+1;return l<e.length?l:t})(R);q.current=e,G(e),H.current=e,X(1200);let t=()=>{var t,l;return null==(l=O.current)||null==(t=l.scrollToIndex)?void 0:t.call(l,e,"auto")};t();let l=window.setTimeout(t,0),r=window.setTimeout(t,50),n=window.setTimeout(t,150),i=window.setTimeout(()=>{q.current===e&&(q.current=null)},1200);return()=>{window.clearTimeout(l),window.clearTimeout(r),window.clearTimeout(n),window.clearTimeout(i)}},[D,X]),(0,n.useEffect)(()=>{L&&et((e=>{let t=e.findIndex(e=>(null==e?void 0:e.media_type)===a.CY.VECTOR);if(-1!==t)return t;let l=e.findIndex(e=>null==e?void 0:e.is_baseimage);return -1!==l?l:0})(R),"smooth")},[L]),(0,n.useEffect)(()=>

1{if(!Z)return;let e=()=>{V.current=!1,$(!1),W()};return window.addEventListener("popstate",e),()=>window.removeEventListener("popstate",e)},[Z,W]);let el=(0,n.useCallback)(e=>{et(e,"smooth");let t=ee(v);t&&(0,j.S)(C.Q.ADB_PRODUCT_THUMBNAIL,t,!0)},[et,ee,v]),er=(0,n.useCallback)(e=>{if(K(),null!==q.current){if(e!==q.current)return;q.current=null,G(e)}else Y.current||G(e);Y.current||(F.current&&window.clearTimeout(F.current),F.current=window.setTimeout(()=>{if(F.current=null,e===H.current)return;H.current=e;let t=ee(v);t&&(0,j.S)(C.Q.ADB_PRODUCT_IMAGE_SCROLL,t,!0)},400))},[K,ee,v]),en=(0,n.useCallback)(e=>{et(e,"smooth")},[et]),ea=(0,n.useCallback)(e=>{et(e,"smooth"),I||M||(window.history.pushState({imageGalleryPreview:!0},"",window.location.href),V.current=!0,$(!0))},[et,I,M]),ei=(0,n.useCallback)(()=>{if(W(),V.current)return void window.history.back();$(!1)},[W]),eo=(0,n.useCallback)(e=>{var t,l;return S&&null!=(l=null==(t=S.find(t=>t.dimension_value===e))?void 0:t.default_value)?l:null},[S]),es=(0,n.useCallback)(e=>{if(!S)return"";let t=eo(e);return t&&"object"==typeof t?"".concat(Number(t.feet)||0,"'").concat(Number(t.inch)||0,'"'):"".concat(null!=t?t:"").concat("CM"===A?" ".concat(A):A)},[S,eo,A]),ec=(0,n.useCallback)(e=>{if(!m)return"bg-gray-700";if(L===e)return"bg-primary";let t=m[e],l=eo(e);return l&&t?"object"==typeof l&&"object"==typeof t?l.feet===t.feet&&l.inch===t.inch?"bg-gray-700":"bg-primary-900":t!==l?"bg-primary-900":"bg-gray-700":"bg-gray-700"},[m,L,eo]),eu=(0,n.useMemo)(()=>P?R.map((e,t)=>(0,r.jsxs)("div",{className:"relative aspect-square rounded-lg border border-gray-500",children:[(0,r.jsx)(N.CDNImage,{src:e.thumb_url||e.url,alt:"Thumbnail ".concat(t+1),fill:!0,className:"rounded-lg object-contain",removeLazyRendering:!0}),(E(e)||_(e))&&(0,r.jsx)("div",{className:"absolute inset-0 flex items-center justify-center",children:(0,r.jsx)("svg",{className:"h-6 w-6 text-white",fill:"currentColor",viewBox:"0 0 24 24",children:(0,r.jsx)("path",{d:"M8 5v14l11-7z"})})})]},t)):void 0,[P,R]);return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("div",{ref:B,className:(0,s.cn)("group/gallery sticky top-35 w-full",h),children:(0,r.jsx)(T.K0,{ref:O,activeIndex:U,hasOnlyPlaceholder:M,mainClassName:(0,s.cn)("relative aspect-square w-full overflow-visible h-full",z),mainFrameClassName:"border border-gray-500 rounded-[20px] overflow-hidden h-full ".concat(w),loop:!0,dotsEnable:u,showThumbnails:P,thumbnails:eu,thumbWrapperClassName:"px-4 lg:px-0",thumbClassName:"w-full shrink-0 rounded-lg border border-gray-400 bg-white transition-colors",activeThumbClassName:"border-primary",thumbGap:6,thumbBreakpoints:{320:{slidesToShow:5,slidesToScroll:5,gap:6},640:{slidesToShow:5,slidesToScroll:5,gap:8},1024:{slidesToShow:5,slidesToScroll:5,gap:10}},onSlideChange:er,onThumbnailClick:el,isDesktop:J,isAdminFlow:I,showNavigation:f,children:R.map((e,t)=>{let n=1===e.is_baseimage||e.media_type===a.CY.VECTOR;return(0,r.jsxs)("div",{className:(0,s.cn)("relative aspect-square",I?"cursor-default":"cursor-zoom-in",b),onClick:()=>ea(t),draggable:!1,children:[n&&Array.isArray(l)&&l.length>0&&(0,r.jsx)("div",{className:"absolute top-0 left-0 z-1 h-full w-full",children:l.map((e,t)=>(0,r.jsx)(y,{obj:e,index:t,showUnitPopup:d,measurementValue:es,isValueChanged:ec},e.buttonAttributes.id))}),E(e)?(0,r.jsx)("iframe",{className:"h-full w-full object-contain",src:(0,p.$f)(e.video_url),title:e.video_url||"Product video ".concat(t+1),style:{border:"none"},allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,draggable:!1}):_(e)?(0,r.jsx)("video",{src:e.url,className:"h-full w-full object-contain",controls:!0,playsInline:!0,draggable:!1}):(0,r.jsx)(N.CDNImage,{src:e.url,alt:"Product image ".concat(t+1),fill:!0,className:"h-full w-full object-contain",removeLazyRendering:!0,priority:0===t,loading:0===t?"eager":"lazy",fetchPriority:0===t?"high":"low",draggable:!1})]},t)})},D)}),Z&&(0,r.jsx)(g,{galleryData:R,selectedIndex:U,onClose:ei,onSelectedChange:en})]})}}}]);