@woosh/meep-engine 3.46.0 → 3.47.0

package/src/shade/renderer/shader/ImageShader.js

@@ -1,219 +1,231 @@
-import { assert } from "../../../core/assert.js";
-import {
-    rp_validate_and_rewrite_for_color_attachments
-} from "../../device/pipeline/rp_validate_and_rewrite_for_color_attachments.js";
-import { create_full_quad_pipeline_descriptor } from "./fullscreen/create_full_quad_pipeline_descriptor.js";
-
-const VALIDATION_ENABLED = true;
-
-/**
- * Full-screen render shader
- */
-export class ImageShader {
-    /**
-     * @type {ShaderDescriptor}
-     */
-    #descriptor
-
-    /**
-     *
-     * @returns {ShaderDescriptor}
-     */
-    get descriptor() {
-        return this.#descriptor;
-    }
-
-    /**
-     * Optional clear values for each target
-     * @type {number[][]}
-     */
-    clear_values = [];
-
-    /**
-     * @type {RenderPipelineDescriptor}
-     */
-    #pipeline;
-
-    /**
-     *
-     * @returns {RenderPipelineDescriptor}
-     */
-    get pipeline() {
-        return this.#pipeline
-    }
-
-    /**
-     *
-     * @returns {boolean}
-     */
-    get isImageShader() {
-        return true;
-    }
-
-    /**
-     *
-     * @param {ShaderDescriptor} descriptor
-     * @param {(ColorTargetState|{clearValue?:number[]})[]} [targets]
-     * @param {DepthStencilState} [depthStencil]
-     */
-    constructor({
-                    descriptor,
-                    targets = [],
-                    depthStencil,
-                }) {
-
-        this.#descriptor = descriptor;
-
-        // process optional clearValue parameter
-        for (let i = 0; i < targets.length; i++) {
-            const target = targets[i];
-
-            const clearValue = target.clearValue;
-            if (clearValue !== undefined) {
-                assert.isArrayLike(clearValue, 'clearValue');
-
-                let sanitizedClearValue = clearValue;
-
-                // we need exactly 4 values according to spec
-
-                const value_count = sanitizedClearValue.length;
-
-                // TODO validate count against number of channels in the target
-
-                if (value_count === 4) {
-                    // correct length
-
-                } else if (value_count < 4) {
-                    // too few
-
-                    sanitizedClearValue = sanitizedClearValue.slice();
-
-                    for (let j = value_count; j < 4; j++) {
-                        // pad with 0
-                        sanitizedClearValue[j] = 0;
-                    }
-                } else if (value_count > 4) {
-                    // too many, drop the remainder
-
-                    sanitizedClearValue = sanitizedClearValue.slice(0, 4);
-
-                }
-
-                this.clear_values[i] = sanitizedClearValue;
-            }
-
-        }
-
-        this.#pipeline = create_full_quad_pipeline_descriptor({
-            label: descriptor.label,
-            fragment_code: descriptor.source,
-            layout: descriptor.resources.generatePipelineLayout(GPUShaderStage.FRAGMENT),
-            targets,
-            depthStencil,
-        });
-    }
-
-    // TODO simplify constructor
-    /**
-     * Utility constructor, matching general Shade API
-     * @param {Object} options
-     * @param {ShaderDescriptor} options.descriptor
-     * @param {ColorTargetState[]} options.targets
-     * @param {DepthStencilState} [options.depthStencil]
-     * @returns {ImageShader}
-     */
-    static from({
-                    descriptor,
-                    targets,
-                    depthStencil,
-                }) {
-
-        return new ImageShader({
-            descriptor,
-            depthStencil,
-            targets
-        });
-    }
-
-    /**
-     * Note the absence of depth target, image shader is a full-screen pass, so depth is not used.
-     *
-     * @param {ShadeGPUCommandContext} encoder
-     * @param {Object} [bindings] data bindings. It's optional, but in 99.99% of use cases you will want to specify this.
-     * @param {GPURenderPassColorAttachment[]} [colorAttachments] where to draw, these are fragment shader outputs.
-     * @param {GPURenderPassDepthStencilAttachment} [depthStencilAttachment]
-     * @param {GPUTextureFormat[]} [color_formats] optional, if specified will be used to rewrite the pipeline for compatibility
-     * @param {number[]} [viewport] [x0, y0, width, height ]
-     */
-    draw({
-             encoder,
-             bindings = {},
-             colorAttachments = [],
-             depthStencilAttachment,
-             color_formats,
-             viewport
-         }) {
-
-        assert.defined(encoder, 'encoder');
-
-        // TODO I hate the separate color_formats parameter. Make a wrapper around GPURenderPassColorAttachment instead, and have a pointer to the GPUTextureContext in there so we can access the texture format
-
-        const shader_descriptor = this.#descriptor;
-
-        if (VALIDATION_ENABLED) {
-            shader_descriptor.validate_against_device(encoder.device);
-        }
-
-        const resolved_bindings = shader_descriptor.resources.generateBindings(bindings, encoder);
-
-        const immediate = encoder.writeImmediate(shader_descriptor.resources, bindings);
-
-        encoder.pushDebugGroup(shader_descriptor.label);
-
-        let pipeline = this.#pipeline;
-
-        if (color_formats !== undefined) {
-            // potentially rewrite the pipeline to be compatible with output formats
-            // example: rgba8unorm -> rgba16float
-            pipeline = rp_validate_and_rewrite_for_color_attachments(pipeline, color_formats);
-        }
-
-        const pass = encoder.constructRenderPass({
-            pipeline,
-            bindings: resolved_bindings,
-            colorAttachments,
-            depthStencilAttachment,
-            immediate
-        });
-
-        if (viewport !== undefined) {
-            const _x = viewport[0];
-            const _y = viewport[1];
-            const _width = viewport[2];
-            const _height = viewport[3];
-
-            assert.greaterThanOrEqual(_width, 0, 'viewport width must be positive');
-            assert.greaterThanOrEqual(_height, 0, 'viewport width must be positive');
-
-            assert.notNaN(_x, '_x');
-            assert.notNaN(_y, '_y');
-
-
-            pass.setViewport(
-                _x,
-                _y,
-                _width,
-                _height,
-                0,
-                1
-            );
-        }
-
-        pass.draw(3);
-
-        pass.end();
-
-        encoder.popDebugGroup();
-
-    }
+import { assert } from "../../../core/assert.js";
+import {
+    rp_validate_and_rewrite_for_color_attachments
+} from "../../device/pipeline/rp_validate_and_rewrite_for_color_attachments.js";
+import { create_full_quad_pipeline_descriptor } from "./fullscreen/create_full_quad_pipeline_descriptor.js";
+
+const VALIDATION_ENABLED = true;
+
+/**
+ * Full-screen render shader
+ */
+export class ImageShader {
+    /**
+     * @type {ShaderDescriptor}
+     */
+    #descriptor
+
+    /**
+     *
+     * @returns {ShaderDescriptor}
+     */
+    get descriptor() {
+        return this.#descriptor;
+    }
+
+    /**
+     * Optional clear values for each target
+     * @type {number[][]}
+     */
+    clear_values = [];
+
+    /**
+     * @type {RenderPipelineDescriptor}
+     */
+    #pipeline;
+
+    /**
+     * The device this shader last passed {@link ShaderDescriptor#validate_against_device} on, or null:
+     * one check per device rather than one per draw. See `ComputeShader`'s field of the same name.
+     *
+     * @type {GPUDevice|null}
+     */
+    #validated_device = null;
+
+    /**
+     *
+     * @returns {RenderPipelineDescriptor}
+     */
+    get pipeline() {
+        return this.#pipeline
+    }
+
+    /**
+     *
+     * @returns {boolean}
+     */
+    get isImageShader() {
+        return true;
+    }
+
+    /**
+     *
+     * @param {ShaderDescriptor} descriptor
+     * @param {(ColorTargetState|{clearValue?:number[]})[]} [targets]
+     * @param {DepthStencilState} [depthStencil]
+     */
+    constructor({
+                    descriptor,
+                    targets = [],
+                    depthStencil,
+                }) {
+
+        this.#descriptor = descriptor;
+
+        // process optional clearValue parameter
+        for (let i = 0; i < targets.length; i++) {
+            const target = targets[i];
+
+            const clearValue = target.clearValue;
+            if (clearValue !== undefined) {
+                assert.isArrayLike(clearValue, 'clearValue');
+
+                let sanitizedClearValue = clearValue;
+
+                // we need exactly 4 values according to spec
+
+                const value_count = sanitizedClearValue.length;
+
+                // TODO validate count against number of channels in the target
+
+                if (value_count === 4) {
+                    // correct length
+
+                } else if (value_count < 4) {
+                    // too few
+
+                    sanitizedClearValue = sanitizedClearValue.slice();
+
+                    for (let j = value_count; j < 4; j++) {
+                        // pad with 0
+                        sanitizedClearValue[j] = 0;
+                    }
+                } else if (value_count > 4) {
+                    // too many, drop the remainder
+
+                    sanitizedClearValue = sanitizedClearValue.slice(0, 4);
+
+                }
+
+                this.clear_values[i] = sanitizedClearValue;
+            }
+
+        }
+
+        this.#pipeline = create_full_quad_pipeline_descriptor({
+            label: descriptor.label,
+            fragment_code: descriptor.source,
+            layout: descriptor.resources.generatePipelineLayout(GPUShaderStage.FRAGMENT),
+            targets,
+            depthStencil,
+        });
+    }
+
+    // TODO simplify constructor
+    /**
+     * Utility constructor, matching general Shade API
+     * @param {Object} options
+     * @param {ShaderDescriptor} options.descriptor
+     * @param {ColorTargetState[]} options.targets
+     * @param {DepthStencilState} [options.depthStencil]
+     * @returns {ImageShader}
+     */
+    static from({
+                    descriptor,
+                    targets,
+                    depthStencil,
+                }) {
+
+        return new ImageShader({
+            descriptor,
+            depthStencil,
+            targets
+        });
+    }
+
+    /**
+     * Note the absence of depth target, image shader is a full-screen pass, so depth is not used.
+     *
+     * @param {ShadeGPUCommandContext} encoder
+     * @param {Object} [bindings] data bindings. It's optional, but in 99.99% of use cases you will want to specify this.
+     * @param {GPURenderPassColorAttachment[]} [colorAttachments] where to draw, these are fragment shader outputs.
+     * @param {GPURenderPassDepthStencilAttachment} [depthStencilAttachment]
+     * @param {GPUTextureFormat[]} [color_formats] optional, if specified will be used to rewrite the pipeline for compatibility
+     * @param {number[]} [viewport] [x0, y0, width, height ]
+     */
+    draw({
+             encoder,
+             bindings = {},
+             colorAttachments = [],
+             depthStencilAttachment,
+             color_formats,
+             viewport
+         }) {
+
+        assert.defined(encoder, 'encoder');
+
+        // TODO I hate the separate color_formats parameter. Make a wrapper around GPURenderPassColorAttachment instead, and have a pointer to the GPUTextureContext in there so we can access the texture format
+
+        const shader_descriptor = this.#descriptor;
+
+        const device = encoder.device;
+
+        if (VALIDATION_ENABLED && device !== this.#validated_device) {
+            shader_descriptor.validate_against_device(device);
+
+            this.#validated_device = device;
+        }
+
+        const resolved_bindings = shader_descriptor.resources.generateBindings(bindings, encoder);
+
+        const immediate = encoder.writeImmediate(shader_descriptor.resources, bindings);
+
+        encoder.pushDebugGroup(shader_descriptor.label);
+
+        let pipeline = this.#pipeline;
+
+        if (color_formats !== undefined) {
+            // potentially rewrite the pipeline to be compatible with output formats
+            // example: rgba8unorm -> rgba16float
+            pipeline = rp_validate_and_rewrite_for_color_attachments(pipeline, color_formats);
+        }
+
+        const pass = encoder.constructRenderPass({
+            pipeline,
+            bindings: resolved_bindings,
+            colorAttachments,
+            depthStencilAttachment,
+            immediate
+        });
+
+        if (viewport !== undefined) {
+            const _x = viewport[0];
+            const _y = viewport[1];
+            const _width = viewport[2];
+            const _height = viewport[3];
+
+            assert.greaterThanOrEqual(_width, 0, 'viewport width must be positive');
+            assert.greaterThanOrEqual(_height, 0, 'viewport width must be positive');
+
+            assert.notNaN(_x, '_x');
+            assert.notNaN(_y, '_y');
+
+
+            pass.setViewport(
+                _x,
+                _y,
+                _width,
+                _height,
+                0,
+                1
+            );
+        }
+
+        pass.draw(3);
+
+        pass.end();
+
+        encoder.popDebugGroup();
+
+    }
 }

