@woosh/meep-engine 3.67.0 → 3.69.0

package/src/engine/physics/fluid/ecs/FluidObstacleSystem.d.ts

@@ -9,7 +9,8 @@
  * {@link FluidComponent}: the collider's shape — posed rigidly at the
  * transform's position/rotation via {@link PosedShape3D} — is sampled at the
  * centre of every fluid cell inside its world AABB, and cells whose signed
- * distance is `<= obstacle.inflation` become solid. The fluid then treats
+ * distance is `<= obstacle.inflation` become solid. A porous obstacle (`FluidObstacle.drag` above 0)
+ * is the GPU fluid's alone and is left out here. The fluid then treats
  * those cells exactly like hand-authored walls: faces pinned, pressure
  * Neumann, traces clipped.
  *
@@ -66,11 +67,11 @@ export class FluidObstacleSystem extends System<any> {
     /**
      * @param {FluidComponent} fluid
      */
-    static "__#497@#refresh_masks"(fluid: FluidComponent): void;
+    static "__#504@#refresh_masks"(fluid: FluidComponent): void;
     /**
      * @param {FluidComponent} fluid
      */
-    static "__#497@#clear_field"(fluid: FluidComponent): void;
+    static "__#504@#clear_field"(fluid: FluidComponent): void;
     /**
      * Mark every cell of `fluid` whose centre lies within `inflation` of the
      * posed shape as solid. Iteration is clipped to the shape's world AABB
@@ -82,7 +83,7 @@ export class FluidObstacleSystem extends System<any> {
      * @param {number} inflation       world-units SDF threshold
      * @param {Float64Array} point     length-3 scratch
      */
-    static "__#497@#voxelize"(fluid: FluidComponent, posed: PosedShape3D, aabb: Float64Array, inflation: number, point: Float64Array): void;
+    static "__#504@#voxelize"(fluid: FluidComponent, posed: PosedShape3D, aabb: Float64Array, inflation: number, point: Float64Array): void;
     /**
      * Write the obstacle's translation velocity onto every face of every cell
      * it voxelized — the moving-wall boundary condition. Runs AFTER the mask
@@ -102,7 +103,7 @@ export class FluidObstacleSystem extends System<any> {
      * @param {number} wvy
      * @param {number} wvz
      */
-    static "__#497@#stamp_wall_velocity"(fluid: FluidComponent, posed: PosedShape3D, aabb: Float64Array, inflation: number, point: Float64Array, wvx: number, wvy: number, wvz: number): void;
+    static "__#504@#stamp_wall_velocity"(fluid: FluidComponent, posed: PosedShape3D, aabb: Float64Array, inflation: number, point: Float64Array, wvx: number, wvy: number, wvz: number): void;
     constructor();
     dependencies: (typeof FluidObstacle)[];
     components_used: (ResourceAccessSpecification<typeof Transform64> | ResourceAccessSpecification<typeof FluidObstacle> | ResourceAccessSpecification<typeof Collider> | ResourceAccessSpecification<typeof RigidBody> | ResourceAccessSpecification<typeof FluidComponent>)[];

package/src/engine/physics/fluid/ecs/FluidObstacleSystem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FluidObstacleSystem.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/ecs/FluidObstacleSystem.js"],"names":[],"mappings":"AAUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AACH;IAuHI;;OAEG;IACH,sCAFW,cAAc,QAIxB;IAED;;OAEG;IACH,oCAFW,cAAc,QAOxB;IAED;;;;;;;;;;OAUG;IACH,iCANW,cAAc,SACd,YAAY,QACZ,YAAY,aACZ,MAAM,SACN,YAAY,QAiDtB;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,4CATW,cAAc,SACd,YAAY,QACZ,YAAY,aACZ,MAAM,SACN,YAAY,OACZ,MAAM,OACN,MAAM,OACN,MAAM,QAqEhB;;IAxRD,uCAA+B;IAE/B,6QAOE;;CAgRL;uBAlWsB,wBAAwB;8BAKjB,oBAAoB;4BAJtB,uCAAuC;4CAFvB,uDAAuD;yBAG1E,uBAAuB;0BACtB,wBAAwB;+BACnB,qBAAqB;6BAPvB,gDAAgD"}
+{"version":3,"file":"FluidObstacleSystem.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/ecs/FluidObstacleSystem.js"],"names":[],"mappings":"AAUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgEG;AACH;IAiII;;OAEG;IACH,sCAFW,cAAc,QAIxB;IAED;;OAEG;IACH,oCAFW,cAAc,QAOxB;IAED;;;;;;;;;;OAUG;IACH,iCANW,cAAc,SACd,YAAY,QACZ,YAAY,aACZ,MAAM,SACN,YAAY,QAiDtB;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,4CATW,cAAc,SACd,YAAY,QACZ,YAAY,aACZ,MAAM,SACN,YAAY,OACZ,MAAM,OACN,MAAM,OACN,MAAM,QAqEhB;;IAlSD,uCAA+B;IAE/B,6QAOE;;CA0RL;uBA7WsB,wBAAwB;8BAKjB,oBAAoB;4BAJtB,uCAAuC;4CAFvB,uDAAuD;yBAG1E,uBAAuB;0BACtB,wBAAwB;+BACnB,qBAAqB;6BAPvB,gDAAgD"}

