import WebGPUBackend from 'three/src/renderers/webgpu/WebGPUBackend.js';
import { REVISION, HalfFloatType } from 'three/src/constants.js';
/**
* An HDR-enabled WebGPU backend for three.js, extending the standard `WebGPUBackend`.
* This class configures the WebGPU context to support High Dynamic Range rendering
* by setting the output color space to "rec2100-hlg".
* **You should never have the need to use this!**
*
* @class
* @augments {WebGPUBackend}
* @deprecated Use WebGPUBackend instead
*/
class HDRWebGPUBackend extends WebGPUBackend {
get context() {
const canvasTarget = this.renderer.getCanvasTarget();
const canvasData = this.get( canvasTarget );
let context = canvasData.context;
if ( context === undefined ) {
const parameters = this.parameters;
if ( canvasTarget.isDefaultCanvasTarget === true && parameters.context !== undefined ) {
context = parameters.context;
} else {
context = canvasTarget.domElement.getContext( 'webgpu' );
}
// OffscreenCanvas does not have setAttribute, see #22811
if ( 'setAttribute' in canvasTarget.domElement ) canvasTarget.domElement.setAttribute( 'data-engine', `three.js r${ REVISION } webgpu` );
const alphaMode = parameters.alpha ? 'premultiplied' : 'opaque';
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const toneMappingMode = parameters.outputType === HalfFloatType ? 'extended' : 'standard';
// See https://github.com/ccameron-chromium/webgpu-hdr/blob/main/EXPLAINER.md#example-use
/**
* Configures the WebGPU context with HDR settings.
* The `colorSpace` is set to `rec2100-hlg` for High Dynamic Range support.
* @see {@link https://github.com/ccameron-chromium/webgpu-hdr/blob/main/EXPLAINER.md#example-use | WebGPU HDR Explainer}
*/
const hdrSettings = {};
const dynamicRangeHighMQ = window.matchMedia("(dynamic-range: high)").matches;
if (dynamicRangeHighMQ) {
hdrSettings["colorSpace"] = "rec2100-hlg";
hdrSettings["toneMapping"] = { mode: "extended" };
}
if (Array.isArray(navigator.userAgent.match(/Version\/[\d.]+.*Safari/))) {
delete hdrSettings["colorSpace"];
}
context.configure( {
device: this.device,
format: this.utils.getPreferredCanvasFormat(),
usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC,
alphaMode: alphaMode,
...hdrSettings
} );
canvasData.context = context;
}
return context;
}
}
export default HDRWebGPUBackend;
Source