super-three 0.167.0 → 0.168.0

package/src/nodes/display/ToneMappingFunctions.js

@@ -0,0 +1,190 @@
+import { Fn, float, mat3, vec3, If } from '../tsl/TSLBase.js';
+import { select } from '../math/ConditionalNode.js';
+import { clamp, log2, max, min, pow, mix } from '../math/MathNode.js';
+import { mul, sub, div } from '../math/OperatorNode.js';
+
+// exposure only
+
+export const LinearToneMapping = /*@__PURE__*/ Fn( ( [ color, exposure ] ) => {
+
+	return color.mul( exposure ).clamp();
+
+} ).setLayout( {
+	name: 'LinearToneMapping',
+	type: 'vec3',
+	inputs: [
+		{ name: 'color', type: 'vec3' },
+		{ name: 'exposure', type: 'float' }
+	]
+} );
+
+// source: https://www.cs.utah.edu/docs/techreports/2002/pdf/UUCS-02-001.pdf
+
+export const ReinhardToneMapping = /*@__PURE__*/ Fn( ( [ color, exposure ] ) => {
+
+	color = color.mul( exposure );
+
+	return color.div( color.add( 1.0 ) ).clamp();
+
+} ).setLayout( {
+	name: 'ReinhardToneMapping',
+	type: 'vec3',
+	inputs: [
+		{ name: 'color', type: 'vec3' },
+		{ name: 'exposure', type: 'float' }
+	]
+} );
+
+// source: http://filmicworlds.com/blog/filmic-tonemapping-operators/
+
+export const CineonToneMapping = /*@__PURE__*/ Fn( ( [ color, exposure ] ) => {
+
+	// filmic operator by Jim Hejl and Richard Burgess-Dawson
+	color = color.mul( exposure );
+	color = color.sub( 0.004 ).max( 0.0 );
+
+	const a = color.mul( color.mul( 6.2 ).add( 0.5 ) );
+	const b = color.mul( color.mul( 6.2 ).add( 1.7 ) ).add( 0.06 );
+
+	return a.div( b ).pow( 2.2 );
+
+} ).setLayout( {
+	name: 'CineonToneMapping',
+	type: 'vec3',
+	inputs: [
+		{ name: 'color', type: 'vec3' },
+		{ name: 'exposure', type: 'float' }
+	]
+} );
+
+// source: https://github.com/selfshadow/ltc_code/blob/master/webgl/shaders/ltc/ltc_blit.fs
+
+const RRTAndODTFit = /*@__PURE__*/ Fn( ( [ color ] ) => {
+
+	const a = color.mul( color.add( 0.0245786 ) ).sub( 0.000090537 );
+	const b = color.mul( color.add( 0.4329510 ).mul( 0.983729 ) ).add( 0.238081 );
+
+	return a.div( b );
+
+} );
+
+// source: https://github.com/selfshadow/ltc_code/blob/master/webgl/shaders/ltc/ltc_blit.fs
+
+export const ACESFilmicToneMapping = /*@__PURE__*/ Fn( ( [ color, exposure ] ) => {
+
+	// sRGB => XYZ => D65_2_D60 => AP1 => RRT_SAT
+	const ACESInputMat = mat3(
+		0.59719, 0.35458, 0.04823,
+		0.07600, 0.90834, 0.01566,
+		0.02840, 0.13383, 0.83777
+	);
+
+	// ODT_SAT => XYZ => D60_2_D65 => sRGB
+	const ACESOutputMat = mat3(
+		1.60475, - 0.53108, - 0.07367,
+		- 0.10208, 1.10813, - 0.00605,
+		- 0.00327, - 0.07276, 1.07602
+	);
+
+	color = color.mul( exposure ).div( 0.6 );
+
+	color = ACESInputMat.mul( color );
+
+	// Apply RRT and ODT
+	color = RRTAndODTFit( color );
+
+	color = ACESOutputMat.mul( color );
+
+	// Clamp to [0, 1]
+	return color.clamp();
+
+} ).setLayout( {
+	name: 'ACESFilmicToneMapping',
+	type: 'vec3',
+	inputs: [
+		{ name: 'color', type: 'vec3' },
+		{ name: 'exposure', type: 'float' }
+	]
+} );
+
+const LINEAR_REC2020_TO_LINEAR_SRGB = /*@__PURE__*/ mat3( vec3( 1.6605, - 0.1246, - 0.0182 ), vec3( - 0.5876, 1.1329, - 0.1006 ), vec3( - 0.0728, - 0.0083, 1.1187 ) );
+const LINEAR_SRGB_TO_LINEAR_REC2020 = /*@__PURE__*/ mat3( vec3( 0.6274, 0.0691, 0.0164 ), vec3( 0.3293, 0.9195, 0.0880 ), vec3( 0.0433, 0.0113, 0.8956 ) );
+
+const agxDefaultContrastApprox = /*@__PURE__*/ Fn( ( [ x_immutable ] ) => {
+
+	const x = vec3( x_immutable ).toVar();
+	const x2 = vec3( x.mul( x ) ).toVar();
+	const x4 = vec3( x2.mul( x2 ) ).toVar();
+
+	return float( 15.5 ).mul( x4.mul( x2 ) ).sub( mul( 40.14, x4.mul( x ) ) ).add( mul( 31.96, x4 ).sub( mul( 6.868, x2.mul( x ) ) ).add( mul( 0.4298, x2 ).add( mul( 0.1191, x ).sub( 0.00232 ) ) ) );
+
+} );
+
+export const AgXToneMapping = /*@__PURE__*/ Fn( ( [ color, exposure ] ) => {
+
+	const colortone = vec3( color ).toVar();
+	const AgXInsetMatrix = mat3( vec3( 0.856627153315983, 0.137318972929847, 0.11189821299995 ), vec3( 0.0951212405381588, 0.761241990602591, 0.0767994186031903 ), vec3( 0.0482516061458583, 0.101439036467562, 0.811302368396859 ) );
+	const AgXOutsetMatrix = mat3( vec3( 1.1271005818144368, - 0.1413297634984383, - 0.14132976349843826 ), vec3( - 0.11060664309660323, 1.157823702216272, - 0.11060664309660294 ), vec3( - 0.016493938717834573, - 0.016493938717834257, 1.2519364065950405 ) );
+	const AgxMinEv = float( - 12.47393 );
+	const AgxMaxEv = float( 4.026069 );
+	colortone.mulAssign( exposure );
+	colortone.assign( LINEAR_SRGB_TO_LINEAR_REC2020.mul( colortone ) );
+	colortone.assign( AgXInsetMatrix.mul( colortone ) );
+	colortone.assign( max( colortone, 1e-10 ) );
+	colortone.assign( log2( colortone ) );
+	colortone.assign( colortone.sub( AgxMinEv ).div( AgxMaxEv.sub( AgxMinEv ) ) );
+	colortone.assign( clamp( colortone, 0.0, 1.0 ) );
+	colortone.assign( agxDefaultContrastApprox( colortone ) );
+	colortone.assign( AgXOutsetMatrix.mul( colortone ) );
+	colortone.assign( pow( max( vec3( 0.0 ), colortone ), vec3( 2.2 ) ) );
+	colortone.assign( LINEAR_REC2020_TO_LINEAR_SRGB.mul( colortone ) );
+	colortone.assign( clamp( colortone, 0.0, 1.0 ) );
+
+	return colortone;
+
+} ).setLayout( {
+	name: 'AgXToneMapping',
+	type: 'vec3',
+	inputs: [
+		{ name: 'color', type: 'vec3' },
+		{ name: 'exposure', type: 'float' }
+	]
+} );
+
+// https://modelviewer.dev/examples/tone-mapping
+
+export const NeutralToneMapping = /*@__PURE__*/ Fn( ( [ color, exposure ] ) => {
+
+	const StartCompression = float( 0.8 - 0.04 );
+	const Desaturation = float( 0.15 );
+
+	color = color.mul( exposure );
+
+	const x = min( color.r, min( color.g, color.b ) );
+	const offset = select( x.lessThan( 0.08 ), x.sub( mul( 6.25, x.mul( x ) ) ), 0.04 );
+
+	color.subAssign( offset );
+
+	const peak = max( color.r, max( color.g, color.b ) );
+
+	If( peak.lessThan( StartCompression ), () => {
+
+		return color;
+
+	} );
+
+	const d = sub( 1, StartCompression );
+	const newPeak = sub( 1, d.mul( d ).div( peak.add( d.sub( StartCompression ) ) ) );
+	color.mulAssign( newPeak.div( peak ) );
+	const g = sub( 1, div( 1, Desaturation.mul( peak.sub( newPeak ) ).add( 1 ) ) );
+
+	return mix( color, vec3( newPeak ), g );
+
+} ).setLayout( {
+	name: 'NeutralToneMapping',
+	type: 'vec3',
+	inputs: [
+		{ name: 'color', type: 'vec3' },
+		{ name: 'exposure', type: 'float' }
+	]
+} );