package/src/engine/physics/fluid/ecs/FluidObstacleSystem.js

@@ -19,7 +19,8 @@ import { FluidObstacle } from "./FluidObstacle.js";
  * {@link FluidComponent}: the collider's shape — posed rigidly at the
  * transform's position/rotation via {@link PosedShape3D} — is sampled at the
  * centre of every fluid cell inside its world AABB, and cells whose signed
- * distance is `<= obstacle.inflation` become solid. The fluid then treats
+ * distance is `<= obstacle.inflation` become solid. A porous obstacle (`FluidObstacle.drag` above 0)
+ * is the GPU fluid's alone and is left out here. The fluid then treats
  * those cells exactly like hand-authored walls: faces pinned, pressure
  * Neumann, traces clipped.
  *
@@ -119,8 +120,10 @@ export class FluidObstacleSystem extends System {
         // With no obstacles the system must not touch any mask — fields with
         // hand-authored solids keep them.
         let obstacle_count = 0;
-        ecd.traverseEntities([FluidObstacle, Collider, RigidBody, Transform64], function () {
-            obstacle_count++;
+        ecd.traverseEntities([FluidObstacle, Collider, RigidBody, Transform64], function (obstacle) {
+            if (obstacle.drag === 0) {
+                obstacle_count++;
+            }
         });
         if (obstacle_count === 0) {
             return;
@@ -136,6 +139,10 @@ export class FluidObstacleSystem extends System {
         const point = this.#point;
 
         ecd.traverseEntities([FluidObstacle, Collider, RigidBody, Transform64], function (obstacle, collider, body, transform) {
+            if (obstacle.drag !== 0) {
+                return;
+            }
+
             posed.setup_components(
         collider.shape,
         transform.translation_x, transform.translation_y, transform.translation_z,
@@ -161,6 +168,10 @@ export class FluidObstacleSystem extends System {
         // (and pulls) the surrounding fluid. The source is the solver's own
         // linearVelocity, NOT a pose delta — teleports stamp nothing.
         ecd.traverseEntities([FluidObstacle, Collider, RigidBody, Transform64], function (obstacle, collider, body, transform) {
+            if (obstacle.drag !== 0) {
+                return;
+            }
+
             const lv = body.linearVelocity;
             const vx = lv[0];
             const vy = lv[1];

package/src/engine/physics/fluid/obstacle/FLUID_OBSTACLE_RECORD_STRUCT.d.ts

@@ -8,7 +8,7 @@
  * of rows; one with no record of its own (a mesh, a heightmap, a scaled wrapper) is one row, its
  * oriented box (`shape_record_pack_bounding_box`), until the SDF stage. A hull's planes are rows of a
  * plane table, `vec4<f32>` each in core's `(n, offset)` layout, from `shape_parameters.x` for
- * `shape_parameters.y` planes. 80 bytes.
+ * `shape_parameters.y` planes. 96 bytes.
  *
  * Written field by field in two halves: {@link fluid_obstacle_write_gpu_shape} when the collider's
  * shape changes, {@link fluid_obstacle_write_gpu_motion} every frame, so an obstacle whose inflation
@@ -25,6 +25,14 @@
  * `fluid_obstacle_record_signed_distance` and `fluid_obstacle_record_wall_velocity`
  * (`chunk_fluid_obstacle_record`) are those, with CPU twins.
  *
+ * ## Solid or porous
+ *
+ * A record whose `drag` is 0 is **solid**: the air in it moves with the wall, and the faces of its
+ * cells are pinned. One whose `drag` is above 0 is **porous**: the air passes through it and is
+ * slowed toward the wall's velocity by `drag · |u − v| · (u − v)` a second, `u` the air's velocity
+ * and `v` the wall's (`FluidObstacle.drag`). The solid is the limit of the porous as the drag grows
+ * without bound. A porous record has no inflation: what it slows is what its surface holds.
+ *
  * @type {WebGPUStruct}
  */
 export const FLUID_OBSTACLE_RECORD_STRUCT: WebGPUStruct;

package/src/engine/physics/fluid/obstacle/FLUID_OBSTACLE_RECORD_STRUCT.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FLUID_OBSTACLE_RECORD_STRUCT.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/obstacle/FLUID_OBSTACLE_RECORD_STRUCT.js"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,2CAFU,YAAY,CAmBI;6BAhDG,wDAAwD"}
+{"version":3,"file":"FLUID_OBSTACLE_RECORD_STRUCT.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/obstacle/FLUID_OBSTACLE_RECORD_STRUCT.js"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,2CAFU,YAAY,CAqBI;6BA1DG,wDAAwD"}

package/src/engine/physics/fluid/obstacle/FLUID_OBSTACLE_RECORD_STRUCT.js

@@ -11,7 +11,7 @@ import { WebGPUStruct } from "../../../../shade/renderer/shader/type/WebGPUStruc
  * of rows; one with no record of its own (a mesh, a heightmap, a scaled wrapper) is one row, its
  * oriented box (`shape_record_pack_bounding_box`), until the SDF stage. A hull's planes are rows of a
  * plane table, `vec4<f32>` each in core's `(n, offset)` layout, from `shape_parameters.x` for
- * `shape_parameters.y` planes. 80 bytes.
+ * `shape_parameters.y` planes. 96 bytes.
  *
  * Written field by field in two halves: {@link fluid_obstacle_write_gpu_shape} when the collider's
  * shape changes, {@link fluid_obstacle_write_gpu_motion} every frame, so an obstacle whose inflation
@@ -28,6 +28,14 @@ import { WebGPUStruct } from "../../../../shade/renderer/shader/type/WebGPUStruc
  * `fluid_obstacle_record_signed_distance` and `fluid_obstacle_record_wall_velocity`
  * (`chunk_fluid_obstacle_record`) are those, with CPU twins.
  *
+ * ## Solid or porous
+ *
+ * A record whose `drag` is 0 is **solid**: the air in it moves with the wall, and the faces of its
+ * cells are pinned. One whose `drag` is above 0 is **porous**: the air passes through it and is
+ * slowed toward the wall's velocity by `drag · |u − v| · (u − v)` a second, `u` the air's velocity
+ * and `v` the wall's (`FluidObstacle.drag`). The solid is the limit of the porous as the drag grows
+ * without bound. A porous record has no inflation: what it slows is what its surface holds.
+ *
  * @type {WebGPUStruct}
  */
 export const FLUID_OBSTACLE_RECORD_STRUCT = WebGPUStruct.from({
@@ -47,4 +55,6 @@ export const FLUID_OBSTACLE_RECORD_STRUCT = WebGPUStruct.from({
     angular_velocity: vec3f,
     /** The transforms row that poses the record; `NODE3D_SCENE_ID` (0) for the world. */
     node: u32,
+    /** `FluidObstacle.drag`, 1/m: 0 for a solid, above 0 for a porous obstacle's drag. */
+    drag: f32,
 }, "FluidObstacleRecord");

package/src/engine/physics/fluid/obstacle/fluid_obstacle_record_create.d.ts

@@ -8,6 +8,7 @@
  * @property {number} inflation metres
  * @property {Float32Array} angular_velocity `[x, y, z]`, world rad/s
  * @property {number} node the transforms row that poses the record
+ * @property {number} drag 1/m: 0 for a solid, above 0 for a porous obstacle's drag
  */
 /**
  * A staging record for one row of {@link FLUID_OBSTACLE_RECORD_STRUCT}: what
@@ -54,5 +55,9 @@ export type FluidObstacleRecord = {
      * the transforms row that poses the record
      */
     node: number;
+    /**
+     * 1/m: 0 for a solid, above 0 for a porous obstacle's drag
+     */
+    drag: number;
 };
 //# sourceMappingURL=fluid_obstacle_record_create.d.ts.map

package/src/engine/physics/fluid/obstacle/fluid_obstacle_record_create.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fluid_obstacle_record_create.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/obstacle/fluid_obstacle_record_create.js"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH;;;;;;;;;;GAUG;AACH,gDAFa,mBAAmB,CAa/B;;;;;sBAhCa,YAAY;;;;sBACZ,YAAY;;;;gBACZ,MAAM;;;;mBACN,YAAY;;;;qBACZ,YAAY;;;;eACZ,MAAM;;;;sBACN,YAAY;;;;UACZ,MAAM"}
+{"version":3,"file":"fluid_obstacle_record_create.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/obstacle/fluid_obstacle_record_create.js"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH;;;;;;;;;;GAUG;AACH,gDAFa,mBAAmB,CAc/B;;;;;sBAlCa,YAAY;;;;sBACZ,YAAY;;;;gBACZ,MAAM;;;;mBACN,YAAY;;;;qBACZ,YAAY;;;;eACZ,MAAM;;;;sBACN,YAAY;;;;UACZ,MAAM;;;;UACN,MAAM"}

package/src/engine/physics/fluid/obstacle/fluid_obstacle_record_create.js

@@ -8,6 +8,7 @@
  * @property {number} inflation metres
  * @property {Float32Array} angular_velocity `[x, y, z]`, world rad/s
  * @property {number} node the transforms row that poses the record
+ * @property {number} drag 1/m: 0 for a solid, above 0 for a porous obstacle's drag
  */
 
 /**
@@ -31,5 +32,6 @@ export function fluid_obstacle_record_create() {
         inflation: 0,
         angular_velocity: new Float32Array(3),
         node: 0,
+        drag: 0,
     };
 }

package/src/engine/physics/fluid/obstacle/fluid_obstacle_write_gpu_record.d.ts

@@ -39,8 +39,8 @@ export function fluid_obstacle_record_plane_count(record: FluidObstacleRecord):
  */
 export function fluid_obstacle_write_gpu_shape(record: FluidObstacleRecord, planes: Float32Array, plane_index: number, shape: AbstractShape3D, element: number): number;
 /**
- * Write the motion half of a record: the obstacle's inflation and its body's linear and angular
- * velocity, comparing each as it is assigned. Every record of a collider's run takes the same.
+ * Write the motion half of a record: the obstacle's inflation and drag and its body's linear and
+ * angular velocity, comparing each as it is assigned. Every record of a collider's run takes the same.
  * Allocates nothing.
  *
  * @param {FluidObstacleRecord} record
@@ -64,7 +64,8 @@ export function fluid_obstacle_write_gpu_motion(record: FluidObstacleRecord, obs
  * - {@link fluid_obstacle_write_gpu_shape}: the shape record, its pose within the collider and a
  *   hull's planes. A collider's shape is shared and never mutated, so it changes only when the
  *   collider is handed another shape object, which is when a caller writes this half, and on link;
- * - {@link fluid_obstacle_write_gpu_motion}: the inflation and the body's velocities, every frame.
+ * - {@link fluid_obstacle_write_gpu_motion}: the inflation, the drag and the body's velocities,
+ *   every frame.
  *
  * So an obstacle whose inflation and motion have not changed (a static wall, a sleeping body) writes
  * nothing, and its pose is its node's. A caller links a collider as

package/src/engine/physics/fluid/obstacle/fluid_obstacle_write_gpu_record.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fluid_obstacle_write_gpu_record.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/obstacle/fluid_obstacle_write_gpu_record.js"],"names":[],"mappings":"AAgEA;;;;;;GAMG;AACH,qEAFa,MAAM,CAUlB;AAED;;;;;GAKG;AACH,oEAFa,MAAM,CAclB;AAED;;;;;;GAMG;AACH,gFAFa,MAAM,CAOlB;AAED;;;;;;;;;;;;;;;GAeG;AACH,oFAPW,YAAY,eACZ,MAAM,mCAEN,MAAM,GACJ,MAAM,CA4FlB;AAED;;;;;;;;;GASG;AACH,wHAFa,OAAO,CAyCnB;AAhQD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH;;;GAGG;AACH,4CAFU,MAAM,CAE+B;AAE/C;;;GAGG;AACH,4CAFU,MAAM,CAE+B"}
+{"version":3,"file":"fluid_obstacle_write_gpu_record.d.ts","sourceRoot":"","sources":["../../../../../../src/engine/physics/fluid/obstacle/fluid_obstacle_write_gpu_record.js"],"names":[],"mappings":"AAiEA;;;;;;GAMG;AACH,qEAFa,MAAM,CAUlB;AAED;;;;;GAKG;AACH,oEAFa,MAAM,CAclB;AAED;;;;;;GAMG;AACH,gFAFa,MAAM,CAOlB;AAED;;;;;;;;;;;;;;;GAeG;AACH,oFAPW,YAAY,eACZ,MAAM,mCAEN,MAAM,GACJ,MAAM,CA4FlB;AAED;;;;;;;;;GASG;AACH,wHAFa,OAAO,CAgDnB;AAxQD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AAEH;;;GAGG;AACH,4CAFU,MAAM,CAE+B;AAE/C;;;GAGG;AACH,4CAFU,MAAM,CAE+B"}

package/src/engine/physics/fluid/obstacle/fluid_obstacle_write_gpu_record.js

@@ -28,7 +28,8 @@ import { shape_record_pack_bounding_box } from "../../../../core/geom/3d/shape/r
  * - {@link fluid_obstacle_write_gpu_shape}: the shape record, its pose within the collider and a
  *   hull's planes. A collider's shape is shared and never mutated, so it changes only when the
  *   collider is handed another shape object, which is when a caller writes this half, and on link;
- * - {@link fluid_obstacle_write_gpu_motion}: the inflation and the body's velocities, every frame.
+ * - {@link fluid_obstacle_write_gpu_motion}: the inflation, the drag and the body's velocities,
+ *   every frame.
  *
  * So an obstacle whose inflation and motion have not changed (a static wall, a sleeping body) writes
  * nothing, and its pose is its node's. A caller links a collider as
@@ -221,8 +222,8 @@ export function fluid_obstacle_write_gpu_shape(record, planes, plane_index, shap
 }
 
 /**
- * Write the motion half of a record: the obstacle's inflation and its body's linear and angular
- * velocity, comparing each as it is assigned. Every record of a collider's run takes the same.
+ * Write the motion half of a record: the obstacle's inflation and drag and its body's linear and
+ * angular velocity, comparing each as it is assigned. Every record of a collider's run takes the same.
  * Allocates nothing.
  *
  * @param {FluidObstacleRecord} record
@@ -240,6 +241,13 @@ export function fluid_obstacle_write_gpu_motion(record, obstacle, body) {
         changed = true;
     }
 
+    const drag = Math.fround(obstacle.drag);
+
+    if (record.drag !== drag) {
+        record.drag = drag;
+        changed = true;
+    }
+
     const linear = body.linearVelocity;
     const linear_velocity = record.linear_velocity;
 

package/src/shade/playground/probe_clipmap/index.html

@@ -89,6 +89,7 @@
         <span>Indirect light</span>
         <select id="indirect">
             <option value="ProbeClipmap" selected>Probe clipmap</option>
+            <option value="ScreenProbes">Screen probes — Lumen's gather over the clipmap's world</option>
             <option value="IBL">IBL</option>
         </select>
     </label>
@@ -124,6 +125,48 @@
 
     <hr>
 
+    <label>
+        <span>Screen probes</span>
+        <select id="screen_probe_debug_view">
+            <option value="None" selected>Debug: none</option>
+            <option value="IndirectDiffuse">Indirect diffuse — irradiance / π, before the material</option>
+            <option value="ProbePlacement">Probe placement — uniform green, adaptive red, uncovered blue</option>
+            <option value="TraceKinds">Trace kinds — screen red, bricks green, world probes blue</option>
+        </select>
+    </label>
+
+    <label>
+        <span>Downsample</span>
+        <select id="screen_probe_downsample">
+            <option value="2">1 probe / 2×2 pixels</option>
+            <option value="4">1 probe / 4×4 pixels</option>
+            <option value="8">1 probe / 8×8 pixels</option>
+            <option value="16" selected>1 probe / 16×16 pixels</option>
+            <option value="32">1 probe / 32×32 pixels</option>
+        </select>
+    </label>
+
+    <label>
+        <span>Octahedron</span>
+        <select id="screen_probe_octahedron">
+            <option value="4">4×4 rays a probe</option>
+            <option value="8" selected>8×8 rays a probe</option>
+            <option value="16">16×16 rays a probe</option>
+        </select>
+    </label>
+
+    <label>
+        <input type="checkbox" id="screen_probe_importance" checked>
+        <span>Importance sampling <span class="hint">— rays follow the BRDF and last frame's light</span></span>
+    </label>
+
+    <label>
+        <input type="checkbox" id="screen_probe_screen_traces" checked>
+        <span>Screen traces <span class="hint">— the depth buffer before the SDF bricks</span></span>
+    </label>
+
+    <hr>
+
     <label>
         <input type="checkbox" id="sun" checked>
         <span>Sun <span class="hint">— the directional light; L flips it</span></span>

package/src/shade/playground/probe_clipmap/main.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../../../src/shade/playground/probe_clipmap/main.js"],"names":[],"mappings":"AAyFA;;;;;GAKG;AACH,yBAFa,QAAQ,IAAI,CAAC,CA8UzB"}
+{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../../../src/shade/playground/probe_clipmap/main.js"],"names":[],"mappings":"AA0FA;;;;;GAKG;AACH,yBAFa,QAAQ,IAAI,CAAC,CA0WzB"}

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

@@ -12,6 +12,7 @@ import { OrbitalCameraController } from "../../renderer/camera/orbital/OrbitalCa
 import { PerspectiveCamera } from "../../renderer/camera/PerspectiveCamera.js";
 import { create_frame_loop } from "../../renderer/create_frame_loop.js";
 import { ProbeClipmapDebugView } from "../../renderer/global_illumination/probe_clipmap/debug/ProbeClipmapDebugView.js";
+import { ScreenProbeDebugView } from "../../renderer/global_illumination/screen_probe/ScreenProbeDebugView.js";
 import { make_sunlight } from "../../renderer/light/make_sunlight.js";
 import { PointLight } from "../../renderer/light/model/PointLight.js";
 import { place_light } from "../../renderer/light/place_light.js";
@@ -272,6 +273,34 @@ export async function start() {
         renderer.probe_clipmap.debug_view = ProbeClipmapDebugView[event.target.value];
     });
 
+    element('screen_probe_debug_view').addEventListener('change', event => {
+        renderer.screen_probes.debug_view = ScreenProbeDebugView[event.target.value];
+    });
+
+    element('screen_probe_downsample').addEventListener('change', event => {
+        renderer.screen_probes.downsample_factor = Number(event.target.value);
+    });
+
+    element('screen_probe_octahedron').addEventListener('change', event => {
+        renderer.screen_probes.octahedron_resolution = Number(event.target.value);
+    });
+
+    element('screen_probe_importance').addEventListener('change', event => {
+        renderer.screen_probes.importance_sampling = event.target.checked;
+    });
+
+    element('screen_probe_screen_traces').addEventListener('change', event => {
+        renderer.screen_probes.screen_traces = event.target.checked;
+    });
+
+    // ?mode=ScreenProbes starts the page in another mode, as the panel's select would set it
+    const mode = new URLSearchParams(location.search).get('mode');
+
+    if (mode !== null && ShadeIndirectLightingMode[mode] !== undefined) {
+        renderer.indirect_lighting_mode = ShadeIndirectLightingMode[mode];
+        element('indirect').value = mode;
+    }
+
     const taa_toggle = element('taa');
     const path_tracing_toggle = element('path_tracing');
 

package/src/shade/playground/trails/index.html

@@ -0,0 +1,50 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Trails</title>
+    <style>
+        :root {
+            color-scheme: dark;
+        }
+
+        html, body {
+            margin: 0;
+            height: 100%;
+            overflow: hidden;
+            background: #0b0d10;
+            color: #e4e6ea;
+            font: 13px system-ui, sans-serif;
+        }
+
+        #viewport {
+            position: fixed;
+            inset: 0;
+        }
+
+        #hud {
+            position: fixed;
+            left: 12px;
+            top: 10px;
+            padding: 6px 10px;
+            border-radius: 6px;
+            background: rgba(10, 12, 16, 0.7);
+            font-variant-numeric: tabular-nums;
+        }
+
+        #message {
+            position: fixed;
+            inset: 40% 10% auto 10%;
+            white-space: pre-wrap;
+            text-align: center;
+        }
+    </style>
+</head>
+<body tabindex="-1">
+<div id="viewport"></div>
+<div id="hud">starting…</div>
+<div id="message"></div>
+<script type="module" src="./main.js"></script>
+</body>
+</html>

package/src/shade/playground/trails/main.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=main.d.ts.map

package/src/shade/playground/trails/main.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../../../src/shade/playground/trails/main.js"],"names":[],"mappings":""}