@vibesdotdev/runnable 0.0.0-stage → 1.0.0-rc.0

package/dist/svelte/viz/mfd/renderer/context.js

@@ -0,0 +1,272 @@
+// ═══════════════════════════════════════════════════════════════
+// NERV MFD — Global WebGL2 Rendering Context
+//
+// Single canvas, single GL context. All MFD panels render as scissored
+// viewports into this one surface. CRT post-processing is applied globally.
+// ═══════════════════════════════════════════════════════════════
+import { MAX_DATA_SIZE, CRT_DEFAULTS } from '../types';
+import { linkProgram, QUAD_VERT, CRT_FRAG, MODULE_SHADERS, getUniforms } from './shaders';
+const COMMON_UNIFORMS = [
+    'u_time',
+    'u_resolution',
+    'u_color',
+    'u_accent',
+    'u_dim',
+    'u_grid',
+    'u_glow',
+    'u_warning',
+    'u_intensity',
+    'u_params',
+    'u_dataCount',
+    'u_data'
+];
+const CRT_UNIFORMS = [
+    'u_scene',
+    'u_resolution',
+    'u_time',
+    'u_scanlineIntensity',
+    'u_scanlineCount',
+    'u_barrelDistortion',
+    'u_chromaticAberration',
+    'u_bloom',
+    'u_noise',
+    'u_vignette',
+    'u_flicker'
+];
+export class GLContext {
+    canvas;
+    gl;
+    dpr;
+    programs = new Map();
+    crtProgram = null;
+    quadVAO;
+    sceneFBO;
+    sceneTexture;
+    /**
+     * True once the canvas has been sized to non-zero dimensions AND
+     * the scene FBO has been allocated at that size. Render frame hooks
+     * short-circuit when this is false so they don't spam the console
+     * with GL_INVALID_FRAMEBUFFER_OPERATION when the canvas is in a
+     * zero-sized container (collapsed panel, hidden tab, pre-layout).
+     */
+    hasValidSize = false;
+    crt = { ...CRT_DEFAULTS };
+    constructor(canvas, gl) {
+        this.canvas = canvas;
+        this.gl = gl;
+        this.dpr = Math.min(window.devicePixelRatio, 2);
+        const verts = new Float32Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]);
+        this.quadVAO = gl.createVertexArray();
+        const vbo = gl.createBuffer();
+        gl.bindVertexArray(this.quadVAO);
+        gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
+        gl.bufferData(gl.ARRAY_BUFFER, verts, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(0);
+        gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 0, 0);
+        gl.bindVertexArray(null);
+        this.sceneTexture = gl.createTexture();
+        this.sceneFBO = gl.createFramebuffer();
+        this._initFBO();
+        gl.enable(gl.BLEND);
+        gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+        gl.enable(gl.SCISSOR_TEST);
+        gl.getExtension('EXT_color_buffer_float');
+        gl.getExtension('OES_texture_float_linear');
+    }
+    static create(container) {
+        const canvas = document.createElement('canvas');
+        canvas.style.cssText = `
+      position: absolute; inset: 0; width: 100%; height: 100%;
+      pointer-events: none; z-index: 5;
+    `;
+        container.appendChild(canvas);
+        const gl = canvas.getContext('webgl2', {
+            alpha: true,
+            antialias: false,
+            premultipliedAlpha: false,
+            preserveDrawingBuffer: false,
+            powerPreference: 'high-performance'
+        });
+        if (!gl)
+            throw new Error('WebGL2 not available');
+        const ctx = new GLContext(canvas, gl);
+        ctx.resize();
+        ctx._compileCRT();
+        return ctx;
+    }
+    resize() {
+        // Use the canvas container dimensions, not window dimensions.
+        // The canvas is position:absolute inside its container.
+        const parent = this.canvas.parentElement;
+        const w = parent ? parent.offsetWidth : window.innerWidth;
+        const h = parent ? parent.offsetHeight : window.innerHeight;
+        this.dpr = Math.min(window.devicePixelRatio, 2);
+        const pw = Math.round(w * this.dpr);
+        const ph = Math.round(h * this.dpr);
+        // If the container hasn't been laid out yet (hidden tab, collapsed
+        // panel, pre-mount) the computed size is 0. Leave `hasValidSize`
+        // false so frame hooks skip gl.clear() until the next resize()
+        // call finds a real size. A future ResizeObserver tick from the
+        // pipeline will re-invoke us once layout settles.
+        if (pw <= 0 || ph <= 0) {
+            this.hasValidSize = false;
+            return;
+        }
+        if (this.canvas.width !== pw || this.canvas.height !== ph) {
+            this.canvas.width = pw;
+            this.canvas.height = ph;
+            this._initFBO();
+        }
+        this.hasValidSize = true;
+    }
+    /** True when the canvas + FBO are sized for rendering. */
+    get ready() {
+        return this.hasValidSize;
+    }
+    _initFBO() {
+        const gl = this.gl;
+        const w = this.canvas.width;
+        const h = this.canvas.height;
+        gl.bindTexture(gl.TEXTURE_2D, this.sceneTexture);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA16F, w, h, 0, gl.RGBA, gl.HALF_FLOAT, 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);
+        gl.bindFramebuffer(gl.FRAMEBUFFER, this.sceneFBO);
+        gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.sceneTexture, 0);
+        gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    }
+    _compileCRT() {
+        const prog = linkProgram(this.gl, QUAD_VERT, CRT_FRAG);
+        this.crtProgram = { program: prog, uniforms: getUniforms(this.gl, prog, CRT_UNIFORMS) };
+    }
+    getModuleProgram(moduleType) {
+        let cp = this.programs.get(moduleType);
+        if (cp)
+            return cp;
+        const fragSrc = MODULE_SHADERS[moduleType];
+        if (!fragSrc)
+            throw new Error(`Unknown module type: ${moduleType}`);
+        const prog = linkProgram(this.gl, QUAD_VERT, fragSrc);
+        const uniforms = getUniforms(this.gl, prog, COMMON_UNIFORMS);
+        cp = { program: prog, uniforms };
+        this.programs.set(moduleType, cp);
+        return cp;
+    }
+    createDataTexture(width = MAX_DATA_SIZE) {
+        const gl = this.gl;
+        const tex = gl.createTexture();
+        gl.bindTexture(gl.TEXTURE_2D, tex);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, width, 1, 0, gl.RED, gl.FLOAT, 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);
+        return tex;
+    }
+    createDataTexture2D(width, height) {
+        const gl = this.gl;
+        const tex = gl.createTexture();
+        gl.bindTexture(gl.TEXTURE_2D, tex);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, width, height, 0, gl.RED, gl.FLOAT, 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);
+        return tex;
+    }
+    updateDataTexture(tex, data) {
+        const gl = this.gl;
+        gl.bindTexture(gl.TEXTURE_2D, tex);
+        gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, data.length, 1, gl.RED, gl.FLOAT, data);
+    }
+    updateDataTexture2D(tex, data, width, height) {
+        const gl = this.gl;
+        gl.bindTexture(gl.TEXTURE_2D, tex);
+        gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, width, height, gl.RED, gl.FLOAT, data);
+    }
+    beginFrame() {
+        // Skip entirely when the canvas has no valid size — the scene
+        // FBO's color attachment is 0×0 and gl.clear() would throw
+        // GL_INVALID_FRAMEBUFFER_OPERATION on every frame.
+        if (!this.hasValidSize)
+            return;
+        const gl = this.gl;
+        gl.bindFramebuffer(gl.FRAMEBUFFER, this.sceneFBO);
+        gl.viewport(0, 0, this.canvas.width, this.canvas.height);
+        gl.scissor(0, 0, this.canvas.width, this.canvas.height);
+        gl.clearColor(0, 0, 0, 0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+    }
+    renderPanel(moduleType, viewport, time, color, accent, dim, grid, glow, warning, intensity, params, dataTexture, dataCount) {
+        const gl = this.gl;
+        const { program, uniforms } = this.getModuleProgram(moduleType);
+        const x = Math.round(viewport.x);
+        const y = Math.round(viewport.y);
+        const w = Math.round(viewport.width);
+        const h = Math.round(viewport.height);
+        gl.viewport(x, y, w, h);
+        gl.scissor(x, y, w, h);
+        gl.useProgram(program);
+        const u = (name) => uniforms.get(name) ?? null;
+        gl.uniform1f(u('u_time'), time);
+        gl.uniform2f(u('u_resolution'), w, h);
+        gl.uniform3f(u('u_color'), color[0], color[1], color[2]);
+        gl.uniform3f(u('u_accent'), accent[0], accent[1], accent[2]);
+        gl.uniform3f(u('u_dim'), dim[0], dim[1], dim[2]);
+        gl.uniform3f(u('u_grid'), grid[0], grid[1], grid[2]);
+        gl.uniform3f(u('u_glow'), glow[0], glow[1], glow[2]);
+        gl.uniform3f(u('u_warning'), warning[0], warning[1], warning[2]);
+        gl.uniform1f(u('u_intensity'), intensity);
+        gl.uniform4fv(u('u_params'), params);
+        gl.uniform1f(u('u_dataCount'), dataCount);
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, dataTexture);
+        gl.uniform1i(u('u_data'), 0);
+        gl.bindVertexArray(this.quadVAO);
+        gl.drawArrays(gl.TRIANGLES, 0, 6);
+        gl.bindVertexArray(null);
+    }
+    endFrame(time) {
+        // Paired guard with beginFrame(): when the canvas is 0-sized the
+        // default framebuffer clear would throw too.
+        if (!this.hasValidSize)
+            return;
+        const gl = this.gl;
+        const crt = this.crt;
+        const cp = this.crtProgram;
+        gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+        gl.viewport(0, 0, this.canvas.width, this.canvas.height);
+        gl.scissor(0, 0, this.canvas.width, this.canvas.height);
+        gl.clearColor(0, 0, 0, 0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        gl.useProgram(cp.program);
+        const u = (name) => cp.uniforms.get(name) ?? null;
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, this.sceneTexture);
+        gl.uniform1i(u('u_scene'), 0);
+        gl.uniform2f(u('u_resolution'), this.canvas.width, this.canvas.height);
+        gl.uniform1f(u('u_time'), time);
+        gl.uniform1f(u('u_scanlineIntensity'), crt.scanlineIntensity);
+        gl.uniform1f(u('u_scanlineCount'), crt.scanlineCount);
+        gl.uniform1f(u('u_barrelDistortion'), crt.barrelDistortion);
+        gl.uniform1f(u('u_chromaticAberration'), crt.chromaticAberration);
+        gl.uniform1f(u('u_bloom'), crt.bloom);
+        gl.uniform1f(u('u_noise'), crt.noise);
+        gl.uniform1f(u('u_vignette'), crt.vignette);
+        gl.uniform1f(u('u_flicker'), crt.flickerAmount);
+        gl.bindVertexArray(this.quadVAO);
+        gl.drawArrays(gl.TRIANGLES, 0, 6);
+        gl.bindVertexArray(null);
+    }
+    destroy() {
+        const gl = this.gl;
+        this.programs.forEach((cp) => gl.deleteProgram(cp.program));
+        if (this.crtProgram)
+            gl.deleteProgram(this.crtProgram.program);
+        gl.deleteFramebuffer(this.sceneFBO);
+        gl.deleteTexture(this.sceneTexture);
+        this.canvas.remove();
+    }
+}

