diff --git a/examples-testing/changes.patch b/examples-testing/changes.patch index 8857496a1..ae3762ced 100644 --- a/examples-testing/changes.patch +++ b/examples-testing/changes.patch @@ -13372,7 +13372,7 @@ index 58615db84..1ae4e437f 100644 renderer.render(scene, camera); } diff --git a/examples-testing/examples/webgl_tonemapping.ts b/examples-testing/examples/webgl_tonemapping.ts -index 2163e1b06..a7cb196ef 100644 +index 00aee8de5..7115e15d0 100644 --- a/examples-testing/examples/webgl_tonemapping.ts +++ b/examples-testing/examples/webgl_tonemapping.ts @@ -1,23 +1,32 @@ @@ -13414,7 +13414,7 @@ index 2163e1b06..a7cb196ef 100644 None: THREE.NoToneMapping, Linear: THREE.LinearToneMapping, Reinhard: THREE.ReinhardToneMapping, -@@ -112,7 +121,7 @@ async function init() { +@@ -110,7 +119,7 @@ async function init() { const toneMappingFolder = gui.addFolder('Tone Mapping'); toneMappingFolder @@ -13423,7 +13423,7 @@ index 2163e1b06..a7cb196ef 100644 .name('type') .onChange(function () { -@@ -151,9 +160,9 @@ async function init() { +@@ -149,9 +158,9 @@ async function init() { function updateGUI() { if (params.toneMapping === 'None') { @@ -19077,29 +19077,100 @@ index 0d21da69a..b5afcbc47 100644 renderPipeline.render(); diff --git a/examples-testing/examples/webgpu_postprocessing_anamorphic.ts b/examples-testing/examples/webgpu_postprocessing_anamorphic.ts -index 1cdb6893c..8286bb59b 100644 +index 20118247a..877b921bd 100644 --- a/examples-testing/examples/webgpu_postprocessing_anamorphic.ts +++ b/examples-testing/examples/webgpu_postprocessing_anamorphic.ts -@@ -9,8 +9,8 @@ import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; +@@ -26,8 +26,12 @@ import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; import { Inspector } from 'three/addons/inspector/Inspector.js'; --let camera, scene, renderer; +-let camera, scene, renderer, instancedMesh, controls; -let renderPipeline; -+let camera: THREE.PerspectiveCamera, scene: THREE.Scene, renderer: THREE.WebGPURenderer; ++let camera: THREE.PerspectiveCamera, ++ scene: THREE.Scene, ++ renderer: THREE.WebGPURenderer, ++ instancedMesh: THREE.InstancedMesh, ++ controls: OrbitControls; +let renderPipeline: THREE.RenderPipeline; - const params = { - resolutionScale: 0.2, -@@ -77,7 +77,7 @@ async function init() { + const _dummy = new THREE.Object3D(); + +@@ -104,31 +108,41 @@ async function init() { + bloomPass.setResolutionScale(0.25); + + // Custom high pass for anamorphic bloom +- bloomPass.highPassFn = Fn(({ input, threshold, smoothWidth }) => { +- // Extract bright areas to a texture (computed once, sampled many times) +- const v = luminance(input.rgb); +- const alpha = smoothstep(threshold, threshold.add(smoothWidth), v); +- const brightPass = rtt(mix(vec4(0), input, alpha), null, null, { +- wrapS: THREE.MirroredRepeatWrapping, +- wrapT: THREE.MirroredRepeatWrapping, +- }); +- +- // Horizontal blur +- const total = vec4(0); +- const halfSamples = samples.div(2); +- +- const invSize = vec2(1.0).div(viewportSize); +- +- Loop({ start: halfSamples.negate(), end: halfSamples }, ({ i }) => { +- let softness = float(i).abs().div(halfSamples).oneMinus(); +- softness = softness.pow(2.0); +- +- const shiftedUV = vec2(uv().x.add(invSize.x.mul(i).mul(4.0)), uv().y); +- total.addAssign(brightPass.sample(shiftedUV).mul(softness)); +- }); +- +- return total.div(samples.div(3.0)); +- }); ++ bloomPass.highPassFn = Fn( ++ ({ ++ input, ++ threshold, ++ smoothWidth, ++ }: { ++ input: THREE.Node<'vec4'>; ++ threshold: THREE.UniformNode<'float', number>; ++ smoothWidth: THREE.UniformNode<'float', number>; ++ }) => { ++ // Extract bright areas to a texture (computed once, sampled many times) ++ const v = luminance(input.rgb); ++ const alpha = smoothstep(threshold, threshold.add(smoothWidth), v); ++ const brightPass = rtt(mix(vec4(0), input, alpha), null, null, { ++ wrapS: THREE.MirroredRepeatWrapping, ++ wrapT: THREE.MirroredRepeatWrapping, ++ }); ++ ++ // Horizontal blur ++ const total = vec4(0); ++ const halfSamples = samples.div(2); ++ ++ const invSize = vec2(1.0).div(viewportSize); ++ ++ Loop({ start: halfSamples.negate(), end: halfSamples }, ({ i }) => { ++ let softness = float(i).abs().div(halfSamples).oneMinus(); ++ softness = softness.pow(2.0); ++ ++ const shiftedUV = vec2(uv().x.add(invSize.x.mul(i).mul(4.0)), uv().y); ++ total.addAssign(brightPass.sample(shiftedUV).mul(softness)); ++ }); ++ ++ return total.div(samples.div(3.0)); ++ }, ++ ); + + const anamorphicPass = bloomPass.mul(tintColor).toInspector('Anamorphic'); + +@@ -137,7 +151,7 @@ async function init() { // gui - const gui = renderer.inspector.createParameters('Settings'); + const gui = (renderer.inspector as Inspector).createParameters('Settings'); - gui.add(intensity, 'value', 0, 4, 0.1).name('intensity'); - gui.add(threshold, 'value', 0.8, 3, 0.001).name('threshold'); - gui.add(scaleNode, 'value', 1, 10, 0.1).name('scale'); + gui.add(intensity, 'value', 0, 10).name('intensity'); + gui.add(threshold, 'value', 0, 0.9).name('threshold'); + gui.add(samples, 'value', 2, 128, 1).name('samples'); diff --git a/examples-testing/examples/webgpu_postprocessing_ao.ts b/examples-testing/examples/webgpu_postprocessing_ao.ts index 76046bee8..460c90fd6 100644 --- a/examples-testing/examples/webgpu_postprocessing_ao.ts diff --git a/three.js b/three.js index e70a1b55d..cfc519890 160000 --- a/three.js +++ b/three.js @@ -1 +1 @@ -Subproject commit e70a1b55d04cf7094022e229cfa26c041b121c08 +Subproject commit cfc5198905c15a87ea63804915bcaa2b1a757ec4 diff --git a/types/three/examples/jsm/tsl/display/AnamorphicNode.d.ts b/types/three/examples/jsm/tsl/display/AnamorphicNode.d.ts deleted file mode 100644 index 38f2fae2f..000000000 --- a/types/three/examples/jsm/tsl/display/AnamorphicNode.d.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { Node, TempNode, Vector2 } from "three/webgpu"; - -export default class AnamorphicNode extends TempNode<"vec4"> { - textureNode: Node; - thresholdNode: Node; - scaleNode: Node; - samples: number; - resolutionScale: number; - - constructor(textureNode: Node, thresholdNode: Node, scaleNode: Node, samples: number); - - getTextureNode(): Node; - - setSize(width: number, height: number): void; - - /** - * @deprecated The "resolution" property has been renamed to "resolutionScale" and is now of type `number`. - */ - get resolution(): Vector2; - /** - * @deprecated The "resolution" property has been renamed to "resolutionScale" and is now of type `number`. - */ - set resolution(value: Vector2); -} - -export const anamorphic: ( - node: Node, - threshold?: Node, - scale?: Node, - samples?: Node | number, -) => AnamorphicNode; diff --git a/types/three/examples/jsm/tsl/display/BloomNode.d.ts b/types/three/examples/jsm/tsl/display/BloomNode.d.ts index 291e697a3..924496fab 100644 --- a/types/three/examples/jsm/tsl/display/BloomNode.d.ts +++ b/types/three/examples/jsm/tsl/display/BloomNode.d.ts @@ -1,25 +1,42 @@ import { Node, TempNode, TextureNode, UniformNode } from "three/webgpu"; declare class BloomNode extends TempNode<"vec4"> { - inputNode: Node; + inputNode: Node<"vec4">; strength: UniformNode<"float", number>; radius: UniformNode<"float", number>; threshold: UniformNode<"float", number>; smoothWidth: UniformNode<"float", number>; - constructor(inputNode: Node, strength?: number, radius?: number, threshold?: number); + highPassFn: ( + params: { + input: Node<"vec4">; + threshold: UniformNode<"float", number>; + smoothWidth: UniformNode<"float", number>; + }, + ) => void; + + constructor( + inputNode: Node, + strength?: UniformNode<"float", number> | number, + radius?: UniformNode<"float", number> | number, + threshold?: UniformNode<"float", number> | number, + ); getTexture(): TextureNode; + setResolutionScale(resolutionScale: number): this; + + getResolutionScale(): number; + setSize(width: number, height: number): void; } export const bloom: ( - node: Node, - strength?: number, - radius?: number, - threshold?: number, + node: Node<"vec4">, + strength?: UniformNode<"float", number> | number, + radius?: UniformNode<"float", number> | number, + threshold?: UniformNode<"float", number> | number, ) => BloomNode; export default BloomNode; diff --git a/types/three/src/nodes/Nodes.d.ts b/types/three/src/nodes/Nodes.d.ts index 9a06e2143..1819f96ae 100644 --- a/types/three/src/nodes/Nodes.d.ts +++ b/types/three/src/nodes/Nodes.d.ts @@ -161,7 +161,7 @@ export { default as MaxMipLevelNode } from "./utils/MaxMipLevelNode.js"; export { default as MemberNode } from "./utils/MemberNode.js"; export { default as ReflectorNode, ReflectorNodeParameters } from "./utils/ReflectorNode.js"; export { default as RotateNode } from "./utils/RotateNode.js"; -export { default as RTTNode, RTTNodeOptions } from "./utils/RTTNode.js"; +export { default as RTTNode } from "./utils/RTTNode.js"; export { default as SampleNode } from "./utils/SampleNode.js"; export { default as SetNode } from "./utils/SetNode.js"; export { default as SplitNode } from "./utils/SplitNode.js"; diff --git a/types/three/src/nodes/utils/RTTNode.d.ts b/types/three/src/nodes/utils/RTTNode.d.ts index 11b91bcca..c0ba23911 100644 --- a/types/three/src/nodes/utils/RTTNode.d.ts +++ b/types/three/src/nodes/utils/RTTNode.d.ts @@ -1,12 +1,7 @@ -import { TextureDataType } from "../../constants.js"; -import { RenderTarget } from "../../core/RenderTarget.js"; +import { RenderTarget, RenderTargetOptions } from "../../core/RenderTarget.js"; import TextureNode from "../accessors/TextureNode.js"; import Node from "../core/Node.js"; -export interface RTTNodeOptions { - type: TextureDataType; -} - declare class RTTNode extends TextureNode { readonly isRTTNode: true; @@ -21,7 +16,7 @@ declare class RTTNode extends TextureNode { pixelRatio?: number; - constructor(node: Node, width?: number | null, height?: number | null, options?: RTTNodeOptions); + constructor(node: Node, width?: number | null, height?: number | null, options?: RenderTargetOptions); get autoResize(): boolean; @@ -36,11 +31,11 @@ export const rtt: ( node: Node, width?: number | null, height?: number | null, - options?: RTTNodeOptions, + options?: RenderTargetOptions, ) => RTTNode; export const convertToTexture: ( node: Node, width?: number | null, height?: number | null, - options?: RTTNodeOptions, + options?: RenderTargetOptions, ) => RTTNode;