@woosh/meep-engine 3.53.0 → 3.54.0

package/src/shade/playground/foliage_wind/main.js

@@ -1,263 +1,275 @@
-import Vector3 from "../../../core/geom/Vector3.js";
-import { DEG_TO_RAD } from "../../../core/math/DEG_TO_RAD.js";
-import { GraphicsEngine } from "../../../engine/graphics3/GraphicsEngine.js";
-import { OrbitalCameraController } from "../../renderer/camera/OrbitalCameraController.js";
-import { create_frame_loop } from "../../renderer/create_frame_loop.js";
-import { Scene } from "../../renderer/scene/Scene.js";
-import { FrameRateMeter } from "../frame_rate_meter.js";
-import { createFoliageWindWorld, FOLIAGE_PLAYGROUND_PRESETS } from "./foliage_world.js";
-
-const MAX_SIMULATION_STEP = 0.05;
-
-const element = (id) => document.getElementById(id);
-const view_size = () => [Math.max(1, window.innerWidth), Math.max(1, window.innerHeight)];
-
-function show_message(text) {
-    const node = element("message");
-    if (node !== null) {
-        node.textContent = text;
-    }
-}
-
-async function main() {
-    const graphics = new GraphicsEngine();
-    const scene = new Scene();
-
-    element("viewport").appendChild(graphics.viewport.el);
-
-    const [initial_width, initial_height] = view_size();
-    graphics.viewport.size.set(initial_width, initial_height);
-
-    // --- Create the ECS Foliage & Wind World ---
-    const world = await createFoliageWindWorld(graphics, scene, {
-        mode: "specimen",
-        preset: "oak",
-        seed: 1337,
-        lod: 0,
-        windSpeed: 6.5,
-        headingDeg: 25,
-        gustStrength: 4.5,
-        gustPeriod: 5.5,
-        windWeight: 1.0,
-    });
-
-    // --- Camera & OrbitalCameraController ---
-    const camera = graphics.camera.camera;
-    camera.near = 0.03;
-    camera.far = 300;
-    camera.fov = 50 * DEG_TO_RAD;
-
-    const controller = new OrbitalCameraController(camera, document.body);
-    controller.look(new Vector3(11.0, 7.5, 14.5), new Vector3(0, 5.2, 0));
-    controller.movement_speed_scale = 3.0;
-    document.body.focus();
-
-    function frame_camera_for_selection() {
-        if (world.state.mode === "grove") {
-            controller.look(new Vector3(22.0, 12.0, 26.0), new Vector3(0, 4.5, 0));
-        } else {
-            const is_small = world.state.preset === "shrub" || world.state.preset === "fern";
-            if (is_small) {
-                controller.look(new Vector3(3.5, 2.2, 4.2), new Vector3(0, 1.0, 0));
-            } else {
-                controller.look(new Vector3(11.0, 7.5, 14.5), new Vector3(0, 5.2, 0));
-            }
-        }
-    }
-
-    // --- Wire Interactive HUD Controls ---
-    const preset_container = element("preset-buttons");
-    const mode_container = element("mode-buttons");
-    const lod_container = element("lod-buttons");
-    const seed_input = /** @type {HTMLInputElement} */ (element("seed-input"));
-    const seed_random_btn = element("seed-random-btn");
-
-    function format_preset_label(preset) {
-        return preset.charAt(0).toUpperCase() + preset.slice(1);
-    }
-
-    for (const preset of FOLIAGE_PLAYGROUND_PRESETS) {
-        const btn = document.createElement("button");
-        btn.textContent = format_preset_label(preset);
-        btn.dataset.preset = preset;
-        if (preset === world.state.preset) {
-            btn.classList.add("active");
-        }
-        btn.addEventListener("click", () => {
-            for (const child of preset_container.querySelectorAll("button")) {
-                child.classList.toggle("active", child === btn);
-            }
-            world.rebuildTrees({ preset });
-            if (world.state.mode === "specimen") {
-                frame_camera_for_selection();
-            }
-        });
-        preset_container.appendChild(btn);
-    }
-
-    for (const btn of mode_container.querySelectorAll("button")) {
-        btn.addEventListener("click", () => {
-            const mode = /** @type {"specimen"|"grove"} */ (btn.dataset.mode);
-            for (const b of mode_container.querySelectorAll("button")) {
-                b.classList.toggle("active", b === btn);
-            }
-            world.rebuildTrees({ mode });
-            frame_camera_for_selection();
-        });
-    }
-
-    for (const btn of lod_container.querySelectorAll("button")) {
-        btn.addEventListener("click", () => {
-            const lod = Number(btn.dataset.lod) | 0;
-            for (const b of lod_container.querySelectorAll("button")) {
-                b.classList.toggle("active", b === btn);
-            }
-            world.rebuildTrees({ lod });
-        });
-    }
-
-    seed_input.addEventListener("change", () => {
-        const seed = Number(seed_input.value) | 0;
-        world.rebuildTrees({ seed });
-    });
-
-    seed_random_btn.addEventListener("click", () => {
-        const seed = Math.floor(Math.random() * 99999) + 1;
-        seed_input.value = String(seed);
-        world.rebuildTrees({ seed });
-    });
-
-    function bind_slider(slider_id, val_id, unit_suffix, on_change) {
-        const slider = /** @type {HTMLInputElement} */ (element(slider_id));
-        const label = element(val_id);
-        slider.addEventListener("input", () => {
-            const v = Number(slider.value);
-            label.textContent = `${v}${unit_suffix}`;
-            on_change(v);
-        });
-    }
-
-    bind_slider("slider-wind-speed", "val-wind-speed", " m/s", (windSpeed) => {
-        world.setWind({ windSpeed });
-    });
-
-    bind_slider("slider-gust-strength", "val-gust-strength", " m/s", (gustStrength) => {
-        world.setWind({ gustStrength });
-    });
-
-    bind_slider("slider-gust-period", "val-gust-period", " s", (gustPeriod) => {
-        world.setWind({ gustPeriod });
-    });
-
-    bind_slider("slider-wind-heading", "val-wind-heading", "°", (headingDeg) => {
-        world.setWind({ headingDeg });
-    });
-
-    bind_slider("slider-wind-weight", "val-wind-weight", "", (windWeight) => {
-        element("val-wind-weight").textContent = windWeight.toFixed(2);
-        world.setWind({ windWeight });
-    });
-
-    element("btn-trigger-gust").addEventListener("click", () => {
-        world.triggerLocalGust();
-    });
-
-    Object.assign(globalThis, {
-        graphics,
-        scene,
-        world,
-        camera,
-        controller,
-    });
-
-    // --- Start WebGPU Device ---
-    graphics.on.contextFailed.add((failure) =>
-        show_message(
-            "There will be no rendering.\n\n" +
-                failure.message +
-                "\n\nThe page needs WebGPU with subgroups and immediate data, over http://localhost."
-        )
-    );
-
-    try {
-        await graphics.start();
-    } catch (e) {
-        console.error(e);
-        return;
-    }
-
-    const renderer = graphics.renderer;
-    globalThis.renderer = renderer;
-
-    renderer.feature_automatic_exposure_enabled = false;
-    renderer.exposure_compensation = 0;
-
-    /** @type {(() => void)|null} */
-    let stop_loop = null;
-
-    renderer.graphics.device.lost?.then((info) => {
-        stop_loop?.();
-        show_message("The GPU device was lost.\n\n" + (info?.message ?? ""));
-    });
-
-    // --- Main Simulation & Render Loop ---
-    const el_fps = element("stat-fps");
-    const el_trees = element("stat-trees");
-    const el_rigs = element("stat-rigs");
-    const el_joints = element("stat-joints");
-    const el_tris = element("stat-tris");
-    const el_gust = element("stat-gust");
-
-    const frame_rate = new FrameRateMeter();
-    let frame_index = 0;
-
-    function frame(raw_dt) {
-        frame_rate.add(raw_dt);
-        const dt = Math.min(raw_dt, MAX_SIMULATION_STEP);
-
-        const [width, height] = view_size();
-        if (width !== graphics.viewport.size.x || height !== graphics.viewport.size.y) {
-            graphics.viewport.size.set(width, height);
-        }
-
-        controller.update();
-        world.step(dt);
-        graphics.render(dt);
-        frame_index++;
-
-        const stats = world.getStats();
-        el_fps.textContent = frame_rate.fps.toFixed(0);
-        el_trees.textContent = String(stats.treeCount);
-        el_rigs.textContent = String(stats.activeRigCount);
-        el_joints.textContent = stats.totalJoints.toLocaleString();
-        el_tris.textContent = stats.totalTriangles.toLocaleString();
-        el_gust.textContent = stats.gustActive ? "Active (Sweeping)" : "Idle";
-    }
-
-    function guarded_frame(dt) {
-        try {
-            frame(dt);
-        } catch (e) {
-            stop_loop?.();
-            console.error(e);
-            show_message("The frame failed and the loop has stopped.\n\n" + e.message);
-        }
-    }
-
-    if (new URLSearchParams(location.search).has("debug")) {
-        globalThis.__step = (n = 1, dt = 1 / 60) => {
-            for (let i = 0; i < n; i++) {
-                guarded_frame(dt);
-            }
-            return frame_index;
-        };
-        return;
-    }
-
-    stop_loop = create_frame_loop((dt) => guarded_frame(dt));
-}
-
-main().catch((e) => {
-    console.error(e);
-    show_message("The foliage playground failed to start — see the console.\n\n" + e.message);
-});
+import Vector3 from "../../../core/geom/Vector3.js";
+import { DEG_TO_RAD } from "../../../core/math/DEG_TO_RAD.js";
+import { GraphicsEngine } from "../../../engine/graphics3/GraphicsEngine.js";
+import { OrbitalCameraController } from "../../renderer/camera/OrbitalCameraController.js";
+import { create_frame_loop } from "../../renderer/create_frame_loop.js";
+import { Scene } from "../../renderer/scene/Scene.js";
+import { FrameRateMeter } from "../frame_rate_meter.js";
+import { createFoliageWindWorld, FOLIAGE_PLAYGROUND_PRESETS } from "./foliage_world.js";
+
+const MAX_SIMULATION_STEP = 0.05;
+
+const element = (id) => document.getElementById(id);
+const view_size = () => [Math.max(1, window.innerWidth), Math.max(1, window.innerHeight)];
+
+function show_message(text) {
+    const node = element("message");
+    if (node !== null) {
+        node.textContent = text;
+    }
+}
+
+async function main() {
+    const graphics = new GraphicsEngine();
+    const scene = new Scene();
+
+    element("viewport").appendChild(graphics.viewport.el);
+
+    const [initial_width, initial_height] = view_size();
+    graphics.viewport.size.set(initial_width, initial_height);
+
+    // --- Create the ECS Foliage & Wind World ---
+    const world = await createFoliageWindWorld(graphics, scene, {
+        mode: "specimen",
+        preset: "oak",
+        seed: 1337,
+        lod: 0,
+        showLeaves: true,
+        windSpeed: 6.5,
+        headingDeg: 25,
+        gustStrength: 4.5,
+        gustPeriod: 5.5,
+        windWeight: 1.0,
+    });
+
+    // --- Camera & OrbitalCameraController ---
+    const camera = graphics.camera.camera;
+    camera.near = 0.03;
+    camera.far = 300;
+    camera.fov = 50 * DEG_TO_RAD;
+
+    const controller = new OrbitalCameraController(camera, document.body);
+    controller.look(new Vector3(11.0, 7.5, 14.5), new Vector3(0, 5.2, 0));
+    controller.movement_speed_scale = 3.0;
+    document.body.focus();
+
+    function frame_camera_for_selection() {
+        if (world.state.mode === "grove") {
+            controller.look(new Vector3(22.0, 12.0, 26.0), new Vector3(0, 4.5, 0));
+        } else {
+            const is_small = world.state.preset === "shrub" || world.state.preset === "fern";
+            if (is_small) {
+                controller.look(new Vector3(3.5, 2.2, 4.2), new Vector3(0, 1.0, 0));
+            } else {
+                controller.look(new Vector3(11.0, 7.5, 14.5), new Vector3(0, 5.2, 0));
+            }
+        }
+    }
+
+    // --- Wire Interactive HUD Controls ---
+    const preset_container = element("preset-buttons");
+    const mode_container = element("mode-buttons");
+    const leaves_container = element("leaves-buttons");
+    const lod_container = element("lod-buttons");
+    const seed_input = /** @type {HTMLInputElement} */ (element("seed-input"));
+    const seed_random_btn = element("seed-random-btn");
+
+    function format_preset_label(preset) {
+        return preset.charAt(0).toUpperCase() + preset.slice(1);
+    }
+
+    for (const preset of FOLIAGE_PLAYGROUND_PRESETS) {
+        const btn = document.createElement("button");
+        btn.textContent = format_preset_label(preset);
+        btn.dataset.preset = preset;
+        if (preset === world.state.preset) {
+            btn.classList.add("active");
+        }
+        btn.addEventListener("click", () => {
+            for (const child of preset_container.querySelectorAll("button")) {
+                child.classList.toggle("active", child === btn);
+            }
+            world.rebuildTrees({ preset });
+            if (world.state.mode === "specimen") {
+                frame_camera_for_selection();
+            }
+        });
+        preset_container.appendChild(btn);
+    }
+
+    for (const btn of mode_container.querySelectorAll("button")) {
+        btn.addEventListener("click", () => {
+            const mode = /** @type {"specimen"|"grove"} */ (btn.dataset.mode);
+            for (const b of mode_container.querySelectorAll("button")) {
+                b.classList.toggle("active", b === btn);
+            }
+            world.rebuildTrees({ mode });
+            frame_camera_for_selection();
+        });
+    }
+
+    for (const btn of leaves_container.querySelectorAll("button")) {
+        btn.addEventListener("click", () => {
+            const showLeaves = btn.dataset.leaves === "true";
+            for (const b of leaves_container.querySelectorAll("button")) {
+                b.classList.toggle("active", b === btn);
+            }
+            world.rebuildTrees({ showLeaves });
+        });
+    }
+
+    for (const btn of lod_container.querySelectorAll("button")) {
+        btn.addEventListener("click", () => {
+            const lod = Number(btn.dataset.lod) | 0;
+            for (const b of lod_container.querySelectorAll("button")) {
+                b.classList.toggle("active", b === btn);
+            }
+            world.rebuildTrees({ lod });
+        });
+    }
+
+    seed_input.addEventListener("change", () => {
+        const seed = Number(seed_input.value) | 0;
+        world.rebuildTrees({ seed });
+    });
+
+    seed_random_btn.addEventListener("click", () => {
+        const seed = Math.floor(Math.random() * 99999) + 1;
+        seed_input.value = String(seed);
+        world.rebuildTrees({ seed });
+    });
+
+    function bind_slider(slider_id, val_id, unit_suffix, on_change) {
+        const slider = /** @type {HTMLInputElement} */ (element(slider_id));
+        const label = element(val_id);
+        slider.addEventListener("input", () => {
+            const v = Number(slider.value);
+            label.textContent = `${v}${unit_suffix}`;
+            on_change(v);
+        });
+    }
+
+    bind_slider("slider-wind-speed", "val-wind-speed", " m/s", (windSpeed) => {
+        world.setWind({ windSpeed });
+    });
+
+    bind_slider("slider-gust-strength", "val-gust-strength", " m/s", (gustStrength) => {
+        world.setWind({ gustStrength });
+    });
+
+    bind_slider("slider-gust-period", "val-gust-period", " s", (gustPeriod) => {
+        world.setWind({ gustPeriod });
+    });
+
+    bind_slider("slider-wind-heading", "val-wind-heading", "°", (headingDeg) => {
+        world.setWind({ headingDeg });
+    });
+
+    bind_slider("slider-wind-weight", "val-wind-weight", "", (windWeight) => {
+        element("val-wind-weight").textContent = windWeight.toFixed(2);
+        world.setWind({ windWeight });
+    });
+
+    element("btn-trigger-gust").addEventListener("click", () => {
+        world.triggerLocalGust();
+    });
+
+    Object.assign(globalThis, {
+        graphics,
+        scene,
+        world,
+        camera,
+        controller,
+    });
+
+    // --- Start WebGPU Device ---
+    graphics.on.contextFailed.add((failure) =>
+        show_message(
+            "There will be no rendering.\n\n" +
+                failure.message +
+                "\n\nThe page needs WebGPU with subgroups and immediate data, over http://localhost."
+        )
+    );
+
+    try {
+        await graphics.start();
+    } catch (e) {
+        console.error(e);
+        return;
+    }
+
+    const renderer = graphics.renderer;
+    globalThis.renderer = renderer;
+
+    renderer.feature_automatic_exposure_enabled = false;
+    renderer.exposure_compensation = 0;
+
+    /** @type {(() => void)|null} */
+    let stop_loop = null;
+
+    renderer.graphics.device.lost?.then((info) => {
+        stop_loop?.();
+        show_message("The GPU device was lost.\n\n" + (info?.message ?? ""));
+    });
+
+    // --- Main Simulation & Render Loop ---
+    const el_fps = element("stat-fps");
+    const el_trees = element("stat-trees");
+    const el_rigs = element("stat-rigs");
+    const el_joints = element("stat-joints");
+    const el_tris = element("stat-tris");
+    const el_gust = element("stat-gust");
+
+    const frame_rate = new FrameRateMeter();
+    let frame_index = 0;
+
+    function frame(raw_dt) {
+        frame_rate.add(raw_dt);
+        const dt = Math.min(raw_dt, MAX_SIMULATION_STEP);
+
+        const [width, height] = view_size();
+        if (width !== graphics.viewport.size.x || height !== graphics.viewport.size.y) {
+            graphics.viewport.size.set(width, height);
+        }
+
+        controller.update();
+        world.step(dt);
+        graphics.render(dt);
+        frame_index++;
+
+        const stats = world.getStats();
+        el_fps.textContent = frame_rate.fps.toFixed(0);
+        el_trees.textContent = String(stats.treeCount);
+        el_rigs.textContent = String(stats.activeRigCount);
+        el_joints.textContent = stats.totalJoints.toLocaleString();
+        el_tris.textContent = stats.totalTriangles.toLocaleString();
+        el_gust.textContent = stats.gustActive ? "Active (Sweeping)" : "Idle";
+    }
+
+    function guarded_frame(dt) {
+        try {
+            frame(dt);
+        } catch (e) {
+            stop_loop?.();
+            console.error(e);
+            show_message("The frame failed and the loop has stopped.\n\n" + e.message);
+        }
+    }
+
+    if (new URLSearchParams(location.search).has("debug")) {
+        globalThis.__step = (n = 1, dt = 1 / 60) => {
+            for (let i = 0; i < n; i++) {
+                guarded_frame(dt);
+            }
+            return frame_index;
+        };
+        return;
+    }
+
+    stop_loop = create_frame_loop((dt) => guarded_frame(dt));
+}
+
+main().catch((e) => {
+    console.error(e);
+    show_message("The foliage playground failed to start — see the console.\n\n" + e.message);
+});

