super-three 0.167.0 → 0.168.0

package/src/renderers/common/ClippingContext.js

@@ -4,13 +4,11 @@ import { Vector4 } from '../../math/Vector4.js';
 
 const _plane = /*@__PURE__*/ new Plane();
 
-let _clippingContextVersion = 0;
-
 class ClippingContext {
 
 	constructor() {
 
-		this.version = ++ _clippingContextVersion;
+		this.version = 0;
 
 		this.globalClippingCount = 0;
 
@@ -22,6 +20,7 @@ class ClippingContext {
 
 		this.parentVersion = 0;
 		this.viewNormalMatrix = new Matrix3();
+		this.cacheKey = '';
 
 	}
 
@@ -93,7 +92,12 @@ class ClippingContext {
 
 		}
 
-		if ( update ) this.version = _clippingContextVersion ++;
+		if ( update ) {
+
+			this.version ++;
+			this.cacheKey = `${ this.globalClippingCount }:${ this.localClippingEnabled === undefined ? false : this.localClippingEnabled }:`;
+
+		}
 
 	}
 
@@ -158,7 +162,12 @@ class ClippingContext {
 
 		}
 
-		if ( update ) this.version = _clippingContextVersion ++;
+		if ( update ) {
+
+			this.version += parent.version;
+			this.cacheKey = parent.cacheKey + `:${ this.localClippingCount }:${ this.localClipIntersection === undefined ? false : this.localClipIntersection }`;
+
+		}
 
 	}
 

package/src/renderers/common/CubeRenderTarget.js

@@ -1,7 +1,7 @@
 import { equirectUV } from '../../nodes/utils/EquirectUVNode.js';
 import { texture as TSL_Texture } from '../../nodes/accessors/TextureNode.js';
-import { positionWorldDirection } from '../../nodes/accessors/PositionNode.js';
-import { createNodeMaterialFromType } from '../../nodes/materials/NodeMaterial.js';
+import { positionWorldDirection } from '../../nodes/accessors/Position.js';
+import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
 
 import { WebGLCubeRenderTarget } from '../../renderers/WebGLCubeRenderTarget.js';
 import { Scene } from '../../scenes/Scene.js';
