https://www.rabensjogren.se/static/js/theme-overlays-GalleryZoomOverlay.b122cd9b.chunk.js

1"use strict";(self.__LOADABLE_LOADED_CHUNKS__=self.__LOADABLE_LOADED_CHUNKS__||[]).push([[9585],{27444:function(e,t,n){var o=n(95764),i=n(81034),a=(n(30969),n(31513)),r=n(95316),s=n(37574),l=["color","direction","width","height","rotate","customTransform"],c={up:"0 0 12 6",right:"0 0 7 12",down:"0 0 12 6",left:"0 0 7 12"},u={up:"12px",right:"7px",down:"12px",left:"7px"},d={up:"M11 5.5c-2.19-.899-4.097-2.71-4.957-5h-.086C5.097 2.79 3.191 4.601 1 5.5",right:"M1 11c.899-2.19 2.71-4.097 5-4.957v-.086C3.71 5.097 1.899 3.191 1 1",down:"M1 .5c2.19.899 4.097 2.71 4.957 5h.086c.86-2.29 2.766-4.101 4.957-5",left:"M6 1c-.899 2.19-2.71 4.097-5 4.957v.086c2.29.86 4.101 2.766 5 4.957"},h=function(e){var t=e.color,n=e.direction,h=e.width,p=e.height,m=e.rotate,f=e.customTransform,g=(0,i.Z)(e,l);return h=h||u[n],p=p||"auto",(0,s.jsx)(a.Z,(0,o.Z)((0,o.Z)({viewBox:c[n],transition:"transform ".concat(r.Z.primaryFast),transform:m&&f,width:h,height:p,fill:"none"},g),{},{children:(0,s.jsx)("path",{stroke:t,d:d[n],strokeMiterlimit:"10"})}))};h.defaultProps={color:"currentColor",customTransform:"rotateZ(180deg)",height:null,rotate:!1,width:null},t.Z=h},14566:function(e,t,n){var o=n(95764),i=n(81034),a=(n(30969),n(31513)),r=n(37574),s=["color","height","width"],l=function(e){var t=e.color,n=e.height,l=e.width,c=(0,i.Z)(e,s);return(0,r.jsx)(a.Z,(0,o.Z)((0,o.Z)({width:l,height:n,viewBox:"0 0 14 17",fill:"none"},c),{},{children:(0,r.jsx)("path",{stroke:t,d:"M12.666 7.54 2.649.863a1 1 0 0 0-1.555.833v13.35a1 1 0 0 0 1.555.832l10.017-6.675a1 1 0 0 0 0-1.665Z"})}))};l.defaultProps={color:"currentColor",height:"17px",width:"14px"},t.Z=l},26429:function(e,t,n){n.r(t),n.d(t,{default:function(){return ce}});var o=n(99500),i=n(30969),a=n(10546),r=n(85255),s=n(39455),l=n(87148),c=n(99710),u=n(95764),d=n(52555),h=n(86470),p=n(57994),m=n(98907),f=n(90889),g=n(2391),v=n(95870),x=n(37574),Z=function(e){(0,f.Z)(n,e);var t=(0,g.Z)(n);function n(e){var o;return(0,p.Z)(this,n),(o=t.call(this,e)).getNewPosition=function(e,t,n){var i=[o.state.zoom,o.state.posX,o.state.posY],a=i[0],r=i[1],s=i[2];if(1===n)return[0,0];if(n>a){var l=o.ref.current.getBoundingClientRect(),c=l.width/2,u=l.height/2,d=n-a;return[r+(c-(e-l.left-window.pageXOffset))/a*d,s+(u-(t-l.top-window.pageYOffset))/a*d]}return[r*(n-1)/(a-1),s*(n-1)/(a-1)]},o.getLimitedShift=function(e,t,n,o,i){if(e>0){if(o>t)return 0;if(o+e>t)return t-o}else if(e<0){if(i<n)return 0;if(i+e<n)return n-i}return e},o.fullZoomInOnPosition=function(e,t){var n=o.props.maxZoom,i=o.getNewPosition(e,t,n),a=(0,c.Z)(i,2),r=a[0],s=a[1];o.setState({zoom:n,posX:r,posY:s,transitionDuration:o.props.animDuration}),o.props.onZoomChange&&o.props.onZoomChange(n)},o.move=function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:0;if(o.ref.current){var i=o.state,a=i.posX,r=i.posY,s=o.ref.current.getBoundingClientRect(),l=o.ref.current.parentNode.getBoundingClientRect(),c=s.width>l.right-l.left,u=e>0&&s.left-l.left<0,d=e<0&&s.right-l.right>0;(c||u||d)&&(a+=o.getLimitedShift(e,l.left,l.right,s.left,s.right));var h=s.height>l.bottom-l.top,p=t>0&&s.top-l.top<0,m=t<0&&s.bottom-l.bottom>0;(h||p||m)&&(r+=o.getLimitedShift(t,l.top,l.bottom,s.top,s.bottom)),o.setState({posX:a,posY:r,transitionDuration:n})}},o.startDeceleration=function(e,t){var n=null;o.lastRequestAnimationId=requestAnimationFrame((function i(a){null===n&&(n=a);var r=a-n,s=(o.props.decelerationDuration-r)/o.props.decelerationDuration,l=e*s,c=t*s;r<o.props.decelerationDuration&&Math.max(Math.abs(l),Math.abs(c))>1?(o.move(l,c,0),o.lastRequestAnimationId=requestAnimationFrame(i)):o.lastRequestAnimationId=null}))},o.handleClick=function(e){e.preventDefault(),o.props.setZoomed(!o.props.zoomed),o.state.zoom===o.props.minZoom?o.fullZoomInOnPosition(e.pageX,e.pageY):o.reset()},o.handleMouseMove=function(e){if(e.preventDefault(),o.ref.current&&o.state.zoom!==o.props.minZoom){o.lastRequestAnimationId&&cancelAnimationFrame(o.lastRequestAnimationId);var t=o.ref.current.getBoundingClientRect(),n=o.ref.current.parentNode.getBoundingClientRect(),i=e.pageX-n.left,a=(e.pageY-n.top)/n.height,r=i/n.width,s=t.height,l=-(0-t.width/4+r*t.width/2),c=-(0-s/4+a*t.height/2);o.lastRequestAnimationId=requestAnimationFrame((function(){o.setState((function(e){return(0,u.Z)((0,u.Z)({},e),{},{posX:l,posY:c,transitionDuration:0})}

1))}))}},o.handleTouchStart=function(e){e.preventDefault(),o.lastRequestAnimationId&&cancelAnimationFrame(o.lastRequestAnimationId);var t=[e.touches[0].pageX,e.touches[0].pageY],n=t[0],i=t[1];if(1===e.touches.length){var a=(new Date).getTime();a-o.lastTouchTime<o.props.doubleTouchMaxDelay&&a-o.lastDoubleTapTime>o.props.doubleTouchMaxDelay&&(o.state.zoom===o.props.minZoom?o.fullZoomInOnPosition(n,i):o.reset(),o.lastDoubleTapTime=a),o.lastTouchTime=a}o.lastTouch={posX:n,posY:i}},o.handleTouchMove=function(e){e.preventDefault();var t=o.props,n=t.maxZoom,i=t.minZoom,a=o.state.zoom;if(o.lastTouch)if(1===e.touches.length){var r=[e.touches[0].pageX,e.touches[0].pageY],s=r[0],l=r[1],u=s-o.lastTouch.posX,d=l-o.lastTouch.posY;o.move(u,d),o.lastShift={x:u,y:d},o.lastTouch={posX:s,posY:l},o.lastTouchDistance=null}else if(e.touches.length>1){var h=[e.touches[0].pageX,e.touches[0].pageY],p=h[0],m=h[1],f=[e.touches[1].pageX,e.touches[1].pageY],g=f[0],v=f[1],x=Math.sqrt(Math.pow(g-p,2)+Math.pow(v-m,2));if(o.lastTouchDistance&&x&&x!==o.lastTouchDistance){(a+=(x-o.lastTouchDistance)/100)>n?a=n:a<i&&(a=i);var Z=(p+g)/2,w=(m+v)/2,b=o.getNewPosition(Z,w,a),y=(0,c.Z)(b,2),j=y[0],T=y[1];o.setState({zoom:a,posX:j,posY:T,transitionDuration:0}),o.props.onZoomChange&&o.props.onZoomChange(a)}o.lastTouch={posX:p,posY:m},o.lastTouchDistance=x}},o.handleTouchStop=function(){o.lastShift&&(o.startDeceleration(o.lastShift.x,o.lastShift.y),o.lastShift=null),o.lastTouch=null,o.lastTouchDistance=null},o.reset=function(e){o.setState((0,u.Z)((0,u.Z)({},o.constructor.defaultState),{},{transitionDuration:null!==e&&void 0!==e?e:o.props.animDuration})),o.props.onReset&&o.props.onReset()},o.ref=(0,i.createRef)(),o.lastTouch=null,o.lastTouchTime=0,o.lastDoubleTapTime=0,o.lastTouchDistance=null,o.lastRequestAnimationId=null,o.state=(0,u.Z)((0,u.Z)({},o.constructor.defaultState),{},{transitionDuration:e.animDuration}),o}return(0,m.Z)(n,[{key:"render",value:function(){var e=this.props,t=e.className,n=e.children,o=this.state,i=o.zoom,a=o.posX,r=o.posY,s=o.transitionDuration;if(v.N9)return null;var l=(0,u.Z)((0,u.Z)({},this.props.style),{},{transform:"translate(".concat(a,"px, ").concat(r,"px) scale(").concat(i,")"),transition:"transform ease-out ".concat(s,"s"),touchAction:"none",willChange:"transform",height:"100%",width:"100%",maxWidth:"100%",maxHeight:"100%"}),c={ref:this.ref,style:l,className:t},d={};return window.matchMedia("(pointer: fine)").matches||window.matchMedia("(-ms-high-contrast: none)").matches?d={onClick:this.handleClick,onMouseMove:this.handleMouseMove}:c=(0,u.Z)((0,u.Z)({},c),{},{onTouchStart:this.handleTouchStart,onTouchMove:this.handleTouchMove,onTouchEnd:this.handleTouchStop,onTouchCancel:this.handleTouchStop}),(0,x.jsx)("div",(0,u.Z)((0,u.Z)({style:{width:"100%",height:"100%"}},d),{},{children:(0,x.jsx)("div",(0,u.Z)((0,u.Z)({},c),{},{children:n}))}))}}]),n}(i.PureComponent);Z.defaultProps={className:null,style:{},minZoom:1,maxZoom:5,animDuration:.25,doubleTouchMaxDelay:300,decelerationDuration:750,onReset:null,onZoomChange:null},Z.defaultState={zoom:1,posX:0,posY:0};var w=n(81034),b=n(31513),y=["color"],j=function(e){var t=e.color,n=(0,w.Z)(e,y);return(0,x.jsxs)(b.Z,(0,u.Z)((0,u.Z)({fill:"none",viewBox:"0 0 46 46"},n),{},{children:[(0,x.jsx)("circle",{cx:"20",cy:"20",r:"18.5",stroke:t,strokeWidth:"3"}),(0,x.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M19.27 20.77V28h1.5v-7.23H28v-1.5h-7.23V12h-1.5v7.27H12v1.5h7.27z",fill:t}),(0,x.jsx)("path",{d:"M32 32l12 12",stroke:t,strokeWidth:"3"})]}))};j.defaultProps={color:"currentColor",height:"46px",width:"46px"};var T,I,k,D,C=j,M=n(31619),z=n(14566),A=(0,r.Z)("button")(T||(T=(0,o.Z)(["\n    position: relative;\n    color: ",";\n    border: 1px solid ",";\n    width: 46px;\n    height: 46px;\n    "," {\n        width: 80px;\n        height: 80px;\n    }\n\n    &:active,\n    &:focus {\n        outline: 0;\n    }\n    &.active {\n        border: 1px solid ",";\n    }\n    &:not(:last-of-type) {\n        margin-right: 8px;\n    }\n"])),M.Z.white,M.Z.grey,s.aE.lg,M.Z.black),R=(0,r.Z)("img")(I||(I=(0,o.Z)(["\n    width: 100%;\n    height: 100%;\n    max-width: 100%;\n    max-height: 100%;\n    object-fit: contain;\n    user-select: none;

1\n"]))),S=(0,r.Z)("video")(k||(k=(0,o.Z)(["\n    height: 100%;\n    width: 100%;\n    object-fit: cover;\n    z-index: 1;\n"]))),E=(0,r.Z)(z.Z)(D||(D=(0,o.Z)(["\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    z-index: 1;\n    transform: translate3d(-50%, -50%, 0);\n"]))),Y=function(e){var t=e.active,n=e.media,o=e.onClick,i=n.youtube&&n.youtube.split("/").pop(),a=(0,d.$)().t;return(0,x.jsxs)(A,{type:"button","aria-label":a("aria.go_to",{label:a("aria.labels.image")}),className:t?"active":"",background:n.video||n.youtube?"rgba(0, 0, 0, 0.5)":M.Z.white,onClick:o,children:[n.image&&(0,x.jsx)(R,{alt:n.title,src:(0,h.K)(n.image,{m:"pad",f:"jpg",q:90,w:80,h:80})},n.image),(n.video||n.youtube)&&(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(E,{}),n.video&&(0,x.jsx)(S,{children:(0,x.jsx)("source",{src:"".concat(n.video,"#t=0.1"),type:"video/mp4"})},n.video),n.youtube&&(0,x.jsx)(S,{as:"img",src:"https://img.youtube.com/vi/".concat(i,"/0.jpg")})]})]})};Y.defaultProps={onClick:null};var X=Y,q=n(35797);var L=n.p+"static/media/zoomIn.52944f9dcec8f23abd9da43c9927dc39.svg";var P,N,_,B,O,F=n.p+"static/media/zoomOut.1b4b2a1acbecf1ee6a8056a8a5aefbb2.svg",H=(0,r.Z)("div")(P||(P=(0,o.Z)(["\n    position: relative;\n    margin: 16px 32px;\n\n    &.activeZoom {\n        margin: 0;\n    }\n\n    &:after {\n        content: '';\n        display: block;\n        padding-bottom: 100%;\n    }\n\n    "," {\n        flex: 1;\n        &:after {\n            display: none;\n        }\n    }\n\n    "," {\n        cursor: pointer;\n        cursor: ",";\n        transition: flex 200ms ease;\n\n        &.activeZoom {\n            cursor: pointer;\n            cursor: ",";\n            flex: 1 0 100%;\n        }\n    }\n\n    .zoomWrapper {\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        z-index: 1;\n        overflow: hidden;\n    }\n"])),s.aE.md,s.aE.lg,"url(".concat(L,") 20 20, pointer"),"url(".concat(F,") 20 20, pointer")),K=(0,r.Z)("div")(N||(N=(0,o.Z)(["\n    display: flex;\n    & > * {\n        flex-shrink: 0;\n    }\n"]))),W=(0,r.Z)("div")(_||(_=(0,o.Z)(["\n    display: flex;\n    flex-direction: row;\n    justify-content: center;

1\n    align-items: center;\n    padding: 8px 16px;\n\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 2;\n\n    background: ",";\n    border: 1px solid ",";\n    border-radius: 80px;\n    pointer-events: none;\n    opacity: 1;\n    transition: opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.5s;\n    white-space: nowrap;\n\n    "," {\n        display: none;\n    }\n\n    "," {\n        display: none;\n    }\n\n    span {\n        margin-left: 8px;\n        font-size: 12px;\n        line-height: 12px;\n        font-weight: 700;\n    }\n\n    &.hide {\n        opacity: 0;\n    }\n"])),M.Z.white,M.Z.black,s.BC.hover,s.aE.md),U=(0,r.Z)("div",{shouldForwardProp:function(e){return-1===["mobileImage","desktopImage"].indexOf(e)}})(B||(B=(0,o.Z)(["\n    height: 100%;\n    width: 100%;\n    background-size: contain;\n    background-position: center;\n\n    background-image: ",";\n    "," {\n        background-image: ",";\n    }\n"])),(function(e){return"url(".concat(e.mobileImage,")")}),s.aE.lg,(function(e){return"url(".concat(e.desktopImage,")")})),V=(0,r.Z)("button")(O||(O=(0,o.Z)(["\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    z-index: 1;\n    color: ",";\n    padding: 12px 0;\n    width: 32px;\n"])),M.Z.grey),$=n(27444),G=function(e){var t,n=e.media,o=void 0===n?[]:n,i=e.startIndex,a=void 0===i?0:i,r=null!==o&&void 0!==o&&o.length?o[0]:null,s=0;return null!==o&&void 0!==o&&o.length&&o[a]&&(r=o[a],s=a),{activeIndex:s,activeImage:null===(t=r)||void 0===t?void 0:t.image,activeZoom:!1,media:o}},J=function(e,t){var n,o,i=e.activeIndex,a=e.media;switch(t.type){case"setActive":return(0,u.Z)((0,u.Z)({},e),{},{activeZoom:t.active});case"setImage":return(0,u.Z)((0,u.Z)({},e),{},{activeIndex:t.index,activeImage:t.image});case"prevImage":return n=a[i-1]||a[a.length-1],o=a.findIndex((function(e){return e.image===n.image})),(0,u.Z)((0,u.Z)({},e),{},{activeIndex:o,activeImage:n.image,activeZoom:!1});case"nextImage":return n=a[i+1]||a[0],o=a.findIndex((function(e){return e.image===n.image})),(0,u.Z)((0,u.Z)({},e),{},{activeIndex:o,activeImage:n.image,activeZoom:!1});default:throw new Error}},Q=function(e){var t=e.media,n=e.startIndex,o=(0,d.$)().t,a=(0,i.useReducer)(J,{media:t,startIndex:n},G),r=(0,c.Z)(a,2),s=r[0],l=s.activeIndex,u=s.activeImage,p=s.activeZoom,m=r[1],f=(0,i.useRef)(null),g=(0,i.useRef)(null),v=function(e){m({type:"".concat(e,"Image")}),f.current.reset(0)},w=function(e,t){m({type:"setImage",index:e,image:t}),f.current.reset(0)},b=function(e){if(!e.defaultPrevented){switch(e.key){case"Left":case"ArrowLeft":m({type:"prevImage"}),f.current.reset(0);break;case"Right":case"ArrowRight":m({type:"nextImage"}),f.current.reset(0);break;default:return}e.preventDefault()}};(0,i.useEffect)((function(){return g.current&&g.current.classList.add("hide"),window.addEventListener("keydown",b),function(){window.removeEventListener("keydown",b)}}),[]);var y=t.length>1;return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsxs)(H,{className:p&&"activeZoom",children:[(0,x.jsx)("div",{className:"zoomWrapper",children:u&&(0,x.jsx)(Z,{ref:f,maxZoom:2.5,onReset:function(){return p&&m({type:"setActive",active:!1})},onZoomChange:function(e){return m({type:"setActive",active:e>1})},children:(0,x.jsx)(U,{mobileImage:(0,h.K)(u,{m:"pad",f:"jpg",q:70,w:875,h:875}),desktopImage:(0,h.K)(u,{m:"pad",f:"jpg",q:70,w:1200,h:1200})})})}),(0,x.jsxs)(W,{ref:g,children:[(0,x.jsx)(C,{height:"32px",width:"32px"}),(0,x.jsx)("span",{children:o("pinch_to_zoom")})]}),y&&!p&&(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(V,{type:"button","aria-label":o("aria.prev",{label:o("aria.labels.image")}),left:"-32px",onClick:v.bind(null,"prev"),children:(0,x.jsx)($.Z,{direction:"left",width:["12px",null,"20px"]})}),(0,x.jsx)(V,{type:"button","aria-label":o("aria.next",{label:o("aria.labels.image")}),right:"-32px",onClick:v.bind(null,"next"),children:(0,x.jsx)($.Z,{direction:"right",width:["12px",null,"20px"]})})]})]}),(0,x.jsx)(q.Z,{scrollDirection:"horizontal",margin:"12px",children:(0,x.jsx)(K,{children:(t||[]).map((function(e,t){return(0,x.jsx)(X,{media:e,active:l===t,onClick:w.bind(null,t,e.image)},e.key)}))})})]})};Q.defaultProps={media:[],startIndex:0};var ee,te,ne,oe,ie=Q,ae=(0,r.Z)("div")(ee||(ee=(0,o.Z)(["\n    display: flex;\n    position: absolute;\n    overflow: hidden;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    flex-direction: column;

1\n    align-items: center;\n    justify-content: center;\n"]))),re=(0,r.Z)("div")(te||(te=(0,o.Z)(["\n    position: relative;\n    background: #fff;\n    width: 100%;\n    /* max-width: 1280px; */\n\n    "," {\n        height: calc(100% - 64px);\n        width: calc(100% - 64px);\n    }\n"])),s.aE.md),se=(0,r.Z)("button")(ne||(ne=(0,o.Z)(["\n    position: absolute;\n    top: 0;\n    right: 0;\n    padding: 20px;\n    z-index: 2;\n"]))),le=(0,r.Z)("div")(oe||(oe=(0,o.Z)(["\n    position: relative;\n\n    display: flex;\n    flex-direction: column;\n\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n"]))),ce=(0,a.sG)("overlay")((function(e){var t=e.overlay,n=e.media,o=e.startIndex,a=(0,i.useCallback)((function(e){if(!e.defaultPrevented){switch(e.key){case"Esc":case"Escape":t.hide();break;default:return}e.preventDefault()}}),[t]);return(0,i.useEffect)((function(){return window.addEventListener("keydown",a,!0),function(){window.removeEventListener("keydown",a,!0)}}),[n,a]),(0,x.jsx)(ae,{className:"slide-in--top",onClick:function(e){e.target===e.currentTarget&&t.hide()},children:(0,x.jsxs)(re,{children:[(0,x.jsx)(se,{onClick:t.hide,children:(0,x.jsx)(l.Z,{})}),(0,x.jsx)(le,{children:(0,x.jsx)(ie,{media:n,startIndex:o})})]})})}))}}]);
2//# sourceMappingURL=theme-overlays-GalleryZoomOverlay.b122cd9b.chunk.js.map