package/src/shade/renderer/fluid/GPUFluidCascade.d.ts

@@ -143,7 +143,7 @@ export class GPUFluidCascade {
      * @param {*} _resources
      * @param {{encoder: ShadeGPUCommandContext}} context
      */
-    static "__#264@#execute_restrict"(record: object, _resources: any, context: {
+    static "__#266@#execute_restrict"(record: object, _resources: any, context: {
         encoder: ShadeGPUCommandContext;
     }): void;
     /**
@@ -151,7 +151,7 @@ export class GPUFluidCascade {
      * @param {*} _resources
      * @param {{encoder: ShadeGPUCommandContext}} context
      */
-    static "__#264@#execute_fill"(record: object, _resources: any, context: {
+    static "__#266@#execute_fill"(record: object, _resources: any, context: {
         encoder: ShadeGPUCommandContext;
     }): void;
     /**
@@ -159,7 +159,7 @@ export class GPUFluidCascade {
      * @param {import("../../../engine/graphics/render/frame_graph/FramePassResources.js").FramePassResources} resources
      * @param {{encoder: ShadeGPUCommandContext}} context
      */
-    static "__#264@#execute"(record: object, resources: import("../../../engine/graphics/render/frame_graph/FramePassResources.js").FramePassResources, context: {
+    static "__#266@#execute"(record: object, resources: import("../../../engine/graphics/render/frame_graph/FramePassResources.js").FramePassResources, context: {
         encoder: ShadeGPUCommandContext;
     }): void;
     /**

package/src/shade/renderer/fluid/GPUFluidCascadeStack.d.ts

@@ -63,7 +63,7 @@ export class GPUFluidCascadeStack {
      * @param {*} _resources
      * @param {{encoder: import("../../device/ShadeGPUCommandContext.js").ShadeGPUCommandContext}} context
      */
-    static "__#266@#execute_publish"(pass: object, _resources: any, context: {
+    static "__#268@#execute_publish"(pass: object, _resources: any, context: {
         encoder: import("../../device/ShadeGPUCommandContext.js").ShadeGPUCommandContext;
     }): void;
     /**

package/src/shade/renderer/fluid/forcing/GPUFluidForcing.d.ts

@@ -90,19 +90,19 @@ export class GPUFluidForcing {
      * @param {number} clear_size bytes cleared from 0 when the pool reuses the buffer
      * @returns {BufferResourceDescriptor}
      */
-    static "__#267@#descriptor"(kept: BufferResourceDescriptor[], role: number, size: number, usage: number, clear_size: number): BufferResourceDescriptor;
+    static "__#269@#descriptor"(kept: BufferResourceDescriptor[], role: number, size: number, usage: number, clear_size: number): BufferResourceDescriptor;
     /**
      * @param {object} record
      * @param {FramePassResources} resources
      * @param {{encoder: ShadeGPUCommandContext}} context
      */
-    static "__#267@#execute_extract"(record: object, resources: FramePassResources, context: {
+    static "__#269@#execute_extract"(record: object, resources: FramePassResources, context: {
         encoder: ShadeGPUCommandContext;
     }): void;
-    static "__#267@#execute_clear"(record: any, _resources: any, context: any): void;
-    static "__#267@#execute_query"(record: any, resources: any, context: any): void;
-    static "__#267@#execute_command"(record: any, resources: any, context: any): void;
-    static "__#267@#execute_apply"(record: any, resources: any, context: any): void;
+    static "__#269@#execute_clear"(record: any, _resources: any, context: any): void;
+    static "__#269@#execute_query"(record: any, resources: any, context: any): void;
+    static "__#269@#execute_command"(record: any, resources: any, context: any): void;
+    static "__#269@#execute_apply"(record: any, resources: any, context: any): void;
     /**
      * @param {object} options
      * @param {GPUDevice} options.device

package/src/shade/renderer/fluid/pressure/GPUFluidPressureSolve.d.ts

@@ -41,7 +41,7 @@ export class GPUFluidPressureSolve {
      * @param {*} _resources
      * @param {{encoder: ShadeGPUCommandContext}} context
      */
-    static "__#263@#execute"(data: {
+    static "__#265@#execute"(data: {
         solve: GPUFluidPressureSolve;
         arm: number;
         count: number;

package/src/shade/renderer/fluid/query/GPUFluidQueries.d.ts

@@ -49,7 +49,7 @@ export class GPUFluidQueries {
      * @param {import("../../../../engine/graphics/render/frame_graph/FramePassResources.js").FramePassResources} resources
      * @param {{encoder: import("../../../device/ShadeGPUCommandContext.js").ShadeGPUCommandContext}} context
      */
-    static "__#268@#execute"(pass: object, resources: import("../../../../engine/graphics/render/frame_graph/FramePassResources.js").FramePassResources, context: {
+    static "__#270@#execute"(pass: object, resources: import("../../../../engine/graphics/render/frame_graph/FramePassResources.js").FramePassResources, context: {
         encoder: import("../../../device/ShadeGPUCommandContext.js").ShadeGPUCommandContext;
     }): void;
     /**

package/src/shade/renderer/geometry/sdf/GPUGeometrySDFManager.js

@@ -65,7 +65,7 @@ export class GPUGeometrySDFManager {
 
         this.#atlas = new GPUTileAtlas3D({
             device,
-            format: "r32float",
+            formats: ["r32float"],
             // a cube: the build and every reader take one resolution for all three axes
             content_size: [DEFAULT_MESH_RESOLUTION, DEFAULT_MESH_RESOLUTION, DEFAULT_MESH_RESOLUTION],
             border: 0,