super-three 0.164.0 → 0.167.0

package/src/nodes/display/RGBShiftNode.js

@@ -0,0 +1,49 @@
+import TempNode from '../core/TempNode.js';
+import { nodeObject, addNodeElement, tslFn, vec2, vec4 } from '../shadernode/ShaderNode.js';
+import { uniform } from '../core/UniformNode.js';
+import { uv } from '../accessors/UVNode.js';
+import { sin, cos } from '../math/MathNode.js';
+
+class RGBShiftNode extends TempNode {
+
+	constructor( textureNode, amount = 0.005, angle = 0 ) {
+
+		super( 'vec4' );
+
+		this.textureNode = textureNode;
+		this.amount = uniform( amount );
+		this.angle = uniform( angle );
+
+	}
+
+	setup() {
+
+		const { textureNode } = this;
+
+		const uvNode = textureNode.uvNode || uv();
+
+		const sampleTexture = ( uv ) => textureNode.uv( uv );
+
+		const rgbShift = tslFn( () => {
+
+			const offset = vec2( cos( this.angle ), sin( this.angle ) ).mul( this.amount );
+			const cr = sampleTexture( uvNode.add( offset ) );
+			const cga = sampleTexture( uvNode );
+			const cb = sampleTexture( uvNode.sub( offset ) );
+
+			return vec4( cr.r, cga.g, cb.b, cga.a );
+
+		} );
+
+		return rgbShift();
+
+	}
+
+}
+
+export const rgbShift = ( node, amount, angle ) => nodeObject( new RGBShiftNode( nodeObject( node ).toTexture(), amount, angle ) );
+
+addNodeElement( 'rgbShift', rgbShift );
+
+export default RGBShiftNode;
+

package/src/nodes/display/RenderOutputNode.js

@@ -0,0 +1,56 @@
+import TempNode from '../core/TempNode.js';
+import { addNodeClass } from '../core/Node.js';
+import { addNodeElement, nodeObject } from '../shadernode/ShaderNode.js';
+
+import { SRGBColorSpace, NoToneMapping } from '../../constants.js';
+
+class RenderOutputNode extends TempNode {
+
+	constructor( colorNode, toneMapping, outputColorSpace ) {
+
+		super( 'vec4' );
+
+		this.colorNode = colorNode;
+		this.toneMapping = toneMapping;
+		this.outputColorSpace = outputColorSpace;
+
+		this.isRenderOutput = true;
+
+	}
+
+	setup( { context } ) {
+
+		let outputNode = this.colorNode || context.color;
+
+		// tone mapping
+
+		const toneMapping = this.toneMapping !== null ? this.toneMapping : context.toneMapping;
+		const outputColorSpace = this.outputColorSpace !== null ? this.outputColorSpace : context.outputColorSpace;
+
+		if ( toneMapping !== NoToneMapping ) {
+
+			outputNode = outputNode.toneMapping( toneMapping );
+
+		}
+
+		// output color space
+
+		if ( outputColorSpace === SRGBColorSpace ) {
+
+			outputNode = outputNode.linearToColorSpace( outputColorSpace );
+
+		}
+
+		return outputNode;
+
+	}
+
+}
+
+export default RenderOutputNode;
+
+export const renderOutput = ( color, toneMapping = null, outputColorSpace = null ) => nodeObject( new RenderOutputNode( nodeObject( color ), toneMapping, outputColorSpace ) );
+
+addNodeElement( 'renderOutput', renderOutput );
+
+addNodeClass( 'RenderOutputNode', RenderOutputNode );

package/src/nodes/display/SobelOperatorNode.js

