gloop-sim 0.0.0-stage → 1.0.0

package/dist/render/backend/gpu.js

@@ -0,0 +1,278 @@
+import { Color, Fog, Group, OrthographicCamera, PerspectiveCamera, Scene as ThreeScene, Vector3, WebGPURenderer, } from "three/webgpu";
+import { assert } from "../../assert.js";
+import { post } from "../../render/backend/post.js";
+import { Sampler } from "../../render/sampler.js";
+const DEFAULT_PIXEL_RATIO_CAP = 2;
+const DEFAULT_CLEAR_COLOR = "#000000";
+const FOG_NEAR = 2;
+const FOG_FAR = 6;
+export var backend;
+(function (backend) {
+    /**
+     * Selects the GPU rendering device.
+     */
+    function gpu() {
+        return { kind: "gpu" };
+    }
+    backend.gpu = gpu;
+})(backend || (backend = {}));
+function browserPixelRatio() {
+    return typeof devicePixelRatio === "number" ? devicePixelRatio : 1;
+}
+function createCameraObject(camera, aspect) {
+    const object = camera.kind === "perspective" ? new PerspectiveCamera() : new OrthographicCamera();
+    frameCameraObject({ object, camera, aspect });
+    return object;
+}
+function frameCameraObject({ object, camera, aspect }) {
+    if (camera.kind === "perspective") {
+        assert(object instanceof PerspectiveCamera, "a perspective camera cannot be framed by an orthographic object");
+        object.fov = camera.fieldOfView;
+        object.aspect = aspect;
+    }
+    else {
+        assert(object instanceof OrthographicCamera, "an orthographic camera cannot be framed by a perspective object");
+        object.left = -camera.extent * aspect;
+        object.right = camera.extent * aspect;
+        object.top = camera.extent;
+        object.bottom = -camera.extent;
+    }
+    object.near = camera.near;
+    object.far = camera.far;
+    object.position.set(...camera.position);
+    object.lookAt(new Vector3(...camera.target));
+    object.updateProjectionMatrix();
+}
+function mount(built, order) {
+    const root = new Group();
+    root.add(built.object);
+    root.traverse((object) => {
+        object.renderOrder = order;
+    });
+    return root;
+}
+class GpuScene {
+    sampler;
+    threeScene = new ThreeScene();
+    mounted = [];
+    sources = [];
+    disposed = false;
+    /**
+     * Counts layer replacements, so the stage can tell which layer set its
+     * pipelines were compiled for.
+     */
+    revision = 0;
+    constructor(sampler) {
+        this.sampler = sampler;
+    }
+    layers(layers) {
+        assert(!this.disposed, "cannot set layers on a disposed scene");
+        this.clearLayers();
+        this.revision += 1;
+        const sources = [];
+        for (const [order, layer] of layers.entries()) {
+            if (!sources.includes(layer.source)) {
+                sources.push(layer.source);
+            }
+            const built = layer.build();
+            const root = mount(built, order);
+            this.mounted.push({ built, root });
+            this.threeScene.add(root);
+        }
+        this.sources = sources;
+        return this;
+    }
+    async advanceFrame() {
+        const sample = await this.sampler.sample();
+        for (const source of this.sources) {
+            source.update(sample.state, sample);
+        }
+        for (const { built } of this.mounted) {
+            built.update(sample);
+        }
+    }
+    dispose() {
+        if (this.disposed) {
+            return;
+        }
+        this.clearLayers();
+        this.disposed = true;
+    }
+    clearLayers() {
+        for (const { built, root } of this.mounted) {
+            this.threeScene.remove(root);
+            built.dispose();
+        }
+        this.mounted.length = 0;
+    }
+}
+class GpuStage {
+    renderer;
+    canvas;
+    pixelRatioCap;
+    fogColor;
+    scenes = new Set();
+    effectChain = [];
+    cameraDescriptor;
+    cameraObject;
+    post = null;
+    postScene = null;
+    postDirty = true;
+    compiledRevision = null;
+    width = 1;
+    height = 1;
+    fogNear = FOG_NEAR;
+    fogFar = FOG_FAR;
+    disposed = false;
+    constructor(renderer, canvas, pixelRatioCap, fogColor, camera) {
+        this.renderer = renderer;
+        this.canvas = canvas;
+        this.pixelRatioCap = pixelRatioCap;
+        this.fogColor = fogColor;
+        this.cameraDescriptor = camera;
+        this.cameraObject = createCameraObject(camera, 1);
+        this.resize();
+    }
+    observe(swarm) {
+        assert(!this.disposed, "cannot observe on a disposed stage");
+        const scene = new GpuScene(new Sampler({ swarm }));
+        this.applyFog(scene);
+        this.scenes.add(scene);
+        return scene;
+    }
+    fog(range) {
+        this.fogNear = range === null ? null : range.near;
+        this.fogFar = range === null ? this.fogFar : range.far;
+        for (const scene of this.scenes) {
+            // We adjust the existing fog in place, since replacing it re-dirties every material.
+            this.applyFog(scene);
+        }
+    }
+    applyFog(scene) {
+        if (this.fogNear === null) {
+            scene.threeScene.fog = null;
+            return;
+        }
+        const fog = scene.threeScene.fog;
+        if (fog instanceof Fog) {
+            fog.near = this.fogNear;
+            fog.far = this.fogFar;
+            return;
+        }
+        scene.threeScene.fog = new Fog(this.fogColor, this.fogNear, this.fogFar);
+    }
+    camera(camera) {
+        this.frameCamera(camera);
+    }
+    effects(effects) {
+        const next = [...effects];
+        // A chain with the same passes in the same order is tuned in place.
+        // Otherwise, the post chain is rebuilt on the next render.
+        if (hasSameShape(this.effectChain, next)) {
+            this.post?.tune(next);
+        }
+        else {
+            this.postDirty = true;
+        }
+        this.effectChain = next;
+    }
+    async render(scene) {
+        assert(!this.disposed, "cannot render on a disposed stage");
+        assert(scene instanceof GpuScene, "scene was not created by this stage");
+        await scene.advanceFrame();
+        if (this.postDirty || this.postScene !== scene) {
+            this.post = post({
+                renderer: this.renderer,
+                scene: scene.threeScene,
+                camera: this.cameraObject,
+                effects: this.effectChain,
+            });
+            this.postScene = scene;
+            this.postDirty = false;
+            this.compiledRevision = null;
+        }
+        assert(this.post !== null, "post-processing pipeline failed to build");
+        if (this.compiledRevision !== scene.revision) {
+            const post = this.post;
+            const revision = scene.revision;
+            await post.compile();
+            // The chain or the layers can have been replaced while compiling, in
+            // which case the next render compiles again.
+            if (this.disposed || this.post !== post) {
+                return;
+            }
+            this.compiledRevision = revision;
+        }
+        this.post.render();
+    }
+    resize(size) {
+        const width = Math.max(1, Math.floor(size?.width ?? this.canvas.clientWidth ?? this.canvas.width));
+        const height = Math.max(1, Math.floor(size?.height ?? this.canvas.clientHeight ?? this.canvas.height));
+        this.width = width;
+        this.height = height;
+        this.renderer.setPixelRatio(Math.min(browserPixelRatio(), this.pixelRatioCap));
+        this.renderer.setSize(width, height, false);
+        // The post-processing chain tracks the renderer's drawing buffer, so a
+        // resize must not dirty it.
+        this.frameCamera(this.cameraDescriptor);
+    }
+    frameCamera(camera) {
+        if (camera.kind === this.cameraDescriptor.kind) {
+            frameCameraObject({ object: this.cameraObject, camera, aspect: this.aspect() });
+        }
+        else {
+            this.cameraObject = createCameraObject(camera, this.aspect());
+            this.postDirty = true;
+        }
+        this.cameraDescriptor = camera;
+    }
+    dispose() {
+        if (this.disposed) {
+            return;
+        }
+        for (const scene of this.scenes) {
+            scene.dispose();
+        }
+        this.scenes.clear();
+        this.post = null;
+        this.renderer.dispose();
+        this.disposed = true;
+    }
+    aspect() {
+        return this.width / this.height;
+    }
+}
+function hasSameShape(current, next) {
+    if (current.length !== next.length) {
+        return false;
+    }
+    for (const [index, effect] of current.entries()) {
+        const other = next[index];
+        assert(other !== undefined, `effect ${index} is missing from a chain of ${next.length}`);
+        if (effect.type !== other.type) {
+            return false;
+        }
+    }
+    return true;
+}
+/**
+ * Creates a GPU-backed stage on `canvas`. Waits for the device to initialize
+ * before returning.
+ */
+export async function createStage(options) {
+    assert(options.backend.kind === "gpu", `unsupported render backend "${options.backend.kind}"`);
+    const renderer = new WebGPURenderer({ canvas: options.canvas, antialias: true, alpha: false });
+    await renderer.init();
+    const clear = new Color(options.clear ?? DEFAULT_CLEAR_COLOR);
+    renderer.setClearColor(clear, 1);
+    const defaultCamera = {
+        kind: "perspective",
+        position: [0, 0, 3],
+        target: [0, 0, 0],
+        fieldOfView: 45,
+        near: 0.01,
+        far: 100,
+    };
+    return new GpuStage(renderer, options.canvas, options.pixelRatio ?? DEFAULT_PIXEL_RATIO_CAP, clear, options.camera ?? defaultCamera);
+}
+//# sourceMappingURL=gpu.js.map

