super-three 0.170.0 → 0.171.0

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

@@ -1,4 +1,5 @@
-import { TempNode, nodeObject, Fn, float, uniform, vec3, vec4, mix } from 'three/tsl';
+import { TempNode } from 'three/webgpu';
+import { nodeObject, Fn, float, uniform, vec3, vec4, mix } from 'three/tsl';
 
 class Lut3DNode extends TempNode {
 
@@ -10,7 +11,7 @@ class Lut3DNode extends TempNode {
 
 	constructor( inputNode, lutNode, size, intensityNode ) {
 
-		super();
+		super( 'vec4' );
 
 		this.inputNode = inputNode;
 		this.lutNode = lutNode;

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

@@ -1,5 +1,5 @@
-import { Color, DepthTexture, FloatType, RenderTarget, Vector2, PostProcessingUtils } from 'three';
-import { Loop, int, exp, min, float, mul, uv, vec2, vec3, Fn, textureSize, orthographicDepthToViewZ, QuadMesh, screenUV, TempNode, nodeObject, NodeUpdateType, uniform, vec4, NodeMaterial, passTexture, texture, perspectiveDepthToViewZ, positionView } from 'three/tsl';
+import { Color, DepthTexture, FloatType, RenderTarget, Vector2, TempNode, QuadMesh, NodeMaterial, PostProcessingUtils, 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 } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
 const _size = /*@__PURE__*/ new Vector2();

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

@@ -1,4 +1,5 @@
-import { nodeObject, Fn, vec4, uv, NodeMaterial, If, mod, screenCoordinate } from 'three/tsl';
+import { NodeMaterial } from 'three/webgpu';
+import { nodeObject, Fn, vec4, uv, If, mod, screenCoordinate } from 'three/tsl';
 import StereoCompositePassNode from './StereoCompositePassNode.js';
 
 class ParallaxBarrierPassNode extends StereoCompositePassNode {

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

@@ -1,5 +1,5 @@
-import { NearestFilter, Vector4 } from 'three';
-import { TempNode, nodeObject, Fn, float, NodeUpdateType, uv, uniform, convertToTexture, vec2, vec3, clamp, floor, dot, smoothstep, If, sign, step, mrt, output, normalView, PassNode, property } from 'three/tsl';
+import { NearestFilter, Vector4, TempNode, NodeUpdateType, PassNode } from 'three/webgpu';
+import { nodeObject, Fn, float, uv, uniform, convertToTexture, vec2, vec3, clamp, floor, dot, smoothstep, If, sign, step, mrt, output, normalView, property } from 'three/tsl';
 
 class PixelationNode extends TempNode {
 
@@ -11,7 +11,7 @@ class PixelationNode extends TempNode {
 
 	constructor( textureNode, depthNode, normalNode, pixelSize, normalEdgeStrength, depthEdgeStrength ) {
 
-		super();
+		super( 'vec4' );
 
 		// Input textures
 
@@ -158,7 +158,7 @@ class PixelationPassNode extends PassNode {
 
 	constructor( scene, camera, pixelSize = 6, normalEdgeStrength = 0.3, depthEdgeStrength = 0.4 ) {
 
-		super( 'color', scene, camera, { minFilter: NearestFilter, magFilter: NearestFilter } );
+		super( PassNode.COLOR, scene, camera, { minFilter: NearestFilter, magFilter: NearestFilter } );
 
 		this.pixelSize = pixelSize;
 		this.normalEdgeStrength = normalEdgeStrength;

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

@@ -1,4 +1,5 @@
-import { TempNode, nodeObject, Fn, uv, uniform, vec2, sin, cos, vec4, convertToTexture } from 'three/tsl';
+import { TempNode } from 'three/webgpu';
+import { nodeObject, Fn, uv, uniform, vec2, sin, cos, vec4, convertToTexture } from 'three/tsl';
 
 class RGBShiftNode extends TempNode {
 

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

@@ -1,5 +1,5 @@
-import { HalfFloatType, LinearFilter, NearestFilter, RenderTarget, Texture, Vector2, PostProcessingUtils } from 'three';
-import { abs, QuadMesh, NodeMaterial, TempNode, nodeObject, Fn, NodeUpdateType, uv, uniform, convertToTexture, varyingProperty, vec2, vec4, modelViewProjection, passTexture, max, step, dot, float, texture, If, Loop, int, Break, sqrt, sign, mix } from 'three/tsl';
+import { HalfFloatType, LinearFilter, NearestFilter, RenderTarget, Texture, Vector2, QuadMesh, NodeMaterial, TempNode, PostProcessingUtils } from 'three/webgpu';
+import { abs, nodeObject, Fn, NodeUpdateType, uv, uniform, convertToTexture, varyingProperty, vec2, vec4, modelViewProjection, passTexture, max, step, dot, float, texture, If, Loop, int, Break, sqrt, sign, mix } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
 const _size = /*@__PURE__*/ new Vector2();
@@ -22,7 +22,7 @@ class SMAANode extends TempNode {
 
 	constructor( textureNode ) {
 
-		super();
+		super( 'vec4' );
 
 		this.textureNode = textureNode;
 

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

@@ -1,5 +1,5 @@
-import { AdditiveBlending, Color, Vector2, PostProcessingUtils } from 'three';
-import { nodeObject, uniform, mrt, PassNode, QuadMesh, texture, NodeMaterial, getTextureIndex } from 'three/tsl';
+import { AdditiveBlending, Color, Vector2, PostProcessingUtils, PassNode, QuadMesh, NodeMaterial } from 'three/webgpu';
+import { nodeObject, uniform, mrt, texture, getTextureIndex } from 'three/tsl';
 
 const _size = /*@__PURE__*/ new Vector2();
 

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

@@ -1,5 +1,5 @@
-import { NearestFilter, RenderTarget, Vector2, PostProcessingUtils } from 'three';
-import { getScreenPosition, getViewPosition, sqrt, mul, div, cross, float, Continue, Break, Loop, int, max, abs, sub, If, dot, reflect, normalize, screenCoordinate, QuadMesh, TempNode, nodeObject, Fn, NodeUpdateType, passTexture, NodeMaterial, uv, uniform, perspectiveDepthToViewZ, orthographicDepthToViewZ, vec2, vec3, vec4 } from 'three/tsl';
+import { NearestFilter, RenderTarget, Vector2, PostProcessingUtils, QuadMesh, TempNode, NodeMaterial, NodeUpdateType } from 'three/webgpu';
+import { reference, viewZToPerspectiveDepth, logarithmicDepthToViewZ, getScreenPosition, getViewPosition, sqrt, mul, div, cross, float, Continue, Break, Loop, int, max, abs, sub, If, dot, reflect, normalize, screenCoordinate, nodeObject, Fn, passTexture, uv, uniform, perspectiveDepthToViewZ, orthographicDepthToViewZ, vec2, vec3, vec4 } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
 const _size = /*@__PURE__*/ new Vector2();
@@ -19,7 +19,7 @@ class SSRNode extends TempNode {
 
 	constructor( colorNode, depthNode, normalNode, metalnessNode, camera ) {
 
-		super();
+		super( 'vec4' );
 
 		this.colorNode = colorNode;
 		this.depthNode = depthNode;
@@ -42,10 +42,10 @@ class SSRNode extends TempNode {
 		this.thickness = uniform( 0.1 ); // controls the cutoff between what counts as a possible reflection hit and what does not
 		this.opacity = uniform( 1 ); // controls the transparency of the reflected colors
 
-		this._cameraNear = uniform( camera.near );
-		this._cameraFar = uniform( camera.far );
 		this._cameraProjectionMatrix = uniform( camera.projectionMatrix );
 		this._cameraProjectionMatrixInverse = uniform( camera.projectionMatrixInverse );
+		this._cameraNear = reference( 'near', 'float', camera );
+		this._cameraFar = reference( 'far', 'float', camera );
 		this._isPerspectiveCamera = uniform( camera.isPerspectiveCamera ? 1 : 0 );
 		this._resolution = uniform( new Vector2() );
 		this._maxStep = uniform( 0 );
@@ -151,15 +151,31 @@ class SSRNode extends TempNode {
 
 		} );
 
+		const sampleDepth = ( uv ) => {
+
+			const depth = this.depthNode.uv( 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 ssr = Fn( () => {
 
 			const metalness = this.metalnessNode.uv( uvNode ).r;
 
-			 // fragments with no metalness do not reflect their environment
+			// fragments with no metalness do not reflect their environment
 			metalness.equal( 0.0 ).discard();
 
 			// compute some standard FX entities
-			const depth = this.depthNode.uv( uvNode ).r.toVar();
+			const depth = sampleDepth( uvNode ).toVar();
 			const viewPosition = getViewPosition( uvNode, depth, this._cameraProjectionMatrixInverse ).toVar();
 			const viewNormal = this.normalNode.rgb.normalize().toVar();
 
@@ -214,6 +230,13 @@ class SSRNode extends TempNode {
 			// it does not exceed d1 (the maximum ray extend)
 			Loop( { start: int( 0 ), end: int( this._maxStep ), type: 'int', condition: '<' }, ( { i } ) => {
 
+				// TODO: Remove this when Chrome is fixed, see https://issues.chromium.org/issues/372714384#comment14
+				If( metalness.equal( 0 ), () => {
+
+					Break();
+
+				} );
+
 				// stop if the maximum number of steps is reached for this specific ray
 				If( float( i ).greaterThanEqual( totalStep ), () => {
 
@@ -233,7 +256,7 @@ class SSRNode extends TempNode {
 
 				// compute new uv, depth, viewZ and viewPosition for the new location on the ray
 				const uvNode = xy.div( this._resolution );
-				const d = this.depthNode.uv( uvNode ).r.toVar();
+				const d = sampleDepth( uvNode ).toVar();
 				const vZ = getViewZ( d ).toVar();
 				const vP = getViewPosition( uvNode, d, this._cameraProjectionMatrixInverse ).toVar();
 

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

@@ -1,5 +1,5 @@
-import { Vector2 } from 'three';
-import { TempNode, nodeObject, Fn, NodeUpdateType, uv, uniform, convertToTexture, vec2, vec3, vec4, mat3, luminance, add } from 'three/tsl';
+import { Vector2, TempNode, NodeUpdateType } from 'three/webgpu';
+import { nodeObject, Fn, uv, uniform, convertToTexture, vec2, vec3, vec4, mat3, luminance, add } from 'three/tsl';
 
 class SobelOperatorNode extends TempNode {
 
@@ -11,7 +11,7 @@ class SobelOperatorNode extends TempNode {
 
 	constructor( textureNode ) {
 
-		super();
+		super( 'vec4' );
 
 		this.textureNode = textureNode;
 

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

@@ -1,5 +1,5 @@
-import { RenderTarget, StereoCamera, HalfFloatType, LinearFilter, NearestFilter, Vector2, PostProcessingUtils } from 'three';
-import { PassNode, QuadMesh, texture } from 'three/tsl';
+import { RenderTarget, StereoCamera, HalfFloatType, LinearFilter, NearestFilter, Vector2, PassNode, QuadMesh, PostProcessingUtils } from 'three/webgpu';
+import { texture } from 'three/tsl';
 
 const _size = /*@__PURE__*/ new Vector2();
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
@@ -55,7 +55,7 @@ class StereoCompositePassNode extends PassNode {
 		const { renderer } = frame;
 		const { scene, stereo, renderTarget } = this;
 
-		_rendererState = PostProcessingUtils.resetRendererAndSceneState( renderer, scene, _rendererState );
+		_rendererState = PostProcessingUtils.resetRendererState( renderer, _rendererState );
 
 		//
 
@@ -84,7 +84,7 @@ class StereoCompositePassNode extends PassNode {
 
 		// restore
 
-		PostProcessingUtils.restoreRendererState( renderer, scene, _rendererState );
+		PostProcessingUtils.restoreRendererState( renderer, _rendererState );
 
 	}
 

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

@@ -1,5 +1,5 @@
-import { StereoCamera, Vector2, PostProcessingUtils } from 'three';
-import { PassNode, nodeObject } from 'three/tsl';
+import { StereoCamera, Vector2, PassNode, PostProcessingUtils } from 'three/webgpu';
+import { nodeObject } from 'three/tsl';
 
 const _size = /*@__PURE__*/ new Vector2();
 

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

@@ -1,5 +1,5 @@
-import { Color, Vector2, PostProcessingUtils, NearestFilter, Matrix4 } from 'three';
-import { add, float, If, Loop, int, Fn, min, max, clamp, nodeObject, PassNode, QuadMesh, texture, NodeMaterial, uniform, uv, vec2, vec4, luminance } from 'three/tsl';
+import { Color, Vector2, NearestFilter, Matrix4, PostProcessingUtils, PassNode, QuadMesh, NodeMaterial } from 'three/webgpu';
+import { add, float, If, Loop, int, Fn, min, max, clamp, nodeObject, texture, uniform, uv, vec2, vec4, luminance } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
 const _size = /*@__PURE__*/ new Vector2();

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

@@ -1,4 +1,5 @@
-import { TempNode, nodeObject, Fn, float, uv, convertToTexture, vec4, If, int, clamp, sub, mix } from 'three/tsl';
+import { TempNode } from 'three/webgpu';
+import { nodeObject, Fn, float, uv, convertToTexture, vec4, If, int, clamp, sub, mix } from 'three/tsl';
 
 class TransitionNode extends TempNode {
 
@@ -10,7 +11,7 @@ class TransitionNode extends TempNode {
 
 	constructor( textureNodeA, textureNodeB, mixTextureNode, mixRatioNode, thresholdNode, useTextureNode ) {
 
-		super();
+		super( 'vec4' );
 
 		// Input textures
 

package/examples/jsm/tsl/lighting/TiledLightsNode.js

@@ -1,10 +1,10 @@
+import { DataTexture, FloatType, RGBAFormat, Vector2, Vector3, LightsNode, NodeUpdateType } from 'three/webgpu';
+
 import {
-	storageObject, nodeProxy, int, float, vec2, ivec2, ivec4, uniform, Break, Loop,
+	attributeArray, nodeProxy, int, float, vec2, ivec2, ivec4, uniform, Break, Loop,
 	Fn, If, Return, textureLoad, instanceIndex, screenCoordinate, directPointLight
 } from 'three/tsl';
 
-import { DataTexture, FloatType, LightsNode, NodeUpdateType, RGBAFormat, StorageBufferAttribute, Vector2, Vector3 } from 'three';
-
 export const circleIntersectsAABB = /*@__PURE__*/ Fn( ( [ circleCenter, radius, minBounds, maxBounds ] ) => {
 
 	// Find the closest point on the AABB to the circle's center using method chaining
@@ -204,6 +204,8 @@ class TiledLightsNode extends LightsNode {
 		lightingModel.directDiffuse.append();
 		lightingModel.directSpecular.append();
 
+		super.setupLights( builder, lightNodes );
+
 		Fn( () => {
 
 			Loop( this.tileLightCount, ( { i } ) => {
@@ -229,10 +231,6 @@ class TiledLightsNode extends LightsNode {
 
 		} )().append();
 
-		// others lights
-
-		super.setupLights( builder, lightNodes );
-
 	}
 
 	getBufferFitSize( value ) {
@@ -291,8 +289,7 @@ class TiledLightsNode extends LightsNode {
 		const lightsTexture = new DataTexture( lightsData, lightsData.length / 8, 2, RGBAFormat, FloatType );
 
 		const lightIndexesArray = new Int32Array( count * 4 * 2 );
-		const lightIndexesAttribute = new StorageBufferAttribute( lightIndexesArray, 4 );
-		const lightIndexes = storageObject( lightIndexesAttribute, 'ivec4', lightIndexesAttribute.count ).label( 'lightIndexes' );
+		const lightIndexes = attributeArray( lightIndexesArray, 'ivec4' ).label( 'lightIndexes' );
 
 		// compute