@woosh/meep-engine 3.11.3 → 3.13.0

package/src/shade/renderer/dynamic/shader_dynamic_mesh.js

@@ -1,170 +1,177 @@
-import { ColorTargetState } from "../../descriptor/pipeline/render/ColorTargetState.js";
-import { DepthStencilState } from "../../descriptor/pipeline/render/DepthStencilState.js";
-import { RenderPipelineDescriptor } from "../../descriptor/pipeline/render/RenderPipelineDescriptor.js";
-import { CAMERA_UNIFORM_STRUCT } from "../camera/CAMERA_UNIFORM_STRUCT.js";
-import { CodeChunk } from "../shader/compiler/CodeChunk.js";
-import { ShaderResourceSetDescriptor } from "../shader/resource/ShaderResourceSetDescriptor.js";
-import { ShaderDescriptor } from "../shader/ShaderDescriptor.js";
-import { mat4x4f, vec4f } from "../shader/type/WEBGPU_WGSL_PRIMITIVE_TYPES.js";
-import { WebGPUArray } from "../shader/type/WebGPUArray.js";
-import { WebGPUStruct } from "../shader/type/WebGPUStruct.js";
-import {
-    DYNAMIC_MESH_VERTEX_COLOR_OFFSET,
-    DYNAMIC_MESH_VERTEX_POSITION_OFFSET,
-    DYNAMIC_MESH_VERTEX_STRIDE
-} from "./DYNAMIC_MESH_VERTEX.js";
-
-/**
- * Per-draw constants. One dynamic mesh is one draw, so this is small and rewritten per mesh per
- * frame rather than tabled.
- */
-export const DYNAMIC_MESH_DRAW_STRUCT = WebGPUStruct.from({
-    /**
-     * Object → world. Dynamic meshes are usually built in world space already, in which case this
-     * is identity, but a trail rigidly attached to something is cheaper to build once in local
-     * space and transform.
-     */
-    model: mat4x4f,
-
-    /**
-     * Multiplied into every vertex colour. Alpha is what fades a whole effect out at once.
-     */
-    color: vec4f,
-}, "DynamicMeshDraw").pack();
-
-const resources = new ShaderResourceSetDescriptor();
-
-resources.createGroup()
-    .addUniform("camera", CAMERA_UNIFORM_STRUCT)
-    .addUniform("draw", DYNAMIC_MESH_DRAW_STRUCT)
-    .addStorageBuffer("vertices", WebGPUArray.f32, false)
-    .addStorageBuffer("indices", WebGPUArray.u32, false);
-
-const body = CodeChunk.from(
-    //language=WGSL
-    `
-const VERTEX_STRIDE : u32 = ${DYNAMIC_MESH_VERTEX_STRIDE}u;
-const POSITION_OFFSET : u32 = ${DYNAMIC_MESH_VERTEX_POSITION_OFFSET}u;
-const COLOR_OFFSET : u32 = ${DYNAMIC_MESH_VERTEX_COLOR_OFFSET}u;
-
-struct DynamicMeshVertexOut {
-    @builtin(position) clip : vec4<f32>,
-    @location(0) color : vec4<f32>,
-}
-
-// Vertices are pulled from storage rather than bound as vertex buffers, which is how the rest of
-// the engine reads geometry: one pipeline then serves every dynamic mesh, whatever it holds.
-@vertex
-fn vs_main(@builtin(vertex_index) vi : u32) -> DynamicMeshVertexOut {
-    let vertex = indices[vi];
-    let base = vertex * VERTEX_STRIDE;
-
-    let position = vec3<f32>(
-        vertices[base + POSITION_OFFSET],
-        vertices[base + POSITION_OFFSET + 1u],
-        vertices[base + POSITION_OFFSET + 2u],
-    );
-
-    let color = vec4<f32>(
-        vertices[base + COLOR_OFFSET],
-        vertices[base + COLOR_OFFSET + 1u],
-        vertices[base + COLOR_OFFSET + 2u],
-        vertices[base + COLOR_OFFSET + 3u],
-    );
-
-    let world = draw.model * vec4<f32>(position, 1.0);
-
-    var out : DynamicMeshVertexOut;
-
-    out.clip = camera.view_projection_matrix * world;
-    out.color = color * draw.color;
-
-    return out;
-}
-
-@fragment
-fn fs_main(in : DynamicMeshVertexOut) -> @location(0) vec4<f32> {
-    return in.color;
-}
-    `, []
-);
-
-/**
- * Straight alpha over what is already there. Effect content — trails, ribbons, CPU particles —
- * composites over a finished scene rather than participating in it.
- */
-const DYNAMIC_MESH_BLEND = {
-    color: {
-        srcFactor: "src-alpha",
-        dstFactor: "one-minus-src-alpha",
-        operation: "add",
-    },
-    alpha: {
-        srcFactor: "one",
-        dstFactor: "one-minus-src-alpha",
-        operation: "add",
-    },
-};
-
-/**
- * Build the dynamic-mesh pipeline.
- *
- * Two modes, and `opaque` picks between them wholesale because the two halves of each are not
- * separable: blending over the scene only makes sense for something that must not occlude it, and
- * writing depth only makes sense for something that replaces what it covers.
- *
- * - **Effect (default).** Alpha over the frame, depth tested and never written. Trails, ribbons and
- *   CPU particles draw after the standard geometry path has finished, so they must be occluded by
- *   the scene without occluding anything themselves.
- * - **Opaque.** No blend, depth written. A solid surface going down this path — a decoded LOD cut,
- *   a generated mesh with no meshlet build behind it — has to occlude both the scene and itself,
- *   and the depth buffer is the only thing that orders its own triangles against each other.
- *
- * `greater` is the comparison either way, because the engine is reverse-Z.
- *
- * @param {object} [options]
- * @param {string} [options.color_format]
- * @param {string} [options.depth_format]
- * @param {GPUCompareFunction} [options.depth_compare]
- * @param {boolean} [options.opaque] write depth and skip blending, rather than the reverse
- * @returns {RenderPipelineDescriptor}
- */
-export function create_dynamic_mesh_pipeline({
-                                                 color_format = "rgba16float",
-                                                 depth_format = "depth32float",
-                                                 depth_compare = "greater",
-                                                 opaque = false,
-                                             } = {}) {
-    const descriptor = ShaderDescriptor.from({ label: "Dynamic Mesh", body, resources });
-    const code = descriptor.compile();
-
-    return RenderPipelineDescriptor.from({
-        label: opaque ? "Dynamic Mesh (opaque)" : "Dynamic Mesh",
-        layout: resources.generatePipelineLayout(GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT),
-        vertex: { module: { code }, entryPoint: "vs_main" },
-        fragment: {
-            module: { code },
-            entryPoint: "fs_main",
-            targets: [ColorTargetState.from({
-                format: color_format,
-                blend: opaque ? undefined : DYNAMIC_MESH_BLEND,
-            })],
-        },
-        depthStencil: DepthStencilState.from({
-            format: depth_format,
-            depthWriteEnabled: opaque,
-            depthCompare: depth_compare,
-        }),
-        // Nothing on this path promises a winding. Ribbons and trails are viewed from both sides by
-        // definition, and a mesh decoded from a container carries whatever its source had — so
-        // culling here would silently erase geometry rather than save work.
-        primitive: { topology: "triangle-list", cullMode: "none" },
-    });
-}
-
-/**
- * The pipeline's resource set, for building bind groups.
- *
- * @type {ShaderResourceSetDescriptor}
- */
-export const DYNAMIC_MESH_RESOURCES = resources;
+import { ColorTargetState } from "../../descriptor/pipeline/render/ColorTargetState.js";
+import { DepthStencilState } from "../../descriptor/pipeline/render/DepthStencilState.js";
+import { RenderPipelineDescriptor } from "../../descriptor/pipeline/render/RenderPipelineDescriptor.js";
+import { CAMERA_UNIFORM_STRUCT } from "../camera/CAMERA_UNIFORM_STRUCT.js";
+import { CodeChunk } from "../shader/compiler/CodeChunk.js";
+import { ShaderResourceSetDescriptor } from "../shader/resource/ShaderResourceSetDescriptor.js";
+import { ShaderDescriptor } from "../shader/ShaderDescriptor.js";
+import { mat4x4f, vec4f } from "../shader/type/WEBGPU_WGSL_PRIMITIVE_TYPES.js";
+import { WebGPUArray } from "../shader/type/WebGPUArray.js";
+import { WebGPUStruct } from "../shader/type/WebGPUStruct.js";
+import {
+    DYNAMIC_MESH_VERTEX_COLOR_OFFSET,
+    DYNAMIC_MESH_VERTEX_POSITION_OFFSET,
+    DYNAMIC_MESH_VERTEX_STRIDE
+} from "./DYNAMIC_MESH_VERTEX.js";
+
+/**
+ * Per-draw constants. One dynamic mesh is one draw, so this is small and rewritten per mesh per
+ * frame rather than tabled.
+ */
+export const DYNAMIC_MESH_DRAW_STRUCT = WebGPUStruct.from({
+    /**
+     * Object → world. Dynamic meshes are usually built in world space already, in which case this
+     * is identity, but a trail rigidly attached to something is cheaper to build once in local
+     * space and transform.
+     */
+    model: mat4x4f,
+
+    /**
+     * Multiplied into every vertex colour. Alpha is what fades a whole effect out at once.
+     */
+    color: vec4f,
+}, "DynamicMeshDraw").pack();
+
+const resources = new ShaderResourceSetDescriptor();
+
+resources.createGroup()
+    .addUniform("camera", CAMERA_UNIFORM_STRUCT)
+    .addUniform("draw", DYNAMIC_MESH_DRAW_STRUCT)
+    .addStorageBuffer("vertices", WebGPUArray.f32, false)
+    .addStorageBuffer("indices", WebGPUArray.u32, false);
+
+const body = CodeChunk.from(
+    //language=WGSL
+    `
+const VERTEX_STRIDE : u32 = ${DYNAMIC_MESH_VERTEX_STRIDE}u;
+const POSITION_OFFSET : u32 = ${DYNAMIC_MESH_VERTEX_POSITION_OFFSET}u;
+const COLOR_OFFSET : u32 = ${DYNAMIC_MESH_VERTEX_COLOR_OFFSET}u;
+
+struct DynamicMeshVertexOut {
+    @builtin(position) clip : vec4<f32>,
+    @location(0) color : vec4<f32>,
+}
+
+// Vertices are pulled from storage rather than bound as vertex buffers, which is how the rest of
+// the engine reads geometry: one pipeline then serves every dynamic mesh, whatever it holds.
+@vertex
+fn vs_main(@builtin(vertex_index) vi : u32) -> DynamicMeshVertexOut {
+    let vertex = indices[vi];
+    let base = vertex * VERTEX_STRIDE;
+
+    let position = vec3<f32>(
+        vertices[base + POSITION_OFFSET],
+        vertices[base + POSITION_OFFSET + 1u],
+        vertices[base + POSITION_OFFSET + 2u],
+    );
+
+    let color = vec4<f32>(
+        vertices[base + COLOR_OFFSET],
+        vertices[base + COLOR_OFFSET + 1u],
+        vertices[base + COLOR_OFFSET + 2u],
+        vertices[base + COLOR_OFFSET + 3u],
+    );
+
+    let world = draw.model * vec4<f32>(position, 1.0);
+
+    var out : DynamicMeshVertexOut;
+
+    out.clip = camera.view_projection_matrix * world;
+    out.color = color * draw.color;
+
+    return out;
+}
+
+@fragment
+fn fs_main(in : DynamicMeshVertexOut) -> @location(0) vec4<f32> {
+    return in.color;
+}
+    `, []
+);
+
+/**
+ * The shader itself. One compilation, shared by every pipeline built from it — the options below
+ * vary the pipeline state, never the WGSL.
+ *
+ * @type {ShaderDescriptor}
+ */
+const descriptor = ShaderDescriptor.from({ label: "Dynamic Mesh", body, resources });
+
+/**
+ * Straight alpha over what is already there. Effect content — trails, ribbons, CPU particles —
+ * composites over a finished scene rather than participating in it.
+ */
+const DYNAMIC_MESH_BLEND = {
+    color: {
+        srcFactor: "src-alpha",
+        dstFactor: "one-minus-src-alpha",
+        operation: "add",
+    },
+    alpha: {
+        srcFactor: "one",
+        dstFactor: "one-minus-src-alpha",
+        operation: "add",
+    },
+};
+
+/**
+ * Build the dynamic-mesh pipeline.
+ *
+ * Two modes, and `opaque` picks between them wholesale because the two halves of each are not
+ * separable: blending over the scene only makes sense for something that must not occlude it, and
+ * writing depth only makes sense for something that replaces what it covers.
+ *
+ * - **Effect (default).** Alpha over the frame, depth tested and never written. Trails, ribbons and
+ *   CPU particles draw after the standard geometry path has finished, so they must be occluded by
+ *   the scene without occluding anything themselves.
+ * - **Opaque.** No blend, depth written. A solid surface going down this path — a decoded LOD cut,
+ *   a generated mesh with no meshlet build behind it — has to occlude both the scene and itself,
+ *   and the depth buffer is the only thing that orders its own triangles against each other.
+ *
+ * `greater` is the comparison either way, because the engine is reverse-Z.
+ *
+ * @param {object} [options]
+ * @param {string} [options.color_format]
+ * @param {string} [options.depth_format]
+ * @param {GPUCompareFunction} [options.depth_compare]
+ * @param {boolean} [options.opaque] write depth and skip blending, rather than the reverse
+ * @returns {RenderPipelineDescriptor}
+ */
+export function create_dynamic_mesh_pipeline({
+                                                 color_format = "rgba16float",
+                                                 depth_format = "depth32float",
+                                                 depth_compare = "greater",
+                                                 opaque = false,
+                                             } = {}) {
+    const code = descriptor.source;
+
+    return RenderPipelineDescriptor.from({
+        label: opaque ? "Dynamic Mesh (opaque)" : "Dynamic Mesh",
+        layout: resources.generatePipelineLayout(GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT),
+        vertex: { module: { code }, entryPoint: "vs_main" },
+        fragment: {
+            module: { code },
+            entryPoint: "fs_main",
+            targets: [ColorTargetState.from({
+                format: color_format,
+                blend: opaque ? undefined : DYNAMIC_MESH_BLEND,
+            })],
+        },
+        depthStencil: DepthStencilState.from({
+            format: depth_format,
+            depthWriteEnabled: opaque,
+            depthCompare: depth_compare,
+        }),
+        // Nothing on this path promises a winding. Ribbons and trails are viewed from both sides by
+        // definition, and a mesh decoded from a container carries whatever its source had — so
+        // culling here would silently erase geometry rather than save work.
+        primitive: { topology: "triangle-list", cullMode: "none" },
+    });
+}
+
+/**
+ * The pipeline's resource set, for building bind groups.
+ *
+ * @type {ShaderResourceSetDescriptor}
+ */
+export const DYNAMIC_MESH_RESOURCES = resources;