package/dist/render/backend/gpu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gpu.js","sourceRoot":"","sources":["../../../src/render/backend/gpu.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Color,\n  Fog,\n  Group,\n  OrthographicCamera,\n  PerspectiveCamera,\n  Scene as ThreeScene,\n  Vector3,\n  WebGPURenderer,\n} from \"three/webgpu\";\nimport { assert } from \"@/assert.js\";\nimport { type PostChain, post } from \"@/render/backend/post.js\";\nimport type { Camera } from \"@/render/camera.js\";\nimport type { Effect } from \"@/render/effect.js\";\nimport type { Layer, LayerObject } from \"@/render/layer.js\";\nimport { Sampler } from \"@/render/sampler.js\";\nimport type { Source } from \"@/render/sources.js\";\nimport type { RenderBackend, Scene, Stage, StageOptions } from \"@/render/stage.js\";\nimport type { Swarm } from \"@/types.js\";\n\nconst DEFAULT_PIXEL_RATIO_CAP = 2;\nconst DEFAULT_CLEAR_COLOR = \"#000000\";\nconst FOG_NEAR = 2;\nconst FOG_FAR = 6;\n\nexport namespace backend {\n  /**\n   * Selects the GPU rendering device.\n   */\n  export function gpu(): RenderBackend {\n    return { kind: \"gpu\" };\n  }\n}\n\nfunction browserPixelRatio(): number {\n  return typeof devicePixelRatio === \"number\" ? devicePixelRatio : 1;\n}\n\ntype CameraObject = PerspectiveCamera | OrthographicCamera;\n\ninterface CameraFraming {\n  object: CameraObject;\n  camera: Camera;\n  aspect: number;\n}\n\nfunction createCameraObject(camera: Camera, aspect: number): CameraObject {\n  const object = camera.kind === \"perspective\" ? new PerspectiveCamera() : new OrthographicCamera();\n  frameCameraObject({ object, camera, aspect });\n  return object;\n}\n\nfunction frameCameraObject({ object, camera, aspect }: CameraFraming): void {\n  if (camera.kind === \"perspective\") {\n    assert(object instanceof PerspectiveCamera, \"a perspective camera cannot be framed by an orthographic object\");\n    object.fov = camera.fieldOfView;\n    object.aspect = aspect;\n  } else {\n    assert(object instanceof OrthographicCamera, \"an orthographic camera cannot be framed by a perspective object\");\n    object.left = -camera.extent * aspect;\n    object.right = camera.extent * aspect;\n    object.top = camera.extent;\n    object.bottom = -camera.extent;\n  }\n\n  object.near = camera.near;\n  object.far = camera.far;\n  object.position.set(...camera.position);\n  object.lookAt(new Vector3(...camera.target));\n  object.updateProjectionMatrix();\n}\n\ninterface MountedLayer {\n  readonly built: LayerObject;\n  readonly root: Group;\n}\n\nfunction mount(built: LayerObject, order: number): Group {\n  const root = new Group();\n  root.add(built.object);\n  root.traverse((object) => {\n    object.renderOrder = order;\n  });\n  return root;\n}\n\nclass GpuScene implements Scene {\n  readonly threeScene = new ThreeScene();\n  private readonly mounted: MountedLayer[] = [];\n  private sources: readonly Source[] = [];\n  private disposed = false;\n\n  /**\n   * Counts layer replacements, so the stage can tell which layer set its\n   * pipelines were compiled for.\n   */\n  revision = 0;\n\n  constructor(private readonly sampler: Sampler) {}\n\n  layers(layers: readonly Layer<Source>[]): Scene {\n    assert(!this.disposed, \"cannot set layers on a disposed scene\");\n    this.clearLayers();\n    this.revision += 1;\n    const sources: Source[] = [];\n    for (const [order, layer] of layers.entries()) {\n      if (!sources.includes(layer.source)) {\n        sources.push(layer.source);\n      }\n      const built = layer.build();\n      const root = mount(built, order);\n      this.mounted.push({ built, root });\n      this.threeScene.add(root);\n    }\n    this.sources = sources;\n    return this;\n  }\n\n  async advanceFrame(): Promise<void> {\n    const sample = await this.sampler.sample();\n    for (const source of this.sources) {\n      source.update(sample.state, sample);\n    }\n    for (const { built } of this.mounted) {\n      built.update(sample);\n    }\n  }\n\n  dispose(): void {\n    if (this.disposed) {\n      return;\n    }\n    this.clearLayers();\n    this.disposed = true;\n  }\n\n  private clearLayers(): void {\n    for (const { built, root } of this.mounted) {\n      this.threeScene.remove(root);\n      built.dispose();\n    }\n    this.mounted.length = 0;\n  }\n}\n\nclass GpuStage implements Stage {\n  private readonly scenes = new Set<GpuScene>();\n  private effectChain: readonly Effect[] = [];\n  private cameraDescriptor: Camera;\n  private cameraObject: CameraObject;\n  private post: PostChain | null = null;\n  private postScene: GpuScene | null = null;\n  private postDirty = true;\n  private compiledRevision: number | null = null;\n  private width = 1;\n  private height = 1;\n  private fogNear: number | null = FOG_NEAR;\n  private fogFar = FOG_FAR;\n  private disposed = false;\n\n  constructor(\n    private readonly renderer: WebGPURenderer,\n    private readonly canvas: HTMLCanvasElement,\n    private readonly pixelRatioCap: number,\n    private readonly fogColor: Color,\n    camera: Camera,\n  ) {\n    this.cameraDescriptor = camera;\n    this.cameraObject = createCameraObject(camera, 1);\n    this.resize();\n  }\n\n  observe(swarm: Swarm): Scene {\n    assert(!this.disposed, \"cannot observe on a disposed stage\");\n    const scene = new GpuScene(new Sampler({ swarm }));\n    this.applyFog(scene);\n    this.scenes.add(scene);\n    return scene;\n  }\n\n  fog(range: { readonly near: number; readonly far: number } | null): void {\n    this.fogNear = range === null ? null : range.near;\n    this.fogFar = range === null ? this.fogFar : range.far;\n    for (const scene of this.scenes) {\n      // We adjust the existing fog in place, since replacing it re-dirties every material.\n      this.applyFog(scene);\n    }\n  }\n\n  private applyFog(scene: GpuScene): void {\n    if (this.fogNear === null) {\n      scene.threeScene.fog = null;\n      return;\n    }\n\n    const fog = scene.threeScene.fog;\n    if (fog instanceof Fog) {\n      fog.near = this.fogNear;\n      fog.far = this.fogFar;\n      return;\n    }\n    scene.threeScene.fog = new Fog(this.fogColor, this.fogNear, this.fogFar);\n  }\n\n  camera(camera: Camera): void {\n    this.frameCamera(camera);\n  }\n\n  effects(effects: readonly Effect[]): void {\n    const next = [...effects];\n\n    // A chain with the same passes in the same order is tuned in place.\n    // Otherwise, the post chain is rebuilt on the next render.\n    if (hasSameShape(this.effectChain, next)) {\n      this.post?.tune(next);\n    } else {\n      this.postDirty = true;\n    }\n    this.effectChain = next;\n  }\n\n  async render(scene: Scene): Promise<void> {\n    assert(!this.disposed, \"cannot render on a disposed stage\");\n    assert(scene instanceof GpuScene, \"scene was not created by this stage\");\n    await scene.advanceFrame();\n\n    if (this.postDirty || this.postScene !== scene) {\n      this.post = post({\n        renderer: this.renderer,\n        scene: scene.threeScene,\n        camera: this.cameraObject,\n        effects: this.effectChain,\n      });\n      this.postScene = scene;\n      this.postDirty = false;\n      this.compiledRevision = null;\n    }\n    assert(this.post !== null, \"post-processing pipeline failed to build\");\n\n    if (this.compiledRevision !== scene.revision) {\n      const post = this.post;\n      const revision = scene.revision;\n      await post.compile();\n      // The chain or the layers can have been replaced while compiling, in\n      // which case the next render compiles again.\n      if (this.disposed || this.post !== post) {\n        return;\n      }\n      this.compiledRevision = revision;\n    }\n    this.post.render();\n  }\n\n  resize(size?: { readonly width: number; readonly height: number }): void {\n    const width = Math.max(1, Math.floor(size?.width ?? this.canvas.clientWidth ?? this.canvas.width));\n    const height = Math.max(1, Math.floor(size?.height ?? this.canvas.clientHeight ?? this.canvas.height));\n    this.width = width;\n    this.height = height;\n\n    this.renderer.setPixelRatio(Math.min(browserPixelRatio(), this.pixelRatioCap));\n    this.renderer.setSize(width, height, false);\n\n    // The post-processing chain tracks the renderer's drawing buffer, so a\n    // resize must not dirty it.\n    this.frameCamera(this.cameraDescriptor);\n  }\n\n  private frameCamera(camera: Camera): void {\n    if (camera.kind === this.cameraDescriptor.kind) {\n      frameCameraObject({ object: this.cameraObject, camera, aspect: this.aspect() });\n    } else {\n      this.cameraObject = createCameraObject(camera, this.aspect());\n      this.postDirty = true;\n    }\n    this.cameraDescriptor = camera;\n  }\n\n  dispose(): void {\n    if (this.disposed) {\n      return;\n    }\n    for (const scene of this.scenes) {\n      scene.dispose();\n    }\n    this.scenes.clear();\n    this.post = null;\n    this.renderer.dispose();\n    this.disposed = true;\n  }\n\n  private aspect(): number {\n    return this.width / this.height;\n  }\n}\n\nfunction hasSameShape(current: readonly Effect[], next: readonly Effect[]): boolean {\n  if (current.length !== next.length) {\n    return false;\n  }\n  for (const [index, effect] of current.entries()) {\n    const other = next[index];\n    assert(other !== undefined, `effect ${index} is missing from a chain of ${next.length}`);\n    if (effect.type !== other.type) {\n      return false;\n    }\n  }\n  return true;\n}\n\n/**\n * Creates a GPU-backed stage on `canvas`. Waits for the device to initialize\n * before returning.\n */\nexport async function createStage(options: StageOptions): Promise<Stage> {\n  assert(options.backend.kind === \"gpu\", `unsupported render backend \"${options.backend.kind}\"`);\n\n  const renderer = new WebGPURenderer({ canvas: options.canvas, antialias: true, alpha: false });\n  await renderer.init();\n\n  const clear = new Color(options.clear ?? DEFAULT_CLEAR_COLOR);\n  renderer.setClearColor(clear, 1);\n\n  const defaultCamera: Camera = {\n    kind: \"perspective\",\n    position: [0, 0, 3],\n    target: [0, 0, 0],\n    fieldOfView: 45,\n    near: 0.01,\n    far: 100,\n  };\n\n  return new GpuStage(\n    renderer,\n    options.canvas,\n    options.pixelRatio ?? DEFAULT_PIXEL_RATIO_CAP,\n    clear,\n    options.camera ?? defaultCamera,\n  );\n}\n"]}

