super-three 0.160.1 → 0.162.0

package/examples/jsm/nodes/utils/ReflectorNode.js

@@ -0,0 +1,227 @@
+import TextureNode from '../accessors/TextureNode.js';
+import { nodeObject, vec2 } from '../shadernode/ShaderNode.js';
+import { NodeUpdateType } from '../core/constants.js';
+import { viewportTopLeft } from '../display/ViewportNode.js';
+import { Matrix4, Vector2, Vector3, Vector4, Object3D, Plane, RenderTarget, HalfFloatType, LinearMipMapLinearFilter } from 'three';
+
+const _reflectorPlane = new Plane();
+const _normal = new Vector3();
+const _reflectorWorldPosition = new Vector3();
+const _cameraWorldPosition = new Vector3();
+const _rotationMatrix = new Matrix4();
+const _lookAtPosition = new Vector3( 0, 0, - 1 );
+const clipPlane = new Vector4();
+
+const _view = new Vector3();
+const _target = new Vector3();
+const _q = new Vector4();
+
+const _size = new Vector2();
+
+const _defaultRT = new RenderTarget();
+const _defaultUV = vec2( viewportTopLeft.x.oneMinus(), viewportTopLeft.y );
+
+let _inReflector = false;
+
+class ReflectorNode extends TextureNode {
+
+	constructor( parameters = {} ) {
+
+		super( _defaultRT.texture, _defaultUV );
+
+		const {
+			target = new Object3D(),
+			resolution = 1,
+			generateMipmaps = false,
+			bounces = true
+		} = parameters;
+
+		//
+
+		this.target = target;
+		this.resolution = resolution;
+		this.generateMipmaps = generateMipmaps;
+		this.bounces = bounces;
+
+		this.updateBeforeType = bounces ? NodeUpdateType.RENDER : NodeUpdateType.FRAME;
+
+		this.virtualCameras = new WeakMap();
+		this.renderTargets = new WeakMap();
+
+
+	}
+
+	_updateResolution( renderTarget, renderer ) {
+
+		const resolution = this.resolution;
+
+		renderer.getDrawingBufferSize( _size );
+
+		renderTarget.setSize( Math.round( _size.width * resolution ), Math.round( _size.height * resolution ) );
+
+	}
+
+	setup( builder ) {
+
+		this._updateResolution( _defaultRT, builder.renderer );
+
+		return super.setup( builder );
+
+	}
+
+	getTextureNode() {
+
+		return this.textureNode;
+
+	}
+
+	getVirtualCamera( camera ) {
+
+		let virtualCamera = this.virtualCameras.get( camera );
+
+		if ( virtualCamera === undefined ) {
+
+			virtualCamera = camera.clone();
+
+			this.virtualCameras.set( camera, virtualCamera );
+
+		}
+
+		return virtualCamera;
+
+	}
+
+	getRenderTarget( camera ) {
+
+		let renderTarget = this.renderTargets.get( camera );
+
+		if ( renderTarget === undefined ) {
+
+			renderTarget = new RenderTarget( 0, 0, { type: HalfFloatType } );
+
+			if ( this.generateMipmaps === true ) {
+
+			    renderTarget.texture.minFilter = LinearMipMapLinearFilter;
+			    renderTarget.texture.generateMipmaps = true;
+
+			}
+
+			this.renderTargets.set( camera, renderTarget );
+
+		}
+
+		return renderTarget;
+
+	}
+
+	updateBefore( frame ) {
+
+		if ( this.bounces === false && _inReflector ) return false;
+
+		_inReflector = true;
+
+		const { scene, camera, renderer, material } = frame;
+		const { target } = this;
+
+		const virtualCamera = this.getVirtualCamera( camera );
+		const renderTarget = this.getRenderTarget( virtualCamera );
+
+		renderer.getDrawingBufferSize( _size );
+
+		this._updateResolution( renderTarget, renderer );
+
+		//
+
+		_reflectorWorldPosition.setFromMatrixPosition( target.matrixWorld );
+		_cameraWorldPosition.setFromMatrixPosition( camera.matrixWorld );
+
+		_rotationMatrix.extractRotation( target.matrixWorld );
+
+		_normal.set( 0, 0, 1 );
+		_normal.applyMatrix4( _rotationMatrix );
+
+		_view.subVectors( _reflectorWorldPosition, _cameraWorldPosition );
+
+		// Avoid rendering when reflector is facing away
+
+		if ( _view.dot( _normal ) > 0 ) return;
+
+		_view.reflect( _normal ).negate();
+		_view.add( _reflectorWorldPosition );
+
+		_rotationMatrix.extractRotation( camera.matrixWorld );
+
+		_lookAtPosition.set( 0, 0, - 1 );
+		_lookAtPosition.applyMatrix4( _rotationMatrix );
+		_lookAtPosition.add( _cameraWorldPosition );
+
+		_target.subVectors( _reflectorWorldPosition, _lookAtPosition );
+		_target.reflect( _normal ).negate();
+		_target.add( _reflectorWorldPosition );
+
+		//
+
+		virtualCamera.coordinateSystem = camera.coordinateSystem;
+		virtualCamera.position.copy( _view );
+		virtualCamera.up.set( 0, 1, 0 );
+		virtualCamera.up.applyMatrix4( _rotationMatrix );
+		virtualCamera.up.reflect( _normal );
+		virtualCamera.lookAt( _target );
+
+		virtualCamera.near = camera.near;
+		virtualCamera.far = camera.far;
+
+		virtualCamera.updateMatrixWorld();
+		virtualCamera.projectionMatrix.copy( camera.projectionMatrix );
+
+		// Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
+		// Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
+		_reflectorPlane.setFromNormalAndCoplanarPoint( _normal, _reflectorWorldPosition );
+		_reflectorPlane.applyMatrix4( virtualCamera.matrixWorldInverse );
+
+		clipPlane.set( _reflectorPlane.normal.x, _reflectorPlane.normal.y, _reflectorPlane.normal.z, _reflectorPlane.constant );
+
+		const projectionMatrix = virtualCamera.projectionMatrix;
+
+		_q.x = ( Math.sign( clipPlane.x ) + projectionMatrix.elements[ 8 ] ) / projectionMatrix.elements[ 0 ];
+		_q.y = ( Math.sign( clipPlane.y ) + projectionMatrix.elements[ 9 ] ) / projectionMatrix.elements[ 5 ];
+		_q.z = - 1.0;
+		_q.w = ( 1.0 + projectionMatrix.elements[ 10 ] ) / projectionMatrix.elements[ 14 ];
+
+		// Calculate the scaled plane vector
+		clipPlane.multiplyScalar( 1.0 / clipPlane.dot( _q ) );
+
+		const clipBias = 0;
+
+		// Replacing the third row of the projection matrix
+		projectionMatrix.elements[ 2 ] = clipPlane.x;
+		projectionMatrix.elements[ 6 ] = clipPlane.y;
+		projectionMatrix.elements[ 10 ] = clipPlane.z - clipBias;
+		projectionMatrix.elements[ 14 ] = clipPlane.w;
+
+		//
+
+		this.value = renderTarget.texture;
+
+		material.visible = false;
+
+		const currentRenderTarget = renderer.getRenderTarget();
+
+		renderer.setRenderTarget( renderTarget );
+
+		renderer.render( scene, virtualCamera );
+
+		renderer.setRenderTarget( currentRenderTarget );
+
+		material.visible = true;
+
+		_inReflector = false;
+
+	}
+
+}
+
+export const reflector = ( parameters ) => nodeObject( new ReflectorNode( parameters ) );
+
+export default ReflectorNode;
+

