@woosh/meep-engine 3.63.3 → 3.64.0

package/src/shade/renderer/deferred/tonemap/TonemapAces2Tables.js

@@ -7,18 +7,18 @@ import {
 import { PAPER_WHITE_NITS } from "../../shader/chunk/color/tonemap/chunk_PAPER_WHITE_NITS.js";
 
 /**
- * What {@link shader_tonemap_HDR_aces} binds as `aces2_tables`: two ACES 2.0 output transforms, each its parameters and
+ * What the ACES tone-map operator binds as `aces2_tables`: two ACES 2.0 output transforms, each its parameters and
  * gamut tables, both limited to Rec.709, the gamut of the SDR picture they expand.
  *
- * 1. An SDR display, 100 cd/m². The pass runs it backwards, from the SDR picture to the scene.
+ * 1. An SDR display, 100 cd/m². The operator runs it backwards, from the SDR picture to the scene.
  * 2. This display: the peak over the paper white, times 100 cd/m². A display at or under the paper white gets
- *    100 cd/m², which the pass does not read.
+ *    100 cd/m², which the operator does not read.
  *
  * Both take SDR white for 100 cd/m², ACES 2.0's reference, so an SDR picture expanded for a display keeps SDR white
  * where the paper white puts it.
  *
- * Building one transform takes 7 to 13 ms, so the tables are built on the first {@link update} rather than with the
- * renderer, and again only when the display's peak changes.
+ * Building one transform takes 7 to 13 ms, so the tables are built on the first {@link update}, and again only when
+ * the display's peak changes.
  */
 export class TonemapAces2Tables {
     /**
@@ -29,13 +29,6 @@ export class TonemapAces2Tables {
 
     #peak_nits = NaN;
 
-    /**
-     * @type {GPUBuffer|null}
-     */
-    #buffer = null;
-
-    #uploaded = false;
-
     /**
      * Build the tables for a display, if they are not built for it already.
      *
@@ -59,39 +52,7 @@ export class TonemapAces2Tables {
         aces2_transform_block_write(this.data, ACES2_BLOCK_FLOATS, 100 * headroom, ACES2_LIMITING_REC709);
 
         this.#peak_nits = peak_nits;
-        this.#uploaded = false;
 
         return true;
     }
-
-    /**
-     * The tables on the device, written if they changed since the last call.
-     *
-     * @param {GPUDevice} device
-     * @returns {GPUBuffer}
-     */
-    gpu_buffer(device) {
-        if (this.#buffer === null) {
-            this.#buffer = device.createBuffer({
-                label: "tonemap/aces2 tables",
-                size: this.data.byteLength,
-                usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST,
-            });
-            this.#uploaded = false;
-        }
-
-        if (!this.#uploaded) {
-            device.queue.writeBuffer(this.#buffer, 0, this.data);
-            this.#uploaded = true;
-        }
-
-        return this.#buffer;
-    }
-
-    destroy() {
-        if (this.#buffer !== null) {
-            this.#buffer.destroy();
-            this.#buffer = null;
-        }
-    }
 }

package/src/shade/renderer/deferred/tonemap/TonemapDisplaySettings.d.ts