package/dist/render/backend/material.d.ts

@@ -0,0 +1,30 @@
+import { LineBasicNodeMaterial, MeshBasicNodeMaterial } from "three/webgpu";
+import type { ColorNode, ScalarNode } from "../../render/backend/compile.js";
+import type { Color } from "../../render/color.js";
+export declare namespace material {
+    /**
+     * An unlit material for the flat, translucent geometry that layers draw.
+     * Additive materials add their color to what is behind them instead of
+     * blending over it.
+     */
+    function flat({ color, opacity, additive, }: {
+        color: ColorNode;
+        opacity: ScalarNode;
+        additive?: boolean;
+    }): MeshBasicNodeMaterial;
+    /**
+     * An unlit, translucent material for closed solid geometry, drawn from the
+     * front only.
+     */
+    function solid({ color, opacity }: {
+        color: ColorNode;
+        opacity: ScalarNode;
+    }): MeshBasicNodeMaterial;
+    /**
+     * An unlit, translucent material for line geometry of one constant color.
+     */
+    function line({ color, opacity }: {
+        color: Color;
+        opacity: number;
+    }): LineBasicNodeMaterial;
+}

package/dist/render/backend/material.js

@@ -0,0 +1,57 @@
+import { AdditiveBlending, DoubleSide, LineBasicNodeMaterial, MeshBasicNodeMaterial, Color as ThreeColor, } from "three/webgpu";
+export var material;
+(function (material) {
+    /**
+     * An unlit material for the flat, translucent geometry that layers draw.
+     * Additive materials add their color to what is behind them instead of
+     * blending over it.
+     */
+    function flat({ color, opacity, additive = false, }) {
+        const result = new MeshBasicNodeMaterial();
+        result.colorNode = color;
+        result.opacityNode = opacity;
+        makeTranslucent(result);
+        // A flat layer is seen from either side. In three's terms: double-sided,
+        // so a quad draws whichever way its triangles wind; and single-pass,
+        // because three otherwise draws transparent double-sided materials as a
+        // back-then-front pair, which for flat geometry that writes no depth gives
+        // the same image at twice the cost.
+        result.side = DoubleSide;
+        result.forceSinglePass = true;
+        if (additive) {
+            result.blending = AdditiveBlending;
+        }
+        return result;
+    }
+    material.flat = flat;
+    /**
+     * An unlit, translucent material for closed solid geometry, drawn from the
+     * front only.
+     */
+    function solid({ color, opacity }) {
+        const result = new MeshBasicNodeMaterial();
+        result.colorNode = color;
+        result.opacityNode = opacity;
+        makeTranslucent(result);
+        return result;
+    }
+    material.solid = solid;
+    /**
+     * An unlit, translucent material for line geometry of one constant color.
+     */
+    function line({ color, opacity }) {
+        const result = new LineBasicNodeMaterial();
+        result.color = new ThreeColor(color);
+        result.opacity = opacity;
+        makeTranslucent(result);
+        return result;
+    }
+    material.line = line;
+})(material || (material = {}));
+function makeTranslucent(target) {
+    // A layer is translucent. In three's terms: transparent without depth
+    // writes, so overlapping layers blend rather than occlude each other.
+    target.transparent = true;
+    target.depthWrite = false;
+}
+//# sourceMappingURL=material.js.map

