@lampdotdev/lamp 0.0.0-stage → 0.36.2-nightly.16

package/Resources/WebLibraries/three/addons/tsl/display/TransitionNode.js

@@ -0,0 +1,141 @@
+import { Node } from 'three/webgpu';
+import { nodeObject, Fn, float, uv, convertToTexture, vec4, If, int, clamp, sub, mix } from 'three/tsl';
+
+/**
+ * Post processing node for creating a transition effect between scenes.
+ *
+ * @augments Node
+ * @three_import import { transition } from 'three/addons/tsl/display/TransitionNode.js';
+ */
+class TransitionNode extends Node {
+
+	static get type() {
+
+		return 'TransitionNode';
+
+	}
+
+	/**
+	 * Constructs a new transition node.
+	 *
+	 * @param {TextureNode} textureNodeA - A texture node that represents the beauty pass of the first scene.
+	 * @param {TextureNode} textureNodeB - A texture node that represents the beauty pass of the second scene.
+	 * @param {TextureNode} mixTextureNode - A texture node that defines how the transition effect should look like.
+	 * @param {Node<float>} mixRatioNode - The interpolation factor that controls the mix.
+	 * @param {Node<float>} thresholdNode - Can be used to tweak the linear interpolation.
+	 * @param {Node<float>} useTextureNode - Whether `mixTextureNode` should influence the transition or not.
+	 */
+	constructor( textureNodeA, textureNodeB, mixTextureNode, mixRatioNode, thresholdNode, useTextureNode ) {
+
+		super( 'vec4' );
+
+		/**
+		 * A texture node that represents the beauty pass of the first scene.
+		 *
+		 * @type {TextureNode}
+		 */
+		this.textureNodeA = textureNodeA;
+
+		/**
+		 * A texture node that represents the beauty pass of the second scene.
+		 *
+		 * @type {TextureNode}
+		 */
+		this.textureNodeB = textureNodeB;
+
+		/**
+		 * A texture that defines how the transition effect should look like.
+		 *
+		 * @type {TextureNode}
+		 */
+		this.mixTextureNode = mixTextureNode;
+
+		/**
+		 * The interpolation factor that controls the mix.
+		 *
+		 * @type {Node<float>}
+		 */
+		this.mixRatioNode = mixRatioNode;
+
+		/**
+		 * Can be used to tweak the linear interpolation.
+		 *
+		 * @type {Node<float>}
+		 */
+		this.thresholdNode = thresholdNode;
+
+		/**
+		 * Whether `mixTextureNode` should influence the transition or not.
+		 *
+		 * @type {Node<float>}
+		 */
+		this.useTextureNode = useTextureNode;
+
+	}
+
+	/**
+	 * This method is used to setup the effect's TSL code.
+	 *
+	 * @param {NodeBuilder} builder - The current node builder.
+	 * @return {ShaderCallNodeInternal}
+	 */
+	setup() {
+
+		const { textureNodeA, textureNodeB, mixTextureNode, mixRatioNode, thresholdNode, useTextureNode } = this;
+
+		const sampleTexture = ( textureNode ) => {
+
+			const uvNodeTexture = textureNode.uvNode || uv();
+			return textureNode.sample( uvNodeTexture );
+
+		};
+
+		const transition = Fn( () => {
+
+			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 default TransitionNode;
+
+/**
+ * TSL function for creating a transition node for post processing.
+ *
+ * @tsl
+ * @function
+ * @param {Node<vec4>} nodeA - A texture node that represents the beauty pass of the first scene.
+ * @param {Node<vec4>} nodeB - A texture node that represents the beauty pass of the second scene.
+ * @param {Node<vec4>} mixTextureNode - A texture that defines how the transition effect should look like.
+ * @param {Node<float> | number} mixRatio - The interpolation factor that controls the mix.
+ * @param {Node<float> | number} threshold - Can be used to tweak the linear interpolation.
+ * @param {Node<float> | number} useTexture - Whether `mixTextureNode` should influence the transition or not.
+ * @returns {TransitionNode}
+ */
+export const transition = ( nodeA, nodeB, mixTextureNode, mixRatio, threshold, useTexture ) => new TransitionNode( convertToTexture( nodeA ), convertToTexture( nodeB ), convertToTexture( mixTextureNode ), nodeObject( mixRatio ), nodeObject( threshold ), nodeObject( useTexture ) );

package/Resources/WebLibraries/three/addons/tsl/display/boxBlur.js

@@ -0,0 +1,65 @@
+import { Fn, vec2, uv, Loop, vec4, premultiplyAlpha, unpremultiplyAlpha, max, int, textureSize, nodeObject, convertToTexture } from 'three/tsl';
+
+/**
+ * Applies a box blur effect to the given texture node.
+ *
+ * Compared to Gaussian blur, box blur produces a more blocky result but with better performance when correctly
+ * configured. It is intended for mobile devices or performance restricted use cases where Gaussian is too heavy.
+ *
+ * The (kernel) `size` parameter should be small (1, 2 or 3) since it determines the number of samples based on (size * 2 + 1)^2.
+ * This implementation uses a single pass approach so the kernel is not applied as a separable filter. That means larger
+ * kernels won't perform well. Use Gaussian instead if you need a more high-quality blur.
+ *
+ * To produce wider blurs, increase the `separation` parameter instead which has no influence on the performance.
+ *
+ * Reference: {@link https://github.com/lettier/3d-game-shaders-for-beginners/blob/master/demonstration/shaders/fragment/box-blur.frag}.
+ *
+ * @tsl
+ * @function
+ * @param {Node<vec4>} textureNode - The texture node that should be blurred.
+ * @param {Object} [options={}] - Additional options for the hash blur effect.
+ * @param {Node<int>} [options.size=int(1)] - Controls the blur's kernel. For performant results, the range should within [1, 3].
+ * @param {Node<int>} [options.separation=int(1)] - Spreads out the blur without having to sample additional fragments. Ranges from [1, Infinity].
+ * @param {boolean} [options.premultipliedAlpha=false] - Whether to use premultiplied alpha for the blur effect.
+ * @return {Node<vec4>} The blurred texture node.
+ */
+export const boxBlur = /*#__PURE__*/ Fn( ( [ textureNode, options = {} ] ) => {
+
+	textureNode = convertToTexture( textureNode );
+
+	const size = nodeObject( options.size ) || int( 1 );
+	const separation = nodeObject( options.separation ) || int( 1 );
+	const premultipliedAlpha = options.premultipliedAlpha || false;
+
+	const tap = ( uv ) => {
+
+		const sample = textureNode.sample( uv );
+
+		return premultipliedAlpha ? premultiplyAlpha( sample ) : sample;
+
+	};
+
+	const targetUV = textureNode.uvNode || uv();
+
+	const result = vec4( 0 );
+	const sep = max( separation, 1 );
+	const count = int( 0 );
+	const pixelStep = vec2( 1 ).div( textureSize( textureNode ) );
+
+	Loop( { start: size.negate(), end: size, name: 'i', condition: '<=' }, ( { i } ) => {
+
+		Loop( { start: size.negate(), end: size, name: 'j', condition: '<=' }, ( { j } ) => {
+
+			const uvs = targetUV.add( vec2( i, j ).mul( pixelStep ).mul( sep ) );
+			result.addAssign( tap( uvs ) );
+			count.addAssign( 1 );
+
+		} );
+
+	} );
+
+	result.divAssign( count );
+
+	return premultipliedAlpha ? unpremultiplyAlpha( result ) : result;
+
+} );

package/Resources/WebLibraries/three/addons/tsl/display/depthAwareBlend.js

@@ -0,0 +1,80 @@
+import { abs, color, float, Fn, Loop, mix, nodeObject, perspectiveDepthToViewZ, reference, textureSize, uv, vec2, vec4, viewZToOrthographicDepth, int, If, array, ivec2 } from 'three/tsl';
+
+/**
+ * Performs a depth-aware blend between a base scene and a secondary effect (like godrays).
+ * This function uses a Poisson disk sampling pattern to detect depth discontinuities
+ * in the neighborhood of the current pixel. If an edge is detected, it shifts the
+ * sampling coordinate for the blend node away from the edge to prevent light leaking/haloing.
+ *
+ * @param {Node} baseNode - The main scene/beauty pass texture node.
+ * @param {Node} blendNode - The effect to be blended (e.g., Godrays, Bloom).
+ * @param {Node} depthNode - The scene depth texture node.
+ * @param {Camera} camera - The camera used for the scene.
+ * @param {Object} [options={}] - Configuration for the blend effect.
+ * @param {Node|Color} [options.blendColor=Color(0xff0000)] - The color applied to the blend node.
+ * @param {Node<int> | number} [options.edgeRadius=2] - The search radius (in pixels) for detecting depth edges.
+ * @param {Node<float> | number} [options.edgeStrength=2] - How far to "push" the UV away from detected edges.
+ * @returns {Node<vec4>} The resulting blended color node.
+ */
+export const depthAwareBlend = /*#__PURE__*/ Fn( ( [ baseNode, blendNode, depthNode, camera, options = {} ] ) => {
+
+	const uvNode = baseNode.uvNode || uv();
+
+	const cameraNear = reference( 'near', 'float', camera );
+	const cameraFar = reference( 'far', 'float', camera );
+
+	const blendColor = nodeObject( options.blendColor ) || color( 0xffffff );
+	const edgeRadius = nodeObject( options.edgeRadius ) || int( 2 );
+	const edgeStrength = nodeObject( options.edgeStrength ) || float( 2 );
+
+	const viewZ = perspectiveDepthToViewZ( depthNode, cameraNear, cameraFar );
+	const correctDepth = viewZToOrthographicDepth( viewZ, cameraNear, cameraFar );
+
+	const pushDir = vec2( 0.0 ).toVar();
+	const count = float( 0 ).toVar();
+
+	const resolution = ivec2( textureSize( baseNode ) ).toConst();
+	const pixelStep = vec2( 1 ).div( resolution );
+
+	const poissonDisk = array( [
+		vec2( 0.493393, 0.394269 ),
+		vec2( 0.798547, 0.885922 ),
+		vec2( 0.259143, 0.650754 ),
+		vec2( 0.605322, 0.023588 ),
+		vec2( - 0.574681, 0.137452 ),
+		vec2( - 0.430397, - 0.638423 ),
+		vec2( - 0.849487, - 0.366258 ),
+		vec2( 0.170621, - 0.569941 )
+	] );
+
+	Loop( 8, ( { i } ) => {
+
+		const offset = poissonDisk.element( i ).mul( edgeRadius );
+
+		const sampleUv = uvNode.add( offset.mul( pixelStep ) );
+		const sampleDepth = depthNode.sample( sampleUv );
+
+		const sampleViewZ = perspectiveDepthToViewZ( sampleDepth, cameraNear, cameraFar );
+		const sampleLinearDepth = viewZToOrthographicDepth( sampleViewZ, cameraNear, cameraFar );
+
+		If( abs( sampleLinearDepth.sub( correctDepth ) ).lessThan( float( 0.05 ).mul( correctDepth ) ), () => {
+
+			pushDir.addAssign( offset );
+			count.addAssign( 1 );
+
+		} );
+
+	} );
+
+	count.assign( count.equal( 0 ).select( 1, count ) );
+
+	pushDir.divAssign( count ).normalize();
+
+	const sampleUv = pushDir.length().greaterThan( 0 ).select( uvNode.add( edgeStrength.mul( pushDir.div( resolution ) ) ), uvNode );
+
+	const bestChoice = blendNode.sample( sampleUv ).r;
+	const baseColor = baseNode.sample( uvNode );
+
+	return vec4( mix( baseColor, vec4( blendColor, 1 ), bestChoice ) );
+
+} );

package/Resources/WebLibraries/three/addons/tsl/display/depthAwareBlur.js

@@ -0,0 +1,63 @@
+import { abs, exp, float, Fn, int, logarithmicDepthToViewZ, Loop, max, perspectiveDepthToViewZ, reference, uv } from 'three/tsl';
+
+/**
+ * Applies one pass of a separable, depth-aware (bilateral) blur to a screen-space signal.
+ *
+ * The spatial term is a fixed 5-tap gaussian along `directionNode`; the edge-stopping term
+ * rejects neighbours whose view-space depth differs from the center, so the signal is smoothed
+ * across surfaces but not across silhouettes. Depth rejection is measured relative to `radius`,
+ * which keeps it scale invariant. Run it twice (horizontal then vertical) for a full separable
+ * blur. Handy for denoising a half-resolution effect such as ambient occlusion.
+ *
+ * @tsl
+ * @function
+ * @param {Node<vec4>} inputNode - The texture node to blur; its red channel is filtered.
+ * @param {Node<float>} depthNode - The scene depth texture node.
+ * @param {Node<vec2>} directionNode - One texel step along the blur axis, e.g. `vec2( 1 / width, 0 )`.
+ * @param {Camera} camera - The camera the scene is rendered with.
+ * @param {Node<float> | number} [sharpness=2] - How strongly a depth difference rejects a neighbour.
+ * @param {Node<float> | number} [radius=1] - The world-space scale the depth rejection is relative to.
+ * @returns {Node<float>} The blurred value.
+ */
+export const depthAwareBlur = /*#__PURE__*/ Fn( ( [ inputNode, depthNode, directionNode, camera, sharpness = 2, radius = 1 ], builder ) => {
+
+	const cameraNear = reference( 'near', 'float', camera );
+	const cameraFar = reference( 'far', 'float', camera );
+
+	const viewZ = ( uvNode ) => {
+
+		const depth = depthNode.sample( uvNode ).r;
+
+		if ( builder.renderer.logarithmicDepthBuffer === true ) {
+
+			return logarithmicDepthToViewZ( depth, cameraNear, cameraFar );
+
+		}
+
+		return perspectiveDepthToViewZ( depth, cameraNear, cameraFar );
+
+	};
+
+	const uvNode = uv();
+	const centerViewZ = viewZ( uvNode ).toVar();
+
+	const sum = float( 0 ).toVar();
+	const weightSum = float( 0 ).toVar();
+
+	Loop( { start: int( - 2 ), end: int( 3 ), type: 'int', condition: '<' }, ( { i } ) => {
+
+		const fi = float( i );
+		const sampleUv = uvNode.add( directionNode.mul( fi ) );
+
+		const spatialWeight = exp( fi.mul( fi ).mul( - 0.5 ) );
+		const depthWeight = exp( abs( viewZ( sampleUv ).sub( centerViewZ ) ).div( radius ).mul( sharpness ).negate() );
+		const weight = spatialWeight.mul( depthWeight );
+
+		sum.addAssign( inputNode.sample( sampleUv ).r.mul( weight ) );
+		weightSum.addAssign( weight );
+
+	} );
+
+	return sum.div( max( weightSum, float( 0.0001 ) ) );
+
+} );

package/Resources/WebLibraries/three/addons/tsl/display/hashBlur.js

@@ -0,0 +1,55 @@
+import { float, Fn, vec2, uv, sin, rand, TWO_PI, cos, Loop, vec4, premultiplyAlpha, unpremultiplyAlpha, convertToTexture, nodeObject } from 'three/tsl';
+
+/**
+ * Applies a hash blur effect to the given texture node.
+ *
+ * The approach of this blur is different compared to Gaussian and box blur since
+ * it does not rely on a kernel to apply a convolution. Instead, it reads the base
+ * texture multiple times in a random pattern and then averages the samples. A
+ * typical artifact of this technique is a slightly noisy appearance of the blur which
+ * can be mitigated by increasing the number of iterations (see `repeats` parameter).
+ * Compared to Gaussian blur, hash blur requires just a single pass.
+ *
+ * Reference: {@link https://www.shadertoy.com/view/4lXXWn}.
+ *
+ * @tsl
+ * @function
+ * @param {Node<vec4>} textureNode - The texture node that should be blurred.
+ * @param {Node<float>} [bluramount=float(0.1)] - This node determines the amount of blur.
+ * @param {Object} [options={}] - Additional options for the hash blur effect.
+ * @param {Node<float>} [options.repeats=float(45)] - The number of iterations for the blur effect.
+ * @param {boolean} [options.premultipliedAlpha=false] - Whether to use premultiplied alpha for the blur effect.
+ * @return {Node<vec4>} The blurred texture node.
+ */
+export const hashBlur = /*#__PURE__*/ Fn( ( [ textureNode, bluramount = float( 0.1 ), options = {} ] ) => {
+
+	textureNode = convertToTexture( textureNode );
+
+	const repeats = nodeObject( options.repeats ) || float( 45 );
+	const premultipliedAlpha = options.premultipliedAlpha || false;
+
+	const tap = ( uv ) => {
+
+		const sample = textureNode.sample( uv );
+
+		return premultipliedAlpha ? premultiplyAlpha( sample ) : sample;
+
+	};
+
+	const targetUV = textureNode.uvNode || uv();
+	const blurred_image = vec4( 0. );
+
+	Loop( { start: 0., end: repeats, type: 'float' }, ( { i } ) => {
+
+		const angle = i.div( repeats ).mul( TWO_PI ).toConst();
+		const q = vec2( cos( angle ), sin( angle ) ).mul( rand( vec2( i, targetUV.x.add( targetUV.y ) ) ).add( bluramount ) );
+		const uv2 = vec2( targetUV.add( q.mul( bluramount ) ) );
+		blurred_image.addAssign( tap( uv2 ) );
+
+	} );
+
+	blurred_image.divAssign( repeats );
+
+	return premultipliedAlpha ? unpremultiplyAlpha( blurred_image ) : blurred_image;
+
+} );

package/Resources/WebLibraries/three/addons/tsl/display/lensDirt.js

@@ -0,0 +1,30 @@
+import { float, Fn, vec2, vec4, uv, min, screenSize, convertToTexture } from 'three/tsl';
+
+/**
+ * Applies a lens dirt effect. The lens dirt texture is revealed wherever the
+ * scene's luminance is bright. The input is typically a blurred luminance of
+ * the scene, e.g. the result of a bloom pass. A wider blur reveals the dirt
+ * over a larger area around bright spots.
+ *
+ * @tsl
+ * @function
+ * @param {Node<vec4>} textureNode - The node that represents the scene's blurred luminance.
+ * @param {TextureNode} dirtTextureNode - The lens dirt texture.
+ * @param {Node<float>} [intensity=float(1)] - Defines the intensity of the lens dirt.
+ * @return {Node<vec4>} The lens dirt.
+ */
+export const lensDirt = /*#__PURE__*/ Fn( ( [ textureNode, dirtTextureNode, intensity = float( 1 ) ] ) => {
+
+	textureNode = convertToTexture( textureNode );
+
+	const targetUV = textureNode.uvNode || uv();
+
+	const dirtSize = vec2( dirtTextureNode.size( 0 ) ).toConst();
+	const aspect = screenSize.x.div( screenSize.y ).div( dirtSize.x.div( dirtSize.y ) ).toConst();
+	const dirtUV = targetUV.sub( 0.5 ).mul( vec2( min( aspect, 1 ), min( aspect.reciprocal(), 1 ) ) ).add( 0.5 ).toConst();
+
+	const dirt = dirtTextureNode.sample( dirtUV ).rgb.mul( textureNode.sample( targetUV ).rgb ).mul( intensity );
+
+	return vec4( dirt, 1 );
+
+} );

package/Resources/WebLibraries/three/addons/tsl/display/radialBlur.js

@@ -0,0 +1,68 @@
+import { interleavedGradientNoise, Fn, vec2, vec4, mix, uv, Loop, premultiplyAlpha, unpremultiplyAlpha, int, float, nodeObject, convertToTexture, screenCoordinate } from 'three/tsl';
+
+/**
+ * This TSL function blurs an image in a circular pattern, radiating from a configurable center point in screen space.
+ *
+ * Radial blurs can be used for different kind of effects like producing simple faked lighting effects also known as
+ * "light shafts". The major limitation of this specific usage is the center point can only be defined in 2D so the
+ * effect does not honor the depth of 3D objects. Consequently, it is not intended for physically correct lit scenes.
+ *
+ * @tsl
+ * @function
+ * @param {Node<vec4>} textureNode - The texture node that should be blurred.
+ * @param {Object} [options={}] - Additional options for the radial blur effect.
+ * @param {Node<vec2>} [options.center=vec2(0.5, 0.5)] - The center of the light in screen uvs.
+ * @param {Node<int>} [options.weight=float(0.9)] - Base weight factor for each sample in the range `[0,1]`.
+ * @param {Node<int>} [options.decay=float(0.95)] - Decreases the weight factor so each iteration adds less to the sum. Must be in the range `[0,1]`.
+ * If you increase the sample count, you have to increase this option as well to avoid a darking effect.
+ * @param {Node<int>} [options.count=int(32)] - The number if iterations. Should be in the range `[16,64]`.
+ * @param {Node<int>} [options.exposure=float(5)] - Exposure control of the blur.
+ * @return {Node<vec4>} The blurred texture node.
+ */
+export const radialBlur = /*#__PURE__*/ Fn( ( [ textureNode, options = {} ] ) => {
+
+	textureNode = convertToTexture( textureNode );
+
+	const center = nodeObject( options.center ) || vec2( 0.5, 0.5 );
+	const weight = nodeObject( options.weight ) || float( 0.9 );
+	const decay = nodeObject( options.decay ) || float( 0.95 );
+	const count = nodeObject( options.count ) || int( 32 );
+	const exposure = nodeObject( options.exposure ) || float( 5 );
+	const premultipliedAlpha = options.premultipliedAlpha || false;
+
+	const tap = ( uv ) => {
+
+		const sample = textureNode.sample( uv );
+
+		return premultipliedAlpha ? premultiplyAlpha( sample ) : sample;
+
+	};
+
+	const sampleUv = vec2( textureNode.uvNode || uv() );
+
+	const base = tap( sampleUv ).toConst();
+	const blur = vec4().toVar();
+	const offset = center.sub( sampleUv ).div( count ).toConst();
+	const w = float( weight ).toVar();
+
+	const noise = interleavedGradientNoise( screenCoordinate );
+	sampleUv.addAssign( offset.mul( noise ) ); // mitigate banding
+
+	Loop( { start: int( 0 ), end: int( count ), type: 'int', condition: '<' }, () => {
+
+		sampleUv.addAssign( offset );
+		const sample = tap( sampleUv );
+
+		blur.addAssign( sample.mul( w ) );
+		w.mulAssign( decay );
+
+	} );
+
+	blur.divAssign( count );
+	blur.mulAssign( exposure );
+
+	const color = mix( blur, base.mul( 2 ), 0.5 );
+
+	return premultipliedAlpha ? unpremultiplyAlpha( color ) : color;
+
+} );