@@ -0,0 +1,121 @@
+import TempNode from '../core/TempNode.js';
+import { uv } from '../accessors/UVNode.js';
+import { luminance } from './ColorAdjustmentNode.js';
+import { addNodeElement, tslFn, nodeObject, vec2, vec3, vec4, mat3 } from '../shadernode/ShaderNode.js';
+import { NodeUpdateType } from '../core/constants.js';
+import { uniform } from '../core/UniformNode.js';
+import { add } from '../math/OperatorNode.js';
+
+import { Vector2 } from '../../math/Vector2.js';
+
+class SobelOperatorNode extends TempNode {
+
+	constructor( textureNode ) {
+
+		super();
+
+		this.textureNode = textureNode;
+
+		this.updateBeforeType = NodeUpdateType.RENDER;
+
+		this._invSize = uniform( new Vector2() );
+
+	}
+
+	updateBefore() {
+
+		const map = this.textureNode.value;
+
+		this._invSize.value.set( 1 / map.image.width, 1 / map.image.height );
+
+	}
+
+	setup() {
+
+		const { textureNode } = this;
+
+		const uvNode = textureNode.uvNode || uv();
+
+		const sampleTexture = ( uv ) => textureNode.uv( uv );
+
+		const sobel = tslFn( () => {
+
+			// Sobel Edge Detection (see https://youtu.be/uihBwtPIBxM)
+
+			const texel = this._invSize;
+
+			// kernel definition (in glsl matrices are filled in column-major order)
+
+			const Gx = mat3( - 1, - 2, - 1, 0, 0, 0, 1, 2, 1 ); // x direction kernel
+			const Gy = mat3( - 1, 0, 1, - 2, 0, 2, - 1, 0, 1 ); // y direction kernel
+
+			// fetch the 3x3 neighbourhood of a fragment
+
+			// first column
+
+			const tx0y0 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( - 1, - 1 ) ) ) ).xyz );
+			const tx0y1 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( - 1, 0 ) ) ) ).xyz );
+			const tx0y2 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( - 1, 1 ) ) ) ).xyz );
+
+			// second column
+
+			const tx1y0 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( 0, - 1 ) ) ) ).xyz );
+			const tx1y1 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( 0, 0 ) ) ) ).xyz );
+			const tx1y2 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( 0, 1 ) ) ) ).xyz );
+
+			// third column
+
+			const tx2y0 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( 1, - 1 ) ) ) ).xyz );
+			const tx2y1 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( 1, 0 ) ) ) ).xyz );
+			const tx2y2 = luminance( sampleTexture( uvNode.add( texel.mul( vec2( 1, 1 ) ) ) ).xyz );
+
+			// gradient value in x direction
+
+			const valueGx = add(
+				Gx[ 0 ][ 0 ].mul( tx0y0 ),
+				Gx[ 1 ][ 0 ].mul( tx1y0 ),
+				Gx[ 2 ][ 0 ].mul( tx2y0 ),
+				Gx[ 0 ][ 1 ].mul( tx0y1 ),
+				Gx[ 1 ][ 1 ].mul( tx1y1 ),
+				Gx[ 2 ][ 1 ].mul( tx2y1 ),
+				Gx[ 0 ][ 2 ].mul( tx0y2 ),
+				Gx[ 1 ][ 2 ].mul( tx1y2 ),
+				Gx[ 2 ][ 2 ].mul( tx2y2 )
+			);
+
+
+			// gradient value in y direction
+
+			const valueGy = add(
+				Gy[ 0 ][ 0 ].mul( tx0y0 ),
+				Gy[ 1 ][ 0 ].mul( tx1y0 ),
+				Gy[ 2 ][ 0 ].mul( tx2y0 ),
+				Gy[ 0 ][ 1 ].mul( tx0y1 ),
+				Gy[ 1 ][ 1 ].mul( tx1y1 ),
+				Gy[ 2 ][ 1 ].mul( tx2y1 ),
+				Gy[ 0 ][ 2 ].mul( tx0y2 ),
+				Gy[ 1 ][ 2 ].mul( tx1y2 ),
+				Gy[ 2 ][ 2 ].mul( tx2y2 )
+			);
+
+			// magnitute of the total gradient
+
+			const G = valueGx.mul( valueGx ).add( valueGy.mul( valueGy ) ).sqrt();
+
+			return vec4( vec3( G ), 1 );
+
+		} );
+
+		const outputNode = sobel();
+
+		return outputNode;
+
+	}
+
+}
+
+export const sobel = ( node ) => nodeObject( new SobelOperatorNode( nodeObject( node ).toTexture() ) );
+
+addNodeElement( 'sobel', sobel );
+
+export default SobelOperatorNode;

