three-text 0.5.2 → 0.6.0

package/dist/vector/webgl/index.js

@@ -1,227 +1,157 @@
-function assertCreate(value, label) {
-    if (!value) {
-        throw new Error(`Failed to create ${label}`);
-    }
-    return value;
-}
+var vertGLSL = "#version 300 es\n// GLSL 300 es port of the Slug vertex shader\n// Eric Lengyel, MIT License, 2017\n\nprecision highp float;\nprecision highp int;\n\n// Per-vertex attributes (5 x vec4, matching Slug reference layout)\nlayout(location = 0) in vec4 a_pos; // .xy = object-space position, .zw = outward normal\nlayout(location = 1) in vec4 a_tex; // .xy = em-space sample coords, .z = packed glyph loc, .w = packed band max + flags\nlayout(location = 2) in vec4 a_jac; // inverse Jacobian (2x2): (j00, j01, j10, j11)\nlayout(location = 3) in vec4 a_bnd; // (bandScaleX, bandScaleY, bandOffsetX, bandOffsetY)\nlayout(location = 4) in vec4 a_col; // vertex color RGBA\n\nuniform mat4 slug_matrix;    // MVP matrix (rows as vec4s)\nuniform vec2 slug_viewport;  // viewport dimensions in pixels\n\nout vec4 v_color;\nout vec2 v_texcoord;\nflat out vec4 v_banding;\nflat out ivec4 v_glyph;\n\nvoid SlugUnpack(vec4 tex, vec4 bnd, out vec4 vbnd, out ivec4 vgly) {\n    uvec2 g = floatBitsToUint(tex.zw);\n    vgly = ivec4(g.x & 0xFFFFu, g.x >> 16u, g.y & 0xFFFFu, g.y >> 16u);\n    vbnd = bnd;\n}\n\nvec2 SlugDilate(vec4 pos, vec4 tex, vec4 jac, vec4 m0, vec4 m1, vec4 m3, vec2 dim, out vec2 vpos) {\n    vec2 n = normalize(pos.zw);\n    float s = dot(m3.xy, pos.xy) + m3.w;\n    float t = dot(m3.xy, n);\n\n    float u = (s * dot(m0.xy, n) - t * (dot(m0.xy, pos.xy) + m0.w)) * dim.x;\n    float v = (s * dot(m1.xy, n) - t * (dot(m1.xy, pos.xy) + m1.w)) * dim.y;\n\n    float s2 = s * s;\n    float st = s * t;\n    float uv = u * u + v * v;\n    vec2 d = pos.zw * (s2 * (st + sqrt(uv)) / (uv - st * st));\n\n    vpos = pos.xy + d;\n    return vec2(tex.x + dot(d, jac.xy), tex.y + dot(d, jac.zw));\n}\n\nvoid main() {\n    vec2 p;\n\n    // Dynamic dilation: expand quad by a pixel to prevent edge clipping.\n    v_texcoord = SlugDilate(a_pos, a_tex, a_jac,\n                            slug_matrix[0], slug_matrix[1], slug_matrix[3],\n                            slug_viewport, p);\n\n    // MVP transform on dilated position.\n    gl_Position.x = p.x * slug_matrix[0].x + p.y * slug_matrix[0].y + slug_matrix[0].w;\n    gl_Position.y = p.x * slug_matrix[1].x + p.y * slug_matrix[1].y + slug_matrix[1].w;\n    gl_Position.z = p.x * slug_matrix[2].x + p.y * slug_matrix[2].y + slug_matrix[2].w;\n    gl_Position.w = p.x * slug_matrix[3].x + p.y * slug_matrix[3].y + slug_matrix[3].w;\n\n    SlugUnpack(a_tex, a_bnd, v_banding, v_glyph);\n    v_color = a_col;\n}\n";
+
+var fragGLSL = "#version 300 es\n// GLSL 300 es port of the Slug fragment shader\n// Eric Lengyel, MIT License, 2017\n\nprecision highp float;\nprecision highp int;\n\n#define kLogBandTextureWidth 12\n\nin vec4 v_color;\nin vec2 v_texcoord;\nflat in vec4 v_banding;\nflat in ivec4 v_glyph;\n\nuniform sampler2D curveTexture;     // RGBA32F control points\nuniform highp usampler2D bandTexture; // RGBA32UI band data\n\nlayout(location = 0) out vec4 outColor;\n\nuint CalcRootCode(float y1, float y2, float y3) {\n    uint i1 = floatBitsToUint(y1) >> 31u;\n    uint i2 = floatBitsToUint(y2) >> 30u;\n    uint i3 = floatBitsToUint(y3) >> 29u;\n\n    uint shift = (i2 & 2u) | (i1 & ~2u);\n    shift = (i3 & 4u) | (shift & ~4u);\n\n    return (0x2E74u >> shift) & 0x0101u;\n}\n\nvec2 SolveHorizPoly(vec4 p12, vec2 p3) {\n    vec2 a = p12.xy - p12.zw * 2.0 + p3;\n    vec2 b = p12.xy - p12.zw;\n    float ra = 1.0 / a.y;\n    float rb = 0.5 / b.y;\n\n    float d = sqrt(max(b.y * b.y - a.y * p12.y, 0.0));\n    float t1 = (b.y - d) * ra;\n    float t2 = (b.y + d) * ra;\n\n    if (abs(a.y) < 1.0 / 65536.0) t1 = t2 = p12.y * rb;\n\n    return vec2((a.x * t1 - b.x * 2.0) * t1 + p12.x, (a.x * t2 - b.x * 2.0) * t2 + p12.x);\n}\n\nvec2 SolveVertPoly(vec4 p12, vec2 p3) {\n    vec2 a = p12.xy - p12.zw * 2.0 + p3;\n    vec2 b = p12.xy - p12.zw;\n    float ra = 1.0 / a.x;\n    float rb = 0.5 / b.x;\n\n    float d = sqrt(max(b.x * b.x - a.x * p12.x, 0.0));\n    float t1 = (b.x - d) * ra;\n    float t2 = (b.x + d) * ra;\n\n    if (abs(a.x) < 1.0 / 65536.0) t1 = t2 = p12.x * rb;\n\n    return vec2((a.y * t1 - b.y * 2.0) * t1 + p12.y, (a.y * t2 - b.y * 2.0) * t2 + p12.y);\n}\n\nivec2 CalcBandLoc(ivec2 glyphLoc, uint offset) {\n    ivec2 bandLoc = ivec2(glyphLoc.x + int(offset), glyphLoc.y);\n    bandLoc.y += bandLoc.x >> kLogBandTextureWidth;\n    bandLoc.x &= (1 << kLogBandTextureWidth) - 1;\n    return bandLoc;\n}\n\nfloat CalcCoverage(float xcov, float ycov, float xwgt, float ywgt, int flags) {\n    float coverage = max(abs(xcov * xwgt + ycov * ywgt) / max(xwgt + ywgt, 1.0 / 65536.0), min(abs(xcov), abs(ycov)));\n\n#if defined(SLUG_EVENODD)\n    if ((flags & 0x1000) == 0) {\n#endif\n        coverage = clamp(coverage, 0.0, 1.0);\n#if defined(SLUG_EVENODD)\n    } else {\n        coverage = 1.0 - abs(1.0 - fract(coverage * 0.5) * 2.0);\n    }\n#endif\n\n#if defined(SLUG_WEIGHT)\n    coverage = sqrt(coverage);\n#endif\n\n    return coverage;\n}\n\nfloat SlugRenderSingle(vec2 renderCoord, vec2 emsPerPixel, vec4 bandTransform, ivec4 glyphData) {\n    int curveIndex;\n\n    vec2 pixelsPerEm = 1.0 / emsPerPixel;\n\n    ivec2 bandMax = glyphData.zw;\n    bandMax.y &= 0x00FF;\n\n    ivec2 bandIndex = clamp(ivec2(renderCoord * bandTransform.xy + bandTransform.zw), ivec2(0, 0), bandMax);\n    ivec2 glyphLoc = glyphData.xy;\n\n    float xcov = 0.0;\n    float xwgt = 0.0;\n\n    uvec2 hbandData = texelFetch(bandTexture, ivec2(glyphLoc.x + bandIndex.y, glyphLoc.y), 0).xy;\n    ivec2 hbandLoc = CalcBandLoc(glyphLoc, hbandData.y);\n\n    for (curveIndex = 0; curveIndex < int(hbandData.x); curveIndex++) {\n        ivec2 curveLoc = ivec2(texelFetch(bandTexture, ivec2(hbandLoc.x + curveIndex, hbandLoc.y), 0).xy);\n\n        vec4 p12 = texelFetch(curveTexture, curveLoc, 0) - vec4(renderCoord, renderCoord);\n        vec2 p3 = texelFetch(curveTexture, ivec2(curveLoc.x + 1, curveLoc.y), 0).xy - renderCoord;\n\n        if (max(max(p12.x, p12.z), p3.x) * pixelsPerEm.x < -0.5) break;\n\n        uint code = CalcRootCode(p12.y, p12.w, p3.y);\n        if (code != 0u) {\n            vec2 r = SolveHorizPoly(p12, p3) * pixelsPerEm.x;\n\n            if ((code & 1u) != 0u) {\n                xcov += clamp(r.x + 0.5, 0.0, 1.0);\n                xwgt = max(xwgt, clamp(1.0 - abs(r.x) * 2.0, 0.0, 1.0));\n            }\n\n            if (code > 1u) {\n                xcov -= clamp(r.y + 0.5, 0.0, 1.0);\n                xwgt = max(xwgt, clamp(1.0 - abs(r.y) * 2.0, 0.0, 1.0));\n            }\n        }\n    }\n\n    float ycov = 0.0;\n    float ywgt = 0.0;\n\n    uvec2 vbandData = texelFetch(bandTexture, ivec2(glyphLoc.x + bandMax.y + 1 + bandIndex.x, glyphLoc.y), 0).xy;\n    ivec2 vbandLoc = CalcBandLoc(glyphLoc, vbandData.y);\n\n    for (curveIndex = 0; curveIndex < int(vbandData.x); curveIndex++) {\n        ivec2 curveLoc = ivec2(texelFetch(bandTexture, ivec2(vbandLoc.x + curveIndex, vbandLoc.y), 0).xy);\n        vec4 p12 = texelFetch(curveTexture, curveLoc, 0) - vec4(renderCoord, renderCoord);\n        vec2 p3 = texelFetch(curveTexture, ivec2(curveLoc.x + 1, curveLoc.y), 0).xy - renderCoord;\n\n        if (max(max(p12.y, p12.w), p3.y) * pixelsPerEm.y < -0.5) break;\n\n        uint code = CalcRootCode(p12.x, p12.z, p3.x);\n        if (code != 0u) {\n            vec2 r = SolveVertPoly(p12, p3) * pixelsPerEm.y;\n\n            if ((code & 1u) != 0u) {\n                ycov -= clamp(r.x + 0.5, 0.0, 1.0);\n                ywgt = max(ywgt, clamp(1.0 - abs(r.x) * 2.0, 0.0, 1.0));\n            }\n\n            if (code > 1u) {\n                ycov += clamp(r.y + 0.5, 0.0, 1.0);\n                ywgt = max(ywgt, clamp(1.0 - abs(r.y) * 2.0, 0.0, 1.0));\n            }\n        }\n    }\n\n    return CalcCoverage(xcov, ycov, xwgt, ywgt, glyphData.w);\n}\n\nfloat SlugRender(vec2 renderCoord, vec4 bandTransform, ivec4 glyphData) {\n    vec2 emsPerPixel = fwidth(renderCoord);\n\n#if defined(SLUG_ADAPTIVE_SUPERSAMPLE)\n    // Per-pixel rotated RGSS-4.  The base RGSS offsets are rotated by a\n    // unique angle per fragment (interleaved gradient noise).  This converts\n    // structured aliasing shimmer into uncorrelated grain that the eye\n    // naturally filters out, much closer to how hardware MSAA on many small\n    // triangles behaves perceptually.\n    float noise = fract(52.9829189 * fract(dot(gl_FragCoord.xy, vec2(0.06711056, 0.00583715))));\n    float angle = noise * 6.2831853;\n    float ca = cos(angle), sa = sin(angle);\n\n    // Base RGSS offsets rotated by per-pixel angle\n    vec2 o0 = vec2(ca * -0.375 - sa *  0.125, sa * -0.375 + ca *  0.125) * emsPerPixel;\n    vec2 o1 = vec2(ca *  0.125 - sa *  0.375, sa *  0.125 + ca *  0.375) * emsPerPixel;\n    vec2 o2 = vec2(ca *  0.375 - sa * -0.125, sa *  0.375 + ca * -0.125) * emsPerPixel;\n    vec2 o3 = vec2(ca * -0.125 - sa * -0.375, sa * -0.125 + ca * -0.375) * emsPerPixel;\n\n    float coverage =\n        SlugRenderSingle(renderCoord + o0, emsPerPixel, bandTransform, glyphData) +\n        SlugRenderSingle(renderCoord + o1, emsPerPixel, bandTransform, glyphData) +\n        SlugRenderSingle(renderCoord + o2, emsPerPixel, bandTransform, glyphData) +\n        SlugRenderSingle(renderCoord + o3, emsPerPixel, bandTransform, glyphData);\n    return coverage * 0.25;\n#else\n    return SlugRenderSingle(renderCoord, emsPerPixel, bandTransform, glyphData);\n#endif\n}\n\nvoid main() {\n    float coverage = SlugRender(v_texcoord, v_banding, v_glyph);\n    outColor = v_color * coverage;\n}\n";
+
+// Slug shader source re-exports
+// The .glsl/.wgsl files are the single source of truth, imported as strings
+// at build time via the glslPlugin in rollup.config.js
+// @ts-ignore - resolved by rollup glslPlugin
+const vertexShaderGLSL300 = vertGLSL;
+const fragmentShaderGLSL300 = fragGLSL;
+
+// Raw WebGL2 Slug vector text renderer
+// Standalone, no dependency on Three.js
 function compileShader(gl, type, source) {
-    const shader = assertCreate(gl.createShader(type), 'shader');
+    const shader = gl.createShader(type);
+    if (!shader)
+        throw new Error('Failed to create shader');
     gl.shaderSource(shader, source);
     gl.compileShader(shader);
     if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
-        const info = gl.getShaderInfoLog(shader) || 'unknown shader compile error';
+        const info = gl.getShaderInfoLog(shader);
         gl.deleteShader(shader);
-        throw new Error(info);
+        throw new Error(`Shader compile failed: ${info}`);
     }
     return shader;
 }