@@ -1,22 +1,18 @@
 /**
- * The immediate data every tonemap pass reads: the colour space the canvas actually shows, and the display's peak.
+ * What the tone mapper is told about the display: the colour space the canvas actually shows, and the display's peak.
  *
- * A pass's immediate struct names only the members it reads. The GT7 passes leave the operator in Rec.2020 and read
- * `display_from_rec2020_*`; the others work in Rec.709 and read `display_from_rec709_*`; only the HDR passes read
- * `peak_nits`. So one instance serves whichever pass is current.
+ * The apply passes read the matrix from linear Rec.2020, the LUT's output, to the canvas's linear primaries, as
+ * {@link TONEMAP_SETTINGS}. The peak is what an HDR LUT is baked for.
  *
- * Each matrix is three columns, not a `mat3x3f`: a `mat3x3f` pads each column to 16 bytes and the immediate
+ * The matrix is three columns, not a `mat3x3f`: a `mat3x3f` pads each column to 16 bytes and the immediate
  * serialiser writes its nine floats end to end.
  */
 export class TonemapDisplaySettings {
-    display_from_rec709_c0: Float32Array;
-    display_from_rec709_c1: Float32Array;
-    display_from_rec709_c2: Float32Array;
     display_from_rec2020_c0: Float32Array;
     display_from_rec2020_c1: Float32Array;
     display_from_rec2020_c2: Float32Array;
     /**
-     * The display's peak, cd/m². Read by the HDR passes only.
+     * The display's peak, cd/m². An HDR LUT is baked for it.
      * @type {number}
      */
     peak_nits: number;
@@ -29,22 +25,8 @@ export class TonemapDisplaySettings {
     set_canvas_color_space(color_space: PredefinedColorSpace | string): void;
 }
 /**
- * Immediate data of a pass that works in Rec.709. Filled by {@link TonemapDisplaySettings}.
+ * Immediate data of the tone mapper's apply passes. Filled by {@link TonemapDisplaySettings}.
  */
-export const TONEMAP_SETTINGS_REC709: WebGPUStruct;
-/**
- * Immediate data of a pass that works in Rec.709 and is told the display's peak. Filled by {@link
- * TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC709_PEAK: WebGPUStruct;
-/**
- * Immediate data of a pass that works in Rec.2020. Filled by {@link TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC2020: WebGPUStruct;
-/**
- * Immediate data of a pass that works in Rec.2020 and is told the display's peak. Filled by {@link
- * TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC2020_PEAK: WebGPUStruct;
+export const TONEMAP_SETTINGS: WebGPUStruct;
 import { WebGPUStruct } from "../../shader/type/WebGPUStruct.js";
 //# sourceMappingURL=TonemapDisplaySettings.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"TonemapDisplaySettings.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/TonemapDisplaySettings.js"],"names":[],"mappings":"AAiDA;;;;;;;;;GASG;AACH;IACI,qCAAqD;IACrD,qCAAqD;IACrD,qCAAqD;IAErD,sCAA8C;IAC9C,sCAA8C;IAC9C,sCAA8C;IAE9C;;;OAGG;IACH,WAFU,MAAM,CAEC;IAMjB;;;;;OAKG;IACH,oCAHW,oBAAoB,GAAC,MAAM,QAkBrC;CACJ;AAqBD;;GAEG;AACH,mDAAqF;AAErF;;;GAGG;AACH,wDAAmG;AAEnG;;GAEG;AACH,oDAAuF;AAEvF;;;GAGG;AACH,yDAAqG;6BAzIxE,mCAAmC"}
+{"version":3,"file":"TonemapDisplaySettings.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/TonemapDisplaySettings.js"],"names":[],"mappings":"AAiDA;;;;;;;;GAQG;AACH;IACI,sCAA8C;IAC9C,sCAA8C;IAC9C,sCAA8C;IAE9C;;;OAGG;IACH,WAFU,MAAM,CAEC;IAMjB;;;;;OAKG;IACH,oCAHW,oBAAoB,GAAC,MAAM,QAcrC;CACJ;AAED;;GAEG;AACH,4CAKG;6BAjG0B,mCAAmC"}

package/src/shade/renderer/deferred/tonemap/TonemapDisplaySettings.js

@@ -1,7 +1,7 @@
 import { m3_rgb_to_xyz_from_primaries } from "../../../../core/color/xyz/m3_rgb_to_xyz_from_primaries.js";
 import { m3_invert } from "../../../../core/geom/mat3/m3_invert.js";
 import { m3_multiply } from "../../../../core/geom/mat3/m3_multiply.js";
-import { f32, vec3f } from "../../shader/type/WEBGPU_WGSL_PRIMITIVE_TYPES.js";
+import { vec3f } from "../../shader/type/WEBGPU_WGSL_PRIMITIVE_TYPES.js";
 import { WebGPUStruct } from "../../shader/type/WebGPUStruct.js";
 
 // chromaticities of red, green and blue; every space here has a D65 white, so none needs chromatic adaptation
@@ -48,26 +48,21 @@ function write_columns(c0, c1, c2, from, to) {
 }
 
 /**
- * The immediate data every tonemap pass reads: the colour space the canvas actually shows, and the display's peak.
+ * What the tone mapper is told about the display: the colour space the canvas actually shows, and the display's peak.
  *
- * A pass's immediate struct names only the members it reads. The GT7 passes leave the operator in Rec.2020 and read
- * `display_from_rec2020_*`; the others work in Rec.709 and read `display_from_rec709_*`; only the HDR passes read
- * `peak_nits`. So one instance serves whichever pass is current.
+ * The apply passes read the matrix from linear Rec.2020, the LUT's output, to the canvas's linear primaries, as
+ * {@link TONEMAP_SETTINGS}. The peak is what an HDR LUT is baked for.
  *
- * Each matrix is three columns, not a `mat3x3f`: a `mat3x3f` pads each column to 16 bytes and the immediate
+ * The matrix is three columns, not a `mat3x3f`: a `mat3x3f` pads each column to 16 bytes and the immediate
  * serialiser writes its nine floats end to end.
  */
 export class TonemapDisplaySettings {
-    display_from_rec709_c0 = new Float32Array([1, 0, 0]);
-    display_from_rec709_c1 = new Float32Array([0, 1, 0]);
-    display_from_rec709_c2 = new Float32Array([0, 0, 1]);
-
     display_from_rec2020_c0 = new Float32Array(3);
     display_from_rec2020_c1 = new Float32Array(3);
     display_from_rec2020_c2 = new Float32Array(3);
 
     /**
-     * The display's peak, cd/m². Read by the HDR passes only.
+     * The display's peak, cd/m². An HDR LUT is baked for it.
      * @type {number}
      */
     peak_nits = 1000;
@@ -89,10 +84,6 @@ export class TonemapDisplaySettings {
             throw new Error(`Canvas colorSpace '${color_space}' is not one the tonemap passes can write`);
         }
 
-        write_columns(
-            this.display_from_rec709_c0, this.display_from_rec709_c1, this.display_from_rec709_c2,
-            PRIMARIES_REC709, display
-        );
         write_columns(
             this.display_from_rec2020_c0, this.display_from_rec2020_c1, this.display_from_rec2020_c2,
             PRIMARIES_REC2020, display
@@ -100,43 +91,12 @@ export class TonemapDisplaySettings {
     }
 }
 
-const display_from_rec709 = {
-    /** column 0 of the matrix from linear Rec.709 to the canvas's linear primaries */
-    display_from_rec709_c0: vec3f,
-    display_from_rec709_c1: vec3f,
-    display_from_rec709_c2: vec3f,
-};
-
-const display_from_rec2020 = {
+/**
+ * Immediate data of the tone mapper's apply passes. Filled by {@link TonemapDisplaySettings}.
+ */
+export const TONEMAP_SETTINGS = WebGPUStruct.from({
     /** column 0 of the matrix from linear Rec.2020 to the canvas's linear primaries */
     display_from_rec2020_c0: vec3f,
     display_from_rec2020_c1: vec3f,
     display_from_rec2020_c2: vec3f,
-};
-
-/**
- * The display's peak, cd/m². The paper white is not a setting: it is PAPER_WHITE_NITS on both outputs.
- */
-const peak = { peak_nits: f32 };
-
-/**
- * Immediate data of a pass that works in Rec.709. Filled by {@link TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC709 = WebGPUStruct.from({ ...display_from_rec709 });
-
-/**
- * Immediate data of a pass that works in Rec.709 and is told the display's peak. Filled by {@link
- * TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC709_PEAK = WebGPUStruct.from({ ...display_from_rec709, ...peak });
-
-/**
- * Immediate data of a pass that works in Rec.2020. Filled by {@link TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC2020 = WebGPUStruct.from({ ...display_from_rec2020 });
-
-/**
- * Immediate data of a pass that works in Rec.2020 and is told the display's peak. Filled by {@link
- * TonemapDisplaySettings}.
- */
-export const TONEMAP_SETTINGS_REC2020_PEAK = WebGPUStruct.from({ ...display_from_rec2020, ...peak });
+});

package/src/shade/renderer/deferred/tonemap/m3_white_balance_rec709.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Unreal's temperature white balance (`WhiteBalance` in `TonemapCommon.ush`, the default "White Balance" mode) on
+ * linear Rec.709, as a matrix. Light from a white at `temperature` K, moved along its isotherm by `tint`, becomes
+ * neutral: a lower temperature cools the picture.
+ *
+ * The source white is on the Planckian locus below 4000 K and on the CIE daylight locus from there, as Unreal's is,
+ * and the adaptation to D65 is Bradford. At 6500 K and no tint, where Unreal skips the stage, the matrix is the
+ * identity.
+ *
+ * @param {Float32Array|Float64Array|number[]} out 9 elements, row-major
+ * @param {number} temperature K
+ * @param {number} tint offset along the isotherm, in units of 0.05 in CIE 1960 uv; Unreal's range is -1 to 1
+ */
+export function m3_white_balance_rec709(out: Float32Array | Float64Array | number[], temperature: number, tint: number): void;
+/**
+ * The temperature white balance is neutral at these, and Unreal skips it there.
+ */
+export const WHITE_BALANCE_NEUTRAL_TEMPERATURE: 6500;
+export const WHITE_BALANCE_NEUTRAL_TINT: 0;
+//# sourceMappingURL=m3_white_balance_rec709.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"m3_white_balance_rec709.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/m3_white_balance_rec709.js"],"names":[],"mappings":"AAqCA;;;;;;;;;;;;GAYG;AACH,6CAJW,YAAY,GAAC,YAAY,GAAC,MAAM,EAAE,eAClC,MAAM,QACN,MAAM,QAsDhB;AAxFD;;GAEG;AACH,qDAAsD;AACtD,2CAA4C"}

package/src/shade/renderer/deferred/tonemap/m3_white_balance_rec709.js

@@ -0,0 +1,103 @@
+import { m3_chromatic_adaptation_bradford } from "../../../../core/color/xyz/m3_chromatic_adaptation_bradford.js";
+import { m3_rgb_to_xyz_from_primaries } from "../../../../core/color/xyz/m3_rgb_to_xyz_from_primaries.js";
+import { m3_invert } from "../../../../core/geom/mat3/m3_invert.js";
+import { m3_multiply } from "../../../../core/geom/mat3/m3_multiply.js";
+
+const D65_X = 0.3127;
+const D65_Y = 0.3290;
+
+const REC709_TO_XYZ = new Float64Array(9);
+m3_rgb_to_xyz_from_primaries(REC709_TO_XYZ, [0.640, 0.330, 0.300, 0.600, 0.150, 0.060], D65_X, D65_Y);
+
+const XYZ_TO_REC709 = new Float64Array(9);
+m3_invert(XYZ_TO_REC709, REC709_TO_XYZ);
+
+/**
+ * The temperature white balance is neutral at these, and Unreal skips it there.
+ */
+export const WHITE_BALANCE_NEUTRAL_TEMPERATURE = 6500;
+export const WHITE_BALANCE_NEUTRAL_TINT = 0;
+
+/**
+ * Chromaticity of the Planckian locus at `temperature` K, Krystek's rational fit in CIE 1960 uv, as Unreal's
+ * `PlanckianLocusChromaticity`.
+ *
+ * @param {number[]} out [x, y]
+ * @param {number} temperature
+ */
+function planckian_locus_uv(out, temperature) {
+    const t = temperature;
+    out[0] = (0.860117757 + 1.54118254e-4 * t + 1.28641212e-7 * t * t) / (1 + 8.42420235e-4 * t + 7.08145163e-7 * t * t);
+    out[1] = (0.317398726 + 4.22806245e-5 * t + 4.20481691e-8 * t * t) / (1 - 2.89741816e-5 * t + 1.61456053e-7 * t * t);
+}
+
+const scratch_uv = [0, 0];
+const scratch_cat = new Float64Array(9);
+const scratch_m = new Float64Array(9);
+
+/**
+ * Unreal's temperature white balance (`WhiteBalance` in `TonemapCommon.ush`, the default "White Balance" mode) on
+ * linear Rec.709, as a matrix. Light from a white at `temperature` K, moved along its isotherm by `tint`, becomes
+ * neutral: a lower temperature cools the picture.
+ *
+ * The source white is on the Planckian locus below 4000 K and on the CIE daylight locus from there, as Unreal's is,
+ * and the adaptation to D65 is Bradford. At 6500 K and no tint, where Unreal skips the stage, the matrix is the
+ * identity.
+ *
+ * @param {Float32Array|Float64Array|number[]} out 9 elements, row-major
+ * @param {number} temperature K
+ * @param {number} tint offset along the isotherm, in units of 0.05 in CIE 1960 uv; Unreal's range is -1 to 1
+ */
+export function m3_white_balance_rec709(out, temperature, tint) {
+    if (temperature === WHITE_BALANCE_NEUTRAL_TEMPERATURE && tint === WHITE_BALANCE_NEUTRAL_TINT) {
+        out.fill(0);
+        out[0] = 1;
+        out[4] = 1;
+        out[8] = 1;
+        return;
+    }
+
+    let x, y;
+
+    if (temperature < 4000) {
+        planckian_locus_uv(scratch_uv, temperature);
+        const [u, v] = scratch_uv;
+        const d = 2 * u - 8 * v + 4;
+        x = 3 * u / d;
+        y = 2 * v / d;
+    } else {
+        // the CIE daylight locus, with the temperature corrected for the revision of Planck's c2, so 6500 is D65
+        const t = temperature * 1.4388 / 1.438;
+        const r = 1 / t;
+
+        x = t <= 7000
+            ? 0.244063 + (0.09911e3 + (2.9678e6 - 4.6070e9 * r) * r) * r
+            : 0.237040 + (0.24748e3 + (1.9018e6 - 2.0064e9 * r) * r) * r;
+        y = -3 * x * x + 2.87 * x - 0.275;
+    }
+
+    {
+        // along the isotherm, the normal to the Planckian locus in uv, by the tint
+        const t = temperature;
+        planckian_locus_uv(scratch_uv, t);
+        const [u, v] = scratch_uv;
+
+        const ud = (-1.13758118e9 - 1.91615621e6 * t - 1.53177 * t * t) / ((1.41213984e6 + 1189.62 * t + t * t) ** 2);
+        const vd = (1.97471536e9 - 705674.0 * t - 308.607 * t * t) / ((6.19363586e6 - 179.456 * t + t * t) ** 2);
+        const length = Math.hypot(ud, vd);
+
+        const iu = u + vd / length * tint * 0.05;
+        const iv = v - ud / length * tint * 0.05;
+
+        const d0 = 2 * u - 8 * v + 4;
+        const d1 = 2 * iu - 8 * iv + 4;
+
+        x += 3 * iu / d1 - 3 * u / d0;
+        y += 2 * iv / d1 - 2 * v / d0;
+    }
+
+    m3_chromatic_adaptation_bradford(scratch_cat, x, y, D65_X, D65_Y);
+
+    m3_multiply(scratch_m, scratch_cat, REC709_TO_XYZ);
+    m3_multiply(out, XYZ_TO_REC709, scratch_m);
+}

package/src/shade/renderer/deferred/tonemap/shader_tonemap_HDR_lut.d.ts

@@ -0,0 +1,9 @@
+/**
+ * The HDR output of {@link ToneMapper}: exposure, then the HDR LUT, written in the canvas's primaries, extended, where
+ * 1.0 is SDR white.
+ *
+ * @type {ImageShader}
+ */
+export const shader_tonemap_HDR_lut: ImageShader;
+import { ImageShader } from "../../shader/ImageShader.js";
+//# sourceMappingURL=shader_tonemap_HDR_lut.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"shader_tonemap_HDR_lut.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/shader_tonemap_HDR_lut.js"],"names":[],"mappings":"AAmDA;;;;;GAKG;AACH,qCAFU,WAAW,CAclB;4BAlEyB,6BAA6B"}

package/src/shade/renderer/deferred/tonemap/{shader_tonemap_HDR_none.js → shader_tonemap_HDR_lut.js}

@@ -1,16 +1,21 @@
-import { F32_CONTAINER_STRUCT } from "../../shader/type/F32_CONTAINER_STRUCT.js";
-import { TONEMAP_SETTINGS_REC709 } from "./TonemapDisplaySettings.js";
 import { chunk_sRGBTransferOETF } from "../../shader/chunk/color/sRGB/chunk_sRGBTransferOETF.js";
+import { chunk_tonemap_lut } from "../../shader/chunk/color/tonemap/chunk_tonemap_lut.js";
 import { CodeChunk } from "../../shader/compiler/CodeChunk.js";
 import { ImageShader } from "../../shader/ImageShader.js";
 import { ShaderResourceSetDescriptor } from "../../shader/resource/ShaderResourceSetDescriptor.js";
 import { ShaderDescriptor } from "../../shader/ShaderDescriptor.js";
+import { F32_CONTAINER_STRUCT } from "../../shader/type/F32_CONTAINER_STRUCT.js";
+import { SAMPLER_TONEMAP_LUT } from "./SAMPLER_TONEMAP_LUT.js";
+import { TONEMAP_SETTINGS } from "./TonemapDisplaySettings.js";
 
 const resources = new ShaderResourceSetDescriptor();
-resources.setImmediate("settings", TONEMAP_SETTINGS_REC709);
+
+resources.setImmediate("settings", TONEMAP_SETTINGS);
 resources.createGroup()
     .addTexture("input_color", "float")
     .addUniform("exposure", F32_CONTAINER_STRUCT)
+    .addTexture("lut", "float", "3d")
+    .addSampler("lut_sampler", "filtering", SAMPLER_TONEMAP_LUT)
 
 const body = CodeChunk.from(
     //language=WGSL
@@ -21,39 +26,38 @@ fn main(
 ) -> @location(0) vec4<f32> {
 
     // scene color in linear Rec. 709
-    var color = textureLoad(input_color, vec2i(coord.xy), 0).rgb;
+    let color = textureLoad(input_color, vec2i(coord.xy), 0).rgb * exposure.value;
 
-    color *= exposure.value;
+    let uvw = tonemap_lut_coordinate(color, f32(textureDimensions(lut).x));
+    let color_2020 = tonemap_lut_pq_decode(textureSampleLevel(lut, lut_sampler, uvw, 0.0).rgb);
 
-    // no tone mapping: 1.0 is SDR white, and what lies above it is shown as far as the display reaches
+    // into the primaries the canvas reports it was configured with (Renderer#configure_context)
+    let color_display = mat3x3<f32>(
+        settings.display_from_rec2020_c0,
+        settings.display_from_rec2020_c1,
+        settings.display_from_rec2020_c2
+    ) * color_2020;
 
     // NOTE: no dithering, colorspace is wide
 
-    // into the primaries the canvas reports it was configured with (Renderer#configure_context): Display P3, or
-    // sRGB where the browser would not configure P3
-    let color_display = mat3x3<f32>(
-        settings.display_from_rec709_c0,
-        settings.display_from_rec709_c1,
-        settings.display_from_rec709_c2
-    ) * color;
-
     // apply gamma. Note that gamma is the same for "Display P3" and "sRGB"
     return vec4(sRGBTransferOETF(color_display), 1.0);
 }
     `, [
+        chunk_tonemap_lut,
         chunk_sRGBTransferOETF,
     ]
 );
 
 /**
- * The HDR output with {@link ShadeToneMappingMode.NONE}: exposure and the canvas's primaries, extended, where 1.0 is
- * SDR white, and nothing in between.
+ * The HDR output of {@link ToneMapper}: exposure, then the HDR LUT, written in the canvas's primaries, extended, where
+ * 1.0 is SDR white.
  *
  * @type {ImageShader}
  */
-export const shader_tonemap_HDR_none = new ImageShader({
+export const shader_tonemap_HDR_lut = new ImageShader({
     descriptor: ShaderDescriptor.from({
-        label: "Tonemap/HDR/none",
+        label: "Tonemap/HDR",
         resources,
         body
     }),

package/src/shade/renderer/deferred/tonemap/shader_tonemap_LDR_lut.d.ts

@@ -0,0 +1,9 @@
+/**
+ * The SDR output of {@link ToneMapper}: exposure, then the SDR LUT, the canvas's primaries, the sRGB transfer curve
+ * and an 8-bit dither. The 8-bit target clips anything the LUT puts past SDR white.
+ *
+ * @type {ImageShader}
+ */
+export const shader_tonemap_LDR_lut: ImageShader;
+import { ImageShader } from "../../shader/ImageShader.js";
+//# sourceMappingURL=shader_tonemap_LDR_lut.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"shader_tonemap_LDR_lut.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/shader_tonemap_LDR_lut.js"],"names":[],"mappings":"AA0DA;;;;;GAKG;AACH,qCAFU,WAAW,CAclB;4BAtEyB,6BAA6B"}

package/src/shade/renderer/deferred/tonemap/{shader_tonemap_LDR_aces.js → shader_tonemap_LDR_lut.js}

@@ -1,7 +1,5 @@
-import { F32_CONTAINER_STRUCT } from "../../shader/type/F32_CONTAINER_STRUCT.js";
-import { TONEMAP_SETTINGS_REC709 } from "./TonemapDisplaySettings.js";
 import { chunk_sRGBTransferOETF } from "../../shader/chunk/color/sRGB/chunk_sRGBTransferOETF.js";
-import { chunk_tonemap_ue_filmic } from "../../shader/chunk/color/tonemap/aces/chunk_tonemap_ue_filmic.js";
+import { chunk_tonemap_lut } from "../../shader/chunk/color/tonemap/chunk_tonemap_lut.js";
 import {
     chunk_dither_color_8bit_triangle_noise
 } from "../../shader/chunk/texture/dither/chunk_dither_color_8bit_triangle_noise.js";
@@ -9,12 +7,18 @@ import { CodeChunk } from "../../shader/compiler/CodeChunk.js";
 import { ImageShader } from "../../shader/ImageShader.js";
 import { ShaderResourceSetDescriptor } from "../../shader/resource/ShaderResourceSetDescriptor.js";
 import { ShaderDescriptor } from "../../shader/ShaderDescriptor.js";
+import { F32_CONTAINER_STRUCT } from "../../shader/type/F32_CONTAINER_STRUCT.js";
+import { SAMPLER_TONEMAP_LUT } from "./SAMPLER_TONEMAP_LUT.js";
+import { TONEMAP_SETTINGS } from "./TonemapDisplaySettings.js";
 
 const resources = new ShaderResourceSetDescriptor();
-resources.setImmediate("settings", TONEMAP_SETTINGS_REC709);
+
+resources.setImmediate("settings", TONEMAP_SETTINGS);
 resources.createGroup()
     .addTexture("input_color", "float")
     .addUniform("exposure", F32_CONTAINER_STRUCT)
+    .addTexture("lut", "float", "3d")
+    .addSampler("lut_sampler", "filtering", SAMPLER_TONEMAP_LUT)
 
 const body = CodeChunk.from(
     //language=WGSL
@@ -25,46 +29,42 @@ fn main(
 ) -> @location(0) vec4<f32> {
 
     // scene color in linear Rec. 709
-    var color = textureLoad(input_color, vec2i(coord.xy), 0).rgb;
-
-    color *= exposure.value;
+    let color = textureLoad(input_color, vec2i(coord.xy), 0).rgb * exposure.value;
 
-    // Unreal's default SDR rendering, in Rec.709 and within it
-    color = tonemap_ue_filmic(color);
+    let uvw = tonemap_lut_coordinate(color, f32(textureDimensions(lut).x));
+    let color_2020 = tonemap_lut_pq_decode(textureSampleLevel(lut, lut_sampler, uvw, 0.0).rgb);
 
-    // into the primaries the canvas reports it was configured with (Renderer#configure_context): Display P3, or
-    // sRGB where the browser would not configure P3. A Rec.709 colour sits inside both.
+    // into the primaries the canvas reports it was configured with (Renderer#configure_context)
     let color_display = mat3x3<f32>(
-        settings.display_from_rec709_c0,
-        settings.display_from_rec709_c1,
-        settings.display_from_rec709_c2
-    ) * color;
+        settings.display_from_rec2020_c0,
+        settings.display_from_rec2020_c1,
+        settings.display_from_rec2020_c2
+    ) * color_2020;
 
     // apply gamma. Note that gamma is the same for "Display P3" and "sRGB"
-    color = sRGBTransferOETF(color_display);
+    var color_gamma = sRGBTransferOETF(color_display);
 
     // apply dither to remove color banding
-    color += dither_color_8bit_triangle_noise(coord.xy);
+    color_gamma += dither_color_8bit_triangle_noise(coord.xy);
 
-    return vec4(color, 1.0);
+    return vec4(color_gamma, 1.0);
 }
     `, [
-        chunk_tonemap_ue_filmic,
+        chunk_tonemap_lut,
         chunk_dither_color_8bit_triangle_noise,
         chunk_sRGBTransferOETF,
     ]
 );
 
 /**
- * The SDR output with {@link ShadeToneMappingMode.ACES}: exposure, Unreal Engine's default "Filmic" tone mapping, the
- * canvas's primaries, the sRGB transfer curve and an 8-bit dither. {@link shader_tonemap_HDR_aces} expands the same
- * picture into an HDR display's headroom.
+ * The SDR output of {@link ToneMapper}: exposure, then the SDR LUT, the canvas's primaries, the sRGB transfer curve
+ * and an 8-bit dither. The 8-bit target clips anything the LUT puts past SDR white.
  *
  * @type {ImageShader}
  */
-export const shader_tonemap_LDR_aces = new ImageShader({
+export const shader_tonemap_LDR_lut = new ImageShader({
     descriptor: ShaderDescriptor.from({
-        label: "Tonemap/LDR/aces",
+        label: "Tonemap/LDR",
         resources,
         body
     }),

package/src/shade/renderer/deferred/tonemap/shader_tonemap_lut_bake.d.ts

@@ -0,0 +1,23 @@
+/**
+ * The compute shader that bakes `operator` into a LUT, `lut`, one texel a thread: the texel's PQ signal decoded to
+ * exposed scene colour, through the colour grade and the operator, and encoded again, as {@link chunk_tonemap_lut}
+ * describes. The grade is `grade`, a {@link COLOR_GRADE_STRUCT}, and `grade_keys`, its curves' keyframes; see
+ * `ColorGrade#pack`. Built on first use and kept for the operator.
+ *
+ * Dispatch `ceil(resolution / TONEMAP_LUT_BAKE_GROUP)` workgroups along each axis.
+ *
+ * @param {ToneMapOperator} operator
+ * @returns {ComputeShader}
+ */
+export function shader_tonemap_lut_bake(operator: ToneMapOperator): ComputeShader;
+/**
+ * Immediate data of a bake: the peak the operator is evaluated for, `PAPER_WHITE_NITS` for an SDR LUT.
+ */
+export const TONEMAP_LUT_BAKE_SETTINGS: WebGPUStruct;
+/**
+ * Edge of the cube of LUT texels one workgroup bakes.
+ */
+export const TONEMAP_LUT_BAKE_GROUP: 4;
+import { ComputeShader } from "../../shader/ComputeShader.js";
+import { WebGPUStruct } from "../../shader/type/WebGPUStruct.js";
+//# sourceMappingURL=shader_tonemap_lut_bake.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"shader_tonemap_lut_bake.d.ts","sourceRoot":"","sources":["../../../../../../src/shade/renderer/deferred/tonemap/shader_tonemap_lut_bake.js"],"names":[],"mappings":"AA2BA;;;;;;;;;;GAUG;AACH,oEAFa,aAAa,CAuDzB;AA/ED;;GAEG;AACH,qDAA+E;AAE/E;;GAEG;AACH,uCAAwC;8BAfV,+BAA+B;6BAIhC,mCAAmC"}