package/{examples/jsm → src}/nodes/display/ToneMappingNode.js

@@ -1,11 +1,12 @@
 import TempNode from '../core/TempNode.js';
 import { addNodeClass } from '../core/Node.js';
-import { addNodeElement, tslFn, nodeObject, float, mat3, vec3 } from '../shadernode/ShaderNode.js';
+import { addNodeElement, tslFn, nodeObject, float, mat3, vec3, If } from '../shadernode/ShaderNode.js';
 import { rendererReference } from '../accessors/RendererReferenceNode.js';
-import { clamp, log2, max, pow } from '../math/MathNode.js';
-import { mul } from '../math/OperatorNode.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 } from 'three';
+import { NoToneMapping, LinearToneMapping, ReinhardToneMapping, CineonToneMapping, ACESFilmicToneMapping, AgXToneMapping, NeutralToneMapping } from '../../constants.js';
 
 // exposure only
 const LinearToneMappingNode = tslFn( ( { color, exposure } ) => {
@@ -117,13 +118,51 @@ const AGXToneMappingNode = tslFn( ( { color, exposure } ) => {
 
 } );
 
+// 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
+	[ AgXToneMapping ]: AGXToneMappingNode,
+	[ NeutralToneMapping ]: NeutralToneMappingNode
 };
 
 class ToneMappingNode extends TempNode {

package/src/nodes/display/TransitionNode.js

@@ -0,0 +1,76 @@
+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 { clamp, mix } from '../math/MathNode.js';
+import { sub } from '../math/OperatorNode.js';
+
+class TransitionNode extends TempNode {
+
+	constructor( textureNodeA, textureNodeB, mixTextureNode, mixRatioNode, thresholdNode, useTextureNode ) {
+
+		super();
+
+		// Input textures
+
+		this.textureNodeA = textureNodeA;
+		this.textureNodeB = textureNodeB;
+		this.mixTextureNode = mixTextureNode;
+
+		// Uniforms
+
+		this.mixRatioNode = mixRatioNode;
+		this.thresholdNode = thresholdNode;
+		this.useTextureNode = useTextureNode;
+
+	}
+
+	setup() {
+
+		const { textureNodeA, textureNodeB, mixTextureNode, mixRatioNode, thresholdNode, useTextureNode } = this;
+
+		const sampleTexture = ( textureNode ) => {
+
+			const uvNodeTexture = textureNode.uvNode || uv();
+			return textureNode.uv( uvNodeTexture );
+
+		};
+
+		const transition = tslFn( () => {
+
+			const texelOne = sampleTexture( textureNodeA );
+			const texelTwo = sampleTexture( textureNodeB );
+
+			const color = vec4().toVar();
+
+			If( useTextureNode.equal( int( 1 ) ), () => {
+
+				const transitionTexel = sampleTexture( mixTextureNode );
+				const r = mixRatioNode.mul( thresholdNode.mul( 2.0 ).add( 1.0 ) ).sub( thresholdNode );
+				const mixf = clamp( sub( transitionTexel.r, r ).mul( float( 1.0 ).div( thresholdNode ) ), 0.0, 1.0 );
+
+				color.assign( mix( texelOne, texelTwo, mixf ) );
+
+			} ).else( () => {
+
+				color.assign( mix( texelTwo, texelOne, mixRatioNode ) );
+
+			} );
+
+			return color;
+
+		} );
+
+		const outputNode = transition();
+
+		return outputNode;
+
+	}
+
+}
+
+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;
+

package/{examples/jsm → src}/nodes/display/ViewportDepthNode.js

@@ -21,7 +21,7 @@ class ViewportDepthNode extends Node {
 
 		const { scope } = this;
 
-		if ( scope === ViewportDepthNode.DEPTH_PIXEL ) {
+		if ( scope === ViewportDepthNode.DEPTH ) {
 
 			return builder.getFragDepth();
 
@@ -31,28 +31,52 @@ class ViewportDepthNode extends Node {
 
 	}
 
-	setup( /*builder*/ ) {
+	setup( { camera } ) {
 
 		const { scope } = this;
+		const texture = this.valueNode;
 
 		let node = null;
 
 		if ( scope === ViewportDepthNode.DEPTH ) {
 
-			node = viewZToOrthographicDepth( positionView.z, cameraNear, cameraFar );
+			if ( texture !== null ) {
+
+ 				node = depthBase().assign( texture );
+
+			} else {
+
+				if ( camera.isPerspectiveCamera ) {
+
+					node = viewZToPerspectiveDepth( positionView.z, cameraNear, cameraFar );
+
+				} else {
+
+					node = viewZToOrthographicDepth( positionView.z, cameraNear, cameraFar );
+
+				}
+
+			}
+
+		} else if ( scope === ViewportDepthNode.LINEAR_DEPTH ) {
+
+			if ( texture !== null ) {
+
+				if ( camera.isPerspectiveCamera ) {
+
+					const viewZ = perspectiveDepthToViewZ( texture, cameraNear, cameraFar );
 
-		} else if ( scope === ViewportDepthNode.DEPTH_TEXTURE ) {
+					node = viewZToOrthographicDepth( viewZ, cameraNear, cameraFar );
 
-			const texture = this.valueNode || viewportDepthTexture();
+				} else {
 
-			const viewZ = perspectiveDepthToViewZ( texture, cameraNear, cameraFar );
-			node = viewZToOrthographicDepth( viewZ, cameraNear, cameraFar );
+					node = texture;
 
-		} else if ( scope === ViewportDepthNode.DEPTH_PIXEL ) {
+				}
 
-			if ( this.valueNode !== null ) {
+			} else {
 
- 				node = depthPixelBase().assign( this.valueNode );
+				node = viewZToOrthographicDepth( positionView.z, cameraNear, cameraFar );
 
 			}
 
@@ -81,17 +105,16 @@ export const viewZToPerspectiveDepth = ( viewZ, near, far ) => near.add( viewZ )
 export const perspectiveDepthToViewZ = ( depth, near, far ) => near.mul( far ).div( far.sub( near ).mul( depth ).sub( far ) );
 
 ViewportDepthNode.DEPTH = 'depth';
-ViewportDepthNode.DEPTH_TEXTURE = 'depthTexture';
-ViewportDepthNode.DEPTH_PIXEL = 'depthPixel';
+ViewportDepthNode.LINEAR_DEPTH = 'linearDepth';
 
 export default ViewportDepthNode;
 
-const depthPixelBase = nodeProxy( ViewportDepthNode, ViewportDepthNode.DEPTH_PIXEL );
+const depthBase = nodeProxy( ViewportDepthNode, ViewportDepthNode.DEPTH );
 
 export const depth = nodeImmutable( ViewportDepthNode, ViewportDepthNode.DEPTH );
-export const depthTexture = nodeProxy( ViewportDepthNode, ViewportDepthNode.DEPTH_TEXTURE );
-export const depthPixel = nodeImmutable( ViewportDepthNode, ViewportDepthNode.DEPTH_PIXEL );
+export const linearDepth = nodeProxy( ViewportDepthNode, ViewportDepthNode.LINEAR_DEPTH );
+export const viewportLinearDepth = linearDepth( viewportDepthTexture() );
 
-depthPixel.assign = ( value ) => depthPixelBase( value );
+depth.assign = ( value ) => depthBase( value );
 
 addNodeClass( 'ViewportDepthNode', ViewportDepthNode );

package/{examples/jsm → src}/nodes/display/ViewportDepthTextureNode.js

@@ -2,7 +2,8 @@ import ViewportTextureNode from './ViewportTextureNode.js';
 import { addNodeClass } from '../core/Node.js';
 import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
 import { viewportTopLeft } from './ViewportNode.js';
-import { DepthTexture } from 'three';
+
+import { DepthTexture } from '../../textures/DepthTexture.js';
 
 let sharedDepthbuffer = null;
 

package/{examples/jsm → src}/nodes/display/ViewportNode.js

@@ -3,7 +3,8 @@ import { NodeUpdateType } from '../core/constants.js';
 import { uniform } from '../core/UniformNode.js';
 import { nodeImmutable, vec2 } from '../shadernode/ShaderNode.js';
 
-import { Vector2, Vector4 } from 'three';
+import { Vector2 } from '../../math/Vector2.js';
+import { Vector4 } from '../../math/Vector4.js';
 
 let resolution, viewportResult;
 
@@ -33,7 +34,7 @@ class ViewportNode extends Node {
 
 		if ( this.scope === ViewportNode.RESOLUTION || this.scope === ViewportNode.VIEWPORT ) {
 
-			updateType = NodeUpdateType.FRAME;
+			updateType = NodeUpdateType.RENDER;
 
 		}
 

package/{examples/jsm → src}/nodes/display/ViewportSharedTextureNode.js

@@ -2,7 +2,8 @@ import ViewportTextureNode from './ViewportTextureNode.js';
 import { addNodeClass } from '../core/Node.js';
 import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
 import { viewportTopLeft } from './ViewportNode.js';
-import { FramebufferTexture } from 'three';
+
+import { FramebufferTexture } from '../../textures/FramebufferTexture.js';
 
 let _sharedFramebuffer = null;
 

package/{examples/jsm → src}/nodes/display/ViewportTextureNode.js

@@ -3,9 +3,12 @@ import { NodeUpdateType } from '../core/constants.js';
 import { addNodeClass } from '../core/Node.js';
 import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
 import { viewportTopLeft } from './ViewportNode.js';
-import { Vector2, FramebufferTexture, LinearMipmapLinearFilter } from 'three';
 
-const _size = new Vector2();
+import { Vector2 } from '../../math/Vector2.js';
+import { FramebufferTexture } from '../../textures/FramebufferTexture.js';
+import { LinearMipmapLinearFilter } from '../../constants.js';
+
+const _size = /*@__PURE__*/ new Vector2();
 
 class ViewportTextureNode extends TextureNode {
 

package/src/nodes/functions/BSDF/LTC.js

@@ -0,0 +1,131 @@
+import { tslFn, If, mat3, vec2, vec3 } from '../../shadernode/ShaderNode.js';
+import { max } from '../../math/MathNode.js';
+
+// Rect Area Light
+
+// Real-Time Polygonal-Light Shading with Linearly Transformed Cosines
+// by Eric Heitz, Jonathan Dupuy, Stephen Hill and David Neubelt
+// code: https://github.com/selfshadow/ltc_code/
+
+const LTC_Uv = tslFn( ( { N, V, roughness } ) => {
+
+	const LUT_SIZE = 64.0;
+	const LUT_SCALE = ( LUT_SIZE - 1.0 ) / LUT_SIZE;
+	const LUT_BIAS = 0.5 / LUT_SIZE;
+
+	const dotNV = N.dot( V ).saturate();
+
+	// texture parameterized by sqrt( GGX alpha ) and sqrt( 1 - cos( theta ) )
+	const uv = vec2( roughness, dotNV.oneMinus().sqrt() );
+
+	uv.assign( uv.mul( LUT_SCALE ).add( LUT_BIAS ) );
+
+	return uv;
+
+} ).setLayout( {
+	name: 'LTC_Uv',
+	type: 'vec2',
+	inputs: [
+		{ name: 'N', type: 'vec3' },
+		{ name: 'V', type: 'vec3' },
+		{ name: 'roughness', type: 'float' }
+	]
+} );
+
+const LTC_ClippedSphereFormFactor = tslFn( ( { f } ) => {
+
+	// Real-Time Area Lighting: a Journey from Research to Production (p.102)
+	// An approximation of the form factor of a horizon-clipped rectangle.
+
+	const l = f.length();
+
+	return max( l.mul( l ).add( f.z ).div( l.add( 1.0 ) ), 0 );
+
+} ).setLayout( {
+	name: 'LTC_ClippedSphereFormFactor',
+	type: 'float',
+	inputs: [
+		{ name: 'f', type: 'vec3' }
+	]
+} );
+
+const LTC_EdgeVectorFormFactor = tslFn( ( { v1, v2 } ) => {
+
+	const x = v1.dot( v2 );
+	const y = x.abs().toVar();
+
+	// rational polynomial approximation to theta / sin( theta ) / 2PI
+	const a = y.mul( 0.0145206 ).add( 0.4965155 ).mul( y ).add( 0.8543985 ).toVar();
+	const b = y.add( 4.1616724 ).mul( y ).add( 3.4175940 ).toVar();
+	const v = a.div( b );
+
+	const theta_sintheta = x.greaterThan( 0.0 ).cond( v, max( x.mul( x ).oneMinus(), 1e-7 ).inverseSqrt().mul( 0.5 ).sub( v ) );
+
+	return v1.cross( v2 ).mul( theta_sintheta );
+
+} ).setLayout( {
+	name: 'LTC_EdgeVectorFormFactor',
+	type: 'vec3',
+	inputs: [
+		{ name: 'v1', type: 'vec3' },
+		{ name: 'v2', type: 'vec3' }
+	]
+} );
+
+const LTC_Evaluate = tslFn( ( { N, V, P, mInv, p0, p1, p2, p3 } ) => {
+
+	// bail if point is on back side of plane of light
+	// assumes ccw winding order of light vertices
+	const v1 = p1.sub( p0 ).toVar();
+	const v2 = p3.sub( p0 ).toVar();
+
+	const lightNormal = v1.cross( v2 );
+	const result = vec3().toVar();
+
+	If( lightNormal.dot( P.sub( p0 ) ).greaterThanEqual( 0.0 ), () => {
+
+		// construct orthonormal basis around N
+		const T1 = V.sub( N.mul( V.dot( N ) ) ).normalize();
+		const T2 = N.cross( T1 ).negate(); // negated from paper; possibly due to a different handedness of world coordinate system
+
+		// compute transform
+		const mat = mInv.mul( mat3( T1, T2, N ).transpose() ).toVar();
+
+		// transform rect
+		// & project rect onto sphere
+		const coords0 = mat.mul( p0.sub( P ) ).normalize().toVar();
+		const coords1 = mat.mul( p1.sub( P ) ).normalize().toVar();
+		const coords2 = mat.mul( p2.sub( P ) ).normalize().toVar();
+		const coords3 = mat.mul( p3.sub( P ) ).normalize().toVar();
+
+		// calculate vector form factor
+		const vectorFormFactor = vec3( 0 ).toVar();
+		vectorFormFactor.addAssign( LTC_EdgeVectorFormFactor( { v1: coords0, v2: coords1 } ) );
+		vectorFormFactor.addAssign( LTC_EdgeVectorFormFactor( { v1: coords1, v2: coords2 } ) );
+		vectorFormFactor.addAssign( LTC_EdgeVectorFormFactor( { v1: coords2, v2: coords3 } ) );
+		vectorFormFactor.addAssign( LTC_EdgeVectorFormFactor( { v1: coords3, v2: coords0 } ) );
+
+		// adjust for horizon clipping
+		result.assign( vec3( LTC_ClippedSphereFormFactor( { f: vectorFormFactor } ) ) );
+
+	} );
+
+	return result;
+
+} ).setLayout( {
+	name: 'LTC_Evaluate',
+	type: 'vec3',
+	inputs: [
+		{ name: 'N', type: 'vec3' },
+		{ name: 'V', type: 'vec3' },
+		{ name: 'P', type: 'vec3' },
+		{ name: 'mInv', type: 'mat3' },
+		{ name: 'p0', type: 'vec3' },
+		{ name: 'p1', type: 'vec3' },
+		{ name: 'p2', type: 'vec3' },
+		{ name: 'p3', type: 'vec3' }
+	]
+} );
+
+
+export { LTC_Evaluate, LTC_Uv };