@woosh/meep-engine 3.68.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 "__#500@#refresh_masks"(fluid: FluidComponent): void;
+    static "__#504@#refresh_masks"(fluid: FluidComponent): void;
     /**
      * @param {FluidComponent} fluid
      */
-    static "__#500@#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 "__#500@#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 "__#500@#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/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":""}

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

@@ -0,0 +1,258 @@
+import Vector3 from "../../../core/geom/Vector3.js";
+import { DEG_TO_RAD } from "../../../core/math/DEG_TO_RAD.js";
+import { Entity } from "../../../engine/ecs/Entity.js";
+import { EntityComponentDataset } from "../../../engine/ecs/EntityComponentDataset.js";
+import { EntityManager } from "../../../engine/ecs/EntityManager.js";
+import { t64_announce_change } from "../../../engine/ecs/transform/t64_announce_change.js";
+import { Transform64 } from "../../../engine/ecs/transform/Transform64.js";
+import Trail3D from "../../../engine/graphics/ecs/trail3d/Trail3D.js";
+import { GraphicsEngine } from "../../../engine/graphics3/GraphicsEngine.js";
+import { Trail3DSystem } from "../../../engine/graphics3/Trail3DSystem.js";
+import { OrbitalCameraController } from "../../renderer/camera/orbital/OrbitalCameraController.js";
+import { create_frame_loop } from "../../renderer/create_frame_loop.js";
+import { Scene } from "../../renderer/scene/Scene.js";
+import { ShadeTransparencyMode } from "../../renderer/ShadeTransparencyMode.js";
+
+/**
+ * A field of trails on figures-of-eight, simulated in compute and extruded in the vertex stage by
+ * `Trail3DSystem`, drawn through AVBOIT.
+ *
+ * Query: `n` trails (64), `age` maxAge in seconds (2), `radial` (8, or a list such as
+ * `4,8,16` taken in turn), `width` (0.08), `debug` to drive frames by hand through `__step(n, dt)`
+ * instead of the frame loop.
+ */
+
+const query = new URLSearchParams(location.search);
+
+const number = (name, fallback) => {
+    const value = Number(query.get(name));
+
+    return query.has(name) && Number.isFinite(value) ? value : fallback;
+};
+
+const COUNT = Math.max(1, Math.floor(number("n", 64)));
+const MAX_AGE = number("age", 2);
+/** Radial segments, one value or a comma list the trails take in turn: each distinct value is its own draw. */
+const RADIALS = (query.get("radial") ?? "8").split(",").map(v => Math.max(3, Math.floor(Number(v) || 8)));
+const WIDTH = number("width", 0.08);
+
+/** Trails per row of the field. */
+const ROW = Math.ceil(Math.sqrt(COUNT));
+
+/** Spacing of the field. */
+const SPACING = 3;
+
+const element = id => document.getElementById(id);
+
+const view_size = () => [Math.max(1, window.innerWidth), Math.max(1, window.innerHeight)];
+
+/**
+ * Where trail `i` is at time `t`: a figure-of-eight round its own place in the field, each at its own
+ * phase, rising and falling.
+ *
+ * @param {number} i
+ * @param {number} t
+ * @param {number[]} out
+ */
+function place(i, t, out) {
+    const column = i % ROW;
+    const row = Math.floor(i / ROW);
+
+    const phase = i * 0.6180339 * Math.PI * 2;
+    const a = phase + t * 1.3;
+
+    out[0] = (column - (ROW - 1) * 0.5) * SPACING + Math.sin(a) * 1.2;
+    out[1] = 1.5 + Math.sin(a * 2 + phase) * 0.5;
+    out[2] = (row - (ROW - 1) * 0.5) * SPACING + Math.sin(a * 2) * 0.8;
+}
+
+/**
+ * A colour per trail, bright and linear.
+ *
+ * @param {number} i
+ * @returns {number[]}
+ */
+function tint(i) {
+    const h = (i * 0.137) % 1;
+    const k = n => (n + h * 6) % 6;
+    const f = n => 1 - Math.max(0, Math.min(k(n), 4 - k(n), 1));
+
+    return [f(5) * 2, f(3) * 2, f(1) * 2];
+}
+
+async function main() {
+    const graphics = new GraphicsEngine();
+    const scene = new Scene();
+
+    graphics.set_scene(scene);
+
+    element("viewport").appendChild(graphics.viewport.el);
+
+    const [width, height] = view_size();
+
+    graphics.viewport.size.set(width, height);
+
+    const dataset = new EntityComponentDataset();
+    const entities = new EntityManager();
+
+    const system = new Trail3DSystem(graphics, scene);
+
+    entities.addSystem(system);
+    entities.attachDataset(dataset);
+
+    await new Promise((resolve, reject) => entities.startup(resolve, reject));
+
+    const transforms = [];
+    const position = [0, 0, 0];
+
+    for (let i = 0; i < COUNT; i++) {
+        const trail = new Trail3D();
+
+        trail.maxAge = MAX_AGE;
+        trail.width = WIDTH;
+        trail.radialSegments = RADIALS[i % RADIALS.length];
+
+        const [r, g, b] = tint(i);
+
+        trail.color.set(r, g, b, 0.9);
+
+        const transform = new Transform64();
+
+        place(i, 0, position);
+        transform.setTranslation(position[0], position[1], position[2]);
+        transform.updateMatrix();
+
+        const entity = new Entity().add(transform).add(trail).build(dataset);
+
+        transforms.push({ entity, transform });
+    }
+
+    const camera = graphics.camera.camera;
+    const extent = ROW * SPACING;
+
+    camera.near = 0.05;
+    camera.far = 1000;
+    camera.fov = 50 * DEG_TO_RAD;
+
+    const controller = new OrbitalCameraController(camera, document.body);
+
+    controller.look(new Vector3(0, extent * 0.55 + 4, extent * 0.75 + 6), new Vector3(0, 1.5, 0));
+
+    graphics.on.contextFailed.add(failure => show_message("There will be no rendering.\n\n" + failure.message));
+
+    try {
+        await graphics.start();
+    } catch (e) {
+        console.error(e);
+        return;
+    }
+
+    const renderer = graphics.renderer;
+
+    /** What the device reported on its own: validation failures and the like. */
+    const gpu_errors = [];
+
+    renderer.graphics.device.addEventListener("uncapturederror", event => {
+        gpu_errors.push(event.error.message);
+        console.error(event.error.message);
+    });
+
+    renderer.transparency_mode = ShadeTransparencyMode.AVBOIT;
+    renderer.feature_automatic_exposure_enabled = false;
+    renderer.exposure_compensation = 0;
+
+    let time = 0;
+    let frame_index = 0;
+
+    /** Frames the renderer drew: none while its pipelines compile. */
+    let drawn = 0;
+
+    /** CPU milliseconds of the last frames: the tick and the render call. */
+    const cpu_ms = [];
+
+    function frame(dt) {
+        const [w, h] = view_size();
+
+        if (w !== graphics.viewport.size.x || h !== graphics.viewport.size.y) {
+            graphics.viewport.size.set(w, h);
+        }
+
+        time += dt;
+
+        for (let i = 0; i < transforms.length; i++) {
+            const { entity, transform } = transforms[i];
+
+            place(i, time, position);
+            transform.setTranslation(position[0], position[1], position[2]);
+            transform.updateMatrix();
+
+            t64_announce_change(dataset, entity);
+        }
+
+        controller.update();
+
+        const t0 = performance.now();
+
+        entities.update(dt);
+        if (graphics.render(dt)) {
+            drawn++;
+        }
+
+        cpu_ms.push(performance.now() - t0);
+
+        if (cpu_ms.length > 600) {
+            cpu_ms.shift();
+        }
+
+        frame_index++;
+
+        if (frame_index % 30 === 0) {
+            const sorted = [...cpu_ms].sort((a, b) => a - b);
+
+            element("hud").textContent = `${COUNT} trails · ${MAX_AGE} s · radial ${RADIALS.join(",")} · `
+                + `CPU ${sorted[Math.floor(sorted.length / 2)].toFixed(2)} ms/frame (median)`;
+        }
+    }
+
+    Object.assign(globalThis, {
+        graphics, renderer, scene, dataset, entities, system, camera, controller, Vector3,
+        __cpu_ms: cpu_ms,
+        __gpu_errors: gpu_errors,
+        __frame_index: () => frame_index,
+        __drawn: () => drawn,
+        __seek: t => {
+            time = t;
+        },
+    });
+
+    if (query.has("debug")) {
+        globalThis.__step = (n = 1, dt = 1 / 60) => {
+            for (let i = 0; i < n; i++) {
+                frame(dt);
+            }
+
+            return frame_index;
+        };
+
+        globalThis.__ready = true;
+
+        return;
+    }
+
+    globalThis.__ready = true;
+
+    create_frame_loop(dt => frame(Math.min(dt, 0.05)));
+}
+
+function show_message(text) {
+    const node = element("message");
+
+    if (node !== null) {
+        node.textContent = text;
+    }
+}
+
+main().catch(e => {
+    console.error(e);
+    show_message("The trails playground failed to start — see the console.\n\n" + e.message);
+});

