La-Fabrik/src/shaders/NetShader.ts

import { ShaderMaterial } from "three";

export const createNetShader = (): ShaderMaterial => {
  return new ShaderMaterial({
    transparent: true,
    depthWrite: false,
    uniforms: {
      uTime: { value: 0 },
      uGridScale: { value: 11.3 },
      uPincushionStrength: { value: 0.4 },
      uBloomIntensity: { value: 0.8 },
      uGridThickness: { value: 0.05 },
    },
    vertexShader: `
      varying vec2 vUv;
      
      void main() {
        vUv = uv;
        gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
      }
    `,
    fragmentShader: `
      uniform float uTime;
      uniform float uGridScale;
      uniform float uPincushionStrength;
      uniform float uBloomIntensity;
      uniform float uGridThickness;
      
      varying vec2 vUv;
      
      vec2 applyPincushion(vec2 uv, float strength) {
        vec2 center = uv - 0.5;
        float dist = length(center);
        float distortion = 1.0 + dist * dist * strength;
        return center * distortion + 0.5;
      }
      
      float grid(vec2 uv, float scale, float thickness) {
        vec2 gridUV = fract(uv * scale);
        
        float edgeX = step(gridUV.x, thickness) + step(1.0 - thickness, gridUV.x);
        float edgeY = step(gridUV.y, thickness) + step(1.0 - thickness, gridUV.y);
        
        float line = min(edgeX + edgeY, 1.0);
        
        return line;
      }
      
      void main() {
        vec2 uv = applyPincushion(vUv, uPincushionStrength);
        
        float gridPattern = grid(uv, uGridScale, uGridThickness);
        
        vec3 gridColor = vec3(1.0, 0.8, 0.2);
        float bloom = gridPattern * uBloomIntensity;
        vec3 col = gridColor * (0.3 + bloom);
        
        gl_FragColor = vec4(col, gridPattern * 0.95);
      }
    `,
  });
};