-function linkProgram(gl, vertexSource, fragmentSource) {
-    const vertexShader = compileShader(gl, gl.VERTEX_SHADER, vertexSource);
-    const fragmentShader = compileShader(gl, gl.FRAGMENT_SHADER, fragmentSource);
-    const program = assertCreate(gl.createProgram(), 'program');
-    gl.attachShader(program, vertexShader);
-    gl.attachShader(program, fragmentShader);
-    gl.linkProgram(program);
-    gl.deleteShader(vertexShader);
-    gl.deleteShader(fragmentShader);
-    if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
-        const info = gl.getProgramInfoLog(program) || 'unknown program link error';
-        gl.deleteProgram(program);
-        throw new Error(info);
+function createProgram(gl, vsSrc, fsSrc) {
+    const vs = compileShader(gl, gl.VERTEX_SHADER, vsSrc);
+    const fs = compileShader(gl, gl.FRAGMENT_SHADER, fsSrc);
+    const prog = gl.createProgram();
+    if (!prog)
+        throw new Error('Failed to create program');
+    gl.attachShader(prog, vs);
+    gl.attachShader(prog, fs);
+    gl.linkProgram(prog);
+    if (!gl.getProgramParameter(prog, gl.LINK_STATUS)) {
+        const info = gl.getProgramInfoLog(prog);
+        gl.deleteProgram(prog);
+        throw new Error(`Program link failed: ${info}`);
     }
-    return program;
+    gl.deleteShader(vs);
+    gl.deleteShader(fs);
+    return prog;
 }
-function getUniform(gl, program, name) {
-    const location = gl.getUniformLocation(program, name);
-    if (!location) {
-        throw new Error(`Missing uniform "${name}"`);
-    }
-    return location;
+function createRGBA32FTexture(gl, data, width, height) {
+    const tex = gl.createTexture();
+    if (!tex)
+        throw new Error('Failed to create texture');
+    gl.bindTexture(gl.TEXTURE_2D, tex);
+    gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
+    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.RGBA32F, width, height, 0, gl.RGBA, gl.FLOAT, data);
+    gl.bindTexture(gl.TEXTURE_2D, null);
+    return tex;
 }
-function createProgramWithMvp(gl, vertexSource, fragmentSource) {
-    const program = linkProgram(gl, vertexSource, fragmentSource);
-    return {
-        program,
-        mvp: getUniform(gl, program, 'u_mvp')
-    };
+function createRGBA32UITexture(gl, data, width, height) {
+    const tex = gl.createTexture();
+    if (!tex)
+        throw new Error('Failed to create texture');
+    gl.bindTexture(gl.TEXTURE_2D, tex);
+    gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
+    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.RGBA32UI, width, height, 0, gl.RGBA_INTEGER, gl.UNSIGNED_INT, data);
+    gl.bindTexture(gl.TEXTURE_2D, null);
+    return tex;
 }
-function createColorProgram(gl, vertexSource, fragmentSource) {
-    const program = linkProgram(gl, vertexSource, fragmentSource);
-    return {
-        program,
-        mvp: getUniform(gl, program, 'u_mvp'),
-        color: getUniform(gl, program, 'u_color')
+function createResources(gl, gpuData, fragSrc) {
+    gl.getExtension('EXT_color_buffer_float');
+    const program = createProgram(gl, vertexShaderGLSL300, fragSrc);
+    const uniforms = {
+        slug_matrix: gl.getUniformLocation(program, 'slug_matrix'),
+        slug_viewport: gl.getUniformLocation(program, 'slug_viewport'),
+        curveTexture: gl.getUniformLocation(program, 'curveTexture'),
+        bandTexture: gl.getUniformLocation(program, 'bandTexture'),
     };
-}
-function createGeometryResources(gl, data) {
-    const interiorVAO = assertCreate(gl.createVertexArray(), 'interior VAO');
-    const interiorPositionBuffer = assertCreate(gl.createBuffer(), 'interior position buffer');
-    const interiorIndexBuffer = assertCreate(gl.createBuffer(), 'interior index buffer');
-    gl.bindVertexArray(interiorVAO);
-    gl.bindBuffer(gl.ARRAY_BUFFER, interiorPositionBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, data.interiorPositions, gl.STATIC_DRAW);
-    gl.enableVertexAttribArray(0);
-    gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, interiorIndexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, data.interiorIndices, gl.STATIC_DRAW);
-    const curveVAO = assertCreate(gl.createVertexArray(), 'curve VAO');
-    const curvePositionBuffer = assertCreate(gl.createBuffer(), 'curve position buffer');
-    gl.bindVertexArray(curveVAO);
-    gl.bindBuffer(gl.ARRAY_BUFFER, curvePositionBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, data.curvePositions, gl.STATIC_DRAW);
-    gl.enableVertexAttribArray(0);
-    gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
-    const fillVAO = assertCreate(gl.createVertexArray(), 'fill VAO');
-    const fillPositionBuffer = assertCreate(gl.createBuffer(), 'fill position buffer');
-    const fillIndexBuffer = assertCreate(gl.createBuffer(), 'fill index buffer');
-    gl.bindVertexArray(fillVAO);
-    gl.bindBuffer(gl.ARRAY_BUFFER, fillPositionBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, data.fillPositions, gl.STATIC_DRAW);
+    const vao = gl.createVertexArray();
+    if (!vao)
+        throw new Error('Failed to create VAO');
+    gl.bindVertexArray(vao);
+    const vbo = gl.createBuffer();
+    if (!vbo)
+        throw new Error('Failed to create VBO');
+    gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
+    gl.bufferData(gl.ARRAY_BUFFER, gpuData.vertices, gl.STATIC_DRAW);
+    const stride = 20 * 4;
     gl.enableVertexAttribArray(0);
-    gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, fillIndexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, data.fillIndices, gl.STATIC_DRAW);
+    gl.vertexAttribPointer(0, 4, gl.FLOAT, false, stride, 0);
+    gl.enableVertexAttribArray(1);
+    gl.vertexAttribPointer(1, 4, gl.FLOAT, false, stride, 4 * 4);
+    gl.enableVertexAttribArray(2);
+    gl.vertexAttribPointer(2, 4, gl.FLOAT, false, stride, 8 * 4);
+    gl.enableVertexAttribArray(3);
+    gl.vertexAttribPointer(3, 4, gl.FLOAT, false, stride, 12 * 4);
+    gl.enableVertexAttribArray(4);
+    gl.vertexAttribPointer(4, 4, gl.FLOAT, false, stride, 16 * 4);
+    const ibo = gl.createBuffer();
+    if (!ibo)
+        throw new Error('Failed to create IBO');
+    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, ibo);
+    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, gpuData.indices, gl.STATIC_DRAW);
     gl.bindVertexArray(null);