package/dist/svelte/viz/mfd/renderer/pipeline.d.ts

@@ -0,0 +1,32 @@
+import type { PanelState, MFDModuleType, MFDSize, PaletteName } from '../types';
+import { GLContext } from './context';
+export declare class RenderPipeline {
+    private ctx;
+    private panels;
+    private dataCounts;
+    private rafId;
+    private startTime;
+    private running;
+    private observers;
+    private elements;
+    private _onResize;
+    private _onScroll;
+    constructor(ctx: GLContext);
+    register(id: string, moduleType: MFDModuleType, size: MFDSize, palette?: PaletteName): PanelState;
+    unregister(id: string): void;
+    bindElement(id: string, el: HTMLElement): void;
+    setData(id: string, data: Float32Array | number[]): void;
+    setParams(id: string, params: [number, number, number, number]): void;
+    setPalette(id: string, palette: PaletteName): void;
+    setIntensity(id: string, intensity: number): void;
+    setEnabled(id: string, enabled: boolean): void;
+    start(): void;
+    stop(): void;
+    getPanel(id: string): PanelState | undefined;
+    getPanelIds(): string[];
+    private _frame;
+    private _updateViewport;
+    updateAllViewports(): void;
+    destroy(): void;
+}
+//# sourceMappingURL=pipeline.d.ts.map