package/examples/jsm/nodes/utils/RotateNode.js

@@ -0,0 +1,68 @@
+import TempNode from '../core/TempNode.js';
+import { addNodeClass } from '../core/Node.js';
+import {
+	addNodeElement,
+	nodeProxy,
+	vec4,
+	mat2,
+	mat4,
+} from '../shadernode/ShaderNode.js';
+import { cos, sin } from '../math/MathNode.js';
+
+class RotateNode extends TempNode {
+
+	constructor( positionNode, rotationNode ) {
+
+		super();
+
+		this.positionNode = positionNode;
+		this.rotationNode = rotationNode;
+
+	}
+
+	getNodeType( builder ) {
+
+		return this.positionNode.getNodeType( builder );
+
+	}
+
+	setup( builder ) {
+
+		const { rotationNode, positionNode } = this;
+
+		const nodeType = this.getNodeType( builder );
+
+		if ( nodeType === 'vec2' ) {
+
+			const cosAngle = rotationNode.cos();
+			const sinAngle = rotationNode.sin();
+
+			const rotationMatrix = mat2(
+				cosAngle, sinAngle,
+				sinAngle.negate(), cosAngle
+			);
+
+			return rotationMatrix.mul( positionNode );
+
+		} else {
+
+			const rotation = rotationNode;
+			const rotationXMatrix = mat4( vec4( 1.0, 0.0, 0.0, 0.0 ), vec4( 0.0, cos( rotation.x ), sin( rotation.x ).negate(), 0.0 ), vec4( 0.0, sin( rotation.x ), cos( rotation.x ), 0.0 ), vec4( 0.0, 0.0, 0.0, 1.0 ) );
+			const rotationYMatrix = mat4( vec4( cos( rotation.y ), 0.0, sin( rotation.y ), 0.0 ), vec4( 0.0, 1.0, 0.0, 0.0 ), vec4( sin( rotation.y ).negate(), 0.0, cos( rotation.y ), 0.0 ), vec4( 0.0, 0.0, 0.0, 1.0 ) );
+			const rotationZMatrix = mat4( vec4( cos( rotation.z ), sin( rotation.z ).negate(), 0.0, 0.0 ), vec4( sin( rotation.z ), cos( rotation.z ), 0.0, 0.0 ), vec4( 0.0, 0.0, 1.0, 0.0 ), vec4( 0.0, 0.0, 0.0, 1.0 ) );
+
+			return rotationXMatrix.mul( rotationYMatrix ).mul( rotationZMatrix ).mul( vec4( positionNode, 1.0 ) ).xyz;
+
+		}
+
+	}
+
+}
+
+export default RotateNode;
+
+export const rotate = nodeProxy( RotateNode );
+
+addNodeElement( 'rotate', rotate );
+
+addNodeClass( 'RotateNode', RotateNode );

