super-three 0.160.0 → 0.161.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/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/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/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;
 

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

@@ -45,7 +45,7 @@ class DataMap {
 
 	dispose() {
 
-		this.data.clear();
+		this.data = new WeakMap();
 
 	}
 

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

@@ -16,7 +16,8 @@ class Info {
 		};
 
 		this.compute = {
-			calls: 0
+			calls: 0,
+			computeCalls: 0
 		};
 
 		this.memory = {
@@ -24,6 +25,11 @@ class Info {
 			textures: 0
 		};
 
+		this.timestamp = {
+			compute: 0,
+			render: 0
+		};
+
 	}
 
 	update( object, count, instanceCount ) {
@@ -54,6 +60,20 @@ class Info {
 
 	}
 
+	updateTimestamp( type, time ) {
+
+		this.timestamp[ type ] += time;
+
+	}
+
+	resetCompute() {
+
+		this.compute.computeCalls = 0;
+
+		this.timestamp.compute = 0;
+
+	}
+
 	reset() {
 
 		this.render.drawCalls = 0;
@@ -61,6 +81,8 @@ class Info {
 		this.render.points = 0;
 		this.render.lines = 0;
 
+		this.timestamp.render = 0;
+
 	}
 
 	dispose() {
@@ -72,6 +94,8 @@ class Info {
 		this.render.calls = 0;
 		this.compute.calls = 0;
 
+		this.timestamp.compute = 0;
+		this.timestamp.render = 0;
 		this.memory.geometries = 0;
 		this.memory.textures = 0;
 

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

@@ -42,18 +42,18 @@ class Pipelines extends DataMap {
 
 			// get shader
 
-			const nodeBuilder = this.nodes.getForCompute( computeNode );
+			const nodeBuilderState = this.nodes.getForCompute( computeNode );
 
 			// programmable stage
 
-			let stageCompute = this.programs.compute.get( nodeBuilder.computeShader );
+			let stageCompute = this.programs.compute.get( nodeBuilderState.computeShader );
 
 			if ( stageCompute === undefined ) {
 
 				if ( previousPipeline && previousPipeline.computeProgram.usedTimes === 0 ) this._releaseProgram( previousPipeline.computeProgram );
 
-				stageCompute = new ProgrammableStage( nodeBuilder.computeShader, 'compute' );
-				this.programs.compute.set( nodeBuilder.computeShader, stageCompute );
+				stageCompute = new ProgrammableStage( nodeBuilderState.computeShader, 'compute', nodeBuilderState.transforms, nodeBuilderState.nodeAttributes );
+				this.programs.compute.set( nodeBuilderState.computeShader, stageCompute );
 
 				backend.createProgram( stageCompute );
 
@@ -89,7 +89,7 @@ class Pipelines extends DataMap {
 
 	}
 
-	getForRender( renderObject ) {
+	getForRender( renderObject, promises = null ) {
 
 		const { backend } = this;
 
@@ -149,7 +149,7 @@ class Pipelines extends DataMap {
 
 				if ( previousPipeline && previousPipeline.usedTimes === 0 ) this._releasePipeline( previousPipeline );
 
-				pipeline = this._getRenderPipeline( renderObject, stageVertex, stageFragment, cacheKey );
+				pipeline = this._getRenderPipeline( renderObject, stageVertex, stageFragment, cacheKey, promises );
 
 			} else {
 
@@ -250,7 +250,7 @@ class Pipelines extends DataMap {
 
 	}
 
-	_getRenderPipeline( renderObject, stageVertex, stageFragment, cacheKey ) {
+	_getRenderPipeline( renderObject, stageVertex, stageFragment, cacheKey, promises ) {
 
 		// check for existing pipeline
 
@@ -266,7 +266,7 @@ class Pipelines extends DataMap {
 
 			renderObject.pipeline = pipeline;
 
-			this.backend.createRenderPipeline( renderObject );
+			this.backend.createRenderPipeline( renderObject, promises );
 
 		}
 

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

@@ -12,11 +12,11 @@ class PostProcessing {
 
 	}
 
-	render() {
+	async render() {
 
 		quadMesh.material.fragmentNode = this.outputNode;
 
-		quadMesh.render( this.renderer );
+		await quadMesh.render( this.renderer );
 
 	}
 

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

@@ -2,12 +2,14 @@ let _id = 0;
 
 class ProgrammableStage {
 
-	constructor( code, type ) {
+	constructor( code, type, transforms = null, attributes = null ) {
 
 		this.id = _id ++;
 
 		this.code = code;
 		this.stage = type;
+		this.transforms = transforms;
+		this.attributes = attributes;
 
 		this.usedTimes = 0;
 

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

@@ -82,6 +82,8 @@ export default class RenderObject {
 
 			const attribute = nodeAttribute.node && nodeAttribute.node.attribute ? nodeAttribute.node.attribute : geometry.getAttribute( nodeAttribute.name );
 
+			if ( attribute === undefined ) continue;
+
 			attributes.push( attribute );
 
 			const bufferAttribute = attribute.isInterleavedBufferAttribute ? attribute.data : attribute;