package/src/shade/renderer/animation/animation_curve_write_keys.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Write a curve's keys into `out` at float index `at`, laid out as `ANIMATION_CURVE_KEYFRAME_STRUCT`, the
+ * form `chunk_animation_curve_evaluate_keys` reads them in.
+ *
+ * @param {Float32Array} out
+ * @param {number} at float index
+ * @param {import("../../../engine/animation/curve/AnimationCurve.js").AnimationCurve} curve
+ * @returns {number} the float index after the curve's keys
+ */
+export function animation_curve_write_keys(out: Float32Array, at: number, curve: import("../../../engine/animation/curve/AnimationCurve.js").AnimationCurve): number;
+/**
+ * Floats of one keyframe in an `ANIMATION_CURVE_KEYFRAME_STRUCT` array: time, value, in tangent, out
+ * tangent.
+ *
+ * @type {number}
+ */
+export const ANIMATION_CURVE_KEYFRAME_FLOATS: number;
+//# sourceMappingURL=animation_curve_write_keys.d.ts.map

package/src/shade/renderer/animation/animation_curve_write_keys.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation_curve_write_keys.d.ts","sourceRoot":"","sources":["../../../../../src/shade/renderer/animation/animation_curve_write_keys.js"],"names":[],"mappings":"AAQA;;;;;;;;GAQG;AACH,gDALW,YAAY,MACZ,MAAM,SACN,OAAO,mDAAmD,EAAE,cAAc,GACxE,MAAM,CAkBlB;AAjCD;;;;;GAKG;AACH,8CAFU,MAAM,CAEiC"}