package/dist/svelte/viz/mfd/renderer/pipeline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pipeline.d.ts","sourceRoot":"","sources":["../../../../../src/svelte/viz/mfd/renderer/pipeline.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAIhF,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEtC,qBAAa,cAAc;IAC1B,OAAO,CAAC,GAAG,CAAY;IACvB,OAAO,CAAC,MAAM,CAAiC;IAC/C,OAAO,CAAC,UAAU,CAA6B;IAC/C,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,SAAS,CAAK;IACtB,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,SAAS,CAAqC;IACtD,OAAO,CAAC,QAAQ,CAAkC;IAElD,OAAO,CAAC,SAAS,CAAa;IAC9B,OAAO,CAAC,SAAS,CAAa;gBAElB,GAAG,EAAE,SAAS;IAa1B,QAAQ,CACP,EAAE,EAAE,MAAM,EACV,UAAU,EAAE,aAAa,EACzB,IAAI,EAAE,OAAO,EACb,OAAO,GAAE,WAAwB,GAC/B,UAAU;IAqCb,UAAU,CAAC,EAAE,EAAE,MAAM;IAerB,WAAW,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,WAAW;IAQvC,OAAO,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,GAAG,MAAM,EAAE;IAmBjD,SAAS,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;IAM9D,UAAU,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW;IAK3C,YAAY,CAAC,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM;IAK1C,UAAU,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO;IAKvC,KAAK;IAOL,IAAI;IAQJ,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG,UAAU,GAAG,SAAS;IAI5C,WAAW,IAAI,MAAM,EAAE;IAIvB,OAAO,CAAC,MAAM,CA2BZ;IAEF,OAAO,CAAC,eAAe;IASvB,kBAAkB;IAIlB,OAAO;CAcP"}