package/src/nodes/display/ToneMappingNode.js

@@ -1,173 +1,13 @@
+import { registerNode } from '../core/Node.js';
 import TempNode from '../core/TempNode.js';
-import { addNodeClass } from '../core/Node.js';
-import { addNodeElement, tslFn, nodeObject, float, mat3, vec3, If } from '../shadernode/ShaderNode.js';
+import { addMethodChaining, nodeObject, vec4 } from '../tsl/TSLCore.js';
 import { rendererReference } from '../accessors/RendererReferenceNode.js';
-import { cond } from '../math/CondNode.js';
-import { clamp, log2, max, min, pow, mix } from '../math/MathNode.js';
-import { mul, sub, div } from '../math/OperatorNode.js';
 
-import { NoToneMapping, LinearToneMapping, ReinhardToneMapping, CineonToneMapping, ACESFilmicToneMapping, AgXToneMapping, NeutralToneMapping } from '../../constants.js';
-
-// exposure only
-const LinearToneMappingNode = tslFn( ( { color, exposure } ) => {
-
-	return color.mul( exposure ).clamp();
-
-} );
-
-// source: https://www.cs.utah.edu/docs/techreports/2002/pdf/UUCS-02-001.pdf
-const ReinhardToneMappingNode = tslFn( ( { color, exposure } ) => {
-
-	color = color.mul( exposure );
-
-	return color.div( color.add( 1.0 ) ).clamp();
-
-} );
-
-// source: http://filmicworlds.com/blog/filmic-tonemapping-operators/
-const OptimizedCineonToneMappingNode = tslFn( ( { color, exposure } ) => {
-
-	// optimized filmic operator by Jim Hejl and Richard Burgess-Dawson
-	color = color.mul( exposure );
-	color = color.sub( 0.004 ).max( 0.0 );
-
-	const a = color.mul( color.mul( 6.2 ).add( 0.5 ) );
-	const b = color.mul( color.mul( 6.2 ).add( 1.7 ) ).add( 0.06 );
-
-	return a.div( b ).pow( 2.2 );
-
-} );
-
-// source: https://github.com/selfshadow/ltc_code/blob/master/webgl/shaders/ltc/ltc_blit.fs
-const RRTAndODTFit = tslFn( ( { color } ) => {
-
-	const a = color.mul( color.add( 0.0245786 ) ).sub( 0.000090537 );
-	const b = color.mul( color.add( 0.4329510 ).mul( 0.983729 ) ).add( 0.238081 );
-
-	return a.div( b );
-
-} );
-
-// source: https://github.com/selfshadow/ltc_code/blob/master/webgl/shaders/ltc/ltc_blit.fs
-const ACESFilmicToneMappingNode = tslFn( ( { color, exposure } ) => {
-
-	// sRGB => XYZ => D65_2_D60 => AP1 => RRT_SAT
-	const ACESInputMat = mat3(
-		0.59719, 0.35458, 0.04823,
-		0.07600, 0.90834, 0.01566,
-		0.02840, 0.13383, 0.83777
-	);
-
-	// ODT_SAT => XYZ => D60_2_D65 => sRGB
-	const ACESOutputMat = mat3(
-		1.60475, - 0.53108, - 0.07367,
-		- 0.10208, 1.10813, - 0.00605,
-		- 0.00327, - 0.07276, 1.07602
-	);
-
-	color = color.mul( exposure ).div( 0.6 );
-
-	color = ACESInputMat.mul( color );
-
-	// Apply RRT and ODT
-	color = RRTAndODTFit( { color } );
-
-	color = ACESOutputMat.mul( color );
-
-	// Clamp to [0, 1]
-	return color.clamp();
-
-} );
-
-
-
-const LINEAR_REC2020_TO_LINEAR_SRGB = mat3( vec3( 1.6605, - 0.1246, - 0.0182 ), vec3( - 0.5876, 1.1329, - 0.1006 ), vec3( - 0.0728, - 0.0083, 1.1187 ) );
-const LINEAR_SRGB_TO_LINEAR_REC2020 = mat3( vec3( 0.6274, 0.0691, 0.0164 ), vec3( 0.3293, 0.9195, 0.0880 ), vec3( 0.0433, 0.0113, 0.8956 ) );
-
-const agxDefaultContrastApprox = tslFn( ( [ x_immutable ] ) => {
-
-	const x = vec3( x_immutable ).toVar();
-	const x2 = vec3( x.mul( x ) ).toVar();
-	const x4 = vec3( x2.mul( x2 ) ).toVar();
-
-	return float( 15.5 ).mul( x4.mul( x2 ) ).sub( mul( 40.14, x4.mul( x ) ) ).add( mul( 31.96, x4 ).sub( mul( 6.868, x2.mul( x ) ) ).add( mul( 0.4298, x2 ).add( mul( 0.1191, x ).sub( 0.00232 ) ) ) );
-
-} );
-
-const AGXToneMappingNode = tslFn( ( { color, exposure } ) => {
-
-	const colortone = vec3( color ).toVar();
-	const AgXInsetMatrix = mat3( vec3( 0.856627153315983, 0.137318972929847, 0.11189821299995 ), vec3( 0.0951212405381588, 0.761241990602591, 0.0767994186031903 ), vec3( 0.0482516061458583, 0.101439036467562, 0.811302368396859 ) );
-	const AgXOutsetMatrix = mat3( vec3( 1.1271005818144368, - 0.1413297634984383, - 0.14132976349843826 ), vec3( - 0.11060664309660323, 1.157823702216272, - 0.11060664309660294 ), vec3( - 0.016493938717834573, - 0.016493938717834257, 1.2519364065950405 ) );
-	const AgxMinEv = float( - 12.47393 );
-	const AgxMaxEv = float( 4.026069 );
-	colortone.mulAssign( exposure );
-	colortone.assign( LINEAR_SRGB_TO_LINEAR_REC2020.mul( colortone ) );
-	colortone.assign( AgXInsetMatrix.mul( colortone ) );
-	colortone.assign( max( colortone, 1e-10 ) );
-	colortone.assign( log2( colortone ) );
-	colortone.assign( colortone.sub( AgxMinEv ).div( AgxMaxEv.sub( AgxMinEv ) ) );
-	colortone.assign( clamp( colortone, 0.0, 1.0 ) );
-	colortone.assign( agxDefaultContrastApprox( colortone ) );
-	colortone.assign( AgXOutsetMatrix.mul( colortone ) );
-	colortone.assign( pow( max( vec3( 0.0 ), colortone ), vec3( 2.2 ) ) );
-	colortone.assign( LINEAR_REC2020_TO_LINEAR_SRGB.mul( colortone ) );
-	colortone.assign( clamp( colortone, 0.0, 1.0 ) );
-
-	return colortone;
-
-} );
-
-// https://modelviewer.dev/examples/tone-mapping
-
-const NeutralToneMappingNode = tslFn( ( { color, exposure } ) => {
-
-	const StartCompression = float( 0.8 - 0.04 );
-	const Desaturation = float( 0.15 );
-
-	color = color.mul( exposure );
-
-	const x = min( color.r, min( color.g, color.b ) );
-	const offset = cond( x.lessThan( 0.08 ), x.sub( mul( 6.25, x.mul( x ) ) ), 0.04 );
-
-	color.subAssign( offset );
-
-	const peak = max( color.r, max( color.g, color.b ) );
-
-	If( peak.lessThan( StartCompression ), () => {
-
-		return color;
-
-	} );
-
-	const d = sub( 1, StartCompression );
-	const newPeak = sub( 1, d.mul( d ).div( peak.add( d.sub( StartCompression ) ) ) );
-	color.mulAssign( newPeak.div( peak ) );
-	const g = sub( 1, div( 1, Desaturation.mul( peak.sub( newPeak ) ).add( 1 ) ) );
-
-	return mix( color, vec3( newPeak ), g );
-
-} ).setLayout( {
-	name: 'NeutralToneMapping',
-	type: 'vec3',
-	inputs: [
-		{ name: 'color', type: 'vec3' },
-		{ name: 'exposure', type: 'float' }
-	]
-} );
-
-const toneMappingLib = {
-	[ LinearToneMapping ]: LinearToneMappingNode,
-	[ ReinhardToneMapping ]: ReinhardToneMappingNode,
-	[ CineonToneMapping ]: OptimizedCineonToneMappingNode,
-	[ ACESFilmicToneMapping ]: ACESFilmicToneMappingNode,
-	[ AgXToneMapping ]: AGXToneMappingNode,
-	[ NeutralToneMapping ]: NeutralToneMappingNode
-};
+import { NoToneMapping } from '../../constants.js';
 
 class ToneMappingNode extends TempNode {
 
-	constructor( toneMapping = NoToneMapping, exposureNode = toneMappingExposure, colorNode = null ) {
+	constructor( toneMapping, exposureNode = toneMappingExposure, colorNode = null ) {
 
 		super( 'vec3' );
 
@@ -194,14 +34,13 @@ class ToneMappingNode extends TempNode {
 
 		if ( toneMapping === NoToneMapping ) return colorNode;
 
-		const toneMappingParams = { exposure: this.exposureNode, color: colorNode };
-		const toneMappingNode = toneMappingLib[ toneMapping ];
-
 		let outputNode = null;
 
-		if ( toneMappingNode ) {
+		const toneMappingFn = builder.renderer.nodes.library.getToneMappingFunction( toneMapping );
 
-			outputNode = toneMappingNode( toneMappingParams );
+		if ( toneMappingFn !== null ) {
+
+			outputNode = vec4( toneMappingFn( colorNode.rgb, this.exposureNode ), colorNode.a );
 
 		} else {
 
@@ -219,9 +58,9 @@ class ToneMappingNode extends TempNode {
 
 export default ToneMappingNode;
 
-export const toneMapping = ( mapping, exposure, color ) => nodeObject( new ToneMappingNode( mapping, nodeObject( exposure ), nodeObject( color ) ) );
-export const toneMappingExposure = rendererReference( 'toneMappingExposure', 'float' );
+ToneMappingNode.type = /*@__PURE__*/ registerNode( 'ToneMapping', ToneMappingNode );
 
-addNodeElement( 'toneMapping', ( color, mapping, exposure ) => toneMapping( mapping, exposure, color ) );
+export const toneMapping = ( mapping, exposure, color ) => nodeObject( new ToneMappingNode( mapping, nodeObject( exposure ), nodeObject( color ) ) );
+export const toneMappingExposure = /*@__PURE__*/ rendererReference( 'toneMappingExposure', 'float' );
 
-addNodeClass( 'ToneMappingNode', ToneMappingNode );
+addMethodChaining( 'toneMapping', ( color, mapping, exposure ) => toneMapping( mapping, exposure, color ) );

package/src/nodes/display/TransitionNode.js

@@ -1,8 +1,10 @@
+import { registerNode } from '../core/Node.js';
 import TempNode from '../core/TempNode.js';
-import { uv } from '../accessors/UVNode.js';
-import { addNodeElement, tslFn, nodeObject, float, int, vec4, If } from '../shadernode/ShaderNode.js';
+import { uv } from '../accessors/UV.js';
+import { Fn, nodeObject, float, int, vec4, If } from '../tsl/TSLBase.js';
 import { clamp, mix } from '../math/MathNode.js';
 import { sub } from '../math/OperatorNode.js';
+import { convertToTexture } from '../utils/RTTNode.js';
 
 class TransitionNode extends TempNode {
 
@@ -35,7 +37,7 @@ class TransitionNode extends TempNode {
 
 		};
 
-		const transition = tslFn( () => {
+		const transition = Fn( () => {
 
 			const texelOne = sampleTexture( textureNodeA );
 			const texelTwo = sampleTexture( textureNodeB );
@@ -50,7 +52,7 @@ class TransitionNode extends TempNode {
 
 				color.assign( mix( texelOne, texelTwo, mixf ) );
 
-			} ).else( () => {
+			} ).Else( () => {
 
 				color.assign( mix( texelTwo, texelOne, mixRatioNode ) );
 
@@ -68,9 +70,8 @@ class TransitionNode extends TempNode {
 
 }
 
-export const transition = ( nodeA, nodeB, mixTexture, mixRatio = 0.0, threshold = 0.1, useTexture = 0 ) => nodeObject( new TransitionNode( nodeObject( nodeA ).toTexture(), nodeObject( nodeB ).toTexture(), nodeObject( mixTexture ).toTexture(), nodeObject( mixRatio ), nodeObject( threshold ), nodeObject( useTexture ) ) );
-
-addNodeElement( 'transition', transition );
-
 export default TransitionNode;
 
+TransitionNode.type = /*@__PURE__*/ registerNode( 'Transition', TransitionNode );
+
+export const transition = ( nodeA, nodeB, mixTexture, mixRatio = 0.0, threshold = 0.1, useTexture = 0 ) => nodeObject( new TransitionNode( convertToTexture( nodeA ), convertToTexture( nodeB ), convertToTexture( mixTexture ), nodeObject( mixRatio ), nodeObject( threshold ), nodeObject( useTexture ) ) );

package/src/nodes/display/ViewportDepthNode.js

@@ -1,7 +1,7 @@
-import Node, { addNodeClass } from '../core/Node.js';
-import { nodeImmutable, nodeProxy } from '../shadernode/ShaderNode.js';
-import { cameraNear, cameraFar } from '../accessors/CameraNode.js';
-import { positionView } from '../accessors/PositionNode.js';
+import Node, { registerNode } from '../core/Node.js';
+import { nodeImmutable, nodeProxy } from '../tsl/TSLBase.js';
+import { cameraNear, cameraFar } from '../accessors/Camera.js';
+import { positionView } from '../accessors/Position.js';
 import { viewportDepthTexture } from './ViewportDepthTextureNode.js';
 
 class ViewportDepthNode extends Node {
@@ -21,7 +21,7 @@ class ViewportDepthNode extends Node {
 
 		const { scope } = this;
 
-		if ( scope === ViewportDepthNode.DEPTH ) {
+		if ( scope === ViewportDepthNode.DEPTH_BASE ) {
 
 			return builder.getFragDepth();
 
@@ -34,43 +34,43 @@ class ViewportDepthNode extends Node {
 	setup( { camera } ) {
 
 		const { scope } = this;
-		const texture = this.valueNode;
+		const value = this.valueNode;
 
 		let node = null;
 
-		if ( scope === ViewportDepthNode.DEPTH ) {
+		if ( scope === ViewportDepthNode.DEPTH_BASE ) {
 
-			if ( texture !== null ) {
+			if ( value !== null ) {
 
- 				node = depthBase().assign( texture );
+ 				node = depthBase().assign( value );
 
-			} else {
+			}
 
-				if ( camera.isPerspectiveCamera ) {
+		} else if ( scope === ViewportDepthNode.DEPTH ) {
 
-					node = viewZToPerspectiveDepth( positionView.z, cameraNear, cameraFar );
+			if ( camera.isPerspectiveCamera ) {
 
-				} else {
+				node = viewZToPerspectiveDepth( positionView.z, cameraNear, cameraFar );
 
-					node = viewZToOrthographicDepth( positionView.z, cameraNear, cameraFar );
+			} else {
 
-				}
+				node = viewZToOrthographicDepth( positionView.z, cameraNear, cameraFar );
 
 			}
 
 		} else if ( scope === ViewportDepthNode.LINEAR_DEPTH ) {
 
-			if ( texture !== null ) {
+			if ( value !== null ) {
 
 				if ( camera.isPerspectiveCamera ) {
 
-					const viewZ = perspectiveDepthToViewZ( texture, cameraNear, cameraFar );
+					const viewZ = perspectiveDepthToViewZ( value, cameraNear, cameraFar );
 
 					node = viewZToOrthographicDepth( viewZ, cameraNear, cameraFar );
 
 				} else {
 
-					node = texture;
+					node = value;
 
 				}
 
@@ -88,6 +88,14 @@ class ViewportDepthNode extends Node {
 
 }
 
+ViewportDepthNode.DEPTH_BASE = 'depthBase';
+ViewportDepthNode.DEPTH = 'depth';
+ViewportDepthNode.LINEAR_DEPTH = 'linearDepth';
+
+export default ViewportDepthNode;
+
+ViewportDepthNode.type = /*@__PURE__*/ registerNode( 'ViewportDepth', ViewportDepthNode );
+
 // NOTE: viewZ, the z-coordinate in camera space, is negative for points in front of the camera
 
 // -near maps to 0; -far maps to 1
@@ -104,17 +112,10 @@ export const viewZToPerspectiveDepth = ( viewZ, near, far ) => near.add( viewZ )
 // maps perspective depth in [ 0, 1 ] to viewZ
 export const perspectiveDepthToViewZ = ( depth, near, far ) => near.mul( far ).div( far.sub( near ).mul( depth ).sub( far ) );
 
-ViewportDepthNode.DEPTH = 'depth';
-ViewportDepthNode.LINEAR_DEPTH = 'linearDepth';
+const depthBase = /*@__PURE__*/ nodeProxy( ViewportDepthNode, ViewportDepthNode.DEPTH_BASE );
 
-export default ViewportDepthNode;
-
-const depthBase = nodeProxy( ViewportDepthNode, ViewportDepthNode.DEPTH );
-
-export const depth = nodeImmutable( ViewportDepthNode, ViewportDepthNode.DEPTH );
-export const linearDepth = nodeProxy( ViewportDepthNode, ViewportDepthNode.LINEAR_DEPTH );
-export const viewportLinearDepth = linearDepth( viewportDepthTexture() );
+export const depth = /*@__PURE__*/ nodeImmutable( ViewportDepthNode, ViewportDepthNode.DEPTH );
+export const linearDepth = /*@__PURE__*/ nodeProxy( ViewportDepthNode, ViewportDepthNode.LINEAR_DEPTH );
+export const viewportLinearDepth = /*@__PURE__*/ linearDepth( viewportDepthTexture() );
 
 depth.assign = ( value ) => depthBase( value );
-
-addNodeClass( 'ViewportDepthNode', ViewportDepthNode );

package/src/nodes/display/ViewportDepthTextureNode.js

@@ -1,7 +1,7 @@
+import { registerNode } from '../core/Node.js';
 import ViewportTextureNode from './ViewportTextureNode.js';
-import { addNodeClass } from '../core/Node.js';
-import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
-import { viewportTopLeft } from './ViewportNode.js';
+import { nodeProxy } from '../tsl/TSLBase.js';
+import { viewportUV } from './ViewportNode.js';
 
 import { DepthTexture } from '../../textures/DepthTexture.js';
 
@@ -9,7 +9,7 @@ let sharedDepthbuffer = null;
 
 class ViewportDepthTextureNode extends ViewportTextureNode {
 
-	constructor( uvNode = viewportTopLeft, levelNode = null ) {
+	constructor( uvNode = viewportUV, levelNode = null ) {
 
 		if ( sharedDepthbuffer === null ) {
 
@@ -25,8 +25,6 @@ class ViewportDepthTextureNode extends ViewportTextureNode {
 
 export default ViewportDepthTextureNode;
 
-export const viewportDepthTexture = nodeProxy( ViewportDepthTextureNode );
+ViewportDepthTextureNode.type = /*@__PURE__*/ registerNode( 'ViewportDepthTexture', ViewportDepthTextureNode );
 
-addNodeElement( 'viewportDepthTexture', viewportDepthTexture );
-
-addNodeClass( 'ViewportDepthTextureNode', ViewportDepthTextureNode );
+export const viewportDepthTexture = /*@__PURE__*/ nodeProxy( ViewportDepthTextureNode );

package/src/nodes/display/ViewportNode.js

@@ -1,7 +1,7 @@
-import Node, { addNodeClass } from '../core/Node.js';
+import Node, { registerNode } from '../core/Node.js';
 import { NodeUpdateType } from '../core/constants.js';
 import { uniform } from '../core/UniformNode.js';
-import { nodeImmutable, vec2 } from '../shadernode/ShaderNode.js';
+import { Fn, nodeImmutable, vec2 } from '../tsl/TSLBase.js';
 
 import { Vector2 } from '../../math/Vector2.js';
 import { Vector4 } from '../../math/Vector4.js';
@@ -23,7 +23,6 @@ class ViewportNode extends Node {
 	getNodeType() {
 
 		if ( this.scope === ViewportNode.VIEWPORT ) return 'vec4';
-		else if ( this.scope === ViewportNode.COORDINATE ) return 'vec3';
 		else return 'vec2';
 
 	}
@@ -74,15 +73,7 @@ class ViewportNode extends Node {
 
 		} else {
 
-			output = viewportCoordinate.div( viewportResolution );
-
-			let outX = output.x;
-			let outY = output.y;
-
-			if ( /bottom/i.test( scope ) ) outY = outY.oneMinus();
-			if ( /right/i.test( scope ) ) outX = outX.oneMinus();
-
-			output = vec2( outX, outY );
+			output = vec2( viewportCoordinate.div( viewportResolution ) );
 
 		}
 
@@ -102,7 +93,7 @@ class ViewportNode extends Node {
 
 				const resolution = builder.getNodeProperties( viewportResolution ).outputNode.build( builder );
 
-				coord = `${ builder.getType( 'vec3' ) }( ${ coord }.x, ${ resolution }.y - ${ coord }.y, ${ coord }.z )`;
+				coord = `${ builder.getType( 'vec2' ) }( ${ coord }.x, ${ resolution }.y - ${ coord }.y )`;
 
 			}
 
@@ -119,19 +110,29 @@ class ViewportNode extends Node {
 ViewportNode.COORDINATE = 'coordinate';
 ViewportNode.RESOLUTION = 'resolution';
 ViewportNode.VIEWPORT = 'viewport';
-ViewportNode.TOP_LEFT = 'topLeft';
-ViewportNode.BOTTOM_LEFT = 'bottomLeft';
-ViewportNode.TOP_RIGHT = 'topRight';
-ViewportNode.BOTTOM_RIGHT = 'bottomRight';
+ViewportNode.UV = 'uv';
 
 export default ViewportNode;
 
-export const viewportCoordinate = nodeImmutable( ViewportNode, ViewportNode.COORDINATE );
-export const viewportResolution = nodeImmutable( ViewportNode, ViewportNode.RESOLUTION );
-export const viewport = nodeImmutable( ViewportNode, ViewportNode.VIEWPORT );
-export const viewportTopLeft = nodeImmutable( ViewportNode, ViewportNode.TOP_LEFT );
-export const viewportBottomLeft = nodeImmutable( ViewportNode, ViewportNode.BOTTOM_LEFT );
-export const viewportTopRight = nodeImmutable( ViewportNode, ViewportNode.TOP_RIGHT );
-export const viewportBottomRight = nodeImmutable( ViewportNode, ViewportNode.BOTTOM_RIGHT );
+ViewportNode.type = /*@__PURE__*/ registerNode( 'Viewport', ViewportNode );
+
+export const viewportCoordinate = /*@__PURE__*/ nodeImmutable( ViewportNode, ViewportNode.COORDINATE );
+export const viewportResolution = /*@__PURE__*/ nodeImmutable( ViewportNode, ViewportNode.RESOLUTION );
+export const viewport = /*@__PURE__*/ nodeImmutable( ViewportNode, ViewportNode.VIEWPORT );
+export const viewportUV = /*@__PURE__*/ nodeImmutable( ViewportNode, ViewportNode.UV );
+
+export const viewportTopLeft = /*@__PURE__*/ ( Fn( () => { // @deprecated, r168
+
+	console.warn( 'TSL.ViewportNode: "viewportTopLeft" is deprecated. Use "viewportUV" instead.' );
+
+	return viewportUV;
+
+}, 'vec2' ).once() )();
+
+export const viewportBottomLeft = /*@__PURE__*/ ( Fn( () => { // @deprecated, r168
+
+	console.warn( 'TSL.ViewportNode: "viewportBottomLeft" is deprecated. Use "viewportUV.flipY()" instead.' );
+
+	return viewportUV.flipY();
 
-addNodeClass( 'ViewportNode', ViewportNode );
+}, 'vec2' ).once() )();