package/src/shade/renderer/animation/animation_curve_write_keys.js

@@ -0,0 +1,34 @@
+/**
+ * Floats of one keyframe in an `ANIMATION_CURVE_KEYFRAME_STRUCT` array: time, value, in tangent, out
+ * tangent.
+ *
+ * @type {number}
+ */
+export const ANIMATION_CURVE_KEYFRAME_FLOATS = 4;
+
+/**
+ * Write a curve's keys into `out` at float index `at`, laid out as `ANIMATION_CURVE_KEYFRAME_STRUCT`, the
+ * form `chunk_animation_curve_evaluate_keys` reads them in.
+ *
+ * @param {Float32Array} out
+ * @param {number} at float index
+ * @param {import("../../../engine/animation/curve/AnimationCurve.js").AnimationCurve} curve
+ * @returns {number} the float index after the curve's keys
+ */
+export function animation_curve_write_keys(out, at, curve) {
+    const keys = curve.keys;
+    const count = keys.length;
+
+    for (let i = 0; i < count; i++) {
+        const key = keys[i];
+
+        out[at] = key.time;
+        out[at + 1] = key.value;
+        out[at + 2] = key.inTangent;
+        out[at + 3] = key.outTangent;
+
+        at += ANIMATION_CURVE_KEYFRAME_FLOATS;
+    }
+
+    return at;
+}