package/dist/svelte/viz/mfd/renderer/pipeline.js

@@ -0,0 +1,188 @@
+// ═══════════════════════════════════════════════════════════════
+// NERV MFD — Render Pipeline
+//
+// Orchestrates the frame loop: iterates all registered panels, renders each
+// via the global GLContext, applies CRT post-process, manages data textures.
+// ═══════════════════════════════════════════════════════════════
+import { MAX_DATA_SIZE, HISTORY_DEPTH } from '../types';
+import { getPalette } from '../palette';
+import { panelViewport } from '../grid';
+export class RenderPipeline {
+    ctx;
+    panels = new Map();
+    dataCounts = new Map();
+    rafId = 0;
+    startTime = 0;
+    running = false;
+    observers = new Map();
+    elements = new Map();
+    _onResize;
+    _onScroll;
+    constructor(ctx) {
+        this.ctx = ctx;
+        this.startTime = performance.now() / 1000;
+        this._onResize = () => {
+            this.ctx.resize();
+            this.updateAllViewports();
+        };
+        window.addEventListener('resize', this._onResize);
+        this._onScroll = () => this.updateAllViewports();
+        window.addEventListener('scroll', this._onScroll, true);
+    }
+    register(id, moduleType, size, palette = 'phosphor') {
+        const existing = this.panels.get(id);
+        if (existing) {
+            if (existing._dataTexture)
+                this.ctx.gl.deleteTexture(existing._dataTexture);
+        }
+        this.ctx.getModuleProgram(moduleType);
+        const needsHistory = moduleType === 'waterfall' || moduleType === 'hex-matrix';
+        const histW = needsHistory ? MAX_DATA_SIZE : 0;
+        const histH = needsHistory ? HISTORY_DEPTH : 0;
+        const panel = {
+            id,
+            moduleType,
+            size,
+            viewport: { x: 0, y: 0, width: 1, height: 1 },
+            palette,
+            intensity: 1.0,
+            speed: 1.0,
+            data: new Float32Array(MAX_DATA_SIZE),
+            params: new Float32Array(4),
+            enabled: true,
+            _dataTexture: needsHistory
+                ? this.ctx.createDataTexture2D(histW, histH)
+                : this.ctx.createDataTexture(),
+            _history: needsHistory ? new Float32Array(histW * histH) : null,
+            _historyWidth: histW,
+            _historyHeight: histH,
+            _historyRow: 0
+        };
+        this.panels.set(id, panel);
+        this.dataCounts.set(id, 0);
+        return panel;
+    }
+    unregister(id) {
+        const panel = this.panels.get(id);
+        if (panel?._dataTexture) {
+            this.ctx.gl.deleteTexture(panel._dataTexture);
+        }
+        this.panels.delete(id);
+        this.dataCounts.delete(id);
+        const obs = this.observers.get(id);
+        if (obs) {
+            obs.disconnect();
+            this.observers.delete(id);
+        }
+        this.elements.delete(id);
+    }
+    bindElement(id, el) {
+        this.elements.set(id, el);
+        const obs = new ResizeObserver(() => this._updateViewport(id));
+        obs.observe(el);
+        this.observers.set(id, obs);
+        this._updateViewport(id);
+    }
+    setData(id, data) {
+        const panel = this.panels.get(id);
+        if (!panel)
+            return;
+        const src = data instanceof Float32Array ? data : new Float32Array(data);
+        this.dataCounts.set(id, Math.min(src.length, MAX_DATA_SIZE));
+        if (panel._history) {
+            const w = panel._historyWidth;
+            const row = panel._historyRow;
+            panel._history.set(src.subarray(0, Math.min(src.length, w)), row * w);
+            panel._historyRow = (row + 1) % panel._historyHeight;
+            this.ctx.updateDataTexture2D(panel._dataTexture, panel._history, w, panel._historyHeight);
+        }
+        else {
+            panel.data.fill(0);
+            panel.data.set(src.subarray(0, Math.min(src.length, MAX_DATA_SIZE)));
+            this.ctx.updateDataTexture(panel._dataTexture, panel.data);
+        }
+    }
+    setParams(id, params) {
+        const panel = this.panels.get(id);
+        if (!panel)
+            return;
+        panel.params.set(params);
+    }
+    setPalette(id, palette) {
+        const panel = this.panels.get(id);
+        if (panel)
+            panel.palette = palette;
+    }
+    setIntensity(id, intensity) {
+        const panel = this.panels.get(id);
+        if (panel)
+            panel.intensity = intensity;
+    }
+    setEnabled(id, enabled) {
+        const panel = this.panels.get(id);
+        if (panel)
+            panel.enabled = enabled;
+    }
+    start() {
+        if (this.running)
+            return;
+        this.running = true;
+        this.startTime = performance.now() / 1000;
+        this._frame();
+    }
+    stop() {
+        this.running = false;
+        if (this.rafId) {
+            cancelAnimationFrame(this.rafId);
+            this.rafId = 0;
+        }
+    }
+    getPanel(id) {
+        return this.panels.get(id);
+    }
+    getPanelIds() {
+        return Array.from(this.panels.keys());
+    }
+    _frame = () => {
+        if (!this.running)
+            return;
+        const time = performance.now() / 1000 - this.startTime;
+        this.ctx.beginFrame();
+        for (const panel of this.panels.values()) {
+            if (!panel.enabled || panel.viewport.width < 1 || panel.viewport.height < 1)
+                continue;
+            const pal = getPalette(panel.palette);
+            this.ctx.renderPanel(panel.moduleType, panel.viewport, time * panel.speed, pal.primary, pal.accent, pal.dim, pal.grid, pal.glow, pal.warning, panel.intensity, panel.params, panel._dataTexture, this.dataCounts.get(panel.id) ?? 0);
+        }
+        this.ctx.endFrame(time);
+        this.rafId = requestAnimationFrame(this._frame);
+    };
+    _updateViewport(id) {
+        const el = this.elements.get(id);
+        const panel = this.panels.get(id);
+        if (!el || !panel)
+            return;
+        const rect = el.getBoundingClientRect();
+        const canvas = this.ctx.canvas.getBoundingClientRect();
+        panel.viewport = panelViewport(rect, canvas.height, this.ctx.dpr, canvas);
+    }
+    updateAllViewports() {
+        for (const id of this.elements.keys())
+            this._updateViewport(id);
+    }
+    destroy() {
+        this.stop();
+        window.removeEventListener('resize', this._onResize);
+        window.removeEventListener('scroll', this._onScroll, true);
+        this.observers.forEach((obs) => obs.disconnect());
+        this.observers.clear();
+        this.elements.clear();
+        for (const panel of this.panels.values()) {
+            if (panel._dataTexture)
+                this.ctx.gl.deleteTexture(panel._dataTexture);
+        }
+        this.panels.clear();
+        this.dataCounts.clear();
+        this.ctx.destroy();
+    }
+}