package/dist/render/backend/material.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"material.js","sourceRoot":"","sources":["../../../src/render/backend/material.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,qBAAqB,EAErB,qBAAqB,EACrB,KAAK,IAAI,UAAU,GACpB,MAAM,cAAc,CAAC;AAItB,MAAM,KAAW,QAAQ,CAwDxB;AAxDD,WAAiB,QAAQ;IACvB;;;;OAIG;IACH,SAAgB,IAAI,CAAC,EACnB,KAAK,EACL,OAAO,EACP,QAAQ,GAAG,KAAK,GAKjB;QACC,MAAM,MAAM,GAAG,IAAI,qBAAqB,EAAE,CAAC;QAC3C,MAAM,CAAC,SAAS,GAAG,KAAK,CAAC;QACzB,MAAM,CAAC,WAAW,GAAG,OAAO,CAAC;QAC7B,eAAe,CAAC,MAAM,CAAC,CAAC;QAExB,yEAAyE;QACzE,qEAAqE;QACrE,wEAAwE;QACxE,2EAA2E;QAC3E,oCAAoC;QACpC,MAAM,CAAC,IAAI,GAAG,UAAU,CAAC;QACzB,MAAM,CAAC,eAAe,GAAG,IAAI,CAAC;QAE9B,IAAI,QAAQ,EAAE,CAAC;YACb,MAAM,CAAC,QAAQ,GAAG,gBAAgB,CAAC;QACrC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IA1Be,aAAI,OA0BnB,CAAA;IAED;;;OAGG;IACH,SAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,OAAO,EAA6C;QACjF,MAAM,MAAM,GAAG,IAAI,qBAAqB,EAAE,CAAC;QAC3C,MAAM,CAAC,SAAS,GAAG,KAAK,CAAC;QACzB,MAAM,CAAC,WAAW,GAAG,OAAO,CAAC;QAC7B,eAAe,CAAC,MAAM,CAAC,CAAC;QACxB,OAAO,MAAM,CAAC;IAChB,CAAC;IANe,cAAK,QAMpB,CAAA;IAED;;OAEG;IACH,SAAgB,IAAI,CAAC,EAAE,KAAK,EAAE,OAAO,EAAqC;QACxE,MAAM,MAAM,GAAG,IAAI,qBAAqB,EAAE,CAAC;QAC3C,MAAM,CAAC,KAAK,GAAG,IAAI,UAAU,CAAC,KAAK,CAAC,CAAC;QACrC,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;QACzB,eAAe,CAAC,MAAM,CAAC,CAAC;QACxB,OAAO,MAAM,CAAC;IAChB,CAAC;IANe,aAAI,OAMnB,CAAA;AACH,CAAC,EAxDgB,QAAQ,KAAR,QAAQ,QAwDxB;AAED,SAAS,eAAe,CAAC,MAAgB;IACvC,sEAAsE;IACtE,sEAAsE;IACtE,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC;IAC1B,MAAM,CAAC,UAAU,GAAG,KAAK,CAAC;AAC5B,CAAC","sourcesContent":["import {\n  AdditiveBlending,\n  DoubleSide,\n  LineBasicNodeMaterial,\n  type Material,\n  MeshBasicNodeMaterial,\n  Color as ThreeColor,\n} from \"three/webgpu\";\nimport type { ColorNode, ScalarNode } from \"@/render/backend/compile.js\";\nimport type { Color } from \"@/render/color.js\";\n\nexport namespace material {\n  /**\n   * An unlit material for the flat, translucent geometry that layers draw.\n   * Additive materials add their color to what is behind them instead of\n   * blending over it.\n   */\n  export function flat({\n    color,\n    opacity,\n    additive = false,\n  }: {\n    color: ColorNode;\n    opacity: ScalarNode;\n    additive?: boolean;\n  }): MeshBasicNodeMaterial {\n    const result = new MeshBasicNodeMaterial();\n    result.colorNode = color;\n    result.opacityNode = opacity;\n    makeTranslucent(result);\n\n    // A flat layer is seen from either side. In three's terms: double-sided,\n    // so a quad draws whichever way its triangles wind; and single-pass,\n    // because three otherwise draws transparent double-sided materials as a\n    // back-then-front pair, which for flat geometry that writes no depth gives\n    // the same image at twice the cost.\n    result.side = DoubleSide;\n    result.forceSinglePass = true;\n\n    if (additive) {\n      result.blending = AdditiveBlending;\n    }\n    return result;\n  }\n\n  /**\n   * An unlit, translucent material for closed solid geometry, drawn from the\n   * front only.\n   */\n  export function solid({ color, opacity }: { color: ColorNode; opacity: ScalarNode }): MeshBasicNodeMaterial {\n    const result = new MeshBasicNodeMaterial();\n    result.colorNode = color;\n    result.opacityNode = opacity;\n    makeTranslucent(result);\n    return result;\n  }\n\n  /**\n   * An unlit, translucent material for line geometry of one constant color.\n   */\n  export function line({ color, opacity }: { color: Color; opacity: number }): LineBasicNodeMaterial {\n    const result = new LineBasicNodeMaterial();\n    result.color = new ThreeColor(color);\n    result.opacity = opacity;\n    makeTranslucent(result);\n    return result;\n  }\n}\n\nfunction makeTranslucent(target: Material): void {\n  // A layer is translucent. In three's terms: transparent without depth\n  // writes, so overlapping layers blend rather than occlude each other.\n  target.transparent = true;\n  target.depthWrite = false;\n}\n"]}

