https://kasbu.bio/assets/js/GridDistortion-DAZAY_mO.js

1import{r as e,j as t}from"../index-DqIz-mL6.js";import{S as n,W as r,J as s,T as o,L as i,a,D as u,R as l,F as v,G as c,e as m,K as d,P as p,M as f}from"./three.module-_hTxpw8L.js";import"./cjs-helpers-BrGt3VpK.js";import"./supabase-vendor-DuR9KhUO.js";const g=({grid:g=15,mouse:h=.1,strength:w=.15,relaxation:x=.9,imageSrc:R="/images/loginimage.webp",className:T=""})=>{const M=e.useRef(null),j=e.useRef(null),y=e.useRef(null),E=e.useRef(null),D=e.useRef(null),F=e.useRef(1),L=e.useRef(null),X=e.useRef(null);return e.useEffect(()=>{if(!M.current)return;const e=M.current,t=new n;j.current=t;const T=new r({antialias:!0,alpha:!0,powerPreference:"high-performance"});T.setPixelRatio(Math.min(window.devicePixelRatio,2)),T.setClearColor(0,0),y.current=T,e.innerHTML="",e.appendChild(T.domElement);const Y=new s(0,0,0,0,-1e3,1e3);Y.position.z=2,E.current=Y;const b={time:{value:0},resolution:{value:new m},uTexture:{value:null},uDataTexture:{value:null}};(new o).load(R,e=>{e.minFilter=i,e.magFilter=i,e.wrapS=a,e.wrapT=a,F.current=e.image.width/e.image.height,b.uTexture.value=e,O()});const C=g,P=new Float32Array(4*C*C);for(let n=0;n<C*C;n++)P[4*n]=255*Math.random()-125,P[4*n+1]=255*Math.random()-125;const U=new u(P,C,C,l,v);U.needsUpdate=!0,b.uDataTexture.value=U;const z=new c({side:d,uniforms:b,vertexShader:"\nuniform float time;\nvarying vec2 vUv;\nvarying vec3 vPosition;\n\nvoid main() {\n  vUv = uv;\n  vPosition = position;\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n}\n",fragmentShader:"\nuniform sampler2D uDataTexture;\nuniform sampler2D uTexture;\nuniform vec4 resolution;\nvarying vec2 vUv;\n\nvoid main() {\n  vec2 uv = vUv;\n  vec4 offset = texture2D(uDataTexture, vUv);\n  gl_FragColor = texture2D(uTexture, uv - 0.02 * offset.rg);\n}\n",transparent:!0}),S=new p(1,1,C-1,C-1),A=new f(S,z);D.current=A,t.add(A);const O=()=>{if(!e||!T||!Y)return;const t=e.getBoundingClientRect(),n=t.width,r=t.height;if(0===n||0===r)return;const s=n/r;T.setSize(n,r),A&&A.scale.set(s,1,1);const o=1*s;Y.left=-o/2,Y.right=o/2,Y.top=.5,Y.bottom=-.5,Y.updateProjectionMatrix(),b.resolution.value.set(n,r,1,1)};if(window.ResizeObserver){const t=new ResizeObserver(()=>{O()});t.observe(e),X.current=t}else window.addEventListener("resize",O);const _={x:0,y:0,prevX:0,prevY:0,vX:0,vY:0},q=t=>{const n=e.getBoundingClientRect(),r=(t.clientX-n.left)/n.width,s=1-(t.clientY-n.top)/n.height;_.vX=r-_.prevX,_.vY=s-_.prevY,Object.assign(_,{x:r,y:s,prevX:r,prevY:s})},B=()=>{U&&(U.needsUpdate=!0),Object.assign(_,{x:0,y:0,prevX:0,prevY:0,vX:0,vY:0})};e.addEventListener("mousemove",q),e.addEventListener("mouseleave",B),O();const H=()=>{if(L.current=requestAnimationFrame(H),!T||!t||!Y)return;if(b.time.value+=.05,!(U.image.data instanceof Float32Array))return void console.error("dataTexture.image.data is not a Float32Array");const e=U.image.data;for(let t=0;t<C*C;t++)e[4*t]*=x,e[4*t+1]*=x;const n=C*_.x,r=C*_.y,s=C*h;for(let t=0;t<C;t++)for(let o=0;o<C;o++){const i=Math.pow(n-t,2)+Math.pow(r-o,2);if(i<s*s){const n=4*(t+C*o),r=Math.min(s/Math.sqrt(i),10);e[n]+=100*w*_.vX*r,e[n+1]-=100*w*_.vY*r}}U.needsUpdate=!0,T.render(t,Y)};return H(),()=>{L.current&&cancelAnimationFrame(L.current),X.current?X.current.disconnect():window.removeEventListener("resize",O),e.removeEventListener("mousemove",q),e.removeEventListener("mouseleave",B),T&&(T.dispose(),T.forceContextLoss(),e.contains(T.domElement)&&e.removeChild(T.domElement)),S&&S.dispose(),z&&z.dispose(),U&&U.dispose(),b.uTexture.value&&b.uTexture.value.dispose(),j.current=null,y.current=null,E.current=null,D.current=null}},[g,h,w,x,R]),t.jsx("div",{ref:M,className:`distortion-container ${T}`,style:{width:"100%",height:"100%",minWidth:"0",minHeight:"0"}})};export{g as default};