package/dist/svelte/viz/mfd/renderer/shaders.d.ts

@@ -0,0 +1,35 @@
+export declare function compileShader(gl: WebGL2RenderingContext, type: number, source: string): WebGLShader;
+export declare function linkProgram(gl: WebGL2RenderingContext, vertSrc: string, fragSrc: string): WebGLProgram;
+export declare function getUniforms(gl: WebGL2RenderingContext, program: WebGLProgram, names: string[]): Map<string, WebGLUniformLocation | null>;
+export declare const QUAD_VERT = "#version 300 es\nprecision highp float;\nin vec2 a_position;\nout vec2 v_uv;\nvoid main() {\n  v_uv = a_position * 0.5 + 0.5;\n  gl_Position = vec4(a_position, 0.0, 1.0);\n}\n";
+export declare const FRAG_COMMON = "#version 300 es\nprecision highp float;\n\nin vec2 v_uv;\nout vec4 fragColor;\n\nuniform float     u_time;\nuniform vec2      u_resolution;\nuniform vec3      u_color;\nuniform vec3      u_accent;\nuniform vec3      u_dim;\nuniform vec3      u_grid;\nuniform vec3      u_glow;\nuniform vec3      u_warning;\nuniform float     u_intensity;\nuniform vec4      u_params;\nuniform float     u_dataCount;\nuniform sampler2D u_data;\n\n#define PI  3.14159265359\n#define TAU 6.28318530718\n\nfloat pulse(float x, float center, float width) {\n  float hw = width * 0.5;\n  return smoothstep(center - hw, center, x) - smoothstep(center, center + hw, x);\n}\n\nfloat sdCircle(vec2 p, float r) {\n  return length(p) - r;\n}\n\nfloat sdBox(vec2 p, vec2 b) {\n  vec2 d = abs(p) - b;\n  return length(max(d, 0.0)) + min(max(d.x, d.y), 0.0);\n}\n\nfloat sdRoundBox(vec2 p, vec2 b, float r) {\n  vec2 d = abs(p) - b + r;\n  return length(max(d, 0.0)) + min(max(d.x, d.y), 0.0) - r;\n}\n\nfloat sdSegment(vec2 p, vec2 a, vec2 b) {\n  vec2 pa = p - a, ba = b - a;\n  float h = clamp(dot(pa, ba) / dot(ba, ba), 0.0, 1.0);\n  return length(pa - ba * h);\n}\n\nfloat sdArc(vec2 p, float angle, float aperture, float ra, float rb) {\n  float ca = cos(angle), sa = sin(angle);\n  p = mat2(ca, sa, -sa, ca) * p;\n  p.x = abs(p.x);\n  float an = aperture;\n  vec2 scb = vec2(sin(an), cos(an));\n  float k = (scb.y * p.x > scb.x * p.y) ? dot(p, scb) : length(p);\n  return sqrt(max(dot(p, p) + ra * ra - 2.0 * ra * k, 0.0)) - rb;\n}\n\nfloat hash(vec2 p) {\n  return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453);\n}\n\nfloat noise(vec2 p) {\n  vec2 i = floor(p);\n  vec2 f = fract(p);\n  f = f * f * (3.0 - 2.0 * f);\n  return mix(\n    mix(hash(i), hash(i + vec2(1, 0)), f.x),\n    mix(hash(i + vec2(0, 1)), hash(i + vec2(1, 1)), f.x),\n    f.y\n  );\n}\n\nfloat sampleData(float x) {\n  return texture(u_data, vec2(x, 0.5)).r;\n}\n\nfloat sampleScope(float x) {\n  float index = clamp(x, 0.0, 1.0) * max(u_dataCount - 1.0, 0.0);\n  return texture(u_data, vec2((index + 0.5) / float(textureSize(u_data, 0).x), 0.5)).r;\n}\n\nfloat sampleData2D(vec2 uv) {\n  return texture(u_data, uv).r;\n}\n\nfloat gridLines(vec2 uv, float spacing, float thickness) {\n  vec2 g = abs(fract(uv * spacing) - 0.5);\n  float d = min(g.x, g.y);\n  return 1.0 - smoothstep(0.0, thickness, d);\n}\n\nvec3 glow(float d, vec3 color, float intensity, float radius) {\n  return color * intensity * exp(-abs(d) / radius);\n}\n";
+export declare const CRT_FRAG = "#version 300 es\nprecision highp float;\n\nin vec2 v_uv;\nout vec4 fragColor;\n\nuniform sampler2D u_scene;\nuniform vec2      u_resolution;\nuniform float     u_time;\nuniform float     u_scanlineIntensity;\nuniform float     u_scanlineCount;\nuniform float     u_barrelDistortion;\nuniform float     u_chromaticAberration;\nuniform float     u_bloom;\nuniform float     u_noise;\nuniform float     u_vignette;\nuniform float     u_flicker;\n\nfloat hash(vec2 p) {\n  return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453);\n}\n\nvec2 distort(vec2 uv, float k) {\n  vec2 c = uv - 0.5;\n  float r2 = dot(c, c);\n  return uv + c * r2 * k;\n}\n\nvoid main() {\n  vec2 uv = v_uv;\n\n  vec2 duv = distort(uv, u_barrelDistortion);\n\n  float sceneAlpha = texture(u_scene, duv).a;\n\n  if (sceneAlpha < 0.005) {\n    fragColor = vec4(0.0);\n    return;\n  }\n\n  float ca = u_chromaticAberration;\n  float r = texture(u_scene, distort(uv, u_barrelDistortion + ca)).r;\n  float g = texture(u_scene, duv).g;\n  float b = texture(u_scene, distort(uv, u_barrelDistortion - ca)).b;\n  vec3 color = vec3(r, g, b);\n\n  vec3 bloom = vec3(0.0);\n  float bloomAlpha = 0.0;\n  float bw = 3.0 / u_resolution.x;\n  float bh = 3.0 / u_resolution.y;\n  for (int x = -2; x <= 2; x++) {\n    for (int y = -2; y <= 2; y++) {\n      vec4 s = texture(u_scene, duv + vec2(float(x) * bw, float(y) * bh));\n      bloom += s.rgb;\n      bloomAlpha += s.a;\n    }\n  }\n  bloom /= 25.0;\n  bloomAlpha /= 25.0;\n  color += bloom * u_bloom;\n  sceneAlpha = max(sceneAlpha, bloomAlpha * u_bloom);\n\n  float scanline = sin(duv.y * u_scanlineCount * 3.14159) * 0.5 + 0.5;\n  color *= 1.0 - u_scanlineIntensity * (1.0 - scanline);\n\n  float px = fract(gl_FragCoord.x / 3.0);\n  vec3 mask = vec3(\n    smoothstep(0.0, 0.33, px) - smoothstep(0.33, 0.66, px),\n    smoothstep(0.33, 0.66, px) - smoothstep(0.66, 1.0, px),\n    smoothstep(0.66, 1.0, px)\n  );\n  color *= mix(vec3(1.0), mask * 1.5 + 0.5, 0.12);\n\n  float n = hash(uv * u_resolution + u_time * 1000.0) * u_noise;\n  color += n * sceneAlpha;\n\n  vec2 vc = uv - 0.5;\n  float vig = 1.0 - dot(vc, vc) * u_vignette * 2.5;\n  color *= vig;\n\n  float flicker = 1.0 - u_flicker * sin(u_time * 8.3) * sin(u_time * 11.7);\n  color *= flicker;\n\n  if (duv.x < 0.0 || duv.x > 1.0 || duv.y < 0.0 || duv.y > 1.0) {\n    fragColor = vec4(0.0);\n    return;\n  }\n\n  fragColor = vec4(color, sceneAlpha);\n}\n";
+export declare const SCOPE_FRAG: string;
+export declare const MULTI_LINE_SCOPE_FRAG: string;
+export declare const ARC_GAUGE_FRAG: string;
+export declare const BAR_METER_FRAG: string;
+export declare const RADAR_FRAG: string;
+export declare const HEX_MATRIX_FRAG: string;
+export declare const WATERFALL_FRAG: string;
+export declare const TOPO_FRAG: string;
+export declare const VECTOR_SCOPE_FRAG: string;
+export declare const PROGRESS_RING_FRAG: string;
+export declare const DIGITAL_READOUT_FRAG: string;
+export declare const STATUS_GRID_FRAG: string;
+export declare const TOGGLE_FRAG: string;
+export declare const MODULE_SHADERS: {
+    scope: string;
+    'multi-line-scope': string;
+    'arc-gauge': string;
+    'bar-meter': string;
+    radar: string;
+    'hex-matrix': string;
+    waterfall: string;
+    topo: string;
+    'vector-scope': string;
+    'progress-ring': string;
+    'digital-readout': string;
+    'status-grid': string;
+    toggle: string;
+};
+//# sourceMappingURL=shaders.d.ts.map