package/src/shade/renderer/deferred/tonemap/ColorGrade.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorGrade.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/ColorGrade.js"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;GAeG;AACH,8CA2BG;AAEH;;;GAGG;AACH,wCAFU,MAAM,CAE4B;AAE5C;;;GAGG;AACH,qCAFU,MAAM,CAEwB;AAExC;;;GAGG;AACH;IACI;;;;OAIG;IACH,qBAFU,OAAO,CAEoB;IAErC;;;;OAIG;IACH,mBAFU,OAAO,CAEkB;IAEnC;;;;OAIG;IACH,gBAFU,OAAO,CAEe;IAEhC;;;OAGG;IACH,eAFU,OAAO,CAEc;IAE/B;;;;OAIG;IACH,iBAFU,OAAO,CAEgB;CACpC;AAwED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH;IACI;;;OAGG;IACH,mBAFU,MAAM,CAEsC;IAEtD;;;OAGG;IACH,YAFU,MAAM,CAEwB;IAExC;;;;OAIG;IACH,iBAFU,cAAc,CAEM;IAE9B;;;OAGG;IACH,kBAFU,cAAc,CAEO;IAE/B;;;OAGG;IACH,mBAFU,cAAc,CAEQ;IAEhC;;;OAGG;IACH,qBAFU,cAAc,CAEU;IAElC;;;OAGG;IACH,aAFU,MAAM,CAEG;IAEnB;;;OAGG;IACH,gBAFU,MAAM,CAEK;IAErB;;;OAGG;IACH,gBAFU,MAAM,CAEG;IAEnB;;;;OAIG;IACH,oBAFU,cAAc,CAES;IAEjC;;;;OAIG;IACH,yBAFU,cAAc,CAEc;IAEtC;;;;OAIG;IACH,wBAFU,cAAc,CAEa;IAErC;;;;;OAKG;IACH,0BAFU,cAAc,CAEe;IAEvC;;;;;OAKG;IACH,8BAFU,cAAc,CAEmB;IAE3C;;;;;OAKG;IACH,gCAFU,cAAc,CAEqB;IAE7C;;;;;OAKG;IACH,+BAFU,cAAc,CAEoB;IAE5C;;;;OAIG;IACH,wBAFU,cAAc,CAEa;IAErC;;;;OAIG;IACH,0BAFU,cAAc,CAEe;IAEvC;;;;OAIG;IACH,yBAFU,cAAc,CAEc;IAEtC;;;;OAIG;IACH,wBAFU,cAAc,CAEa;IAarC;;;;;;;OAOG;IACH,QAFa,YAAY,CAgFxB;;CACJ;6BAtb4B,mCAAmC;wBAHxC,kCAAkC;+BAC3B,sDAAsD"}
+{"version":3,"file":"ColorGrade.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/ColorGrade.js"],"names":[],"mappings":"AAQA;;;;;;;;;;;;;;;GAeG;AACH,8CA2BG;AAEH;;;GAGG;AACH,wCAFU,MAAM,CAE4B;AAE5C;;;GAGG;AACH,qCAFU,MAAM,CAEsD;AAEtE;;;GAGG;AACH;IACI;;;;OAIG;IACH,qBAFU,OAAO,CAEoB;IAErC;;;;OAIG;IACH,mBAFU,OAAO,CAEkB;IAEnC;;;;OAIG;IACH,gBAFU,OAAO,CAEe;IAEhC;;;OAGG;IACH,eAFU,OAAO,CAEc;IAE/B;;;;OAIG;IACH,iBAFU,OAAO,CAEgB;CACpC;AAgDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH;IACI;;;OAGG;IACH,mBAFU,MAAM,CAEsC;IAEtD;;;OAGG;IACH,YAFU,MAAM,CAEwB;IAExC;;;;OAIG;IACH,iBAFU,cAAc,CAEM;IAE9B;;;OAGG;IACH,kBAFU,cAAc,CAEO;IAE/B;;;OAGG;IACH,mBAFU,cAAc,CAEQ;IAEhC;;;OAGG;IACH,qBAFU,cAAc,CAEU;IAElC;;;OAGG;IACH,aAFU,MAAM,CAEG;IAEnB;;;OAGG;IACH,gBAFU,MAAM,CAEK;IAErB;;;OAGG;IACH,gBAFU,MAAM,CAEG;IAEnB;;;;OAIG;IACH,oBAFU,cAAc,CAES;IAEjC;;;;OAIG;IACH,yBAFU,cAAc,CAEc;IAEtC;;;;OAIG;IACH,wBAFU,cAAc,CAEa;IAErC;;;;;OAKG;IACH,0BAFU,cAAc,CAEe;IAEvC;;;;;OAKG;IACH,8BAFU,cAAc,CAEmB;IAE3C;;;;;OAKG;IACH,gCAFU,cAAc,CAEqB;IAE7C;;;;;OAKG;IACH,+BAFU,cAAc,CAEoB;IAE5C;;;;OAIG;IACH,wBAFU,cAAc,CAEa;IAErC;;;;OAIG;IACH,0BAFU,cAAc,CAEe;IAEvC;;;;OAIG;IACH,yBAFU,cAAc,CAEc;IAEtC;;;;OAIG;IACH,wBAFU,cAAc,CAEa;IAarC;;;;;;;OAOG;IACH,QAFa,YAAY,CAgFxB;;CACJ;6BA9Z4B,mCAAmC;wBAJxC,kCAAkC;+BAC3B,sDAAsD"}