super-three 0.164.0 → 0.167.0

package/examples/jsm/misc/GPUComputationRenderer.js

@@ -1,17 +1,15 @@
 import {
-	Camera,
 	ClampToEdgeWrapping,
 	DataTexture,
 	FloatType,
-	Mesh,
 	NearestFilter,
-	PlaneGeometry,
 	RGBAFormat,
-	Scene,
 	ShaderMaterial,
 	WebGLRenderTarget
 } from 'three';
 
+import { FullScreenQuad } from '../postprocessing/Pass.js';
+
 /**
  * GPUComputationRenderer, based on SimulationRenderer by zz85
  *
@@ -48,8 +46,8 @@ import {
  * // and fill in here the texture data...
  *
  * // Add texture variables
- * const velVar = gpuCompute.addVariable( "textureVelocity", fragmentShaderVel, pos0 );
- * const posVar = gpuCompute.addVariable( "texturePosition", fragmentShaderPos, vel0 );
+ * const velVar = gpuCompute.addVariable( "textureVelocity", fragmentShaderVel, vel0 );
+ * const posVar = gpuCompute.addVariable( "texturePosition", fragmentShaderPos, pos0 );
  *
  * // Add variable dependencies
  * gpuCompute.setVariableDependencies( velVar, [ velVar, posVar ] );
@@ -119,20 +117,13 @@ class GPUComputationRenderer {
 
 		let dataType = FloatType;
 
-		const scene = new Scene();
-
-		const camera = new Camera();
-		camera.position.z = 1;
-
 		const passThruUniforms = {
 			passThruTexture: { value: null }
 		};
 
 		const passThruShader = createShaderMaterial( getPassThroughFragmentShader(), passThruUniforms );
 
-		const mesh = new Mesh( new PlaneGeometry( 2, 2 ), passThruShader );
-		scene.add( mesh );
-
+		const quad = new FullScreenQuad( passThruShader );
 
 		this.setDataType = function ( type ) {
 
@@ -284,8 +275,7 @@ class GPUComputationRenderer {
 
 		this.dispose = function () {
 
-			mesh.geometry.dispose();
-			mesh.material.dispose();
+			quad.dispose();
 
 			const variables = this.variables;
 
@@ -395,10 +385,10 @@ class GPUComputationRenderer {
 
 			renderer.xr.enabled = false; // Avoid camera modification
 			renderer.shadowMap.autoUpdate = false; // Avoid re-computing shadows
-			mesh.material = material;
+			quad.material = material;
 			renderer.setRenderTarget( output );
-			renderer.render( scene, camera );
-			mesh.material = passThruShader;
+			quad.render( renderer );
+			quad.material = passThruShader;
 
 			renderer.xr.enabled = currentXrEnabled;
 			renderer.shadowMap.autoUpdate = currentShadowAutoUpdate;

package/examples/jsm/modifiers/CurveModifier.js

@@ -5,12 +5,13 @@ const TEXTURE_HEIGHT = 4;
 
 import {
 	DataTexture,
+	DataUtils,
 	RGBAFormat,
-	FloatType,
+	HalfFloatType,
 	RepeatWrapping,
 	Mesh,
 	InstancedMesh,
-	NearestFilter,
+	LinearFilter,
 	DynamicDrawUsage,
 	Matrix4
 } from 'three';
@@ -22,18 +23,19 @@ import {
  */
 export function initSplineTexture( numberOfCurves = 1 ) {
 
-	const dataArray = new Float32Array( TEXTURE_WIDTH * TEXTURE_HEIGHT * numberOfCurves * CHANNELS );
+	const dataArray = new Uint16Array( TEXTURE_WIDTH * TEXTURE_HEIGHT * numberOfCurves * CHANNELS );
 	const dataTexture = new DataTexture(
 		dataArray,
 		TEXTURE_WIDTH,
 		TEXTURE_HEIGHT * numberOfCurves,
 		RGBAFormat,
-		FloatType
+		HalfFloatType
 	);
 
 	dataTexture.wrapS = RepeatWrapping;
 	dataTexture.wrapY = RepeatWrapping;
-	dataTexture.magFilter = NearestFilter;
+	dataTexture.magFilter = LinearFilter;
+	dataTexture.minFilter = LinearFilter;
 	dataTexture.needsUpdate = true;
 
 	return dataTexture;
@@ -81,10 +83,10 @@ function setTextureValue( texture, index, x, y, z, o ) {
 	const image = texture.image;
 	const { data } = image;
 	const i = CHANNELS * TEXTURE_WIDTH * o; // Row Offset
-	data[ index * CHANNELS + i + 0 ] = x;
-	data[ index * CHANNELS + i + 1 ] = y;
-	data[ index * CHANNELS + i + 2 ] = z;
-	data[ index * CHANNELS + i + 3 ] = 1;
+	data[ index * CHANNELS + i + 0 ] = DataUtils.toHalfFloat( x );
+	data[ index * CHANNELS + i + 1 ] = DataUtils.toHalfFloat( y );
+	data[ index * CHANNELS + i + 2 ] = DataUtils.toHalfFloat( z );
+	data[ index * CHANNELS + i + 3 ] = DataUtils.toHalfFloat( 1 );
 
 }
 

package/examples/jsm/modifiers/SimplifyModifier.js

@@ -1,5 +1,6 @@
 import {
 	BufferGeometry,
+	Color,
 	Float32BufferAttribute,
 	Vector2,
 	Vector3,
@@ -81,7 +82,7 @@ class SimplifyModifier {
 
 			if ( colorAttribute ) {
 
-				col = new THREE.Color().fromBufferAttribute( colorAttribute, i );
+				col = new Color().fromBufferAttribute( colorAttribute, i );
 
 			}
 

package/examples/jsm/objects/InstancedPoints.js

@@ -1,8 +1,8 @@
 import {
-	Mesh
+	Mesh,
+	InstancedPointsNodeMaterial
 } from 'three';
 import InstancedPointsGeometry from '../geometries/InstancedPointsGeometry.js';
-import InstancedPointsNodeMaterial from '../nodes/materials/InstancedPointsNodeMaterial.js';
 
 class InstancedPoints extends Mesh {
 

package/examples/jsm/objects/Lensflare.js

@@ -210,7 +210,7 @@ class Lensflare extends Mesh {
 
 				// save current RGB to temp texture
 
-				renderer.copyFramebufferToTexture( screenPositionPixels, tempMap );
+				renderer.copyFramebufferToTexture( tempMap, screenPositionPixels );
 
 				// render pink quad
 
@@ -222,7 +222,7 @@ class Lensflare extends Mesh {
 
 				// copy result to occlusionMap
 
-				renderer.copyFramebufferToTexture( screenPositionPixels, occlusionMap );
+				renderer.copyFramebufferToTexture( occlusionMap, screenPositionPixels );
 
 				// restore graphics
 

package/examples/jsm/postprocessing/RenderPass.js

@@ -42,7 +42,7 @@ class RenderPass extends Pass {
 		if ( this.clearColor !== null ) {
 
 			renderer.getClearColor( this._oldClearColor );
-			renderer.setClearColor( this.clearColor );
+			renderer.setClearColor( this.clearColor, renderer.getClearAlpha() );
 
 		}
 

package/examples/jsm/postprocessing/RenderTransitionPass.js

@@ -59,51 +59,29 @@ class RenderTransitionPass extends Pass {
 
 	render( renderer, writeBuffer ) {
 
+		renderer.setRenderTarget( this.renderTargetA );
+		renderer.render( this.sceneA, this.cameraA );
+		renderer.setRenderTarget( this.renderTargetB );
+		renderer.render( this.sceneB, this.cameraB );
+
 		const uniforms = this.fsQuad.material.uniforms;
-		const transition = uniforms.mixRatio.value;
+		uniforms.tDiffuse1.value = this.renderTargetA.texture;
+		uniforms.tDiffuse2.value = this.renderTargetB.texture;
 
-		// Prevent render both scenes when it's not necessary
+		if ( this.renderToScreen ) {
 
-		if ( transition === 0 ) {
+			renderer.setRenderTarget( null );
+			renderer.clear();
 
-			renderer.setRenderTarget( writeBuffer );
-			if ( this.clear ) renderer.clear();
-			renderer.render( this.sceneB, this.cameraB );
-
-		} else if ( transition === 1 ) {
+		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			if ( this.clear ) renderer.clear();
-			renderer.render( this.sceneA, this.cameraA );
-
-		} else {
-
-			// When 0 < transition < 1 render transition between two scenes
-
-			renderer.setRenderTarget( this.renderTargetA );
-			renderer.render( this.sceneA, this.cameraA );
-			renderer.setRenderTarget( this.renderTargetB );
-			renderer.render( this.sceneB, this.cameraB );
-
-			uniforms.tDiffuse1.value = this.renderTargetA.texture;
-			uniforms.tDiffuse2.value = this.renderTargetB.texture;
-
-			if ( this.renderToScreen ) {
-
-				renderer.setRenderTarget( null );
-				renderer.clear();
-
-			} else {
-
-				renderer.setRenderTarget( writeBuffer );
-				if ( this.clear ) renderer.clear();
-
-			}
-
-			this.fsQuad.render( renderer );
 
 		}
 
+		this.fsQuad.render( renderer );
+
 	}
 
 	dispose() {
@@ -179,9 +157,6 @@ class RenderTransitionPass extends Pass {
 
 					}
 
-					#include <tonemapping_fragment>
-					#include <colorspace_fragment>
-
 				}
 			`
 		} );

package/examples/jsm/postprocessing/SSAOPass.js

@@ -39,6 +39,7 @@ class SSAOPass extends Pass {
 		this.height = ( height !== undefined ) ? height : 512;
 
 		this.clear = true;
+		this.needsSwap = false;
 
 		this.camera = camera;
 		this.scene = scene;
@@ -201,7 +202,7 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.ssaoRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
@@ -209,13 +210,13 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.blurRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
 			case SSAOPass.OUTPUT.Depth:
 
-				this.renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : writeBuffer );
+				this.renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
@@ -223,19 +224,15 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.normalRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
 			case SSAOPass.OUTPUT.Default:
 
-				this.copyMaterial.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
-				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
-
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.blurRenderTarget.texture;
 				this.copyMaterial.blending = CustomBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 

package/examples/jsm/postprocessing/UnrealBloomPass.js

@@ -49,12 +49,12 @@ class UnrealBloomPass extends Pass {
 
 		for ( let i = 0; i < this.nMips; i ++ ) {
 
-			const renderTargetHorizonal = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
+			const renderTargetHorizontal = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
 
-			renderTargetHorizonal.texture.name = 'UnrealBloomPass.h' + i;
-			renderTargetHorizonal.texture.generateMipmaps = false;
+			renderTargetHorizontal.texture.name = 'UnrealBloomPass.h' + i;
+			renderTargetHorizontal.texture.generateMipmaps = false;
 
-			this.renderTargetsHorizontal.push( renderTargetHorizonal );
+			this.renderTargetsHorizontal.push( renderTargetHorizontal );
 
 			const renderTargetVertical = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
 

package/examples/jsm/renderers/CSS2DRenderer.js

@@ -114,22 +114,42 @@ class CSS2DRenderer {
 
 		};
 
+		function hideObject( object ) {
+
+			if ( object.isCSS2DObject ) object.element.style.display = 'none';
+
+			for ( let i = 0, l = object.children.length; i < l; i ++ ) {
+
+				hideObject( object.children[ i ] );
+
+			}
+
+		}
+
 		function renderObject( object, scene, camera ) {
 
+			if ( object.visible === false ) {
+
+				hideObject( object );
+
+				return;
+
+			}
+			
 			if ( object.isCSS2DObject ) {
 
 				_vector.setFromMatrixPosition( object.matrixWorld );
 				_vector.applyMatrix4( _viewProjectionMatrix );
 
-				const visible = ( object.visible === true ) && ( _vector.z >= - 1 && _vector.z <= 1 ) && ( object.layers.test( camera.layers ) === true );
-				object.element.style.display = ( visible === true ) ? '' : 'none';
+				const visible = ( _vector.z >= - 1 && _vector.z <= 1 ) && ( object.layers.test( camera.layers ) === true );
+
+				const element = object.element;
+				element.style.display = visible === true ? '' : 'none';
 
 				if ( visible === true ) {
 
 					object.onBeforeRender( _this, scene, camera );
 
-					const element = object.element;
-
 					element.style.transform = 'translate(' + ( - 100 * object.center.x ) + '%,' + ( - 100 * object.center.y ) + '%)' + 'translate(' + ( _vector.x * _widthHalf + _widthHalf ) + 'px,' + ( - _vector.y * _heightHalf + _heightHalf ) + 'px)';
 
 					if ( element.parentNode !== domElement ) {
@@ -171,7 +191,7 @@ class CSS2DRenderer {
 
 			const result = [];
 
-			scene.traverse( function ( object ) {
+			scene.traverseVisible( function ( object ) {
 
 				if ( object.isCSS2DObject ) result.push( object );
 

package/examples/jsm/renderers/CSS3DRenderer.js

@@ -251,12 +251,34 @@ class CSS3DRenderer {
 
 		}
 
+		function hideObject( object ) {
+
+			if ( object.isCSS3DObject ) object.element.style.display = 'none';
+	  
+			for ( let i = 0, l = object.children.length; i < l; i ++ ) {
+
+			  hideObject( object.children[ i ] );
+
+			}
+
+		}
+
 		function renderObject( object, scene, camera, cameraCSSMatrix ) {
 
+			if ( object.visible === false ) {
+
+				hideObject( object );
+
+				return;
+
+			}
+
 			if ( object.isCSS3DObject ) {
 
-				const visible = ( object.visible === true ) && ( object.layers.test( camera.layers ) === true );
-				object.element.style.display = ( visible === true ) ? '' : 'none';
+				const visible = ( object.layers.test( camera.layers ) === true );
+
+				const element = object.element;
+				element.style.display = visible === true ? '' : 'none';
 
 				if ( visible === true ) {
 
@@ -290,7 +312,6 @@ class CSS3DRenderer {
 
 					}
 
-					const element = object.element;
 					const cachedObject = cache.objects.get( object );
 
 					if ( cachedObject === undefined || cachedObject.style !== style ) {

package/examples/jsm/shaders/ColorifyShader.js

@@ -39,8 +39,7 @@ const ColorifyShader = {
 
 			vec4 texel = texture2D( tDiffuse, vUv );
 
-			vec3 luma = vec3( 0.299, 0.587, 0.114 );
-			float v = dot( texel.xyz, luma );
+			float v = luminance( texel.xyz );
 
 			gl_FragColor = vec4( v * color, texel.w );
 

package/examples/jsm/shaders/FXAAShader.js

@@ -220,11 +220,9 @@ const FXAAShader = {
 			vec2 posN = posM;
 			vec2 posP = posM;
 
-			int iterationsUsed = 0;
 			int iterationsUsedN = 0;
 			int iterationsUsedP = 0;
 			for( int i = 0; i < NUM_SAMPLES; i++ ) {
-				iterationsUsed = i;
 
 				float increment = float(i + 1);
 

package/examples/jsm/shaders/GTAOShader.js

@@ -203,7 +203,7 @@ const GTAOShader = {
 
 			const int DIRECTIONS = SAMPLES < 30 ? 3 : 5;
 			const int STEPS = (SAMPLES + DIRECTIONS - 1) / DIRECTIONS;
-			float ao = 0.0, totalWeight = 0.0;
+			float ao = 0.0;
 			for (int i = 0; i < DIRECTIONS; ++i) {
 				
 				float angle = float(i) / float(DIRECTIONS) * PI;

package/examples/jsm/shaders/LuminosityHighPassShader.js

@@ -49,9 +49,7 @@ const LuminosityHighPassShader = {
 
 			vec4 texel = texture2D( tDiffuse, vUv );
 
-			vec3 luma = vec3( 0.299, 0.587, 0.114 );
-
-			float v = dot( texel.xyz, luma );
+			float v = luminance( texel.xyz );
 
 			vec4 outputColor = vec4( defaultColor.rgb, defaultOpacity );
 

package/examples/jsm/transpiler/GLSLDecoder.js

@@ -22,6 +22,14 @@ const precedenceOperators = [
 	','
 ].reverse();
 
+const associativityRightToLeft = [
+	'=',
+	'+=', '-=', '*=', '/=', '%=', '^=', '&=', '|=', '<<=', '>>=',
+	',',
+	'?',
+	':'
+];
+
 const spaceRegExp = /^((\t| )\n*)+/;
 const lineRegExp = /^\n+/;
 const commentRegExp = /^\/\*[\s\S]*?\*\//;
@@ -297,13 +305,13 @@ class GLSLDecoder {
 
 		for ( const operator of precedenceOperators ) {
 
-			for ( let i = 0; i < tokens.length; i ++ ) {
+			const parseToken = ( i, inverse = false ) => {
 
 				const token = tokens[ i ];
 
 				groupIndex += getGroupDelta( token.str );
 
-				if ( ! token.isOperator || i === 0 || i === tokens.length - 1 ) continue;
+				if ( ! token.isOperator || i === 0 || i === tokens.length - 1 ) return;
 
 				if ( groupIndex === 0 && token.str === operator ) {
 
@@ -330,9 +338,43 @@ class GLSLDecoder {
 
 				}
 
-				if ( groupIndex < 0 ) {
+				if ( inverse ) {
+
+					if ( groupIndex > 0 ) {
+
+						return this.parseExpressionFromTokens( tokens.slice( i ) );
+
+					}
+
+				} else {
+
+					if ( groupIndex < 0 ) {
+
+						return this.parseExpressionFromTokens( tokens.slice( 0, i ) );
+
+					}
+
+				}
+
+			};
+
+			if ( associativityRightToLeft.includes( operator ) ) {
+
+				for ( let i = 0; i < tokens.length; i ++ ) {
+
+					const result = parseToken( i );
+
+					if ( result ) return result;
+
+				}
+
+			} else {
+
+				for ( let i = tokens.length - 1; i >= 0; i -- ) {
+
+					const result = parseToken( i, true );
 
-					return this.parseExpressionFromTokens( tokens.slice( 0, i ) );
+					if ( result ) return result;
 
 				}
 

package/examples/jsm/transpiler/TSLEncoder.js

@@ -1,6 +1,6 @@
-import { REVISION } from 'three';
+import * as THREE from 'three';
+
 import { VariableDeclaration, Accessor } from './AST.js';
-import * as Nodes from '../nodes/Nodes.js';
 
 const opLib = {
 	'=': 'assign',
@@ -53,7 +53,6 @@ class TSLEncoder {
 		this.imports = new Set();
 		this.global = new Set();
 		this.overloadings = new Map();
-		this.layoutsCode = '';
 		this.iife = false;
 		this.uniqueNames = false;
 		this.reference = false;
@@ -69,7 +68,7 @@ class TSLEncoder {
 
 		name = name.split( '.' )[ 0 ];
 
-		if ( Nodes[ name ] !== undefined && this.global.has( name ) === false && this._currentProperties[ name ] === undefined ) {
+		if ( THREE[ name ] !== undefined && this.global.has( name ) === false && this._currentProperties[ name ] === undefined ) {
 
 			this.imports.add( name );
 
@@ -502,7 +501,9 @@ ${ this.tab }} )`;
 
 		this.addImport( 'overloadingFn' );
 
-		return `const ${ name } = overloadingFn( [ ${ nodes.map( node => node.name + '_' + nodes.indexOf( node ) ).join( ', ' ) } ] );\n`;
+		const prefix = this.iife === false ? 'export ' : '';
+
+		return `${ prefix }const ${ name } = /*#__PURE__*/ overloadingFn( [ ${ nodes.map( node => node.name + '_' + nodes.indexOf( node ) ).join( ', ' ) } ] );\n`;
 
 	}
 
@@ -583,11 +584,13 @@ ${ this.tab }} )`;
 
 		}
 
-		let funcStr = `const ${ fnName } = tslFn( (${ paramsStr }) => {
+		const prefix = this.iife === false ? 'export ' : '';
+
+		let funcStr = `${ prefix }const ${ fnName } = /*#__PURE__*/ tslFn( (${ paramsStr }) => {
 
 ${ bodyStr }
 
-${ this.tab }} );\n`;
+${ this.tab }} )`;
 
 		const layoutInput = inputs.length > 0 ? '\n\t\t' + this.tab + inputs.join( ',\n\t\t' + this.tab ) + '\n\t' + this.tab : '';
 
@@ -595,14 +598,16 @@ ${ this.tab }} );\n`;
 
 			const uniqueName = this.uniqueNames ? fnName + '_' + Math.random().toString( 36 ).slice( 2 ) : fnName;
 
-			this.layoutsCode += `${ this.tab + fnName }.setLayout( {
+			funcStr += `.setLayout( {
 ${ this.tab }\tname: '${ uniqueName }',
 ${ this.tab }\ttype: '${ type }',
 ${ this.tab }\tinputs: [${ layoutInput }]
-${ this.tab }} );\n\n`;
+${ this.tab }} )`;
 
 		}
 
+		funcStr += ';\n';
+
 		this.imports.add( 'tslFn' );
 
 		this.global.add( node.name );
@@ -685,9 +690,7 @@ ${ this.tab }} );\n\n`;
 		const imports = [ ...this.imports ];
 		const exports = [ ...this.global ];
 
-		const layouts = this.layoutsCode.length > 0 ? `\n${ this.tab }// layouts\n\n` + this.layoutsCode : '';
-
-		let header = '// Three.js Transpiler r' + REVISION + '\n\n';
+		let header = '// Three.js Transpiler r' + THREE.REVISION + '\n\n';
 		let footer = '';
 
 		if ( this.iife ) {
@@ -701,12 +704,11 @@ ${ this.tab }} );\n\n`;
 
 		} else {
 
-			header += imports.length > 0 ? 'import { ' + imports.join( ', ' ) + ' } from \'three/nodes\';\n' : '';
-			footer += exports.length > 0 ? 'export { ' + exports.join( ', ' ) + ' };\n' : '';
+			header += imports.length > 0 ? 'import { ' + imports.join( ', ' ) + ' } from \'three/tsl\';\n' : '';
 
 		}
 
-		return header + code + layouts + footer;
+		return header + code + footer;
 
 	}