package/examples/jsm/nodes/utils/RotateUVNode.js

@@ -18,17 +18,9 @@ class RotateUVNode extends TempNode {
 
 		const { uvNode, rotationNode, centerNode } = this;
 
-		const cosAngle = rotationNode.cos();
-		const sinAngle = rotationNode.sin();
-
 		const vector = uvNode.sub( centerNode );
 
-		const rotatedVector = vec2( // @TODO: Maybe we can create mat2 and write something like rotationMatrix.mul( vector )?
-			vec2( cosAngle, sinAngle ).dot( vector ),
-			vec2( sinAngle.negate(), cosAngle ).dot( vector )
-		);
-
-		return rotatedVector.add( centerNode );
+		return vector.rotate( rotationNode ).add( centerNode );
 
 	}
 

package/examples/jsm/nodes/utils/SplitNode.js

@@ -30,15 +30,15 @@ class SplitNode extends Node {
 
 	}
 
-	getPrimitiveType( builder ) {
+	getComponentType( builder ) {
 
-		return builder.getPrimitiveType( this.node.getNodeType( builder ) );
+		return builder.getComponentType( this.node.getNodeType( builder ) );
 
 	}
 
 	getNodeType( builder ) {
 
-		return builder.getTypeFromLength( this.components.length, this.getPrimitiveType( builder ) );
+		return builder.getTypeFromLength( this.components.length, this.getComponentType( builder ) );
 
 	}
 
@@ -59,7 +59,7 @@ class SplitNode extends Node {
 
 				// needed expand the input node
 
-				type = builder.getTypeFromLength( this.getVectorLength(), this.getPrimitiveType( builder ) );
+				type = builder.getTypeFromLength( this.getVectorLength(), this.getComponentType( builder ) );
 
 			}
 

package/examples/jsm/nodes/utils/StorageArrayElementNode.js

@@ -0,0 +1,91 @@
+import { addNodeClass } from '../core/Node.js';
+import { nodeProxy, addNodeElement } from '../shadernode/ShaderNode.js';
+import ArrayElementNode from './ArrayElementNode.js';
+
+class StorageArrayElementNode extends ArrayElementNode {
+
+	constructor( storageBufferNode, indexNode ) {
+
+		super( storageBufferNode, indexNode );
+
+		this.isStorageArrayElementNode = true;
+
+	}
+
+	set storageBufferNode( value ) {
+
+		this.node = value;
+
+	}
+
+	get storageBufferNode() {
+
+		return this.node;
+
+	}
+
+	setup( builder ) {
+
+		if ( builder.isAvailable( 'storageBuffer' ) === false ) {
+
+			if ( ! this.node.instanceIndex && this.node.bufferObject === true ) {
+
+				builder.setupPBO( this.node );
+
+			}
+
+		}
+
+		return super.setup( builder );
+
+	}
+
+	generate( builder, output ) {
+
+		let snippet;
+
+		const isAssignContext = builder.context.assign;
+
+		//
+
+		if ( builder.isAvailable( 'storageBuffer' ) === false ) {
+
+			const { node } = this;
+
+			if ( ! node.instanceIndex && this.node.bufferObject === true && isAssignContext !== true ) {
+
+				snippet = builder.generatePBO( this );
+
+			} else {
+
+				snippet = node.build( builder );
+
+			}
+
+		} else {
+
+			snippet = super.generate( builder );
+
+		}
+
+		if ( isAssignContext !== true ) {
+
+			const type = this.getNodeType( builder );
+
+			snippet = builder.format( snippet, type, output );
+
+		}
+
+		return snippet;
+
+	}
+
+}
+
+export default StorageArrayElementNode;
+
+export const storageElement = nodeProxy( StorageArrayElementNode );
+
+addNodeElement( 'storageElement', storageElement );
+
+addNodeClass( 'StorageArrayElementNode', StorageArrayElementNode );

package/examples/jsm/objects/GroundedSkybox.js

@@ -0,0 +1,50 @@
+import { Mesh, MeshBasicMaterial, SphereGeometry, Vector3 } from 'three';
+
+/**
+ * A ground-projected skybox. The height is how far the camera that took the photo was above the ground - 
+ * a larger value will magnify the downward part of the image. By default the object is centered at the camera, 
+ * so it is often helpful to set skybox.position.y = height to put the ground at the origin. Set the radius 
+ * large enough to ensure your user's camera stays inside.
+ */
+
+class GroundedSkybox extends Mesh {
+
+	constructor( map, height, radius, resolution = 128 ) {
+
+		if ( height <= 0 || radius <= 0 || resolution <= 0 ) {
+
+			throw new Error( 'GroundedSkybox height, radius, and resolution must be positive.' );
+
+		}
+
+		const geometry = new SphereGeometry( radius, 2 * resolution, resolution );
+		geometry.scale( 1, 1, -1 );
+
+		const pos = geometry.getAttribute( 'position' );
+		const tmp = new Vector3();
+
+		for ( let i = 0; i < pos.count; ++ i ) {
+
+			tmp.fromBufferAttribute( pos, i );
+			if ( tmp.y < 0 ) {
+
+				// Smooth out the transition from flat floor to sphere:
+				const y1 = - height * 3 / 2;
+				const f =
+						tmp.y < y1 ? - height / tmp.y : ( 1 - tmp.y * tmp.y / ( 3 * y1 * y1 ) );
+				tmp.multiplyScalar( f );
+				tmp.toArray( pos.array, 3 * i );
+
+			}
+
+		}
+
+		pos.needsUpdate = true;
+
+		super( geometry, new MeshBasicMaterial( { map, depthWrite: false } ) );
+
+	}
+
+}
+
+export { GroundedSkybox };

package/examples/jsm/objects/QuadMesh.js

@@ -37,9 +37,9 @@ class QuadMesh {
 
 	}
 
-	render( renderer ) {
+	async renderAsync( renderer ) {
 
-		renderer.render( this._mesh, _camera );
+		await renderer.renderAsync( this._mesh, _camera );
 
 	}
 
@@ -55,6 +55,12 @@ class QuadMesh {
 
 	}
 
+	get render() {
+
+		return this.renderAsync;
+
+	}
+
 }
 
 export default QuadMesh;

package/examples/jsm/objects/Water2.js

@@ -34,14 +34,14 @@ class Water extends Mesh {
 		const scope = this;
 
 		const color = ( options.color !== undefined ) ? new Color( options.color ) : new Color( 0xFFFFFF );
-		const textureWidth = options.textureWidth || 512;
-		const textureHeight = options.textureHeight || 512;
-		const clipBias = options.clipBias || 0;
-		const flowDirection = options.flowDirection || new Vector2( 1, 0 );
-		const flowSpeed = options.flowSpeed || 0.03;
-		const reflectivity = options.reflectivity || 0.02;
-		const scale = options.scale || 1;
-		const shader = options.shader || Water.WaterShader;
+		const textureWidth = options.textureWidth !== undefined ? options.textureWidth : 512;
+		const textureHeight = options.textureHeight !== undefined ? options.textureHeight : 512;
+		const clipBias = options.clipBias !== undefined ? options.clipBias : 0;
+		const flowDirection = options.flowDirection !== undefined ? options.flowDirection : new Vector2( 1, 0 );
+		const flowSpeed = options.flowSpeed !== undefined ? options.flowSpeed : 0.03;
+		const reflectivity = options.reflectivity !== undefined ? options.reflectivity : 0.02;
+		const scale = options.scale !== undefined ? options.scale : 1;
+		const shader = options.shader !== undefined ? options.shader : Water.WaterShader;
 
 		const textureLoader = new TextureLoader();
 

package/examples/jsm/postprocessing/GTAOPass.js

@@ -61,7 +61,7 @@ class GTAOPass extends Pass {
 			depthTest: false,
 			depthWrite: false,
 		} );
-		this.gtaoMaterial.definesPERSPECTIVE_CAMERA = this.camera.isPerspectiveCamera ? 1 : 0;
+		this.gtaoMaterial.defines.PERSPECTIVE_CAMERA = this.camera.isPerspectiveCamera ? 1 : 0;
 		this.gtaoMaterial.uniforms.tNoise.value = this.gtaoNoiseTexture;
 		this.gtaoMaterial.uniforms.resolution.value.set( this.width, this.height );
 		this.gtaoMaterial.uniforms.cameraNear.value = this.camera.near;
@@ -162,6 +162,12 @@ class GTAOPass extends Pass {
 
 	}
 
+	get gtaoMap() {
+
+		return this.pdRenderTarget.texture;
+
+	}
+
 	setGBuffer( depthTexture, normalTexture ) {
 
 		if ( depthTexture !== undefined ) {
@@ -359,6 +365,9 @@ class GTAOPass extends Pass {
 
 		switch ( this.output ) {
 
+			case GTAOPass.OUTPUT.Off:
+				break;
+
 			case GTAOPass.OUTPUT.Diffuse:
 
 				this.copyMaterial.uniforms.tDiffuse.value = readBuffer.texture;
@@ -561,6 +570,7 @@ class GTAOPass extends Pass {
 }
 
 GTAOPass.OUTPUT = {
+	'Off': - 1,
 	'Default': 0,
 	'Diffuse': 1,
 	'Depth': 2,

package/examples/jsm/postprocessing/OutputPass.js

@@ -7,6 +7,7 @@ import {
 	CineonToneMapping,
 	AgXToneMapping,
 	ACESFilmicToneMapping,
+	NeutralToneMapping,
 	SRGBTransfer
 } from 'three';
 import { Pass, FullScreenQuad } from './Pass.js';
@@ -61,6 +62,7 @@ class OutputPass extends Pass {
 			else if ( this._toneMapping === CineonToneMapping ) this.material.defines.CINEON_TONE_MAPPING = '';
 			else if ( this._toneMapping === ACESFilmicToneMapping ) this.material.defines.ACES_FILMIC_TONE_MAPPING = '';
 			else if ( this._toneMapping === AgXToneMapping ) this.material.defines.AGX_TONE_MAPPING = '';
+			else if ( this._toneMapping === NeutralToneMapping ) this.material.defines.NEUTRAL_TONE_MAPPING = '';
 
 			this.material.needsUpdate = true;
 

package/examples/jsm/renderers/common/Backend.js

@@ -84,10 +84,16 @@ class Backend {
 
 	// canvas
 
+	getContext() { }
+
 	updateSize() { }
 
 	// utils
 
+	resolveTimestampAsync( renderContext, type ) { }
+
+	hasFeatureAsync( name ) { } // return Boolean
+
 	hasFeature( name ) { } // return Boolean
 
 	getInstanceCount( renderObject ) {
@@ -114,6 +120,8 @@ class Backend {
 
 	}
 
+	setScissorTest( boolean ) { }
+
 	getClearColor() {
 
 		const renderer = this.renderer;
@@ -170,6 +178,12 @@ class Backend {
 
 	}
 
+	has( object ) {
+
+		return this.data.has( object );
+
+	}
+
 	delete( object ) {
 
 		this.data.delete( object );

package/examples/jsm/renderers/common/Background.js

@@ -1,7 +1,7 @@
 import DataMap from './DataMap.js';
 import Color4 from './Color4.js';
 import { Mesh, SphereGeometry, BackSide } from 'three';
-import { vec4, context, normalWorld, backgroundBlurriness, backgroundIntensity, NodeMaterial, modelViewProjection } from '../../nodes/Nodes.js';
+import { vec4, context, normalWorld, backgroundBlurriness, backgroundIntensity, NodeMaterial, modelViewProjection, maxMipLevel } from '../../nodes/Nodes.js';
 
 const _clearColor = new Color4();
 
@@ -53,7 +53,7 @@ class Background extends DataMap {
 				const backgroundMeshNode = context( vec4( backgroundNode ), {
 					// @TODO: Add Texture2D support using node context
 					getUV: () => normalWorld,
-					getTextureLevel: () => backgroundBlurriness
+					getTextureLevel: ( textureNode ) => backgroundBlurriness.mul( maxMipLevel( textureNode ) )
 				} ).mul( backgroundIntensity );
 
 				let viewProj = modelViewProjection();

package/examples/jsm/renderers/common/Bindings.js

@@ -48,7 +48,7 @@ class Bindings extends DataMap {
 
 			const nodeBuilderState = this.nodes.getForCompute( computeNode );
 
-			const bindings = nodeBuilderState.bindings.compute;
+			const bindings = nodeBuilderState.bindings;
 
 			data.bindings = bindings;