package/dist/render/backend/particles.d.ts

@@ -0,0 +1,5 @@
+import type { LayerObject, ParticlesLayer } from "../../render/layer.js";
+/**
+ * Builds a particles layer. It draws one glyph per particle in the source.
+ */
+export declare function buildParticles(layer: ParticlesLayer): LayerObject;

package/dist/render/backend/particles.js

@@ -0,0 +1,22 @@
+import { buildGlyphCloud } from "../../render/backend/glyphs.js";
+/**
+ * Builds a particles layer. It draws one glyph per particle in the source.
+ */
+export function buildParticles(layer) {
+    const cloud = buildGlyphCloud({ shape: layer.shape, style: layer, sizeScale: 1 });
+    let indices = [];
+    return {
+        object: cloud.mesh,
+        update(frame) {
+            const count = layer.source.count();
+            if (indices.length !== count) {
+                indices = Array.from({ length: count }, (_, particle) => particle);
+            }
+            cloud.update(frame, indices);
+        },
+        dispose() {
+            cloud.dispose();
+        },
+    };
+}
+//# sourceMappingURL=particles.js.map

package/dist/render/backend/particles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"particles.js","sourceRoot":"","sources":["../../../src/render/backend/particles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAI7D;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,KAAqB;IAClD,MAAM,KAAK,GAAG,eAAe,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;IAElF,IAAI,OAAO,GAAa,EAAE,CAAC;IAE3B,OAAO;QACL,MAAM,EAAE,KAAK,CAAC,IAAI;QAClB,MAAM,CAAC,KAAY;YACjB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;YACnC,IAAI,OAAO,CAAC,MAAM,KAAK,KAAK,EAAE,CAAC;gBAC7B,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC;YACrE,CAAC;YACD,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAC/B,CAAC;QACD,OAAO;YACL,KAAK,CAAC,OAAO,EAAE,CAAC;QAClB,CAAC;KACF,CAAC;AACJ,CAAC","sourcesContent":["import { buildGlyphCloud } from \"@/render/backend/glyphs.js\";\nimport type { Frame } from \"@/render/frame.js\";\nimport type { LayerObject, ParticlesLayer } from \"@/render/layer.js\";\n\n/**\n * Builds a particles layer. It draws one glyph per particle in the source.\n */\nexport function buildParticles(layer: ParticlesLayer): LayerObject {\n  const cloud = buildGlyphCloud({ shape: layer.shape, style: layer, sizeScale: 1 });\n\n  let indices: number[] = [];\n\n  return {\n    object: cloud.mesh,\n    update(frame: Frame): void {\n      const count = layer.source.count();\n      if (indices.length !== count) {\n        indices = Array.from({ length: count }, (_, particle) => particle);\n      }\n      cloud.update(frame, indices);\n    },\n    dispose(): void {\n      cloud.dispose();\n    },\n  };\n}\n"]}

