@unikia/upe-renderer 0.186.110 → 0.187.11

package/examples/jsm/tsl/display/GodraysNode.js

@@ -1,5 +1,5 @@
-import { Frustum, Matrix4, RenderTarget, Vector2, RendererUtils, QuadMesh, TempNode, NodeMaterial, NodeUpdateType, Vector3, Plane } from 'three/webgpu';
-import { cubeTexture, clamp, viewZToPerspectiveDepth, logarithmicDepthToViewZ, float, Loop, max, Fn, passTexture, uv, dot, uniformArray, If, getViewPosition, uniform, vec4, add, interleavedGradientNoise, screenCoordinate, round, mul, uint, mix, exp, vec3, distance, pow, reference, lightPosition, vec2, bool, texture, perspectiveDepthToViewZ, lightShadowMatrix, context } from 'three/tsl';
+import { Frustum, Matrix4, RenderTarget, Vector2, RendererUtils, QuadMesh, Node, NodeMaterial, NodeUpdateType, Vector3, Plane } from 'three/webgpu';
+import { cubeTexture, clamp, viewZToPerspectiveDepth, float, Loop, max, Fn, passTexture, uv, dot, uniformArray, If, getViewPosition, uniform, vec4, add, interleavedGradientNoise, screenCoordinate, round, mul, uint, mix, exp, vec3, distance, pow, reference, lightPosition, vec2, bool, texture, perspectiveDepthToViewZ, lightShadowMatrix, context, projectionDepth } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
 const _size = /*@__PURE__*/ new Vector2();