package/dist/svelte/viz/mfd/renderer/shaders.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shaders.d.ts","sourceRoot":"","sources":["../../../../../src/svelte/viz/mfd/renderer/shaders.ts"],"names":[],"mappings":"AAIA,wBAAgB,aAAa,CAC5B,EAAE,EAAE,sBAAsB,EAC1B,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM,GACZ,WAAW,CAUb;AAED,wBAAgB,WAAW,CAC1B,EAAE,EAAE,sBAAsB,EAC1B,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,MAAM,GACb,YAAY,CAgBd;AAED,wBAAgB,WAAW,CAC1B,EAAE,EAAE,sBAAsB,EAC1B,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,MAAM,EAAE,GACb,GAAG,CAAC,MAAM,EAAE,oBAAoB,GAAG,IAAI,CAAC,CAM1C;AAID,eAAO,MAAM,SAAS,oLAQrB,CAAC;AAEF,eAAO,MAAM,WAAW,u7EA8FvB,CAAC;AAIF,eAAO,MAAM,QAAQ,k4EA0FpB,CAAC;AAIF,eAAO,MAAM,UAAU,QAgEtB,CAAC;AAEF,eAAO,MAAM,qBAAqB,QAoEjC,CAAC;AAEF,eAAO,MAAM,cAAc,QAwD1B,CAAC;AAEF,eAAO,MAAM,cAAc,QAyC1B,CAAC;AAEF,eAAO,MAAM,UAAU,QAgDtB,CAAC;AAEF,eAAO,MAAM,eAAe,QA+C3B,CAAC;AAEF,eAAO,MAAM,cAAc,QAgC1B,CAAC;AAEF,eAAO,MAAM,SAAS,QA+BrB,CAAC;AAEF,eAAO,MAAM,iBAAiB,QAuC7B,CAAC;AAEF,eAAO,MAAM,kBAAkB,QAkC9B,CAAC;AAEF,eAAO,MAAM,oBAAoB,QAkDhC,CAAC;AAEF,eAAO,MAAM,gBAAgB,QAqC5B,CAAC;AAEF,eAAO,MAAM,WAAW,QAuCvB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;;;;;;;;;CAc1B,CAAC"}