package/dist/render/backend/post.d.ts

@@ -0,0 +1,29 @@
+import type { Camera, Scene, WebGPURenderer } from "three/webgpu";
+import type { Effect } from "../../render/effect.js";
+export interface PostChain {
+    /**
+     * Renders the post-processing chain to the screen. Synchronous; the renderer
+     * must already be initialized.
+     */
+    render(): void;
+    /**
+     * Builds the scene's pipelines without blocking the GPU queue. Pipelines not
+     * built beforehand are compiled on first draw, stalling that frame.
+     */
+    compile(): Promise<void>;
+    /**
+     * Updates the post-processing effect chain parameters in place.
+     */
+    tune(effects: readonly Effect[]): void;
+}
+interface PostOptions {
+    renderer: WebGPURenderer;
+    scene: Scene;
+    camera: Camera;
+    effects: readonly Effect[];
+}
+/**
+ * Builds a post-processing chain that applies the specified `effects` in order.
+ */
+export declare function post({ renderer, scene, camera, effects }: PostOptions): PostChain;
+export {};

package/dist/render/backend/post.js

@@ -0,0 +1,77 @@
+import { bloom } from "three/addons/tsl/display/BloomNode.js";
+import { float, length, pass, screenUV, smoothstep, uniform } from "three/tsl";
+import { RenderPipeline } from "three/webgpu";
+import { assert } from "../../assert.js";
+const build = {
+    bloom({ scenePass, input, effect }) {
+        const intensity = uniform(effect.intensity);
+        const radius = uniform(effect.radius);
+        const threshold = uniform(effect.threshold);
+        return {
+            output: input.add(bloom(scenePass, intensity, radius, threshold)),
+            tune(next) {
+                assert(next.type === "bloom", `a bloom pass cannot be tuned by a ${next.type} effect`);
+                intensity.value = next.intensity;
+                radius.value = next.radius;
+                threshold.value = next.threshold;
+            },
+        };
+    },
+    vignette({ input, effect }) {
+        const intensity = uniform(effect.intensity);
+        const smoothness = uniform(effect.smoothness);
+        const distance = length(screenUV.sub(0.5));
+        const inner = smoothness.mul(0.5);
+        const edge = smoothstep(inner, 0.75, distance).mul(intensity);
+        return {
+            output: input.mul(float(1).sub(edge)),
+            tune(next) {
+                assert(next.type === "vignette", `a vignette pass cannot be tuned by a ${next.type} effect`);
+                intensity.value = next.intensity;
+                smoothness.value = next.smoothness;
+            },
+        };
+    },
+};
+/**
+ * Builds a post-processing chain that applies the specified `effects` in order.
+ */
+export function post({ renderer, scene, camera, effects }) {
+    if (effects.length === 0) {
+        return {
+            render: () => renderer.render(scene, camera),
+            compile: () => renderer.compileAsync(scene, camera),
+            tune() { },
+        };
+    }
+    const scenePass = pass(scene, camera);
+    let output = scenePass;
+    const tuners = [];
+    for (const effect of effects) {
+        const built = effect.type === "bloom"
+            ? build.bloom({ scenePass, input: output, effect })
+            : build.vignette({ scenePass, input: output, effect });
+        output = built.output;
+        tuners.push(built.tune);
+    }
+    const post = new RenderPipeline(renderer);
+    post.outputNode = output;
+    return {
+        render: () => post.render(),
+        compile: () => {
+            // The pass takes the renderer's sample count on its first render, so a
+            // compile ahead of that would build single-sampled pipelines.
+            scenePass.renderTarget.samples = renderer.samples;
+            return scenePass.compileAsync(renderer);
+        },
+        tune(next) {
+            assert(next.length === tuners.length, `a chain of ${tuners.length} effects cannot be tuned by ${next.length}`);
+            for (const [index, tune] of tuners.entries()) {
+                const effect = next[index];
+                assert(effect !== undefined, `effect ${index} is missing from a chain of ${next.length}`);
+                tune(effect);
+            }
+        },
+    };
+}
+//# sourceMappingURL=post.js.map