package/src/view/graphics/GraphicsContextFailureView.d.ts

@@ -1,6 +1,5 @@
 /**
- * Shown when WebGL context recovery has been abandoned, so the player sees an explanation instead of a
- * black canvas.
+ * Shown when there will be no rendering, so the person sees an explanation instead of a black canvas.
  *
  * Strings are supplied by the caller. They default to English because this view exists precisely for the
  * case where the renderer is dead, which is not a good moment to depend on the localization pipeline

package/src/view/graphics/GraphicsContextFailureView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GraphicsContextFailureView.d.ts","sourceRoot":"","sources":["../../../../src/view/graphics/GraphicsContextFailureView.js"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AACH;IACI;;;;;;OAMG;IACH;QAL4B,KAAK,GAAtB,MAAM;QACW,IAAI,GAArB,MAAM;QACW,YAAY,GAA7B,MAAM;QACa,MAAM;OAyDnC;CACJ;sBA3EqB,0BAA0B"}
+{"version":3,"file":"GraphicsContextFailureView.d.ts","sourceRoot":"","sources":["../../../../src/view/graphics/GraphicsContextFailureView.js"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH;IACI;;;;;;OAMG;IACH;QAL4B,KAAK,GAAtB,MAAM;QACW,IAAI,GAArB,MAAM;QACW,YAAY,GAA7B,MAAM;QACa,MAAM;OAyDnC;CACJ;sBA1EqB,0BAA0B"}

package/src/view/graphics/GraphicsContextFailureView.js

@@ -3,8 +3,7 @@ import EmptyView from "../elements/EmptyView.js";
 import LabelView from "../common/LabelView.js";
 
 /**
- * Shown when WebGL context recovery has been abandoned, so the player sees an explanation instead of a
- * black canvas.
+ * Shown when there will be no rendering, so the person sees an explanation instead of a black canvas.
  *
  * Strings are supplied by the caller. They default to English because this view exists precisely for the
  * case where the renderer is dead, which is not a good moment to depend on the localization pipeline