@@ -45,10 +45,10 @@ let _rendererState;
  *
  * Reference: This Node is a part of [three-good-godrays](https://github.com/Ameobea/three-good-godrays).
  *
- * @augments TempNode
+ * @augments Node
  * @three_import import { godrays } from 'three/addons/tsl/display/GodraysNode.js';
  */
-class GodraysNode extends TempNode {
+class GodraysNode extends Node {
 
 	static get type() {
 
@@ -354,21 +354,7 @@ class GodraysNode extends TempNode {
 		const uvNode = uv();
 		const lightPos = lightPosition( this._light );
 
-		const sampleDepth = ( uv ) => {
-
-			const depth = this.depthNode.sample( uv ).r;
-
-			if ( builder.renderer.logarithmicDepthBuffer === true ) {
-
-				const viewZ = logarithmicDepthToViewZ( depth, this._cameraNear, this._cameraFar );
-
-				return viewZToPerspectiveDepth( viewZ, this._cameraNear, this._cameraFar );
-
-			}
-
-			return depth;
-
-		};
+		const sampleDepth = ( uv ) => projectionDepth( this.depthNode.sample( uv ).r, this._cameraNear, this._cameraFar );
 
 		const sdPlane = ( p, n, h ) => {
 

package/examples/jsm/tsl/display/ImportanceSampledEnvironment.js

@@ -415,6 +415,7 @@ class ImportanceSampledEnvironment {
 	 * @param {Node<vec3>} params.V - View-space direction to camera.
 	 * @param {Node<float>} params.alpha - GGX roughness (alpha).
 	 * @param {Node<vec3>} params.f0
+	 * @param {Node<float>} [params.f90=1] - Grazing reflectance.
 	 * @return {Node<vec3>}
 	 */
 	sampleEnvironmentBRDF( {
@@ -423,7 +424,8 @@ class ImportanceSampledEnvironment {
 		N,
 		V,
 		alpha,
-		f0
+		f0,
+		f90 = float( 1 )
 	} ) {
 
 		const worldNormal = cameraWorldMatrix.mul( vec4( N, 0 ) ).xyz.normalize().toVar();
@@ -440,7 +442,7 @@ class ImportanceSampledEnvironment {
 		const NdotL1 = max( float( 0 ), dot( worldNormal, L1 ) ).toVar();
 		const VdotH1 = max( float( 0 ), dot( worldV, H1 ) ).toVar();
 
-		const W1 = F_Schlick( f0, VdotH1 ).mul( GeometryTerm( NdotL1, NdotV, alpha ) ).div( SmithG( NdotV, alpha ).max( float( 1e-4 ) ) );
+		const W1 = F_Schlick( f0, VdotH1, f90 ).mul( GeometryTerm( NdotL1, NdotV, alpha ) ).div( SmithG( NdotV, alpha ).max( float( 1e-4 ) ) );
 
 		return brdfEnvColor.mul( W1 ).mul( this.intensity );
 
@@ -461,6 +463,7 @@ class ImportanceSampledEnvironment {
 	 * @param {Node<vec3>} params.V - View-space direction to camera.
 	 * @param {Node<float>} params.alpha - GGX roughness (alpha).
 	 * @param {Node<vec3>} params.f0
+	 * @param {Node<float>} [params.f90=1] - Grazing reflectance.
 	 * @param {Node<vec4>} params.Xi2 - Second blue-noise sample (zw used for the CDF).
 	 * @return {Node<vec3>}
 	 */
@@ -471,6 +474,7 @@ class ImportanceSampledEnvironment {
 		V,
 		alpha,
 		f0,
+		f90 = float( 1 ),
 		Xi2
 	} ) {
 
@@ -503,7 +507,7 @@ class ImportanceSampledEnvironment {
 
 		// Monte-Carlo weight f·cosθ/pdfBrdf1 = F·G1(N·L) (GGX D cancels analytically — stable at low
 		// roughness). G2 and the pdf's G1 must use the same alpha for the cancellation to hold.
-		const W1 = F_Schlick( f0, VdotH1 ).mul( GeometryTerm( NdotL1, NdotV, alpha ) ).div( SmithG( NdotV, alpha ).max( float( 1e-4 ) ) );
+		const W1 = F_Schlick( f0, VdotH1, f90 ).mul( GeometryTerm( NdotL1, NdotV, alpha ) ).div( SmithG( NdotV, alpha ).max( float( 1e-4 ) ) );
 		const result = brdfEnvColor.mul( W1 ).mul( w1 ).toVar();
 
 		// MIS sample 2: the env-luminance CDF direction
@@ -537,7 +541,7 @@ class ImportanceSampledEnvironment {
 
 				// Specular BRDF (without Fresnel): D·G2 / (4·N·L·N·V), reusing D. Same GGX alpha as the pdf.
 				const envBrdfSpec = D.mul( GeometryTerm( envNdotL, NdotV, alpha ) ).div( max( float( 1e-6 ), float( 4 ).mul( envNdotL ).mul( NdotV ) ) );
-				const envFresnelWeight = F_Schlick( f0, envVdotH ); // vec3 — chromatic metal tint
+				const envFresnelWeight = F_Schlick( f0, envVdotH, f90 ); // vec3 — chromatic metal tint
 
 				result.addAssign( sampledColor.mul( envBrdfSpec ).mul( envFresnelWeight ).mul( envNdotL ).div( pdfEnv2 ).mul( w2 ) );
 

package/examples/jsm/tsl/display/LensflareNode.js

@@ -1,4 +1,4 @@
-import { RenderTarget, Vector2, TempNode, NodeUpdateType, QuadMesh, RendererUtils, NodeMaterial } from 'three/webgpu';
+import { RenderTarget, Vector2, Node, NodeUpdateType, QuadMesh, RendererUtils, NodeMaterial } from 'three/webgpu';
 import { convertToTexture, nodeObject, Fn, passTexture, uv, vec2, vec3, vec4, max, float, sub, int, Loop, fract, pow, distance, context } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
@@ -13,10 +13,10 @@ let _rendererState;
  * - {@link https://john-chapman-graphics.blogspot.com/2013/02/pseudo-lens-flare.html}.
  * - {@link https://john-chapman.github.io/2017/11/05/pseudo-lens-flare.html}.
  *
- * @augments TempNode
+ * @augments Node
  * @three_import import { lensflare } from 'three/addons/tsl/display/LensflareNode.js';
  */
-class LensflareNode extends TempNode {
+class LensflareNode extends Node {
 
 	static get type() {
 

package/examples/jsm/tsl/display/Lut3DNode.js

@@ -1,13 +1,13 @@
-import { TempNode } from 'three/webgpu';
+import { Node } from 'three/webgpu';
 import { nodeObject, Fn, float, uniform, vec3, vec4, mix } from 'three/tsl';
 
 /**
  * A post processing node for color grading via lookup tables.
  *
- * @augments TempNode
+ * @augments Node
  * @three_import import { lut3D } from 'three/addons/tsl/display/Lut3DNode.js';
  */
-class Lut3DNode extends TempNode {
+class Lut3DNode extends Node {
 
 	static get type() {
 

package/examples/jsm/tsl/display/OITPassNode.js

@@ -252,11 +252,6 @@ class OITPassNode extends PassNode {
 
 		_rendererState = RendererUtils.saveRendererState( renderer, _rendererState );
 
-		const currentAutoClearColor = renderer.autoClearColor;
-		const currentAutoClearDepth = renderer.autoClearDepth;
-		const currentAutoClearStencil = renderer.autoClearStencil;
-		const currentTransparent = renderer.transparent;
-		const currentOpaque = renderer.opaque;
 		const currentMask = camera.layers.mask;
 
 		this._cameraNear.value = camera.near;
@@ -299,12 +294,6 @@ class OITPassNode extends PassNode {
 		RendererUtils.restoreSceneState( scene, _sceneState );
 		RendererUtils.restoreRendererState( renderer, _rendererState );
 
-		renderer.autoClearColor = currentAutoClearColor;
-		renderer.autoClearDepth = currentAutoClearDepth;
-		renderer.autoClearStencil = currentAutoClearStencil;
-		renderer.transparent = currentTransparent;
-		renderer.opaque = currentOpaque;
-
 		camera.layers.mask = currentMask;
 
 		this._renderer = null;

package/examples/jsm/tsl/display/OutlineNode.js

@@ -1,4 +1,4 @@
-import { DepthTexture, FloatType, RenderTarget, Vector2, TempNode, QuadMesh, NodeMaterial, SpriteNodeMaterial, RendererUtils, NodeUpdateType } from 'three/webgpu';
+import { DepthTexture, FloatType, RenderTarget, Vector2, Node, QuadMesh, NodeMaterial, SpriteNodeMaterial, RendererUtils, NodeUpdateType } from 'three/webgpu';
 import { Loop, int, exp, min, float, mul, uv, vec2, vec3, Fn, textureSize, orthographicDepthToViewZ, screenUV, nodeObject, uniform, vec4, passTexture, texture, perspectiveDepthToViewZ, positionView, reference, color } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
@@ -39,10 +39,10 @@ let _rendererState;
  * renderPipeline.outputNode = outlineColor.add( scenePass );
  * ```
  *
- * @augments TempNode
+ * @augments Node
  * @three_import import { outline } from 'three/addons/tsl/display/OutlineNode.js';
  */
-class OutlineNode extends TempNode {
+class OutlineNode extends Node {
 
 	static get type() {
 
@@ -357,6 +357,49 @@ class OutlineNode extends TempNode {
 		this._compositeMaterial = new NodeMaterial();
 		this._compositeMaterial.name = 'OutlineNode.composite';
 
+		/**
+		 * An internal cache for depth materials.
+		 *
+		 * @private
+		 * @type {Map<Material, NodeMaterial>}
+		 */
+		this._depthMaterialCache = new Map();
+
+		/**
+		 * An internal cache for mask materials.
+		 *
+		 * @private
+		 * @type {Map<Material, NodeMaterial>}
+		 */
+		this._prepareMaskMaterialCache = new Map();
+
+		/**
+		 * Disposes the pass materials of a disposed material.
+		 *
+		 * @private
+		 * @type {Function}
+		 */
+		this._onMaterialDispose = ( event ) => {
+
+			const originalMaterial = event.target;
+
+			originalMaterial.removeEventListener( 'dispose', this._onMaterialDispose );
+
+			for ( const cache of [ this._depthMaterialCache, this._prepareMaskMaterialCache ] ) {
+
+				const passMaterial = cache.get( originalMaterial );
+
+				if ( passMaterial !== undefined ) {
+
+					passMaterial.dispose();
+					cache.delete( originalMaterial );
+
+				}
+
+			}
+
+		};
+
 		/**
 		 * A set to cache selected objects in the scene.
 		 *
@@ -509,7 +552,8 @@ class OutlineNode extends TempNode {
 
 			if ( this._selectionCache.has( object ) === false ) {
 
-				const overrideMaterial = object.isSprite ? this._depthSpriteMaterial : this._depthMaterial;
+				const baseMaterial = object.isSprite ? this._depthSpriteMaterial : this._depthMaterial;
+				const overrideMaterial = this._getPassMaterial( this._depthMaterialCache, baseMaterial, material );
 
 				renderer.renderObject( object, scene, camera, geometry, overrideMaterial, group, lightsNode, clippingContext );
 
@@ -527,7 +571,8 @@ class OutlineNode extends TempNode {
 
 			if ( this._selectionCache.has( object ) === true ) {
 
-				const overrideMaterial = object.isSprite ? this._prepareMaskSpriteMaterial : this._prepareMaskMaterial;
+				const baseMaterial = object.isSprite ? this._prepareMaskSpriteMaterial : this._prepareMaskMaterial;
+				const overrideMaterial = this._getPassMaterial( this._prepareMaskMaterialCache, baseMaterial, material );
 
 				renderer.renderObject( object, scene, camera, geometry, overrideMaterial, group, lightsNode, clippingContext );
 
@@ -771,6 +816,20 @@ class OutlineNode extends TempNode {
 		this._separableBlurMaterial2.dispose();
 		this._compositeMaterial.dispose();
 
+		for ( const cache of [ this._depthMaterialCache, this._prepareMaskMaterialCache ] ) {
+
+			for ( const [ originalMaterial, passMaterial ] of cache ) {
+
+				originalMaterial.removeEventListener( 'dispose', this._onMaterialDispose );
+
+				passMaterial.dispose();
+
+			}
+
+			cache.clear();
+
+		}
+
 	}
 
 	/**
@@ -793,6 +852,49 @@ class OutlineNode extends TempNode {
 
 	}
 
+	/**
+	 * For the given material, this method returns the corresponding pass material.
+	 *
+	 * @private
+	 * @param {Map<Material, NodeMaterial>} cache - The material cache of the pass.
+	 * @param {NodeMaterial} baseMaterial - The pass material to derive from.
+	 * @param {Material} originalMaterial - The object's material.
+	 * @return {NodeMaterial} The pass material.
+	 */
+	_getPassMaterial( cache, baseMaterial, originalMaterial ) {
+
+		if ( ! originalMaterial.positionNode ) return baseMaterial; // early out if there are no node modifications
+
+		let force = false;
+		let passMaterial = cache.get( originalMaterial );
+
+		// create
+
+		if ( passMaterial === undefined ) {
+
+			passMaterial = baseMaterial.clone();
+
+			cache.set( originalMaterial, passMaterial );
+
+			originalMaterial.addEventListener( 'dispose', this._onMaterialDispose );
+
+			force = true;
+
+		}
+
+		// update
+
+		if ( passMaterial.version !== originalMaterial.version || force === true ) {
+
+			passMaterial.positionNode = originalMaterial.positionNode || null;
+			passMaterial.version = originalMaterial.version;
+
+		}
+
+		return passMaterial;
+
+	}
+
 }
 
 export default OutlineNode;