package/dist/render/backend/post.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"post.js","sourceRoot":"","sources":["../../../src/render/backend/post.ts"],"names":[],"mappings":"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","sourcesContent":["import { bloom } from \"three/addons/tsl/display/BloomNode.js\";\nimport { float, length, pass, screenUV, smoothstep, uniform } from \"three/tsl\";\nimport type { Camera, Node, Scene, WebGPURenderer } from \"three/webgpu\";\nimport { RenderPipeline } from \"three/webgpu\";\nimport { assert } from \"@/assert.js\";\nimport type { BloomEffect, Effect, VignetteEffect } from \"@/render/effect.js\";\n\ntype EffectTuner = (effect: Effect) => void;\n\ninterface Pass {\n  output: Node<\"vec4\">;\n  tune: EffectTuner;\n}\n\ninterface PassInput<E extends Effect> {\n  scenePass: Node<\"vec4\">;\n  input: Node<\"vec4\">;\n  effect: E;\n}\n\nexport interface PostChain {\n  /**\n   * Renders the post-processing chain to the screen. Synchronous; the renderer\n   * must already be initialized.\n   */\n  render(): void;\n\n  /**\n   * Builds the scene's pipelines without blocking the GPU queue. Pipelines not\n   * built beforehand are compiled on first draw, stalling that frame.\n   */\n  compile(): Promise<void>;\n\n  /**\n   * Updates the post-processing effect chain parameters in place.\n   */\n  tune(effects: readonly Effect[]): void;\n}\n\nconst build = {\n  bloom({ scenePass, input, effect }: PassInput<BloomEffect>): Pass {\n    const intensity = uniform(effect.intensity);\n    const radius = uniform(effect.radius);\n    const threshold = uniform(effect.threshold);\n    return {\n      output: input.add(bloom(scenePass, intensity, radius, threshold)),\n      tune(next) {\n        assert(next.type === \"bloom\", `a bloom pass cannot be tuned by a ${next.type} effect`);\n        intensity.value = next.intensity;\n        radius.value = next.radius;\n        threshold.value = next.threshold;\n      },\n    };\n  },\n\n  vignette({ input, effect }: PassInput<VignetteEffect>): Pass {\n    const intensity = uniform(effect.intensity);\n    const smoothness = uniform(effect.smoothness);\n    const distance = length(screenUV.sub(0.5));\n    const inner = smoothness.mul(0.5);\n    const edge = smoothstep(inner, 0.75, distance).mul(intensity);\n    return {\n      output: input.mul(float(1).sub(edge)),\n      tune(next) {\n        assert(next.type === \"vignette\", `a vignette pass cannot be tuned by a ${next.type} effect`);\n        intensity.value = next.intensity;\n        smoothness.value = next.smoothness;\n      },\n    };\n  },\n};\n\ninterface PostOptions {\n  renderer: WebGPURenderer;\n  scene: Scene;\n  camera: Camera;\n  effects: readonly Effect[];\n}\n\n/**\n * Builds a post-processing chain that applies the specified `effects` in order.\n */\nexport function post({ renderer, scene, camera, effects }: PostOptions): PostChain {\n  if (effects.length === 0) {\n    return {\n      render: () => renderer.render(scene, camera),\n      compile: () => renderer.compileAsync(scene, camera),\n      tune() {},\n    };\n  }\n\n  const scenePass = pass(scene, camera);\n  let output: Node<\"vec4\"> = scenePass;\n  const tuners: EffectTuner[] = [];\n\n  for (const effect of effects) {\n    const built =\n      effect.type === \"bloom\"\n        ? build.bloom({ scenePass, input: output, effect })\n        : build.vignette({ scenePass, input: output, effect });\n    output = built.output;\n    tuners.push(built.tune);\n  }\n\n  const post = new RenderPipeline(renderer);\n  post.outputNode = output;\n\n  return {\n    render: () => post.render(),\n    compile: () => {\n      // The pass takes the renderer's sample count on its first render, so a\n      // compile ahead of that would build single-sampled pipelines.\n      scenePass.renderTarget.samples = renderer.samples;\n      return scenePass.compileAsync(renderer);\n    },\n    tune(next: readonly Effect[]): void {\n      assert(next.length === tuners.length, `a chain of ${tuners.length} effects cannot be tuned by ${next.length}`);\n      for (const [index, tune] of tuners.entries()) {\n        const effect = next[index];\n        assert(effect !== undefined, `effect ${index} is missing from a chain of ${next.length}`);\n        tune(effect);\n      }\n    },\n  };\n}\n"]}

package/dist/render/backend/solids.d.ts

@@ -0,0 +1,10 @@
+import { type GlyphCloud, type GlyphCloudOptions } from "../../render/backend/cloud.js";
+import type { ParticleGlyph, SolidGlyph } from "../../render/layer.js";
+/**
+ * Whether `shape` is drawn as a solid.
+ */
+export declare function isSolid(shape: ParticleGlyph): shape is SolidGlyph;
+/**
+ * Builds a glyph cloud that draws one shaded solid per particle.
+ */
+export declare function buildSolidCloud({ shape, style, sizeScale }: GlyphCloudOptions<SolidGlyph>): GlyphCloud;