@plastic-software/three 0.178.0 → 0.179.0

package/src/renderers/common/PostProcessing.js

@@ -1,6 +1,7 @@
 import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
+import { ColorManagement } from '../../math/ColorManagement.js';
 import { vec4, renderOutput } from '../../nodes/TSL.js';
-import { LinearSRGBColorSpace, NoToneMapping } from '../../constants.js';
+import { NoToneMapping } from '../../constants.js';
 import QuadMesh from '../../renderers/common/QuadMesh.js';
 
 /**
@@ -82,6 +83,15 @@ class PostProcessing {
 		 */
 		this._quadMesh = new QuadMesh( material );
 
+		/**
+		 * The context of the post processing stack.
+		 *
+		 * @private
+		 * @type {?Object}
+		 * @default null
+		 */
+		this._context = null;
+
 	}
 
 	/**
@@ -91,15 +101,17 @@ class PostProcessing {
 	 */
 	render() {
 
+		const renderer = this.renderer;
+
 		this._update();
 
-		const renderer = this.renderer;
+		if ( this._context.onBeforePostProcessing !== null ) this._context.onBeforePostProcessing();
 
 		const toneMapping = renderer.toneMapping;
 		const outputColorSpace = renderer.outputColorSpace;
 
 		renderer.toneMapping = NoToneMapping;
-		renderer.outputColorSpace = LinearSRGBColorSpace;
+		renderer.outputColorSpace = ColorManagement.workingColorSpace;
 
 		//
 
@@ -115,6 +127,20 @@ class PostProcessing {
 		renderer.toneMapping = toneMapping;
 		renderer.outputColorSpace = outputColorSpace;
 
+		if ( this._context.onAfterPostProcessing !== null ) this._context.onAfterPostProcessing();
+
+	}
+
+	/**
+	 * Returns the current context of the post processing stack.
+	 *
+	 * @readonly
+	 * @type {?Object}
+	 */
+	get context() {
+
+		return this._context;
+
 	}
 
 	/**
@@ -140,7 +166,32 @@ class PostProcessing {
 			const toneMapping = renderer.toneMapping;
 			const outputColorSpace = renderer.outputColorSpace;
 
-			this._quadMesh.material.fragmentNode = this.outputColorTransform === true ? renderOutput( this.outputNode, toneMapping, outputColorSpace ) : this.outputNode.context( { toneMapping, outputColorSpace } );
+			const context = {
+				postProcessing: this,
+				onBeforePostProcessing: null,
+				onAfterPostProcessing: null
+			};
+
+			let outputNode = this.outputNode;
+
+			if ( this.outputColorTransform === true ) {
+
+				outputNode = outputNode.context( context );
+
+				outputNode = renderOutput( outputNode, toneMapping, outputColorSpace );
+
+			} else {
+
+				context.toneMapping = toneMapping;
+				context.outputColorSpace = outputColorSpace;
+
+				outputNode = outputNode.context( context );
+
+			}
+
+			this._context = context;
+
+			this._quadMesh.material.fragmentNode = outputNode;
 			this._quadMesh.material.needsUpdate = true;
 
 			this.needsUpdate = false;
@@ -161,13 +212,15 @@ class PostProcessing {
 
 		this._update();
 
+		if ( this._context.onBeforePostProcessing !== null ) this._context.onBeforePostProcessing();
+
 		const renderer = this.renderer;
 
 		const toneMapping = renderer.toneMapping;
 		const outputColorSpace = renderer.outputColorSpace;
 
 		renderer.toneMapping = NoToneMapping;
-		renderer.outputColorSpace = LinearSRGBColorSpace;
+		renderer.outputColorSpace = ColorManagement.workingColorSpace;
 
 		//
 
@@ -183,6 +236,8 @@ class PostProcessing {
 		renderer.toneMapping = toneMapping;
 		renderer.outputColorSpace = outputColorSpace;
 
+		if ( this._context.onAfterPostProcessing !== null ) this._context.onAfterPostProcessing();
+
 	}
 
 }

package/src/renderers/common/Renderer.js

@@ -21,13 +21,14 @@ import XRManager from './XRManager.js';
 import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
 
 import { Scene } from '../../scenes/Scene.js';
+import { ColorManagement } from '../../math/ColorManagement.js';
 import { Frustum } from '../../math/Frustum.js';
 import { FrustumArray } from '../../math/FrustumArray.js';
 import { Matrix4 } from '../../math/Matrix4.js';
 import { Vector2 } from '../../math/Vector2.js';
 import { Vector4 } from '../../math/Vector4.js';
 import { RenderTarget } from '../../core/RenderTarget.js';
-import { DoubleSide, BackSide, FrontSide, SRGBColorSpace, NoToneMapping, LinearFilter, LinearSRGBColorSpace, HalfFloatType, RGBAFormat, PCFShadowMap } from '../../constants.js';
+import { DoubleSide, BackSide, FrontSide, SRGBColorSpace, NoToneMapping, LinearFilter, HalfFloatType, RGBAFormat, PCFShadowMap } from '../../constants.js';
 
 import { highpModelNormalViewMatrix, highpModelViewMatrix } from '../../nodes/accessors/ModelNode.js';
 
@@ -1210,7 +1211,7 @@ class Renderer {
 		const { currentToneMapping, currentColorSpace } = this;
 
 		const useToneMapping = currentToneMapping !== NoToneMapping;
-		const useColorSpace = currentColorSpace !== LinearSRGBColorSpace;
+		const useColorSpace = currentColorSpace !== ColorManagement.workingColorSpace;
 
 		if ( useToneMapping === false && useColorSpace === false ) return null;
 
@@ -1226,7 +1227,7 @@ class Renderer {
 				stencilBuffer: stencil,
 				type: this._colorBufferType,
 				format: RGBAFormat,
-				colorSpace: LinearSRGBColorSpace,
+				colorSpace: ColorManagement.workingColorSpace,
 				generateMipmaps: false,
 				minFilter: LinearFilter,
 				magFilter: LinearFilter,
@@ -1412,7 +1413,7 @@ class Renderer {
 		if ( ! camera.isArrayCamera ) {
 
 			_projScreenMatrix.multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse );
-			frustum.setFromProjectionMatrix( _projScreenMatrix, coordinateSystem );
+			frustum.setFromProjectionMatrix( _projScreenMatrix, camera.coordinateSystem, camera.reversedDepth );
 
 		}
 
@@ -2130,8 +2131,8 @@ class Renderer {
 	}
 
 	/**
-	 * The current output tone mapping of the renderer. When a render target is set,
-	 * the output tone mapping is always `NoToneMapping`.
+	 * The current tone mapping of the renderer. When not producing screen output,
+	 * the tone mapping is always `NoToneMapping`.
 	 *
 	 * @type {number}
 	 */
@@ -2142,14 +2143,14 @@ class Renderer {
 	}
 
 	/**
-	 * The current output color space of the renderer. When a render target is set,
-	 * the output color space is always `LinearSRGBColorSpace`.
+	 * The current color space of the renderer. When not producing screen output,
+	 * the color space is always the working color space.
 	 *
 	 * @type {string}
 	 */
 	get currentColorSpace() {
 
-		return this.isOutputTarget ? this.outputColorSpace : LinearSRGBColorSpace;
+		return this.isOutputTarget ? this.outputColorSpace : ColorManagement.workingColorSpace;
 
 	}
 
@@ -2308,9 +2309,10 @@ class Renderer {
 	 * if the renderer has been initialized.
 	 *
 	 * @param {Node|Array<Node>} computeNodes - The compute node(s).
+	 * @param {Array<number>|number} [dispatchSizeOrCount=null] - Array with [ x, y, z ] values for dispatch or a single number for the count.
 	 * @return {Promise|undefined} A Promise that resolve when the compute has finished. Only returned when the renderer has not been initialized.
 	 */
-	compute( computeNodes ) {
+	compute( computeNodes, dispatchSizeOrCount = null ) {
 
 		if ( this._isDeviceLost === true ) return;
 
@@ -2389,7 +2391,7 @@ class Renderer {
 			const computeBindings = bindings.getForCompute( computeNode );
 			const computePipeline = pipelines.getForCompute( computeNode, computeBindings );
 
-			backend.compute( computeNodes, computeNode, computeBindings, computePipeline );
+			backend.compute( computeNodes, computeNode, computeBindings, computePipeline, dispatchSizeOrCount );
 
 		}
 
@@ -2406,13 +2408,14 @@ class Renderer {
 	 *
 	 * @async
 	 * @param {Node|Array<Node>} computeNodes - The compute node(s).
+	 * @param {Array<number>|number} [dispatchSizeOrCount=null] - Array with [ x, y, z ] values for dispatch or a single number for the count.
 	 * @return {Promise} A Promise that resolve when the compute has finished.
 	 */
-	async computeAsync( computeNodes ) {
+	async computeAsync( computeNodes, dispatchSizeOrCount = null ) {
 
 		if ( this._initialized === false ) await this.init();
 
-		this.compute( computeNodes );
+		this.compute( computeNodes, dispatchSizeOrCount );
 
 	}
 
@@ -2961,7 +2964,7 @@ class Renderer {
 	 * @param {LightsNode} lightsNode - The current lights node.
 	 * @param {?{start: number, count: number}} group - Only relevant for objects using multiple materials. This represents a group entry from the respective `BufferGeometry`.
 	 * @param {ClippingContext} clippingContext - The clipping context.
-	 * @param {?string} [passId=null] - An optional ID for identifying the pass.
+	 * @param {string} [passId] - An optional ID for identifying the pass.
 	 */
 	_renderObjectDirect( object, material, scene, camera, lightsNode, group, clippingContext, passId ) {
 
@@ -3016,7 +3019,7 @@ class Renderer {
 	 * @param {LightsNode} lightsNode - The current lights node.
 	 * @param {?{start: number, count: number}} group - Only relevant for objects using multiple materials. This represents a group entry from the respective `BufferGeometry`.
 	 * @param {ClippingContext} clippingContext - The clipping context.
-	 * @param {?string} [passId=null] - An optional ID for identifying the pass.
+	 * @param {string} [passId] - An optional ID for identifying the pass.
 	 */
 	_createObjectPipeline( object, material, scene, camera, lightsNode, group, clippingContext, passId ) {
 

package/src/renderers/common/SampledTexture.js

@@ -1,4 +1,4 @@
-import Binding from './Binding.js';
+import Sampler from './Sampler.js';
 
 let _id = 0;
 
@@ -8,7 +8,7 @@ let _id = 0;
  * @private
  * @augments Binding
  */
-class SampledTexture extends Binding {
+class SampledTexture extends Sampler {
 
 	/**
 	 * Constructs a new sampled texture.
@@ -18,7 +18,7 @@ class SampledTexture extends Binding {
 	 */
 	constructor( name, texture ) {
 
-		super( name );
+		super( name, texture );
 
 		/**
 		 * This identifier.
@@ -27,20 +27,6 @@ class SampledTexture extends Binding {
 		 */
 		this.id = _id ++;
 
-		/**
-		 * The texture this binding is referring to.
-		 *
-		 * @type {?Texture}
-		 */
-		this.texture = texture;
-
-		/**
-		 * The binding's version.
-		 *
-		 * @type {number}
-		 */
-		this.version = texture ? texture.version : 0;
-
 		/**
 		 * Whether the texture is a storage texture or not.
 		 *
@@ -49,15 +35,6 @@ class SampledTexture extends Binding {
 		 */
 		this.store = false;
 
-		/**
-		 * The binding's generation which is an additional version
-		 * qualifier.
-		 *
-		 * @type {?number}
-		 * @default null
-		 */
-		this.generation = null;
-
 		/**
 		 * This flag can be used for type testing.
 		 *
@@ -69,51 +46,6 @@ class SampledTexture extends Binding {
 
 	}
 
-	/**
-	 * Returns `true` whether this binding requires an update for the
-	 * given generation.
-	 *
-	 * @param {number} generation - The generation.
-	 * @return {boolean} Whether an update is required or not.
-	 */
-	needsBindingsUpdate( generation ) {
-
-		const { texture } = this;
-
-		if ( generation !== this.generation ) {
-
-			this.generation = generation;
-
-			return true;
-
-		}
-
-		return texture.isVideoTexture;
-
-	}
-
-	/**
-	 * Updates the binding.
-	 *
-	 * @return {boolean} Whether the texture has been updated and must be
-	 * uploaded to the GPU.
-	 */
-	update() {
-
-		const { texture, version } = this;
-
-		if ( version !== texture.version ) {
-
-			this.version = texture.version;
-
-			return true;
-
-		}
-
-		return false;
-
-	}
-
 }
 
 /**

package/src/renderers/common/Sampler.js

@@ -18,6 +18,17 @@ class Sampler extends Binding {
 
 		super( name );
 
+		/**
+		 * This function is called when the texture is disposed.
+		 * @type {function}
+		 * @private
+		 */
+		this._onDisposeTexture = () => {
+
+			this.texture = null;
+
+		};
+
 		/**
 		 * The texture the sampler is referring to.
 		 *
@@ -32,6 +43,15 @@ class Sampler extends Binding {
 		 */
 		this.version = texture ? texture.version : 0;
 
+		/**
+		 * The binding's generation which is an additional version
+		 * qualifier.
+		 *
+		 * @type {?number}
+		 * @default null
+		 */
+		this.generation = null;
+
 		/**
 		 * This flag can be used for type testing.
 		 *
@@ -43,6 +63,65 @@ class Sampler extends Binding {
 
 	}
 
+	/**
+	 * Sets the texture of this sampler.
+	 * @param {?Texture} value - The texture to set.
+	 */
+	set texture( value ) {
+
+		if ( this._texture === value ) return;
+
+		if ( this._texture ) {
+
+			this._texture.removeEventListener( 'dispose', this._onDisposeTexture );
+
+		}
+
+		this._texture = value;
+
+		this.generation = null;
+		this.version = 0;
+
+		if ( this._texture ) {
+
+			this._texture.addEventListener( 'dispose', this._onDisposeTexture );
+
+		}
+
+	}
+
+	/**
+	 * Gets the texture of this sampler.
+	 * @return {?Texture} The texture.
+	 */
+	get texture() {
+
+		return this._texture;
+
+	}
+
+	/**
+	 * Updates the binding.
+	 *
+	 * @return {boolean} Whether the texture has been updated and must be
+	 * uploaded to the GPU.
+	 */
+	update() {
+
+		const { texture, version } = this;
+
+		if ( version !== texture.version ) {
+
+			this.version = texture.version;
+
+			return true;
+
+		}
+
+		return false;
+
+	}
+
 }
 
 export default Sampler;

package/src/renderers/common/Storage3DTexture.js

@@ -74,6 +74,27 @@ class Storage3DTexture extends Texture {
 
 	}
 
+	/**
+	 * Sets the size of the storage 3d texture.
+	 *
+	 * @param {number} width - The new width of the storage texture.
+	 * @param {number} height - The new height of the storage texture.
+	 * @param {number} depth - The new depth of the storage texture.
+	 */
+	setSize( width, height, depth ) {
+
+		if ( this.image.width !== width || this.image.height !== height || this.image.depth !== depth ) {
+
+			this.image.width = width;
+			this.image.height = height;
+			this.image.depth = depth;
+
+			this.dispose();
+
+		}
+
+	}
+
 }
 
 export default Storage3DTexture;

package/src/renderers/common/StorageArrayTexture.js

@@ -58,6 +58,27 @@ class StorageArrayTexture extends Texture {
 
 	}
 
+	/**
+	 * Sets the size of the storage array texture.
+	 *
+	 * @param {number} width - The new width of the storage texture.
+	 * @param {number} height - The new height of the storage texture.
+	 * @param {number} depth - The new depth of the storage texture.
+	 */
+	setSize( width, height, depth ) {
+
+		if ( this.image.width !== width || this.image.height !== height || this.image.depth !== depth ) {
+
+			this.image.width = width;
+			this.image.height = height;
+			this.image.depth = depth;
+
+			this.dispose();
+
+		}
+
+	}
+
 }
 
 export default StorageArrayTexture;

package/src/renderers/common/StorageTexture.js

@@ -54,6 +54,25 @@ class StorageTexture extends Texture {
 
 	}
 
+	/**
+	 * Sets the size of the storage texture.
+	 *
+	 * @param {number} width - The new width of the storage texture.
+	 * @param {number} height - The new height of the storage texture.
+	 */
+	setSize( width, height ) {
+
+		if ( this.image.width !== width || this.image.height !== height ) {
+
+			this.image.width = width;
+			this.image.height = height;
+
+			this.dispose();
+
+		}
+
+	}
+
 }
 
 export default StorageTexture;

package/src/renderers/common/Textures.js

@@ -366,9 +366,25 @@ class Textures extends DataMap {
 
 			if ( image.image !== undefined ) image = image.image;
 
-			target.width = image.width || 1;
-			target.height = image.height || 1;
-			target.depth = texture.isCubeTexture ? 6 : ( image.depth || 1 );
+			if ( image instanceof HTMLVideoElement ) {
+
+				target.width = image.videoWidth || 1;
+				target.height = image.videoHeight || 1;
+				target.depth = 1;
+
+			} else if ( image instanceof VideoFrame ) {
+
+				target.width = image.displayWidth || 1;
+				target.height = image.displayHeight || 1;
+				target.depth = 1;
+
+			} else {
+
+				target.width = image.width || 1;
+				target.height = image.height || 1;
+				target.depth = texture.isCubeTexture ? 6 : ( image.depth || 1 );
+
+			}
 
 		} else {
 

package/src/renderers/common/XRManager.js

@@ -171,6 +171,15 @@ class XRManager extends EventDispatcher {
 		 */
 		this._supportsLayers = false;
 
+		/**
+		 * Whether the device supports binding gl objects.
+		 *
+		 * @private
+		 * @type {boolean}
+		 * @readonly
+		 */
+		this._supportsGlBinding = typeof XRWebGLBinding !== 'undefined';
+
 		this._frameBufferTargets = null;
 
 		/**
@@ -357,7 +366,7 @@ class XRManager extends EventDispatcher {
 		 * @type {boolean}
 		 * @readonly
 		 */
-		this._useLayers = ( typeof XRWebGLBinding !== 'undefined' && 'createProjectionLayer' in XRWebGLBinding.prototype ); // eslint-disable-line compat/compat
+		this._useLayers = ( this._supportsGlBinding && 'createProjectionLayer' in XRWebGLBinding.prototype ); // eslint-disable-line compat/compat
 
 		/**
 		 * Whether the usage of multiview has been requested by the application or not.
@@ -915,9 +924,18 @@ class XRManager extends EventDispatcher {
 
 			//
 
+			if ( this._supportsGlBinding ) {
+
+				const glBinding = new XRWebGLBinding( session, gl );
+				this._glBinding = glBinding;
+
+			}
+
+			//
+
 			if ( this._useLayers === true ) {
 
-				// default path using XRWebGLBinding/XRProjectionLayer
+				// default path using XRProjectionLayer
 
 				let depthFormat = null;
 				let depthType = null;
@@ -945,11 +963,9 @@ class XRManager extends EventDispatcher {
 
 				}
 
-				const glBinding = new XRWebGLBinding( session, gl );
-				const glProjLayer = glBinding.createProjectionLayer( projectionlayerInit );
+				const glProjLayer = this._glBinding.createProjectionLayer( projectionlayerInit );
 				const layersArray = [ glProjLayer ];
 
-				this._glBinding = glBinding;
 				this._glProjLayer = glProjLayer;
 
 				renderer.setPixelRatio( 1 );
@@ -1095,9 +1111,11 @@ class XRManager extends EventDispatcher {
 
 		}
 
-		cameraL.layers.mask = camera.layers.mask | 0b010;
-		cameraR.layers.mask = camera.layers.mask | 0b100;
-		cameraXR.layers.mask = cameraL.layers.mask | cameraR.layers.mask;
+		// inherit camera layers and enable eye layers (1 = left, 2 = right)
+		cameraXR.layers.mask = camera.layers.mask | 0b110;
+		cameraL.layers.mask = cameraXR.layers.mask & 0b011;
+		cameraR.layers.mask = cameraXR.layers.mask & 0b101;
+
 
 		const parent = camera.parent;
 		const cameras = cameraXR.cameras;

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

@@ -45,18 +45,6 @@ class NodeSampledTexture extends SampledTexture {
 
 	}
 
-	/**
-	 * Overwrites the default to additionally check if the node value has changed.
-	 *
-	 * @param {number} generation - The generation.
-	 * @return {boolean} Whether an update is required or not.
-	 */
-	needsBindingsUpdate( generation ) {
-
-		return this.textureNode.value !== this.texture || super.needsBindingsUpdate( generation );
-
-	}
-
 	/**
 	 * Updates the binding.
 	 *

package/src/renderers/shaders/ShaderChunk/shadowmap_pars_fragment.glsl.js

@@ -75,7 +75,17 @@ export default /* glsl */`
 
 	float texture2DCompare( sampler2D depths, vec2 uv, float compare ) {
 
-		return step( compare, unpackRGBAToDepth( texture2D( depths, uv ) ) );
+		float depth = unpackRGBAToDepth( texture2D( depths, uv ) );
+
+		#ifdef USE_REVERSEDEPTHBUF
+
+			return step( depth, compare );
+
+		#else
+
+			return step( compare, depth );
+
+		#endif
 
 	}
 
@@ -91,7 +101,15 @@ export default /* glsl */`
 
 		vec2 distribution = texture2DDistribution( shadow, uv );
 
-		float hard_shadow = step( compare , distribution.x ); // Hard Shadow
+		#ifdef USE_REVERSEDEPTHBUF
+
+			float hard_shadow = step( distribution.x, compare ); // Hard Shadow
+
+		#else
+
+			float hard_shadow = step( compare , distribution.x ); // Hard Shadow
+
+		#endif
 
 		if (hard_shadow != 1.0 ) {