https://sindika.co.id/_next/static/chunks/6069.29c07e3d7018f661.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6069],{36069:(e,n,o)=>{o.r(n),o.d(n,{default:()=>c});var t=o(95155),r=o(30258),a=o(38381),i=o(12115),l=o(40264),s=o(85339);function u(){let e=(0,i.useRef)(null),n=(0,i.useRef)(null),o=(0,i.useRef)({x:0,y:0}),r=(0,i.useRef)({x:0,y:0}),a=(0,i.useRef)(0),u=(0,i.useMemo)(()=>{let e=new Float32Array(28800),n=new Float32Array(9600),o=new Float32Array(9600),t=new Float32Array(9600),r=new Float32Array(9600),a=new Float32Array(9600);for(let i=0;i<120;i++)for(let l=0;l<80;l++){let s=80*i+l,u=(i/119-.5)*22,c=(l/79-.5)*14;n[s]=u,o[s]=c,t[s]=.4+.5*Math.random(),r[s]=Math.random(),a[s]=s,e[3*s]=u,e[3*s+1]=0,e[3*s+2]=c}let i=new s.LoY;return i.setAttribute("position",new s.THS(e,3)),i.setAttribute("aGridX",new s.THS(n,1)),i.setAttribute("aGridZ",new s.THS(o,1)),i.setAttribute("aSize",new s.THS(t,1)),i.setAttribute("aRandom",new s.THS(r,1)),i.setAttribute("aIndex",new s.THS(a,1)),i.boundingSphere=new s.iyt(new s.Pq0(0,0,0),30),i},[]),c=(0,i.useMemo)(()=>({uTime:{value:0},uWaveAmp:{value:1},uPointSize:{value:.8},uScrollY:{value:0},uMouse:{value:new s.I9Y(0,0)},uMouseHue:{value:0},uColorA:{value:new s.Q1f("#4338ca")},uColorB:{value:new s.Q1f("#0891b2")},uColorC:{value:new s.Q1f("#e11d89")}}),[]),d=(0,i.useCallback)(e=>{o.current.x=e.clientX/window.innerWidth*2-1,o.current.y=-(2*(e.clientY/window.innerHeight))+1},[]);return(0,i.useEffect)(()=>(window.addEventListener("mousemove",d),()=>window.removeEventListener("mousemove",d)),[d]),(0,i.useEffect)(()=>{let e=()=>{let e=window.innerHeight;a.current=Math.min(window.scrollY/e,1)};return window.addEventListener("scroll",e,{passive:!0}),()=>window.removeEventListener("scroll",e)},[]),(0,l.D)(t=>{let{clock:i}=t;n.current&&(n.current.uniforms.uTime.value=i.getElapsedTime(),n.current.uniforms.uScrollY.value=a.current,r.current.x+=(o.current.x-r.current.x)*.03,r.current.y+=(o.current.y-r.current.y)*.03,n.current.uniforms.uMouse.value.set(r.current.x,r.current.y),n.current.uniforms.uMouseHue.value=r.current.x),e.current&&(e.current.rotation.y+=(.08*o.current.x-e.current.rotation.y)*.015,e.current.rotation.x+=(-.3+.06*o.current.y-e.current.rotation.x)*.015)}),(0,t.jsxs)("group",{ref:e,position:[0,-.5,0],rotation:[-.3,0,0],children:[(0,t.jsxs)("points",{frustumCulled:!1,children:[(0,t.jsx)("primitive",{object:u,attach:"geometry"}),(0,t.jsx)("shaderMaterial",{ref:n,vertexShader:"\n  uniform float uTime;\n  uniform float uWaveAmp;\n  uniform float uPointSize;\n  uniform float uScrollY;\n  uniform vec2  uMouse;\n  uniform float uMouseHue;\n\n  uniform vec3 uColorA;\n  uniform vec3 uColorB;\n  uniform vec3 uColorC;\n\n  attribute float aGridX;\n  attribute float aGridZ;\n  attribute float aSize;\n  attribute float aRandom;\n  attribute float aIndex;\n\n  varying float vBrightness;\n  varying float vHeight;\n  varying vec3  vParticleColor;\n  varying float vFallAlpha;\n\n  #define PI  3.141592653589793\n\n  // HSL to RGB\n  vec3 hsl2rgb(float h, float s, float l) {\n    vec3 rgb = clamp(abs(mod(h * 6.0 + vec3(0.0, 4.0, 2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);\n    return l + s * (rgb - 0.5) * (1.0 - abs(2.0 * l - 1.0));\n  }\n\n  void main() {\n    float t = uTime;\n\n    // ── Mouse ripple ──\n    float mx = aGridX - uMouse.x * 10.0;\n    float mz = aGridZ - uMouse.y * 5.0;\n    float md = length(vec2(mx, mz));\n    float mouseWave = exp(-md * 0.05) * sin(md * 1.0 - t * 2.0) * 0.5;\n\n    // ── Moving ocean waves — clearly visible motion ──\n    float wave1 = sin(aGridX * 0.4 + t * 0.8 + aGridZ * 0.15) * 0.9;\n    float wave2 = sin(aGridX * 0.6 - t * 0.5 + aGridZ * 0.35) * 0.45;\n    float wave3 = cos(aGridX * 0.2 + aGridZ * 0.5 + t * 0.35) * 0.55;\n    float wave4 = sin(aGridX * 0.08 + t * 0.25) * 1.2;\n    float waveH = (wave1 + wave2 + wave3 + wave4 + mouseWave) * uWaveAmp;\n\n    // Horizontal flow — wave moves to the right\n    float flowX = sin(aGridZ * 0.3 + t * 0.3) * 0.2;\n    float flowZ = cos(aGridX * 0.25 + t * 0.2) * 0.15;\n\n    vec3 pos = vec3(aGridX + flowX, waveH, aGridZ + flowZ);\n\n    // ── Scroll: rain drop effect ──\n    // Each particle drops straight down at different speeds\n    float dropDelay = aRandom * 0.4;\n    float dropProgress = max(uScrollY - dropDelay, 0.0);\n    float dropSpeed = 0.8 + aRandom * 1.5;\n\n    // Straight vertical drop (like rain)\n    float dropY = dropProgress * dropSpeed * -12.0;\n    pos.y += dropY;\n\n    // Tiny horizontal wobble while falling (rain sway)\n    float sway = sin(aIndex * 0.7 + dropProgress * 8.0) * dropProgress * 0.3;\n    pos.x += sway;\n\n    // Fade out as particles fall\n    vFallAlpha = 1.0 - smoothstep(0.0, 0.7, dropProgress);

