From 8706d510db1183484f85b9cbfd958ecbac8d0b4d Mon Sep 17 00:00:00 2001
From: code002lover <code002lover@ipost.rocks>
Date: Mon, 8 Dec 2025 12:15:16 +0100
Subject: [PATCH] base shader

---
 frontend/public/assets/ichannel1.png     |  Bin 0 -> 16558 bytes
 frontend/public/vite.svg                 |    1 -
 frontend/src/ShaderBackground.tsx        |  205 ++++
 frontend/src/ShaderBackground_regret.tsx | 1165 ----------------------
 frontend/src/assets/shader.glsl          |   83 ++
 frontend/src/randomTextureForShader.ts   |   35 -
 6 files changed, 288 insertions(+), 1201 deletions(-)
 create mode 100644 frontend/public/assets/ichannel1.png
 delete mode 100644 frontend/public/vite.svg
 create mode 100644 frontend/src/ShaderBackground.tsx
 delete mode 100644 frontend/src/ShaderBackground_regret.tsx
 create mode 100644 frontend/src/assets/shader.glsl
 delete mode 100644 frontend/src/randomTextureForShader.ts

diff --git a/frontend/public/assets/ichannel1.png b/frontend/public/assets/ichannel1.png
new file mode 100644
index 0000000000000000000000000000000000000000..a02f0a0688ea169584327898b26f50bd4f9fae7b
GIT binary patch
literal 16558
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

literal 0
HcmV?d00001

