(window.wpJsonpTemplateSections=window.wpJsonpTemplateSections||[]).push([[18],{1064:function(e,t,n){"use strict";n.r(t);n(0);var i=n(5),o=n(320);function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function u(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function a(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?u(Object(n),!0).forEach((function(t){d(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):u(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function s(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function f(e,t){return(f=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function c(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,i=v(e);if(t){var o=v(this).constructor;n=Reflect.construct(i,arguments,o)}else n=i.apply(this,arguments);return l(this,n)}}function l(e,t){return!t||"object"!==r(t)&&"function"!=typeof t?p(e):t}function p(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function v(e){return(v=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function d(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var m=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&f(e,t)}(u,e);var t,n,i,r=c(u);function u(e){var t;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,u),d(p(t=r.call(this)),"shiftTarget",[0,0]),d(p(t),"shiftResetTID",-1),d(p(t),"onIntersection",(function(e){e?t.bindListeners():t.unbindListeners()})),d(p(t),"resetShift",(function(){t.shiftTarget=[0,0]})),d(p(t),"onPointerMove",(function(e){var n=t.sectionNode.getBoundingClientRect(),i=(e.clientX-n.left)/t.width,o=(e.clientY-n.top)/t.height;t.shiftTarget[0]=-2*i+1,t.shiftTarget[1]=2*o-1,t.onPointerLeave()})),d(p(t),"onPointerLeave",(function(){clearTimeout(t.shiftResetTID),t.shiftResetTID=setTimeout(t.resetShift,2e3)})),d(p(t),"onResize",(function(){var e=t.imageEffect.canvas,n=e.width,i=e.height,o=t.state,r=o.centerOffsetSize,u=o.isLimitRings,a=o.numRings,s=o.ringSize,f=.5*Math.min(n,i),c=.5*Math.sqrt(n*n+i*i),l=f*(.01*r),p=Math.ceil((c-r)/s),v=u?Math.min(a,p):p;t.width=n,t.height=i,t.imageEffect.uniforms.uCenterRadius=l,t.imageEffect.uniforms.uMaxRings=v})),d(p(t),"update",(function(){var e=t.state.shiftSpeed,n=t.imageEffect.uniforms.uShift,i=t.shiftTarget[0]-n[0],o=t.shiftTarget[1]-n[1];n[0]+=i*(.002*e),n[1]+=o*(.002*e)})),d(p(t),"destroy",(function(){t.imageEffect.destroy(),t.unbindListeners(),clearTimeout(t.shiftResetTID)})),t.node=e,t.sectionNode=t.node.closest("section")||t.node,t.imageEffect=new o.a(t.node.querySelector(".background-fx-canvas"),{programKey:"refracted-circles",image:e.querySelector("img"),uniforms:a({uCenterRadius:100,uMaxRings:-1,uShift:[0,0]},t.updateUniforms({},t.state)),frag:"#define GLSLIFY 1\n#ifndef HALF_PI\n#define HALF_PI 1.5707963267948966\n#endif\n\nfloat sineOut(float t) {\n  return sin(t * HALF_PI);\n}\n\nuniform sampler2D uImage;\nuniform float uCenterRadius;\nuniform float uMaxRings;\nuniform float uReversePixelRatio;\nuniform float uRingSize;\nuniform float uRotation;\nuniform float uScaleEven;\nuniform float uScaleOdd;\nuniform float uScaleTaperEven;\nuniform float uScaleTaperOdd;\nuniform float uShiftIntensity;\nuniform float uStepFlipRotation;\nuniform float uStepFlipX;\nuniform float uStepFlipY;\nuniform vec2 uResolution;\nuniform vec2 uShift;\nvarying vec2 vUv;\n\nvec2 rotate(vec2 uv, float amount) {\n  vec2 prime = vec2(uv.x * cos(amount) + uv.y * sin(amount),\n    -uv.x * sin(amount) + uv.y * cos(amount));\n  return prime;\n}\n\nfloat getStep (vec2 uv) {\n  return (floor(max(0.0, distance(uv, vec2(0.0)) - uCenterRadius) / uRingSize));\n}\n\nvoid main () {\n  vec2 uv = vUv - 0.5;\n  float aspect = uResolution.x / uResolution.y;\n  vec2 stepCoord = (gl_FragCoord.xy / uResolution * uReversePixelRatio) - 0.5;\n  float step = min(getStep(stepCoord * uResolution), uMaxRings);\n  float isEven = mod(step, 2.0);\n  float flipRotation = sign((1.0 - isEven + uStepFlipRotation) * 2.0 - 1.0);\n  vec2 flipAxis = vec2(\n    sign((1.0 - isEven + uStepFlipX) * 2.0 - 1.0),\n    sign((1.0 - isEven + uStepFlipY) * 2.0 - 1.0)\n  );\n  float progress = sineOut((step + 1.0) / (uMaxRings + 1.0));\n  float progressRotation = sineOut((step) / (uMaxRings));\n  float rotation = progressRotation * (uRotation) * flipRotation;\n  float scale = mix(uScaleOdd, uScaleEven, isEven);\n  float taper = mix(uScaleTaperEven, uScaleTaperOdd, isEven);\n  float taperScale = (1.0 - progress) * taper;\n  vec2 shift = uShift * uShiftIntensity * progress;\n\n  uv.x *= aspect;\n  uv = rotate(uv, rotation);\n  uv.x /= aspect;\n  uv =\n    (uv + shift) *\n      flipAxis *\n      scale *\n      (1.0 + taperScale) +\n    0.5;\n\n  vec4 tx = texture2D(uImage, mod(uv * -sign(mod(uv, 2.0) - 1.0), 1.0));\n  tx.xyz *= tx.a;\n\n  gl_FragColor = tx;\n}",onUpdate:t.update,onResize:t.onResize,onIntersection:t.onIntersection}),t.width=t.node.clientWidth,t.height=t.node.clientHeight,t}return t=u,(n=[{key:"bindListeners",value:function(){this.sectionNode.addEventListener("mousemove",this.onPointerMove),this.sectionNode.addEventListener("mouseleave",this.onPointerLeave)}},{key:"unbindListeners",value:function(){this.sectionNode.removeEventListener("mousemove",this.onPointerMove),this.sectionNode.removeEventListener("mouseleave",this.onPointerLeave)}},{key:"updateUniforms",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return e.uRotation=t.rotation*Math.PI/180,e.uRingSize=t.ringSize,e.uScaleEven=.01*t.scaleEven,e.uScaleOdd=.01*t.scaleOdd,e.uScaleTaperEven=.01*t.scaleTaperEven,e.uScaleTaperOdd=.01*t.scaleTaperOdd,e.uStepFlipRotation=1-+t.isStepFlipRotation,e.uStepFlipX=1-+t.isStepFlipX,e.uStepFlipY=1-+t.isStepFlipY,e.uShiftIntensity=.002*t.shiftIntensity,e}}])&&s(t.prototype,n),i&&s(t,i),u}(i.a);d(m,"defaultState",{isLimitRings:!1,numRings:5,centerOffsetSize:55,ringSize:150,rotation:2,scaleEven:100,scaleOdd:90,scaleTaperEven:10,scaleTaperOdd:-10,shiftIntensity:50,shiftSpeed:20,isStepFlipRotation:!0,isStepFlipX:!1,isStepFlipY:!1});t.default=function(e){return new m(e)}}}]);