1\n\n    vec4 mvPosition = modelViewMatrix * vec4(pos, 1.0);\n\n    // Rain drops become small streaks as they fall\n    float fallStretch = 1.0 + dropProgress * 0.8;\n    gl_PointSize = aSize * uPointSize * fallStretch * (160.0 / -mvPosition.z);\n    gl_PointSize = max(gl_PointSize, 0.5);\n    gl_Position  = projectionMatrix * mvPosition;\n\n    // ── Brightness ──\n    float normH = smoothstep(-3.0, 3.0, pos.y - dropY);\n    vBrightness = 0.2 + 0.45 * normH;\n    vBrightness += sin(aIndex * 0.1 + t * 0.8) * 0.06;\n\n    vHeight = normH;\n\n    // ── Mouse-driven color gradient ──\n    float colorP = normH * 0.5 + smoothstep(-11.0, 11.0, aGridX) * 0.5;\n    float hueShift = uMouseHue * 0.15;\n\n    if (colorP < 0.5) {\n      vParticleColor = mix(uColorA, uColorB, colorP * 2.0);\n    } else {\n      vParticleColor = mix(uColorB, uColorC, (colorP - 0.5) * 2.0);\n    }\n\n    // Hue rotation from mouse\n    float luma = dot(vParticleColor, vec3(0.299, 0.587, 0.114));\n    vec3 hueCol = hsl2rgb(fract(colorP * 0.3 + hueShift + 0.6), 0.65, 0.35 + luma * 0.3);\n    vParticleColor = mix(vParticleColor, hueCol, 0.35);\n  }\n",fragmentShader:"\n  varying float vBrightness;\n  varying float vHeight;\n  varying vec3  vParticleColor;\n  varying float vFallAlpha;\n\n  void main() {\n    float dist = length(gl_PointCoord - vec2(0.5));\n    if (dist > 0.5) discard;\n\n    float core = exp(-dist * 10.0);\n    float glow = 1.0 - smoothstep(0.0, 0.5, dist);\n\n    vec3 color = vParticleColor;\n    color *= 0.45 + vBrightness * 0.7;\n    color += vParticleColor * 0.25 * core * vBrightness;\n\n    float alpha = glow * (0.3 + vBrightness * 0.25) * vFallAlpha;\n\n    gl_FragColor = vec4(color, alpha);\n  }\n",uniforms:c,transparent:!0,depthWrite:!1,blending:s.EZo})]}),(0,t.jsx)("pointLight",{position:[-4,3,2],color:"#7c3aed",intensity:4,distance:18,decay:2}),(0,t.jsx)("pointLight",{position:[4,2,-2],color:"#06b6d4",intensity:3,distance:18,decay:2}),(0,t.jsx)("pointLight",{position:[0,-1,5],color:"#ec4899",intensity:3,distance:16,decay:2})]})}function c(){return(0,t.jsx)(r.Hl,{camera:{position:[0,3,12],fov:50},gl:{antialias:!0,alpha:!0,powerPreference:"high-performance"},dpr:[1,1.5],style:{position:"absolute",inset:0,zIndex:1,background:"transparent",pointerEvents:"auto"},children:(0,t.jsxs)(i.Suspense,{fallback:null,children:[(0,t.jsx)("ambientLight",{intensity:.1}),(0,t.jsx)("spotLight",{position:[5,8,8],color:"#aabbff",intensity:1.5,angle:.5,penumbra:1,castShadow:!1}),(0,t.jsx)("spotLight",{position:[-4,-3,4],color:"#cc4488",intensity:.4,angle:.5,penumbra:1}),(0,t.jsx)("spotLight",{position:[0,3,-6],color:"#6644cc",intensity:.8,angle:.6,penumbra:1}),(0,t.jsx)(u,{}),(0,t.jsx)(a.s0,{children:(0,t.jsx)(a.mK,{intensity:.4,luminanceThreshold:.5,luminanceSmoothing:.2,radius:.4})})]})})}}}]);