diff --git a/frontend/public/vite.svg b/frontend/public/vite.svg
deleted file mode 100644
index e7b8dfb..0000000
--- a/frontend/public/vite.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
\ No newline at end of file
diff --git a/frontend/src/ShaderBackground.tsx b/frontend/src/ShaderBackground.tsx
new file mode 100644
index 0000000..f089020
--- /dev/null
+++ b/frontend/src/ShaderBackground.tsx
@@ -0,0 +1,205 @@
+import { useEffect, useRef } from "react";
+
+import SHADER_CODE from "./assets/shader.glsl?raw";
+
+function buildProgram(
+  ctx: WebGL2RenderingContext,
+  fragShader: WebGLShader,
+  vertexShader: WebGLShader
+) {
+  const program = ctx.createProgram();
+  if (!program) return null;
+
+  ctx.attachShader(program, fragShader);
+  ctx.attachShader(program, vertexShader);
+
+  ctx.linkProgram(program);
+
+  const status = ctx.getProgramParameter(program, ctx.LINK_STATUS);
+
+  if (status) {
+    return program;
+  }
+
+  console.error(ctx.getProgramInfoLog(program));
+  ctx.deleteProgram(program);
+  return null;
+}
+
+function buildShader(
+  ctx: WebGL2RenderingContext,
+  type: number,
+  source: string
+) {
+  const shader = ctx.createShader(type);
+  if (!shader) return null;
+
+  ctx.shaderSource(shader, source);
+  ctx.compileShader(shader);
+
+  const status = ctx.getShaderParameter(shader, ctx.COMPILE_STATUS);
+
+  if (status) {
+    return shader;
+  }
+
+  console.error(ctx.getShaderInfoLog(shader));
+  ctx.deleteShader(shader);
+  return null;
+}
+
+function loadTexture(gl: WebGL2RenderingContext, url: string) {
+  const texture = gl.createTexture();
+  gl.bindTexture(gl.TEXTURE_2D, texture);
+
+  // Because images have to be downloaded over the internet
+  // they might take a moment until they are ready.
+  // Until then put a single pixel in the texture so we can
+  // use it immediately. When the image has finished downloading
+  // we'll update the texture with the contents of the image.
+  const level = 0;
+  const internalFormat = gl.RGBA;
+  const width = 1;
+  const height = 1;
+  const border = 0;
+  const srcFormat = gl.RGBA;
+  const srcType = gl.UNSIGNED_BYTE;
+  const pixel = new Uint8Array([0, 0, 255, 255]); // opaque blue
+  gl.texImage2D(
+    gl.TEXTURE_2D,
+    level,
+    internalFormat,
+    width,
+    height,
+    border,
+    srcFormat,
+    srcType,
+    pixel
+  );
+
+  const image = new Image();
+  image.onload = () => {
+    gl.bindTexture(gl.TEXTURE_2D, texture);
+    gl.texImage2D(
+      gl.TEXTURE_2D,
+      level,
+      internalFormat,
+      srcFormat,
+      srcType,
+      image
+    );
+
+    // WebGL1 has different requirements for power of 2 images
+    // vs. non power of 2 images so check if the image is a
+    // power of 2 in both dimensions.
+    if (isPowerOf2(image.width) && isPowerOf2(image.height)) {
+      // Yes, it's a power of 2. Generate mips.
+      gl.generateMipmap(gl.TEXTURE_2D);
+    } else {
+      // No, it's not a power of 2. Turn off mips and set
+      // wrapping to clamp to edge
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+    }
+  };
+  image.src = url;
+
+  return texture;
+}
+
+function isPowerOf2(value: number) {
+  return (value & (value - 1)) === 0;
+}
+
+
+export const ShaderBackground = () => {
+  const canvasRef = useRef<HTMLCanvasElement>(null);
+
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+
+    const gl = canvas.getContext("webgl2");
+    if (!gl) return;
+
+    gl.viewport(0, 0, canvas.width, canvas.height);
+    gl.clearColor(0, 0, 0, 1);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+
+    const shader = buildShader(gl, gl.FRAGMENT_SHADER, SHADER_CODE);
+    const vertexShader = buildShader(
+      gl,
+      gl.VERTEX_SHADER,
+      `#version 300 es
+    precision lowp float;
+    
+    in vec2 a_position;
+    
+    void main() {
+        gl_Position = vec4(a_position, 0.0, 1.0);
+    }`
+    );
+
+    if (!shader || !vertexShader) return;
+
+    const finalProgram = buildProgram(gl, shader, vertexShader);
+
+    if (!finalProgram) return;
+
+    const posBuffer = gl.createBuffer();
+    gl.bindBuffer(gl.ARRAY_BUFFER, posBuffer);
+    gl.bufferData(
+      gl.ARRAY_BUFFER,
+      new Float32Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]),
+      gl.STATIC_DRAW
+    );
+
+    gl.useProgram(finalProgram);
+    const loc = gl.getAttribLocation(finalProgram, "a_position");
+    gl.vertexAttribPointer(loc, 2, gl.FLOAT, false, 0, 0);
+    gl.enableVertexAttribArray(loc);
+
+    function setResolution(program: WebGLProgram) {
+      const loc = gl!.getUniformLocation(program, "iResolution");
+      if (loc) gl!.uniform3fv(loc, [canvas!.width, canvas!.height, 1]);
+    }
+
+    function setTime(program: WebGLProgram, now: number) {
+      const loc = gl!.getUniformLocation(program, "iTime");
+      if (loc) gl!.uniform1f(loc, now);
+    }
+
+    const final_iChannel1 = gl.getUniformLocation(finalProgram, "iChannel1");
+
+    const ichannel1_texture = loadTexture(gl, "assets/ichannel1.png");
+
+    gl!.viewport(0, 0, canvas!.width, canvas!.height);
+
+    gl!.useProgram(finalProgram);
+    setResolution(finalProgram!);
+
+    // Bind Texture to Unit 1
+    gl!.activeTexture(gl!.TEXTURE1);
+    gl!.bindTexture(gl!.TEXTURE_2D, ichannel1_texture);
+    gl!.uniform1i(final_iChannel1, 1);
+
+    function update(now: number) {
+      // time in seconds
+      const time = (now) / 1000;
+      gl!.clear(gl!.COLOR_BUFFER_BIT);
+
+      setTime(finalProgram!, time);
+
+      gl!.drawArrays(gl!.TRIANGLES, 0, 6);
+
+      requestAnimationFrame(update);
+    }
+
+    requestAnimationFrame(update);
+  });
+
+  return (
+    <canvas ref={canvasRef} id="blackhole_canvas" width="800" height="450" />
+  );
+};
diff --git a/frontend/src/ShaderBackground_regret.tsx b/frontend/src/ShaderBackground_regret.tsx
deleted file mode 100644
index 5bcfca6..0000000
--- a/frontend/src/ShaderBackground_regret.tsx
+++ /dev/null
@@ -1,1165 +0,0 @@
-import { useEffect, useRef } from "react";
-import { generateRandomRGBABytes } from "./randomTextureForShader";
-
-const buffer_1 = `#version 300 es
-precision mediump float;
-uniform vec3      iResolution;           // viewport resolution (in pixels)
-uniform float     iTime;                 // shader playback time (in seconds)
-uniform float     iTimeDelta;            // render time (in seconds)
-uniform float     iFrameRate;            // shader frame rate
-uniform int       iFrame;                // shader playback frame
-uniform float     iChannelTime[4];       // channel playback time (in seconds)
-uniform vec3      iChannelResolution[4]; // channel resolution (in pixels)
-uniform vec4      iMouse;                // mouse pixel coords. xy: current (if MLB down), zw: click
-uniform sampler2D iChannel0;
-uniform sampler2D iChannel1;
-uniform sampler2D iChannel2;
-uniform sampler2D iChannel3;
-
-out vec4 FragColor;
-
-/*  
-Main render. 
-
-Temporal AA for a smooth image. Temporal accumulation is disabled while moving the view to prevent ghosting.
-*/
-
-#define ITERATIONS 200          //Increase for less grainy result
-#define TEMPORAL_AA
-
-
-const vec3 MainColor = vec3(1.0);
-
-//noise code by iq
-float noise( in vec3 x )
-{
-    vec3 p = floor(x);
-    vec3 f = fract(x);
-    f = f*f*(3.0-2.0*f);
-    vec2 uv = (p.xy+vec2(37.0,17.0)*p.z) + f.xy;
-    vec2 rg = textureLod( iChannel0, (uv+ 0.5)/256.0, 0.0 ).yx;
-    return -1.0+2.0*mix( rg.x, rg.y, f.z );
-}
-
-float saturate(float x)
-{
-    return clamp(x, 0.0, 1.0);
-}
-
-vec3 saturate(vec3 x)
-{
-    return clamp(x, vec3(0.0), vec3(1.0));
-}
-
-float rand(vec2 coord)
-{
-    return saturate(fract(sin(dot(coord, vec2(12.9898, 78.223))) * 43758.5453));
-}
-
-float pcurve( float x, float a, float b )
-{
-    float k = pow(a+b,a+b) / (pow(a,a)*pow(b,b));
-    return k * pow( x, a ) * pow( 1.0-x, b );
-}
-
-const float pi = 3.14159265;
-
-float atan2(float y, float x)
-{
-    if (x > 0.0)
-    {
-        return atan(y / x);
-    }
-    else if (x == 0.0)
-    {
-        if (y > 0.0)
-        {
-            return pi / 2.0;
-        }
-        else if (y < 0.0)
-        {
-            return -(pi / 2.0);
-        }
-        else
-        {
-            return 0.0;
-        }
-    }
-    else //(x < 0.0)
-    {
-        if (y >= 0.0)
-        {
-            return atan(y / x) + pi;
-        }
-        else
-        {
-            return atan(y / x) - pi;
-        }
-    }
-}
-
-float sdTorus(vec3 p, vec2 t)
-{
-    vec2 q = vec2(length(p.xz) - t.x, p.y);
-    return length(q)-t.y;
-}
-
-float sdSphere(vec3 p, float r)
-{
-  return length(p)-r;
-}
-
-void Haze(inout vec3 color, vec3 pos, float alpha)
-{
-    vec2 t = vec2(1.0, 0.01);
-
-    float torusDist = length(sdTorus(pos + vec3(0.0, -0.05, 0.0), t));
-
-    float bloomDisc = 1.0 / (pow(torusDist, 2.0) + 0.001);
-    vec3 col = MainColor;
-    bloomDisc *= length(pos) < 0.5 ? 0.0 : 1.0;
-
-    color += col * bloomDisc * (2.9 / float(ITERATIONS)) * (1.0 - alpha * 1.0);
-}
-
-void GasDisc(inout vec3 color, inout float alpha, vec3 pos)
-{
-    float discRadius = 3.2;
-    float discWidth = 5.3;
-    float discInner = discRadius - discWidth * 0.5;
-    float discOuter = discRadius + discWidth * 0.5;
-    
-    vec3 origin = vec3(0.0, 0.0, 0.0);
-    float mouseZ = iMouse.y / iResolution.y;
-    vec3 discNormal = normalize(vec3(0.0, 1.0, 0.0));
-    float discThickness = 0.1;
-
-    float distFromCenter = distance(pos, origin);
-    float distFromDisc = dot(discNormal, pos - origin);
-    
-    float radialGradient = 1.0 - saturate((distFromCenter - discInner) / discWidth * 0.5);
-
-    float coverage = pcurve(radialGradient, 4.0, 0.9);
-
-    discThickness *= radialGradient;
-    coverage *= saturate(1.0 - abs(distFromDisc) / discThickness);
-
-    vec3 dustColorLit = MainColor;
-    vec3 dustColorDark = vec3(0.0, 0.0, 0.0);
-
-    float dustGlow = 1.0 / (pow(1.0 - radialGradient, 2.0) * 290.0 + 0.002);
-    vec3 dustColor = dustColorLit * dustGlow * 8.2;
-
-    coverage = saturate(coverage * 0.7);
-
-
-    float fade = pow((abs(distFromCenter - discInner) + 0.4), 4.0) * 0.04;
-    float bloomFactor = 1.0 / (pow(distFromDisc, 2.0) * 40.0 + fade + 0.00002);
-    vec3 b = dustColorLit * pow(bloomFactor, 1.5);
-    
-    b *= mix(vec3(1.7, 1.1, 1.0), vec3(0.5, 0.6, 1.0), vec3(pow(radialGradient, 2.0)));
-    b *= mix(vec3(1.7, 0.5, 0.1), vec3(1.0), vec3(pow(radialGradient, 0.5)));
-
-    dustColor = mix(dustColor, b * 150.0, saturate(1.0 - coverage * 1.0));
-    coverage = saturate(coverage + bloomFactor * bloomFactor * 0.1);
-    
-    if (coverage < 0.01)
-    {
-        return;   
-    }
-    
-    
-    vec3 radialCoords;
-    radialCoords.x = distFromCenter * 1.5 + 0.55;
-    radialCoords.y = atan2(-pos.x, -pos.z) * 1.5;
-    radialCoords.z = distFromDisc * 1.5;
-
-    radialCoords *= 0.95;
-    
-    float speed = 0.06;
-    
-    float noise1 = 1.0;
-    vec3 rc = radialCoords + 0.0;               rc.y += iTime * speed;
-    noise1 *= noise(rc * 3.0) * 0.5 + 0.5;      rc.y -= iTime * speed;
-    noise1 *= noise(rc * 6.0) * 0.5 + 0.5;      rc.y += iTime * speed;
-    noise1 *= noise(rc * 12.0) * 0.5 + 0.5;     rc.y -= iTime * speed;
-    noise1 *= noise(rc * 24.0) * 0.5 + 0.5;     rc.y += iTime * speed;
-
-    float noise2 = 2.0;
-    rc = radialCoords + 30.0;
-    noise2 *= noise(rc * 3.0) * 0.5 + 0.5;      rc.y += iTime * speed;
-    noise2 *= noise(rc * 6.0) * 0.5 + 0.5;      rc.y -= iTime * speed;
-    noise2 *= noise(rc * 12.0) * 0.5 + 0.5;     rc.y += iTime * speed;
-    noise2 *= noise(rc * 24.0) * 0.5 + 0.5;     rc.y -= iTime * speed;
-    noise2 *= noise(rc * 48.0) * 0.5 + 0.5;     rc.y += iTime * speed;
-    noise2 *= noise(rc * 92.0) * 0.5 + 0.5;     rc.y -= iTime * speed;
-
-    dustColor *= noise1 * 0.998 + 0.002;
-    coverage *= noise2;
-    
-    radialCoords.y += iTime * speed * 0.5;
-    
-    dustColor *= pow(texture(iChannel1, radialCoords.yx * vec2(0.15, 0.27)).rgb, vec3(2.0)) * 4.0;
-
-    coverage = saturate(coverage * 1200.0 / float(ITERATIONS));
-    dustColor = max(vec3(0.0), dustColor);
-
-    coverage *= pcurve(radialGradient, 4.0, 0.9);
-
-    color = (1.0 - alpha) * dustColor * coverage + color;
-
-    alpha = (1.0 - alpha) * coverage + alpha;
-}
-
-
-
-vec3 rotate(vec3 p, float x, float y, float z)
-{
-    mat3 matx = mat3(1.0, 0.0, 0.0,
-                     0.0, cos(x), sin(x),
-                     0.0, -sin(x), cos(x));
-
-    mat3 maty = mat3(cos(y), 0.0, -sin(y),
-                     0.0, 1.0, 0.0,
-                     sin(y), 0.0, cos(y));
-
-    mat3 matz = mat3(cos(z), sin(z), 0.0,
-                     -sin(z), cos(z), 0.0,
-                     0.0, 0.0, 1.0);
-
-    p = matx * p;
-    p = matz * p;
-    p = maty * p;
-
-    return p;
-}
-
-void RotateCamera(inout vec3 eyevec, inout vec3 eyepos)
-{
-    float mousePosY = iMouse.y / iResolution.y;
-    float mousePosX = iMouse.x / iResolution.x;
-
-    vec3 angle = vec3(mousePosY * 0.05 + 0.05, 1.0 + mousePosX * 1.0, -0.45);
-
-    eyevec = rotate(eyevec, angle.x, angle.y, angle.z);
-    eyepos = rotate(eyepos, angle.x, angle.y, angle.z);
-}
-
-void WarpSpace(inout vec3 eyevec, inout vec3 raypos)
-{
-    vec3 origin = vec3(0.0, 0.0, 0.0);
-
-    float singularityDist = distance(raypos, origin);
-    float warpFactor = 1.0 / (pow(singularityDist, 2.0) + 0.000001);
-
-    vec3 singularityVector = normalize(origin - raypos);
-    
-    float warpAmount = 5.0;
-
-    eyevec = normalize(eyevec + singularityVector * warpFactor * warpAmount / float(ITERATIONS));
-}
-
-void mainImage( out vec4 fragColor, in vec2 fragCoord )
-{
-    
-    vec2 uv = fragCoord.xy / iResolution.xy;
-    
-    float aspect = iResolution.x / iResolution.y;
-
-    vec2 uveye = uv;
-    
-    #ifdef TEMPORAL_AA
-    uveye.x += (rand(uv + sin(iTime * 1.0)) / iResolution.x) * (iMouse.z > 1.0 ? 0.0 : 1.0);
-    uveye.y += (rand(uv + 1.0 + sin(iTime * 1.0)) / iResolution.y) * (iMouse.z > 1.0 ? 0.0 : 1.0);
-    #endif
-    
-    vec3 eyevec = normalize(vec3((uveye * 2.0 - 1.0) * vec2(aspect, 1.0), 6.0));
-    vec3 eyepos = vec3(0.0, -0.0, -10.0);
-    
-    vec2 mousepos = iMouse.xy / iResolution.xy;
-    if (mousepos.x == 0.0)
-    {
-        mousepos.x = 0.35;
-    }
-    eyepos.x += mousepos.x * 3.0 - 1.5;
-    
-    const float far = 15.0;
-
-    RotateCamera(eyevec, eyepos);
-
-    vec3 color = vec3(0.0, 0.0, 0.0);
-    
-    float dither = rand(uv 
-                        #ifdef TEMPORAL_AA
-                        + sin(iTime * 1.0) * (iMouse.z > 1.0 ? 0.0 : 1.0)
-                        #endif
-                       ) * 2.0;
-
-
-    float alpha = 0.0;
-    vec3 raypos = eyepos + eyevec * dither * far / float(ITERATIONS);
-    for (int i = 0; i < ITERATIONS; i++)
-    {        
-        WarpSpace(eyevec, raypos);
-        raypos += eyevec * far / float(ITERATIONS);
-        GasDisc(color, alpha, raypos);
-        Haze(color, raypos, alpha);
-    }
-    
-    color *= 0.0001;
-
-    
-    #ifdef TEMPORAL_AA
-    const float p = 1.0;
-    vec3 previous = pow(texture(iChannel2, uv).rgb, vec3(1.0 / p));
-    
-    color = pow(color, vec3(1.0 / p));
-    
-    float blendWeight = 0.9 * (iMouse.z > 1.0 ? 0.0 : 1.0);
-    
-    color = mix(color, previous, blendWeight);
-    
-    color = pow(color, vec3(p));
-    #endif
-    
-    fragColor = vec4(saturate(color), 1.0);
-}
-
-void main()
-{
-    // gl_FragCoord.xy is pixel coordinates (1..width, 1..height)
-    mainImage(FragColor, gl_FragCoord.xy);
-}
-`;
-
-const buffer_2 = `#version 300 es
-precision mediump float;
-uniform vec3      iResolution;           // viewport resolution (in pixels)
-uniform float     iTime;                 // shader playback time (in seconds)
-uniform float     iTimeDelta;            // render time (in seconds)
-uniform float     iFrameRate;            // shader frame rate
-uniform int       iFrame;                // shader playback frame
-uniform float     iChannelTime[4];       // channel playback time (in seconds)
-uniform vec3      iChannelResolution[4]; // channel resolution (in pixels)
-uniform vec4      iMouse;                // mouse pixel coords. xy: current (if MLB down), zw: click
-uniform sampler2D iChannel0;
-uniform sampler2D iChannel1;
-uniform sampler2D iChannel2;
-uniform sampler2D iChannel3;
-
-out vec4 FragColor;
-//First bloom pass, mipmap tree thing
-
-vec3 ColorFetch(vec2 coord)
-{
- 	return texture(iChannel0, coord).rgb;   
-}
-
-vec3 Grab1(vec2 coord, const float octave, const vec2 offset)
-{
- 	float scale = exp2(octave);
-    
-    coord += offset;
-    coord *= scale;
-
-   	if (coord.x < 0.0 || coord.x > 1.0 || coord.y < 0.0 || coord.y > 1.0)
-    {
-     	return vec3(0.0);   
-    }
-    
-    vec3 color = ColorFetch(coord);
-
-    return color;
-}
-
-vec3 Grab4(vec2 coord, const float octave, const vec2 offset)
-{
- 	float scale = exp2(octave);
-    
-    coord += offset;
-    coord *= scale;
-
-   	if (coord.x < 0.0 || coord.x > 1.0 || coord.y < 0.0 || coord.y > 1.0)
-    {
-     	return vec3(0.0);   
-    }
-    
-    vec3 color = vec3(0.0);
-    float weights = 0.0;
-    
-    const int oversampling = 4;
-    
-    for (int i = 0; i < oversampling; i++)
-    {    	    
-        for (int j = 0; j < oversampling; j++)
-        {
-			vec2 off = (vec2(i, j) / iResolution.xy + vec2(0.0) / iResolution.xy) * scale / float(oversampling);
-            color += ColorFetch(coord + off);
-            
-
-            weights += 1.0;
-        }
-    }
-    
-    color /= weights;
-    
-    return color;
-}
-
-vec3 Grab8(vec2 coord, const float octave, const vec2 offset)
-{
- 	float scale = exp2(octave);
-    
-    coord += offset;
-    coord *= scale;
-
-   	if (coord.x < 0.0 || coord.x > 1.0 || coord.y < 0.0 || coord.y > 1.0)
-    {
-     	return vec3(0.0);   
-    }
-    
-    vec3 color = vec3(0.0);
-    float weights = 0.0;
-    
-    const int oversampling = 8;
-    
-    for (int i = 0; i < oversampling; i++)
-    {    	    
-        for (int j = 0; j < oversampling; j++)
-        {
-			vec2 off = (vec2(i, j) / iResolution.xy + vec2(0.0) / iResolution.xy) * scale / float(oversampling);
-            color += ColorFetch(coord + off);
-            
-
-            weights += 1.0;
-        }
-    }
-    
-    color /= weights;
-    
-    return color;
-}
-
-vec3 Grab16(vec2 coord, const float octave, const vec2 offset)
-{
- 	float scale = exp2(octave);
-    
-    coord += offset;
-    coord *= scale;
-
-   	if (coord.x < 0.0 || coord.x > 1.0 || coord.y < 0.0 || coord.y > 1.0)
-    {
-     	return vec3(0.0);   
-    }
-    
-    vec3 color = vec3(0.0);
-    float weights = 0.0;
-    
-    const int oversampling = 16;
-    
-    for (int i = 0; i < oversampling; i++)
-    {    	    
-        for (int j = 0; j < oversampling; j++)
-        {
-			vec2 off = (vec2(i, j) / iResolution.xy + vec2(0.0) / iResolution.xy) * scale / float(oversampling);
-            color += ColorFetch(coord + off);
-            
-
-            weights += 1.0;
-        }
-    }
-    
-    color /= weights;
-    
-    return color;
-}
-
-vec2 CalcOffset(float octave)
-{
-    vec2 offset = vec2(0.0);
-    
-    vec2 padding = vec2(10.0) / iResolution.xy;
-    
-    offset.x = -min(1.0, floor(octave / 3.0)) * (0.25 + padding.x);
-    
-    offset.y = -(1.0 - (1.0 / exp2(octave))) - padding.y * octave;
-
-	offset.y += min(1.0, floor(octave / 3.0)) * 0.35;
-    
- 	return offset;   
-}
-
-void mainImage( out vec4 fragColor, in vec2 fragCoord )
-{
-    vec2 uv = fragCoord.xy / iResolution.xy;
-    
-    
-    vec3 color = vec3(0.0);
-    
-    /*
-    Create a mipmap tree thingy with padding to prevent leaking bloom
-   	
-	Since there's no mipmaps for the previous buffer and the reduction process has to be done in one pass,
-    oversampling is required for a proper result
-	*/
-    color += Grab1(uv, 1.0, vec2(0.0,  0.0)   );
-    color += Grab4(uv, 2.0, vec2(CalcOffset(1.0))   );
-    color += Grab8(uv, 3.0, vec2(CalcOffset(2.0))   );
-    color += Grab16(uv, 4.0, vec2(CalcOffset(3.0))   );
-    color += Grab16(uv, 5.0, vec2(CalcOffset(4.0))   );
-    color += Grab16(uv, 6.0, vec2(CalcOffset(5.0))   );
-    color += Grab16(uv, 7.0, vec2(CalcOffset(6.0))   );
-    color += Grab16(uv, 8.0, vec2(CalcOffset(7.0))   );
-
-
-    fragColor = vec4(color, 1.0);
-}
-
-void main()
-{
-    // gl_FragCoord.xy is pixel coordinates (1..width, 1..height)
-    mainImage(FragColor, gl_FragCoord.xy);
-}
-`;
-
-const buffer_3 = `#version 300 es
-precision mediump float;
-uniform vec3      iResolution;           // viewport resolution (in pixels)
-uniform float     iTime;                 // shader playback time (in seconds)
-uniform float     iTimeDelta;            // render time (in seconds)
-uniform float     iFrameRate;            // shader frame rate
-uniform int       iFrame;                // shader playback frame
-uniform float     iChannelTime[4];       // channel playback time (in seconds)
-uniform vec3      iChannelResolution[4]; // channel resolution (in pixels)
-uniform vec4      iMouse;                // mouse pixel coords. xy: current (if MLB down), zw: click
-uniform sampler2D iChannel0;
-uniform sampler2D iChannel1;
-uniform sampler2D iChannel2;
-uniform sampler2D iChannel3;
-
-out vec4 FragColor;
-//Horizontal gaussian blur leveraging hardware filtering for fewer texture lookups.
-
-vec3 ColorFetch(vec2 coord)
-{
- 	return texture(iChannel0, coord).rgb;   
-}
-
-float weights[5];
-float offsets[5];
-
-
-void mainImage( out vec4 fragColor, in vec2 fragCoord )
-{    
-    
-    weights[0] = 0.19638062;
-    weights[1] = 0.29675293;
-    weights[2] = 0.09442139;
-    weights[3] = 0.01037598;
-    weights[4] = 0.00025940;
-    
-    offsets[0] = 0.00000000;
-    offsets[1] = 1.41176471;
-    offsets[2] = 3.29411765;
-    offsets[3] = 5.17647059;
-    offsets[4] = 7.05882353;
-    
-    vec2 uv = fragCoord.xy / iResolution.xy;
-    
-    vec3 color = vec3(0.0);
-    float weightSum = 0.0;
-    
-    if (uv.x < 0.52)
-    {
-        color += ColorFetch(uv) * weights[0];
-        weightSum += weights[0];
-
-        for(int i = 1; i < 5; i++)
-        {
-            vec2 offset = vec2(offsets[i]) / iResolution.xy;
-            color += ColorFetch(uv + offset * vec2(0.5, 0.0)) * weights[i];
-            color += ColorFetch(uv - offset * vec2(0.5, 0.0)) * weights[i];
-            weightSum += weights[i] * 2.0;
-        }
-
-        color /= weightSum;
-    }
-
-    fragColor = vec4(color,1.0);
-}
-
-void main()
-{
-    // gl_FragCoord.xy is pixel coordinates (1..width, 1..height)
-    mainImage(FragColor, gl_FragCoord.xy);
-}
-`;
-
-const buffer_4 = `#version 300 es
-precision mediump float;
-uniform vec3      iResolution;           // viewport resolution (in pixels)
-uniform float     iTime;                 // shader playback time (in seconds)
-uniform float     iTimeDelta;            // render time (in seconds)
-uniform float     iFrameRate;            // shader frame rate
-uniform int       iFrame;                // shader playback frame
-uniform float     iChannelTime[4];       // channel playback time (in seconds)
-uniform vec3      iChannelResolution[4]; // channel resolution (in pixels)
-uniform vec4      iMouse;                // mouse pixel coords. xy: current (if MLB down), zw: click
-uniform sampler2D iChannel0;
-uniform sampler2D iChannel1;
-uniform sampler2D iChannel2;
-uniform sampler2D iChannel3;
-
-out vec4 FragColor;
-
-//Vertical gaussian blur leveraging hardware filtering for fewer texture lookups.
-
-vec3 ColorFetch(vec2 coord)
-{
- 	return texture(iChannel0, coord).rgb;   
-}
-
-float weights[5];
-float offsets[5];
-
-
-void mainImage( out vec4 fragColor, in vec2 fragCoord )
-{    
-    
-    weights[0] = 0.19638062;
-    weights[1] = 0.29675293;
-    weights[2] = 0.09442139;
-    weights[3] = 0.01037598;
-    weights[4] = 0.00025940;
-    
-    offsets[0] = 0.00000000;
-    offsets[1] = 1.41176471;
-    offsets[2] = 3.29411765;
-    offsets[3] = 5.17647059;
-    offsets[4] = 7.05882353;
-    
-    vec2 uv = fragCoord.xy / iResolution.xy;
-    
-    vec3 color = vec3(0.0);
-    float weightSum = 0.0;
-    
-    if (uv.x < 0.52)
-    {
-        color += ColorFetch(uv) * weights[0];
-        weightSum += weights[0];
-
-        for(int i = 1; i < 5; i++)
-        {
-            vec2 offset = vec2(offsets[i]) / iResolution.xy;
-            color += ColorFetch(uv + offset * vec2(0.0, 0.5)) * weights[i];
-            color += ColorFetch(uv - offset * vec2(0.0, 0.5)) * weights[i];
-            weightSum += weights[i] * 2.0;
-        }
-
-        color /= weightSum;
-    }
-
-    fragColor = vec4(color,1.0);
-}
-
-void main()
-{
-    // gl_FragCoord.xy is pixel coordinates (1..width, 1..height)
-    mainImage(FragColor, gl_FragCoord.xy);
-}
-`;
-
-const image_1 = `#version 300 es
-precision mediump float;
-uniform vec3      iResolution;           // viewport resolution (in pixels)
-uniform float     iTime;                 // shader playback time (in seconds)
-uniform float     iTimeDelta;            // render time (in seconds)
-uniform float     iFrameRate;            // shader frame rate
-uniform int       iFrame;                // shader playback frame
-uniform float     iChannelTime[4];       // channel playback time (in seconds)
-uniform vec3      iChannelResolution[4]; // channel resolution (in pixels)
-uniform vec4      iMouse;                // mouse pixel coords. xy: current (if MLB down), zw: click
-uniform sampler2D iChannel0;
-uniform sampler2D iChannel1;
-uniform sampler2D iChannel2;
-uniform sampler2D iChannel3;
-
-out vec4 FragColor;
-vec3 saturate(vec3 x)
-{
-    return clamp(x, vec3(0.0), vec3(1.0));
-}
-
-vec4 cubic(float x)
-{
-    float x2 = x * x;
-    float x3 = x2 * x;
-    vec4 w;
-    w.x =   -x3 + 3.0*x2 - 3.0*x + 1.0;
-    w.y =  3.0*x3 - 6.0*x2       + 4.0;
-    w.z = -3.0*x3 + 3.0*x2 + 3.0*x + 1.0;
-    w.w =  x3;
-    return w / 6.0;
-}
-
-vec4 BicubicTexture(in sampler2D tex, in vec2 coord)
-{
-	vec2 resolution = iResolution.xy;
-
-	coord *= resolution;
-
-	float fx = fract(coord.x);
-    float fy = fract(coord.y);
-    coord.x -= fx;
-    coord.y -= fy;
-
-    fx -= 0.5;
-    fy -= 0.5;
-
-    vec4 xcubic = cubic(fx);
-    vec4 ycubic = cubic(fy);
-
-    vec4 c = vec4(coord.x - 0.5, coord.x + 1.5, coord.y - 0.5, coord.y + 1.5);
-    vec4 s = vec4(xcubic.x + xcubic.y, xcubic.z + xcubic.w, ycubic.x + ycubic.y, ycubic.z + ycubic.w);
-    vec4 offset = c + vec4(xcubic.y, xcubic.w, ycubic.y, ycubic.w) / s;
-
-    vec4 sample0 = texture(tex, vec2(offset.x, offset.z) / resolution);
-    vec4 sample1 = texture(tex, vec2(offset.y, offset.z) / resolution);
-    vec4 sample2 = texture(tex, vec2(offset.x, offset.w) / resolution);
-    vec4 sample3 = texture(tex, vec2(offset.y, offset.w) / resolution);
-
-    float sx = s.x / (s.x + s.y);
-    float sy = s.z / (s.z + s.w);
-
-    return mix( mix(sample3, sample2, sx), mix(sample1, sample0, sx), sy);
-}
-
-vec3 ColorFetch(vec2 coord)
-{
- 	return texture(iChannel0, coord).rgb;   
-}
-
-vec3 BloomFetch(vec2 coord)
-{
- 	return BicubicTexture(iChannel3, coord).rgb;   
-}
-
-vec3 Grab(vec2 coord, const float octave, const vec2 offset)
-{
- 	float scale = exp2(octave);
-    
-    coord /= scale;
-    coord -= offset;
-
-    return BloomFetch(coord);
-}
-
-vec2 CalcOffset(float octave)
-{
-    vec2 offset = vec2(0.0);
-    
-    vec2 padding = vec2(10.0) / iResolution.xy;
-    
-    offset.x = -min(1.0, floor(octave / 3.0)) * (0.25 + padding.x);
-    
-    offset.y = -(1.0 - (1.0 / exp2(octave))) - padding.y * octave;
-
-	offset.y += min(1.0, floor(octave / 3.0)) * 0.35;
-    
- 	return offset;   
-}
-
-vec3 GetBloom(vec2 coord)
-{
- 	vec3 bloom = vec3(0.0);
-    
-    //Reconstruct bloom from multiple blurred images
-    bloom += Grab(coord, 1.0, vec2(CalcOffset(0.0))) * 1.0;
-    bloom += Grab(coord, 2.0, vec2(CalcOffset(1.0))) * 1.5;
-	bloom += Grab(coord, 3.0, vec2(CalcOffset(2.0))) * 1.0;
-    bloom += Grab(coord, 4.0, vec2(CalcOffset(3.0))) * 1.5;
-    bloom += Grab(coord, 5.0, vec2(CalcOffset(4.0))) * 1.8;
-    bloom += Grab(coord, 6.0, vec2(CalcOffset(5.0))) * 1.0;
-    bloom += Grab(coord, 7.0, vec2(CalcOffset(6.0))) * 1.0;
-    bloom += Grab(coord, 8.0, vec2(CalcOffset(7.0))) * 1.0;
-
-	return bloom;
-}
-
-void mainImage( out vec4 fragColor, in vec2 fragCoord )
-{
-    
-    vec2 uv = fragCoord.xy / iResolution.xy;
-    
-    vec3 color = ColorFetch(uv);
-    
-    
-    color += GetBloom(uv) * 0.08;
-    
-    color *= 200.0;
-    
-
-    //Tonemapping and color grading
-    color = pow(color, vec3(1.5));
-    color = color / (1.0 + color);
-    color = pow(color, vec3(1.0 / 1.5));
-
-    
-    color = mix(color, color * color * (3.0 - 2.0 * color), vec3(1.0));
-    color = pow(color, vec3(1.3, 1.20, 1.0));    
-
-	color = saturate(color * 1.01);
-    
-    color = pow(color, vec3(0.7 / 2.2));
-
-    fragColor = vec4(color, 1.0);
-
-}
-
-void main()
-{
-    // gl_FragCoord.xy is pixel coordinates (1..width, 1..height)
-    mainImage(FragColor, gl_FragCoord.xy);
-}
-`;
-
-function buildProgram(
-  ctx: WebGL2RenderingContext,
-  fragShader: WebGLShader,
-  vertexShader: WebGLShader
-) {
-  const program = ctx.createProgram();
-  if (!program) return null;
-
-  ctx.attachShader(program, fragShader);
-  ctx.attachShader(program, vertexShader);
-
-  ctx.linkProgram(program);
-
-  const status = ctx.getProgramParameter(program, ctx.LINK_STATUS);
-
-  if (status) {
-    return program;
-  }
-
-  console.error(ctx.getProgramInfoLog(program));
-  ctx.deleteProgram(program);
-  return null;
-}
-
-function buildShader(
-  ctx: WebGL2RenderingContext,
-  type: number,
-  source: string
-) {
-  const shader = ctx.createShader(type);
-  if (!shader) return null;
-
-  ctx.shaderSource(shader, source);
-  ctx.compileShader(shader);
-
-  const status = ctx.getShaderParameter(shader, ctx.COMPILE_STATUS);
-
-  if (status) {
-    return shader;
-  }
-
-  console.error(ctx.getShaderInfoLog(shader));
-  ctx.deleteShader(shader);
-  return null;
-}
-
-export function ShaderBackground() {
-  const canvasRef = useRef<HTMLCanvasElement>(null);
-
-  useEffect(() => {
-    const canvas = canvasRef.current;
-    if (!canvas) return;
-
-    const gl = canvas.getContext("webgl2");
-    if (!gl) return;
-
-    gl.viewport(0, 0, canvas.width, canvas.height);
-    gl.clearColor(0, 0, 0, 1);
-    gl.clear(gl.COLOR_BUFFER_BIT);
-
-    const buffer_1_shader = buildShader(gl, gl.FRAGMENT_SHADER, buffer_1);
-    const buffer_2_shader = buildShader(gl, gl.FRAGMENT_SHADER, buffer_2);
-    const buffer_3_shader = buildShader(gl, gl.FRAGMENT_SHADER, buffer_3);
-    const buffer_4_shader = buildShader(gl, gl.FRAGMENT_SHADER, buffer_4);
-    const fragmentShader = buildShader(gl, gl.FRAGMENT_SHADER, image_1);
-
-    const vertexShader = buildShader(
-      gl,
-      gl.VERTEX_SHADER,
-      `#version 300 es
-    precision mediump float;
-    
-    in vec2 a_position;
-    
-    void main() {
-        gl_Position = vec4(a_position, 0.0, 1.0);
-    }`
-    );
-
-    if (
-      !buffer_1_shader ||
-      !buffer_2_shader ||
-      !buffer_3_shader ||
-      !buffer_4_shader ||
-      !fragmentShader ||
-      !vertexShader
-    )
-      return;
-
-    const buffer_1_program = buildProgram(gl, buffer_1_shader, vertexShader);
-    const buffer_2_program = buildProgram(gl, buffer_2_shader, vertexShader);
-    const buffer_3_program = buildProgram(gl, buffer_3_shader, vertexShader);
-    const buffer_4_program = buildProgram(gl, buffer_4_shader, vertexShader);
-    const finalProgram = buildProgram(gl, fragmentShader, vertexShader);
-
-    if (
-      !buffer_1_program ||
-      !buffer_2_program ||
-      !buffer_3_program ||
-      !buffer_4_program ||
-      !finalProgram
-    )
-      return;
-
-    const posBuffer = gl.createBuffer();
-    gl.bindBuffer(gl.ARRAY_BUFFER, posBuffer);
-    gl.bufferData(
-      gl.ARRAY_BUFFER,
-      new Float32Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]),
-      gl.STATIC_DRAW
-    );
-
-    // Vertex attributes for each program
-    const programs = [
-      buffer_1_program,
-      buffer_2_program,
-      buffer_3_program,
-      buffer_4_program,
-      finalProgram,
-    ];
-    programs.forEach((prog) => {
-      gl.useProgram(prog);
-      const loc = gl.getAttribLocation(prog, "a_position");
-      gl.vertexAttribPointer(loc, 2, gl.FLOAT, false, 0, 0);
-      gl.enableVertexAttribArray(loc);
-    });
-
-    // --- HELPER FUNC ---
-    function createFramebufferTexture(w: number, h: number) {
-      const tex = gl!.createTexture();
-      gl!.bindTexture(gl!.TEXTURE_2D, tex);
-      gl!.texImage2D(
-        gl!.TEXTURE_2D,
-        0,
-        gl!.RGBA,
-        w,
-        h,
-        0,
-        gl!.RGBA,
-        gl!.UNSIGNED_BYTE,
-        null
-      );
-      gl!.texParameteri(gl!.TEXTURE_2D, gl!.TEXTURE_MIN_FILTER, gl!.LINEAR);
-      gl!.texParameteri(gl!.TEXTURE_2D, gl!.TEXTURE_MAG_FILTER, gl!.LINEAR);
-      gl!.texParameteri(gl!.TEXTURE_2D, gl!.TEXTURE_WRAP_S, gl!.CLAMP_TO_EDGE);
-      gl!.texParameteri(gl!.TEXTURE_2D, gl!.TEXTURE_WRAP_T, gl!.CLAMP_TO_EDGE);
-
-      const fb = gl!.createFramebuffer();
-      gl!.bindFramebuffer(gl!.DRAW_FRAMEBUFFER, fb);
-      gl!.framebufferTexture2D(
-        gl!.DRAW_FRAMEBUFFER,
-        gl!.COLOR_ATTACHMENT0,
-        gl!.TEXTURE_2D,
-        tex,
-        0
-      );
-
-      return { tex, fb };
-    }
-
-    // 1. Scene Buffer (Stores the main render)
-    const sceneTarget = createFramebufferTexture(canvas.width, canvas.height);
-
-    // 2. Ping-Pong Buffers (For doing multipass bloom effects)
-    const pingTarget = createFramebufferTexture(canvas.width, canvas.height);
-    const pongTarget = createFramebufferTexture(canvas.width, canvas.height);
-
-    // --- NOISE TEXTURE ---
-    // Fix: Create once, not every frame
-    const noiseBytes = generateRandomRGBABytes(canvas.width, canvas.height);
-    const noiseTexture = gl.createTexture();
-    gl.activeTexture(gl.TEXTURE0);
-    gl.bindTexture(gl.TEXTURE_2D, noiseTexture);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
-    gl.texImage2D(
-      gl.TEXTURE_2D,
-      0,
-      gl.RGBA,
-      canvas.width,
-      canvas.height,
-      0,
-      gl.RGBA,
-      gl.UNSIGNED_BYTE,
-      noiseBytes
-    );
-
-    function setResolution(program: WebGLProgram) {
-      const loc = gl!.getUniformLocation(program, "iResolution");
-      if (loc) gl!.uniform3fv(loc, [canvas!.width, canvas!.height, 1]);
-    }
-
-    function setTime(program: WebGLProgram, now: number) {
-      const loc = gl!.getUniformLocation(program, "iTime");
-      if (loc) gl!.uniform1f(loc, now);
-    }
-
-    // Cache uniform locations
-    const locs = {
-      b1_iChannel0: gl.getUniformLocation(buffer_1_program, "iChannel0"),
-      b2_iChannel0: gl.getUniformLocation(buffer_2_program, "iChannel0"),
-      b3_iChannel0: gl.getUniformLocation(buffer_3_program, "iChannel0"),
-      b4_iChannel0: gl.getUniformLocation(buffer_4_program, "iChannel0"),
-      final_iChannel0: gl.getUniformLocation(finalProgram, "iChannel0"),
-      final_iChannel3: gl.getUniformLocation(finalProgram, "iChannel3"), // Bloom result
-    };
-
-    let reqId: number;
-    const started = Date.now();
-
-    function update(now: number) {
-      // time in seconds
-      const time = (now - started) / 1000;
-
-      // ----------------------------------------------------
-      // PASS 1: Render SCENE -> sceneTarget
-      // ----------------------------------------------------
-      gl!.bindFramebuffer(gl!.DRAW_FRAMEBUFFER, sceneTarget.fb);
-      gl!.viewport(0, 0, canvas!.width, canvas!.height);
-      gl!.clear(gl!.COLOR_BUFFER_BIT);
-
-      gl!.useProgram(buffer_1_program);
-      setResolution(buffer_1_program!);
-      setTime(buffer_1_program!, time);
-
-      // Bind Noise to Unit 0
-      gl!.activeTexture(gl!.TEXTURE0);
-      gl!.bindTexture(gl!.TEXTURE_2D, noiseTexture);
-      gl!.uniform1i(locs.b1_iChannel0, 0);
-
-      gl!.drawArrays(gl!.TRIANGLES, 0, 6);
-
-      // ----------------------------------------------------
-      // PASS 2: Bloom Prep (Buffer 2) -> pingTarget
-      // input: sceneTarget (Unit 0)
-      // ----------------------------------------------------
-      gl!.bindFramebuffer(gl!.DRAW_FRAMEBUFFER, pingTarget.fb);
-
-      gl!.useProgram(buffer_2_program);
-      setResolution(buffer_2_program!);
-
-      gl!.activeTexture(gl!.TEXTURE0);
-      gl!.bindTexture(gl!.TEXTURE_2D, sceneTarget.tex);
-      gl!.uniform1i(locs.b2_iChannel0, 0);
-
-      gl!.drawArrays(gl!.TRIANGLES, 0, 6);
-
-      // ----------------------------------------------------
-      // PASS 3: Horizontal Blur (Buffer 3) -> pongTarget
-      // input: pingTarget (Unit 0)
-      // ----------------------------------------------------
-      gl!.bindFramebuffer(gl!.DRAW_FRAMEBUFFER, pongTarget.fb);
-
-      gl!.useProgram(buffer_3_program);
-      setResolution(buffer_3_program!);
-
-      gl!.activeTexture(gl!.TEXTURE0);
-      gl!.bindTexture(gl!.TEXTURE_2D, pingTarget.tex);
-      gl!.uniform1i(locs.b3_iChannel0, 0);
-
-      gl!.drawArrays(gl!.TRIANGLES, 0, 6);
-
-      // ----------------------------------------------------
-      // PASS 4: Vertical Blur (Buffer 4) -> pingTarget (Final Bloom)
-      // input: pongTarget (Unit 0)
-      // ----------------------------------------------------
-      // Reuse pingTarget to store the final bloom result
-      gl!.bindFramebuffer(gl!.DRAW_FRAMEBUFFER, pingTarget.fb);
-
-      gl!.useProgram(buffer_4_program);
-      setResolution(buffer_4_program!);
-
-      gl!.activeTexture(gl!.TEXTURE0);
-      gl!.bindTexture(gl!.TEXTURE_2D, pongTarget.tex);
-      gl!.uniform1i(locs.b4_iChannel0, 0);
-
-      gl!.drawArrays(gl!.TRIANGLES, 0, 6);
-
-      // ----------------------------------------------------
-      // PASS 5: Final Composition -> Screen
-      // Inputs:
-      // - iChannel0: sceneTarget (Unit 0)
-      // - iChannel3: pingTarget aka Bloom Result (Unit 3)
-      // ----------------------------------------------------
-      gl!.bindFramebuffer(gl!.DRAW_FRAMEBUFFER, null); // Screen
-
-      gl!.useProgram(finalProgram);
-      setResolution(finalProgram!);
-
-      // Bind Scene to Unit 0
-      gl!.activeTexture(gl!.TEXTURE0);
-      gl!.bindTexture(gl!.TEXTURE_2D, sceneTarget.tex);
-      gl!.uniform1i(locs.final_iChannel0, 0);
-
-      // Bind Bloom to Unit 3
-      gl!.activeTexture(gl!.TEXTURE3);
-      gl!.bindTexture(gl!.TEXTURE_2D, pingTarget.tex);
-      gl!.uniform1i(locs.final_iChannel3, 3); // Tell shader iChannel3 is on unit 3
-
-      gl!.drawArrays(gl!.TRIANGLES, 0, 6);
-
-      reqId = requestAnimationFrame(update);
-    }
-
-    reqId = requestAnimationFrame(update);
-
-    // CLEANUP
-    return () => {
-      cancelAnimationFrame(reqId);
-      gl!.deleteProgram(buffer_1_program);
-      gl!.deleteProgram(buffer_2_program);
-      gl!.deleteProgram(buffer_3_program);
-      gl!.deleteProgram(buffer_4_program);
-      gl!.deleteProgram(finalProgram);
-
-      gl!.deleteShader(buffer_1_shader);
-      gl!.deleteShader(buffer_2_shader);
-      gl!.deleteShader(buffer_3_shader);
-      gl!.deleteShader(buffer_4_shader);
-      gl!.deleteShader(fragmentShader);
-      gl!.deleteShader(vertexShader);
-
-      gl!.deleteBuffer(posBuffer);
-
-      gl!.deleteTexture(noiseTexture);
-      gl!.deleteTexture(sceneTarget.tex);
-      gl!.deleteFramebuffer(sceneTarget.fb);
-      gl!.deleteTexture(pingTarget.tex);
-      gl!.deleteFramebuffer(pingTarget.fb);
-      gl!.deleteTexture(pongTarget.tex);
-      gl!.deleteFramebuffer(pongTarget.fb);
-    };
-  }, []);
-
-  return (
-    <canvas ref={canvasRef} id="blackhole_canvas" width="800" height="450" />
-  );
-}
diff --git a/frontend/src/assets/shader.glsl b/frontend/src/assets/shader.glsl
new file mode 100644
index 0000000..cb66698
--- /dev/null
+++ b/frontend/src/assets/shader.glsl
@@ -0,0 +1,83 @@
+#version 300 es
+precision lowp float;
+uniform vec3 iResolution;           // viewport resolution (in pixels)
+uniform float iTime;                 // shader playback time (in seconds)
+uniform sampler2D iChannel1;
+
+out vec4 FragColor;
+
+const float pi = 3.1415927f;
+
+float sdSphere(vec3 p, float s) {
+  return length(p) - s;
+}
+
+float sdTorus(vec3 p, vec2 t) {
+  vec2 q = vec2(length(p.xz) - t.x, p.y);
+  return length(q) - t.y;
+}
+
+void mainImage(out vec4 fragColor, in vec2 fragCoord) {
+  vec2 pp = fragCoord.xy / iResolution.xy;
+  pp = -1.0f + 2.0f * pp;
+  pp.x *= iResolution.x / iResolution.y;
+
+  vec3 lookAt = vec3(0.0f, -0.1f, 0.0f);
+
+  float eyer = 2.0f;
+  float eyea = 0.0f;
+  float eyea2 = (-0.24f) * pi * 2.0f;
+
+  vec3 ro = vec3(eyer * cos(eyea) * sin(eyea2), eyer * cos(eyea2), eyer * sin(eyea) * sin(eyea2)); //camera position
+
+  vec3 front = normalize(lookAt - ro);
+  vec3 left = normalize(cross(normalize(vec3(0.0f, 1, -0.1f)), front));
+  vec3 up = normalize(cross(front, left));
+  vec3 rd = normalize(front * 1.5f + left * pp.x + up * pp.y); // rect vector
+
+  vec3 bh = vec3(0.0f, 0.0f, 0.0f);
+  float bhr = 0.1f;
+  float bhmass = 5.0f;
+  bhmass *= 0.001f; // premul G
+
+  vec3 p = ro;
+  vec3 pv = rd;
+  float dt = 0.02f;
+
+  vec3 col = vec3(0.0f);
+
+  float noncaptured = 1.0f;
+
+  vec3 c1 = vec3(0.5f, 0.46f, 0.4f);
+  vec3 c2 = vec3(1.0f, 0.8f, 0.6f);
+
+  for(float t = 0.0f; t < 1.0f; t += 0.005f) {
+    p += pv * dt * noncaptured;
+
+        // gravity
+    vec3 bhv = bh - p;
+    float r = dot(bhv, bhv);
+    pv += normalize(bhv) * ((bhmass) / r);
+
+    noncaptured = smoothstep(0.0f, 0.666f, sdSphere(p - bh, bhr));
+
+        // Texture for the accretion disc
+    float dr = length(bhv.xz);
+    float da = atan(bhv.x, bhv.z);
+    vec2 ra = vec2(dr, da * (0.01f + (dr - bhr) * 0.002f) + 2.0f * pi + iTime * 0.005f);
+    ra *= vec2(10.0f, 20.0f);
+
+    vec3 dcol = mix(c2, c1, pow(length(bhv) - bhr, 2.0f)) * max(0.0f, texture(iChannel1, ra * vec2(0.1f, 0.5f)).r + 0.05f) * (4.0f / ((0.001f + (length(bhv) - bhr) * 50.0f)));
+
+    col += max(vec3(0.0f), dcol * smoothstep(0.0f, 1.0f, -sdTorus((p * vec3(1.0f, 25.0f, 1.0f)) - bh, vec2(0.8f, 0.99f))) * noncaptured);
+
+    col += vec3(1.0f, 0.9f, 0.85f) * (1.0f / vec3(dot(bhv, bhv))) * 0.0033f * noncaptured;
+
+  }
+  fragColor = vec4(col, 1.0f);
+}
+
+void main() {
+    // gl_FragCoord.xy is pixel coordinates (1..width, 1..height)
+  mainImage(FragColor, gl_FragCoord.xy);
+}
\ No newline at end of file
diff --git a/frontend/src/randomTextureForShader.ts b/frontend/src/randomTextureForShader.ts
deleted file mode 100644
index 57cc139..0000000
--- a/frontend/src/randomTextureForShader.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-export function generateRandomRGBABytes(
-  width: number,
-  height: number
-): Uint8Array {
-  if (width <= 0 || height <= 0) {
-    throw new Error("width and height must be positive");
-  }
-  const len = width * height * 4;
-  const out = new Uint8Array(len);
-
-  // Maximum bytes per getRandomValues call (per spec / browsers)
-  const MAX_GETRANDOM_BYTES = 65536;
-
-  if (typeof crypto !== "undefined" && "getRandomValues" in crypto) {
-    // Fill in chunks of up to MAX_GETRANDOM_BYTES
-    let offset = 0;
-    while (offset < len) {
-      const chunkSize = Math.min(MAX_GETRANDOM_BYTES, len - offset);
-      // Subarray view for the current chunk
-      const chunkView = out.subarray(offset, offset + chunkSize);
-      crypto.getRandomValues(chunkView);
-      offset += chunkSize;
-    }
-    // Ensure alpha channel is fully opaque (255)
-    for (let i = 3; i < len; i += 4) out[i] = 255;
-  } else {
-    // Fallback to Math.random for all bytes
-    for (let i = 0; i < len; i++) {
-      if ((i + 1) % 4 === 0) out[i] = 255;
-      else out[i] = Math.floor(Math.random() * 256);
-    }
-  }
-
-  return out;
-}