-    gl.bindBuffer(gl.ARRAY_BUFFER, null);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);
-    return {
-        interiorVAO,
-        interiorPositionBuffer,
-        interiorIndexBuffer,
-        interiorIndexCount: data.interiorIndices.length,
-        curveVAO,
-        curvePositionBuffer,
-        curveVertexCount: data.curvePositions.length / 3,
-        fillVAO,
-        fillPositionBuffer,
-        fillIndexBuffer,
-        fillIndexCount: data.fillIndices.length
-    };
+    const curveTexture = createRGBA32FTexture(gl, gpuData.curveTexture.data, gpuData.curveTexture.width, gpuData.curveTexture.height);
+    const bandTexture = createRGBA32UITexture(gl, gpuData.bandTexture.data, gpuData.bandTexture.width, gpuData.bandTexture.height);
+    return { program, vao, vbo, ibo, curveTexture, bandTexture, uniforms, indexCount: gpuData.indices.length };
 }
-function destroyGeometryResources(gl, resources) {
-    gl.deleteVertexArray(resources.interiorVAO);
-    gl.deleteBuffer(resources.interiorPositionBuffer);
-    gl.deleteBuffer(resources.interiorIndexBuffer);
-    gl.deleteVertexArray(resources.curveVAO);
-    gl.deleteBuffer(resources.curvePositionBuffer);
-    gl.deleteVertexArray(resources.fillVAO);
-    gl.deleteBuffer(resources.fillPositionBuffer);
-    gl.deleteBuffer(resources.fillIndexBuffer);
+function draw(gl, res, mvpMatrix, viewportWidth, viewportHeight) {
+    gl.useProgram(res.program);
+    gl.uniformMatrix4fv(res.uniforms.slug_matrix, false, mvpMatrix);
+    gl.uniform2f(res.uniforms.slug_viewport, viewportWidth, viewportHeight);
+    gl.activeTexture(gl.TEXTURE0);
+    gl.bindTexture(gl.TEXTURE_2D, res.curveTexture);
+    gl.uniform1i(res.uniforms.curveTexture, 0);
+    gl.activeTexture(gl.TEXTURE1);
+    gl.bindTexture(gl.TEXTURE_2D, res.bandTexture);
+    gl.uniform1i(res.uniforms.bandTexture, 1);
+    gl.bindVertexArray(res.vao);
+    gl.enable(gl.BLEND);
+    gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+    gl.drawElements(gl.TRIANGLES, res.indexCount, gl.UNSIGNED_SHORT, 0);
+    gl.bindVertexArray(null);
 }
-function createWebGLVectorRenderer(gl) {
-    const interiorVertexShader = `#version 300 es
-layout(location = 0) in vec3 a_position;
-uniform mat4 u_mvp;
-void main() {
-  gl_Position = u_mvp * vec4(a_position, 1.0);
-}`;
-    const interiorFragmentShader = `#version 300 es
-precision highp float;
-out vec4 outColor;
-void main() {
-  outColor = vec4(1.0);
-}`;
-    const curveVertexShader = `#version 300 es
-layout(location = 0) in vec3 a_position;
-uniform mat4 u_mvp;
-out vec2 v_uv;
-void main() {
-  int localVertex = gl_VertexID % 3;
-  float u = float(localVertex) * 0.5;
-  v_uv = vec2(u, floor(u));
-  gl_Position = u_mvp * vec4(a_position, 1.0);
-}`;
-    const curveFragmentShader = `#version 300 es
-precision highp float;
-in vec2 v_uv;
-out vec4 outColor;
-void main() {
-  vec2 px = dFdx(v_uv);
-  vec2 py = dFdy(v_uv);
-  float fx = 2.0 * v_uv.x * px.x - px.y;
-  float fy = 2.0 * v_uv.x * py.x - py.y;
-  float denom = sqrt(fx * fx + fy * fy);
-  if (denom < 1e-6) {
-    discard;
-  }
-  float sd = (v_uv.x * v_uv.x - v_uv.y) / denom;
-  float alpha = clamp(0.5 - sd, 0.0, 1.0);
-  if (alpha <= 0.0) {
-    discard;
-  }
-  outColor = vec4(1.0, 1.0, 1.0, alpha);
-}`;
-    const colorVertexShader = interiorVertexShader;
-    const colorFragmentShader = `#version 300 es
-precision highp float;
-uniform vec4 u_color;
-out vec4 outColor;
-void main() {
-  outColor = u_color;
-}`;
-    const interiorProgram = createProgramWithMvp(gl, interiorVertexShader, interiorFragmentShader);
-    const curveProgram = createProgramWithMvp(gl, curveVertexShader, curveFragmentShader);
-    const colorProgram = createColorProgram(gl, colorVertexShader, colorFragmentShader);
-    let geometryResources = null;
+function createWebGLVectorRenderer(gl, options) {
+    let resources = null;
+    const fragSrc = options?.adaptiveSupersampling
+        ? '#define SLUG_ADAPTIVE_SUPERSAMPLE\n' + fragmentShaderGLSL300
+        : fragmentShaderGLSL300;
     return {
         setGeometry(data) {
-            if (geometryResources) {
-                destroyGeometryResources(gl, geometryResources);
-            }
-            geometryResources = createGeometryResources(gl, data);
+            if (resources)
+                this.dispose();
+            resources = createResources(gl, data, fragSrc);
         },
-        render(mvp, color) {
-            if (!geometryResources) {
+        render(mvp, _color) {
+            if (!resources)
                 return;
-            }
-            gl.disable(gl.CULL_FACE);
-            gl.disable(gl.DEPTH_TEST);
-            gl.depthMask(false);
-            // No stencil clear needed - the fill pass resets stencil to 0
-            // via passOp ZERO wherever stencil was non-zero, and per-glyph
-            // fill quads cover all stencil writes from interior/curve passes
-            gl.enable(gl.STENCIL_TEST);
-            gl.stencilMask(0xff);
-            gl.stencilFunc(gl.ALWAYS, 0, 0xff);
-            // Nonzero winding: front faces increment, back faces decrement
-            gl.stencilOpSeparate(gl.FRONT, gl.KEEP, gl.KEEP, gl.INCR_WRAP);
-            gl.stencilOpSeparate(gl.BACK, gl.KEEP, gl.KEEP, gl.DECR_WRAP);
-            gl.colorMask(false, false, false, false);
-            if (geometryResources.interiorIndexCount > 0) {
-                gl.useProgram(interiorProgram.program);
-                gl.uniformMatrix4fv(interiorProgram.mvp, false, mvp);
-                gl.bindVertexArray(geometryResources.interiorVAO);
-                gl.drawElements(gl.TRIANGLES, geometryResources.interiorIndexCount, gl.UNSIGNED_INT, 0);
-            }
-            if (geometryResources.curveVertexCount > 0) {
-                gl.enable(gl.SAMPLE_ALPHA_TO_COVERAGE);
-                gl.useProgram(curveProgram.program);
-                gl.uniformMatrix4fv(curveProgram.mvp, false, mvp);
-                gl.bindVertexArray(geometryResources.curveVAO);
-                gl.drawArrays(gl.TRIANGLES, 0, geometryResources.curveVertexCount);
-                gl.disable(gl.SAMPLE_ALPHA_TO_COVERAGE);
-            }
-            gl.stencilFunc(gl.NOTEQUAL, 0, 0xff);
-            gl.stencilOp(gl.KEEP, gl.KEEP, gl.ZERO);
-            gl.colorMask(true, true, true, true);
-            gl.useProgram(colorProgram.program);
-            gl.uniformMatrix4fv(colorProgram.mvp, false, mvp);
-            gl.uniform4fv(colorProgram.color, color);
-            gl.bindVertexArray(geometryResources.fillVAO);
-            gl.drawElements(gl.TRIANGLES, geometryResources.fillIndexCount, gl.UNSIGNED_INT, 0);
-            gl.bindVertexArray(null);
-            gl.useProgram(null);
-            gl.disable(gl.STENCIL_TEST);
-            gl.depthMask(true);
+            draw(gl, resources, mvp, gl.drawingBufferWidth, gl.drawingBufferHeight);
         },
         dispose() {
-            if (geometryResources) {
-                destroyGeometryResources(gl, geometryResources);
-                geometryResources = null;
-            }
-            gl.deleteProgram(interiorProgram.program);
-            gl.deleteProgram(curveProgram.program);
-            gl.deleteProgram(colorProgram.program);
+            if (!resources)
+                return;
+            const gl2 = gl;
+            gl2.deleteTexture(resources.curveTexture);
+            gl2.deleteTexture(resources.bandTexture);
+            gl2.deleteBuffer(resources.vbo);
+            gl2.deleteBuffer(resources.ibo);
+            gl2.deleteVertexArray(resources.vao);
+            gl2.deleteProgram(resources.program);
+            resources = null;
         }
     };
 }