@@ -40,7 +40,7 @@ class CubeRenderTarget extends WebGLCubeRenderTarget {
 
 		const uvNode = equirectUV( positionWorldDirection );
 
-		const material = createNodeMaterialFromType( 'MeshBasicNodeMaterial' );
+		const material = new NodeMaterial();
 		material.colorNode = TSL_Texture( texture, uvNode, 0 );
 		material.side = BackSide;
 		material.blending = NoBlending;
@@ -54,8 +54,14 @@ class CubeRenderTarget extends WebGLCubeRenderTarget {
 		if ( texture.minFilter === LinearMipmapLinearFilter ) texture.minFilter = LinearFilter;
 
 		const camera = new CubeCamera( 1, 10, this );
+
+		const currentMRT = renderer.getMRT();
+		renderer.setMRT( null );
+
 		camera.update( renderer, scene );
 
+		renderer.setMRT( currentMRT );
+
 		texture.minFilter = currentMinFilter;
 		texture.currentGenerateMipmaps = currentGenerateMipmaps;
 

package/src/renderers/common/PostProcessing.js

@@ -1,4 +1,5 @@
-import { vec4, renderOutput, NodeMaterial } from '../../nodes/Nodes.js';
+import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
+import { vec4, renderOutput } from '../../nodes/TSL.js';
 import { LinearSRGBColorSpace, NoToneMapping } from '../../constants.js';
 import QuadMesh from '../../renderers/common/QuadMesh.js';
 
@@ -16,6 +17,8 @@ class PostProcessing {
 
 		this.needsUpdate = true;
 
+		_material.name = 'PostProcessing';
+
 	}
 
 	render() {

package/src/renderers/common/QuadMesh.js

@@ -34,6 +34,8 @@ class QuadMesh extends Mesh {
 
 		this.camera = _camera;
 
+		this.isQuadMesh = true;
+
 	}
 
 	renderAsync( renderer ) {

package/src/renderers/common/RenderContext.js

@@ -38,6 +38,30 @@ class RenderContext {
 
 	}
 
+	getCacheKey() {
+
+		return getCacheKey( this );
+
+	}
+
+}
+
+export function getCacheKey( renderContext ) {
+
+	const { textures, activeCubeFace } = renderContext;
+
+	let key = '';
+
+	for ( const texture of textures ) {
+
+		key += texture.id + ',';
+
+	}
+
+	key += activeCubeFace;
+
+	return key;
+
 }
 
 export default RenderContext;

package/src/renderers/common/RenderList.js

@@ -167,7 +167,7 @@ class RenderList {
 
 		// update lights
 
-		this.lightsNode.fromLights( this.lightsArray );
+		this.lightsNode.setLights( this.lightsArray );
 
 		// Clear references from inactive renderItems in the list
 

package/src/renderers/common/RenderObject.js

@@ -235,7 +235,7 @@ export default class RenderObject {
 
 		}
 
-		cacheKey += this.clippingContextVersion + ',';
+		cacheKey += this.clippingContext.cacheKey + ',';
 
 		if ( object.skeleton ) {
 
@@ -263,7 +263,7 @@ export default class RenderObject {
 
 		if ( object.count > 1 ) {
 
-			cacheKey += object.count + ',';
+			cacheKey += object.count + ',' + object.uuid + ',';
 
 		}
 

package/src/renderers/common/Renderer.js

@@ -14,8 +14,9 @@ import Color4 from './Color4.js';
 import ClippingContext from './ClippingContext.js';
 import QuadMesh from './QuadMesh.js';
 import RenderBundles from './RenderBundles.js';
+import NodeLibrary from './nodes/NodeLibrary.js';
 
-import { NodeMaterial } from '../../nodes/Nodes.js';
+import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
 
 import { Scene } from '../../scenes/Scene.js';
 import { Frustum } from '../../math/Frustum.js';
@@ -24,7 +25,7 @@ import { Vector2 } from '../../math/Vector2.js';
 import { Vector3 } from '../../math/Vector3.js';
 import { Vector4 } from '../../math/Vector4.js';
 import { RenderTarget } from '../../core/RenderTarget.js';
-import { DoubleSide, BackSide, FrontSide, SRGBColorSpace, NoColorSpace, NoToneMapping, LinearFilter, LinearSRGBColorSpace, HalfFloatType, RGBAFormat, PCFShadowMap } from '../../constants.js';
+import { DoubleSide, BackSide, FrontSide, SRGBColorSpace, NoToneMapping, LinearFilter, LinearSRGBColorSpace, HalfFloatType, RGBAFormat, PCFShadowMap } from '../../constants.js';
 
 const _scene = /*@__PURE__*/ new Scene();
 const _drawingBufferSize = /*@__PURE__*/ new Vector2();
@@ -45,7 +46,8 @@ class Renderer {
 			logarithmicDepthBuffer = false,
 			alpha = true,
 			antialias = false,
-			samples = 0
+			samples = 0,
+			getFallback = null
 		} = parameters;
 
 		// public
@@ -78,8 +80,14 @@ class Renderer {
 
 		this.info = new Info();
 
+		this.nodes = {
+			library: new NodeLibrary()
+		};
+
 		// internals
 
+		this._getFallback = getFallback;
+
 		this._pixelRatio = 1;
 		this._width = this.domElement.width;
 		this._height = this.domElement.height;
@@ -102,6 +110,7 @@ class Renderer {
 		this._background = null;
 
 		this._quad = new QuadMesh( new NodeMaterial() );
+		this._quad.material.type = 'Renderer_output';
 
 		this._currentRenderContext = null;
 
@@ -147,7 +156,23 @@ class Renderer {
 
 		this.debug = {
 			checkShaderErrors: true,
-			onShaderError: null
+			onShaderError: null,
+			getShaderAsync: async ( scene, camera, object ) => {
+
+				await this.compileAsync( scene, camera );
+
+				const renderList = this._renderLists.get( scene, camera );
+				const renderContext = this._renderContexts.get( scene, camera, this._renderTarget );
+
+				const material = scene.overrideMaterial || object.material;
+
+				const renderObject = this._objects.get( object, material, scene, camera, renderList.lightsNode, renderContext );
+
+				const { fragmentShader, vertexShader } = renderObject.getNodeBuilderState();
+
+				return { fragmentShader, vertexShader };
+
+			}
 		};
 
 	}
@@ -168,7 +193,7 @@ class Renderer {
 
 		this._initPromise = new Promise( async ( resolve, reject ) => {
 
-			const backend = this.backend;
+			let backend = this.backend;
 
 			try {
 
@@ -176,8 +201,28 @@ class Renderer {
 
 			} catch ( error ) {
 
-				reject( error );
-				return;
+				if ( this._getFallback !== null ) {
+
+					// try the fallback
+
+					try {
+
+						this.backend = backend = this._getFallback( error );
+						await backend.init( this );
+
+					} catch ( error ) {
+
+						reject( error );
+						return;
+
+					}
+
+				} else {
+
+					reject( error );
+					return;
+
+				}
 
 			}
 
@@ -366,13 +411,12 @@ class Renderer {
 		const { object, camera, renderList } = bundle;
 
 		const renderContext = this._currentRenderContext;
-		const renderContextData = this.backend.get( renderContext );
 
 		//
 
 		const renderBundle = this._bundles.get( object, camera );
-
 		const renderBundleData = this.backend.get( renderBundle );
+
 		if ( renderBundleData.renderContexts === undefined ) renderBundleData.renderContexts = new Set();
 
 		//
@@ -383,17 +427,11 @@ class Renderer {
 
 		if ( renderBundleNeedsUpdate ) {
 
-			if ( renderContextData.renderObjects === undefined || object.needsUpdate === true ) {
-
-				const nodeFrame = this._nodes.nodeFrame;
+			this.backend.beginBundle( renderContext );
 
-				renderContextData.renderObjects = [];
-				renderContextData.renderBundles = [];
-				renderContextData.scene = sceneRef;
-				renderContextData.camera = camera;
-				renderContextData.renderId = nodeFrame.renderId;
+			if ( renderBundleData.renderObjects === undefined || object.needsUpdate === true ) {
 
-				renderContextData.registerBundlesPhase = true;
+				renderBundleData.renderObjects = [];
 
 			}
 
@@ -407,16 +445,17 @@ class Renderer {
 
 			//
 
+			this.backend.finishBundle( renderContext, renderBundle );
+
 			object.needsUpdate = false;
 
 		} else {
 
-			const renderContext = this._currentRenderContext;
-			const renderContextData = this.backend.get( renderContext );
+			const renderObjects = renderBundleData.renderObjects;
 
-			for ( let i = 0, l = renderContextData.renderObjects.length; i < l; i ++ ) {
+			for ( let i = 0, l = renderObjects.length; i < l; i ++ ) {
 
-				const renderObject = renderContextData.renderObjects[ i ];
+				const renderObject = renderObjects[ i ];
 
 				this._nodes.updateBefore( renderObject );
 
@@ -428,14 +467,14 @@ class Renderer {
 				this._nodes.updateForRender( renderObject );
 				this._bindings.updateForRender( renderObject );
 
-				this.backend.draw( renderObject, this.info );
-
 				this._nodes.updateAfter( renderObject );
 
 			}
 
 		}
 
+		this.backend.addBundle( renderContext, renderBundle );
+
 	}
 
 	render( scene, camera ) {
@@ -454,10 +493,10 @@ class Renderer {
 
 	_getFrameBufferTarget() {
 
-		const { currentColorSpace } = this;
+		const { currentToneMapping, currentColorSpace } = this;
 
-		const useToneMapping = this._renderTarget === null && ( this.toneMapping !== NoToneMapping );
-		const useColorSpace = this._renderTarget === null && ( currentColorSpace !== LinearSRGBColorSpace && currentColorSpace !== NoColorSpace );
+		const useToneMapping = currentToneMapping !== NoToneMapping;
+		const useColorSpace = currentColorSpace !== LinearSRGBColorSpace;
 
 		if ( useToneMapping === false && useColorSpace === false ) return null;
 
@@ -1049,19 +1088,15 @@ class Renderer {
 
 	}
 
-	get currentColorSpace() {
-
-		const renderTarget = this._renderTarget;
-
-		if ( renderTarget !== null ) {
+	get currentToneMapping() {
 
-			const texture = renderTarget.texture;
+		return this._renderTarget !== null ? NoToneMapping : this.toneMapping;
 
-			return ( Array.isArray( texture ) ? texture[ 0 ] : texture ).colorSpace;
+	}
 
-		}
+	get currentColorSpace() {
 
-		return this.outputColorSpace;
+		return this._renderTarget !== null ? LinearSRGBColorSpace : this.outputColorSpace;
 
 	}
 
@@ -1326,7 +1361,7 @@ class Renderer {
 
 		}
 
-		if ( object.static === true ) {
+		if ( object.static === true && this.backend.beginBundle !== undefined ) {
 
 			const baseRenderList = renderList;
 
@@ -1556,25 +1591,16 @@ class Renderer {
 
 		//
 
-		if ( this._currentRenderBundle !== null && this._currentRenderBundle.needsUpdate === true ) {
+		if ( this._currentRenderBundle !== null ) {
 
-			const renderObjectData = this.backend.get( renderObject );
+			const renderBundleData = this.backend.get( this._currentRenderBundle );
 
-			renderObjectData.bundleEncoder = undefined;
-			renderObjectData.lastPipelineGPU = undefined;
+			renderBundleData.renderObjects.push( renderObject );
 
 		}
 
 		this.backend.draw( renderObject, this.info );
 
-		if ( this._currentRenderBundle !== null ) {
-
-			const renderContextData = this.backend.get( this._currentRenderContext );
-
-			renderContextData.renderObjects.push( renderObject );
-
-		}
-
 		this._nodes.updateAfter( renderObject );
 
 	}

package/src/renderers/common/SampledTexture.js

@@ -13,16 +13,25 @@ class SampledTexture extends Binding {
 		this.texture = texture;
 		this.version = texture ? texture.version : 0;
 		this.store = false;
+		this.generation = null;
 
 		this.isSampledTexture = true;
 
 	}
 
-	get needsBindingsUpdate() {
+	needsBindingsUpdate( generation ) {
 
-		const { texture, version } = this;
+		const { texture } = this;
+
+		if ( generation !== this.generation ) {
+
+			this.generation = generation;
+
+			return true;
+
+		}
 
-		return texture.isVideoTexture ? true : version !== texture.version; // @TODO: version === 0 && texture.version > 0 ( add it just to External Textures like PNG,JPG )
+		return texture.isVideoTexture;
 
 	}
 

package/src/renderers/common/StandardRenderer.js

@@ -0,0 +1,18 @@
+import Renderer from './Renderer.js';
+import StandardNodeLibrary from './nodes/StandardNodeLibrary.js';
+
+class StandardRenderer extends Renderer {
+
+	constructor( backend, parameters = {} ) {
+
+		super( backend, parameters );
+
+		this.isStandardRenderer = true;
+
+		this.nodes.library = new StandardNodeLibrary();
+
+	}
+
+}
+
+export default StandardRenderer;

package/src/renderers/common/Textures.js

@@ -25,10 +25,9 @@ class Textures extends DataMap {
 		const sampleCount = renderTarget.samples === 0 ? 1 : renderTarget.samples;
 		const depthTextureMips = renderTargetData.depthTextureMips || ( renderTargetData.depthTextureMips = {} );
 
-		const texture = renderTarget.texture;
 		const textures = renderTarget.textures;
 
-		const size = this.getSize( texture );
+		const size = this.getSize( textures[ 0 ] );
 
 		const mipWidth = size.width >> activeMipmapLevel;
 		const mipHeight = size.height >> activeMipmapLevel;
@@ -103,17 +102,9 @@ class Textures extends DataMap {
 
 				renderTarget.removeEventListener( 'dispose', onDispose );
 
-				if ( textures !== undefined ) {
+				for ( let i = 0; i < textures.length; i ++ ) {
 
-					for ( let i = 0; i < textures.length; i ++ ) {
-
-						this._destroyTexture( textures[ i ] );
-
-					}
-
-				} else {
-
-					this._destroyTexture( texture );
+					this._destroyTexture( textures[ i ] );
 
 				}
 
@@ -182,6 +173,8 @@ class Textures extends DataMap {
 			backend.createSampler( texture );
 			backend.createTexture( texture, options );
 
+			textureData.generation = texture.version;
+
 		} else {
 
 			const needsCreate = textureData.initialized !== true;
@@ -225,6 +218,7 @@ class Textures extends DataMap {
 						backend.createTexture( texture, options );
 
 						textureData.isDefaultTexture = false;
+						textureData.generation = texture.version;
 
 					}
 
@@ -241,6 +235,7 @@ class Textures extends DataMap {
 				backend.createDefaultTexture( texture );
 
 				textureData.isDefaultTexture = true;
+				textureData.generation = texture.version;
 
 			}
 
@@ -251,6 +246,7 @@ class Textures extends DataMap {
 		if ( textureData.initialized !== true ) {
 
 			textureData.initialized = true;
+			textureData.generation = texture.version;
 
 			//
 

package/src/renderers/common/extras/PMREMGenerator.js

@@ -1,12 +1,12 @@
-import NodeMaterial from '../../../nodes/materials/NodeMaterial.js';
+import NodeMaterial from '../../../materials/nodes/NodeMaterial.js';
 import { getDirection, blur } from '../../../nodes/pmrem/PMREMUtils.js';
 import { equirectUV } from '../../../nodes/utils/EquirectUVNode.js';
 import { uniform } from '../../../nodes/core/UniformNode.js';
-import { uniforms } from '../../../nodes/accessors/UniformsNode.js';
+import { uniformArray } from '../../../nodes/accessors/UniformArrayNode.js';
 import { texture } from '../../../nodes/accessors/TextureNode.js';
 import { cubeTexture } from '../../../nodes/accessors/CubeTextureNode.js';
-import { float, vec3 } from '../../../nodes/shadernode/ShaderNode.js';
-import { uv } from '../../../nodes/accessors/UVNode.js';
+import { float, vec3 } from '../../../nodes/tsl/TSLBase.js';
+import { uv } from '../../../nodes/accessors/UV.js';
 import { attribute } from '../../../nodes/core/AttributeNode.js';
 
 import { OrthographicCamera } from '../../../cameras/OrthographicCamera.js';
@@ -698,19 +698,18 @@ function _createRenderTarget( width, height, params ) {
 
 function _setViewport( target, x, y, width, height ) {
 
-	const viewY = target.height - height - y;
-
-	target.viewport.set( x, viewY, width, height );
-	target.scissor.set( x, viewY, width, height );
+	target.viewport.set( x, y, width, height );
+	target.scissor.set( x, y, width, height );
 
 }
 
-function _getMaterial() {
+function _getMaterial( type ) {
 
 	const material = new NodeMaterial();
 	material.depthTest = false;
 	material.depthWrite = false;
 	material.blending = NoBlending;
+	material.name = `PMREM_${ type }`;
 
 	return material;
 
@@ -718,7 +717,7 @@ function _getMaterial() {
 
 function _getBlurShader( lodMax, width, height ) {
 
-	const weights = uniforms( new Array( MAX_SAMPLES ).fill( 0 ) );
+	const weights = uniformArray( new Array( MAX_SAMPLES ).fill( 0 ) );
 	const poleAxis = uniform( new Vector3( 0, 1, 0 ) );
 	const dTheta = uniform( 0 );
 	const n = float( MAX_SAMPLES );
@@ -745,7 +744,7 @@ function _getBlurShader( lodMax, width, height ) {
 		CUBEUV_MAX_MIP
 	};
 
-	const material = _getMaterial();
+	const material = _getMaterial( 'blur' );
 	material.uniforms = materialUniforms; // TODO: Move to outside of the material
 	material.fragmentNode = blur( { ...materialUniforms, latitudinal: latitudinal.equal( 1 ) } );
 
@@ -755,7 +754,7 @@ function _getBlurShader( lodMax, width, height ) {
 
 function _getCubemapMaterial( envTexture ) {
 
-	const material = _getMaterial();
+	const material = _getMaterial( 'cubemap' );
 	material.fragmentNode = cubeTexture( envTexture, outputDirection );
 
 	return material;
@@ -764,7 +763,7 @@ function _getCubemapMaterial( envTexture ) {
 
 function _getEquirectMaterial( envTexture ) {
 
-	const material = _getMaterial();
+	const material = _getMaterial( 'equirect' );
 	material.fragmentNode = texture( envTexture, equirectUV( outputDirection ), 0 );
 
 	return material;

package/src/renderers/common/nodes/NodeBuilderState.js

@@ -32,7 +32,7 @@ class NodeBuilderState {
 
 			if ( shared !== true ) {
 
-				const bindingsGroup = new BindGroup( instanceGroup.name );
+				const bindingsGroup = new BindGroup( instanceGroup.name, [], instanceGroup.index, instanceGroup );
 				bindings.push( bindingsGroup );
 
 				for ( const instanceBinding of instanceGroup.bindings ) {