Siri Orb

"use client";

// A glass orb for an assistant: black above, glossy clear glass below, with a
// helix of coloured strands between that winds round and flares white where
// strands cross. The sphere acts as a lens, so the helix stretches to the rim
// and splits into colour there, spreading a little way along the edge. Idle,
// it drifts; listening, it winds wider with a speech-like rhythm. Every part
// of the look is a prop. Drawn in WebGL over a circular backdrop filter.
// Sleeps off screen; holds still for reduced motion.

import { useEffect, useRef } from "react";
import { cn } from "@/lib/utils";

const vertex = /* glsl */ `
attribute vec2 a_pos;
void main() { gl_Position = vec4(a_pos, 0.0, 1.0); }
`;

const fragment = /* glsl */ `
precision highp float;
uniform vec2 u_res;     // canvas size in px
uniform float u_time;   // seconds
uniform float u_energy; // 0 idle … 1 listening
uniform float u_px;     // one pixel in orb units, for anti-aliasing