@unikia/upe-renderer 0.186.110 → 0.187.11

package/src/objects/Mesh.js

@@ -115,12 +115,20 @@ class Mesh extends Object3D {
 
 			this.morphTargetInfluences = source.morphTargetInfluences.slice();
 
+		} else {
+
+			this.morphTargetInfluences = undefined;
+
 		}
 
 		if ( source.morphTargetDictionary !== undefined ) {
 
 			this.morphTargetDictionary = Object.assign( {}, source.morphTargetDictionary );
 
+		} else {
+
+			this.morphTargetDictionary = undefined;
+
 		}
 
 		this.material = Array.isArray( source.material ) ? source.material.slice() : source.material;

package/src/objects/Points.js

@@ -82,6 +82,26 @@ class Points extends Object3D {
 
 		super.copy( source, recursive );
 
+		if ( source.morphTargetInfluences !== undefined ) {
+
+			this.morphTargetInfluences = source.morphTargetInfluences.slice();
+
+		} else {
+
+			this.morphTargetInfluences = undefined;
+
+		}
+
+		if ( source.morphTargetDictionary !== undefined ) {
+
+			this.morphTargetDictionary = Object.assign( {}, source.morphTargetDictionary );
+
+		} else {
+
+			this.morphTargetDictionary = undefined;
+
+		}
+
 		this.material = Array.isArray( source.material ) ? source.material.slice() : source.material;
 		this.geometry = source.geometry;
 

package/src/objects/Skeleton.js

@@ -70,6 +70,15 @@ class Skeleton {
 		 */
 		this.boneMatrices = null;
 
+		/**
+		 * An array buffer holding the bone data of the previous frame.
+		 * Required for computing velocity.
+		 *
+		 * @type {?Float32Array}
+		 * @default null
+		 */
+		this.previousBoneMatrices = null;
+
 		/**
 		 * A texture holding the bone data for use
 		 * in the vertex shader.
@@ -79,6 +88,15 @@ class Skeleton {
 		 */
 		this.boneTexture = null;
 
+		/**
+		 * A texture holding the bone data of the previous frame.
+		 * Required for computing velocity.
+		 *
+		 * @type {?DataTexture}
+		 * @default null
+		 */
+		this.previousBoneTexture = null;
+
 		this.init();
 
 	}
@@ -305,6 +323,14 @@ class Skeleton {
 
 		}
 
+		if ( this.previousBoneTexture !== null ) {
+
+			this.previousBoneTexture.dispose();
+
+			this.previousBoneTexture = null;
+
+		}
+
 	}
 
 	/**

package/src/objects/SkinnedMesh.js

@@ -168,8 +168,8 @@ class SkinnedMesh extends Mesh {
 
 		this.skeleton = source.skeleton;
 
-		if ( source.boundingBox !== null ) this.boundingBox = source.boundingBox.clone();
-		if ( source.boundingSphere !== null ) this.boundingSphere = source.boundingSphere.clone();
+		this.boundingBox = source.boundingBox !== null ? source.boundingBox.clone() : null;
+		this.boundingSphere = source.boundingSphere !== null ? source.boundingSphere.clone() : null;
 
 		return this;
 
@@ -331,7 +331,7 @@ class SkinnedMesh extends Mesh {
 
 		} else {
 
-			_baseVector.set( ...target, 1 );
+			_baseVector.set( target.x, target.y, target.z, 1 );
 			target.set( 0, 0, 0 );
 
 		}

package/src/objects/Sprite.js

@@ -225,6 +225,16 @@ class Sprite extends Object3D {
 
 	}
 
+	toJSON( meta ) {
+
+		const data = super.toJSON( meta );
+
+		data.object.center = this.center.toArray();
+
+		return data;
+
+	}
+
 }
 
 function transformVertex( vertexPosition, mvPosition, center, scale, sin, cos ) {

package/src/renderers/WebGLRenderer.js

@@ -20,6 +20,7 @@ import {
 } from '../constants.js';
 import { Color } from '../math/Color.js';
 import { Frustum } from '../math/Frustum.js';
+import { FrustumArray } from '../math/FrustumArray.js';
 import { Matrix4 } from '../math/Matrix4.js';
 import { Vector3 } from '../math/Vector3.js';
 import { Vector4 } from '../math/Vector4.js';
@@ -130,7 +131,7 @@ class WebGLRenderer {
 
 		const uintClearColor = new Uint32Array( 4 );
 		const intClearColor = new Int32Array( 4 );
-		const objectPosition = new Vector3();
+		const lightProbeGridUniforms = { textures: [], min: [], max: [], resolution: [] };
 
 		let currentRenderList = null;
 		let currentRenderState = null;
@@ -341,6 +342,7 @@ class WebGLRenderer {
 		// frustum
 
 		const _frustum = new Frustum();
+		const _frustumArray = new FrustumArray();
 
 		// clipping
 
@@ -817,7 +819,7 @@ class WebGLRenderer {
 
 			}
 
-			state.viewport( _currentViewport.copy( _viewport ).multiplyScalar( _pixelRatio ).round() );
+			state.viewport( _currentViewport.copy( _viewport ).multiplyScalar( getTargetPixelRatio() ).round() );
 
 		};
 
@@ -854,7 +856,7 @@ class WebGLRenderer {
 
 			}
 
-			state.scissor( _currentScissor.copy( _scissor ).multiplyScalar( _pixelRatio ).round() );
+			state.scissor( _currentScissor.copy( _scissor ).multiplyScalar( getTargetPixelRatio() ).round() );
 
 		};
 
@@ -1092,9 +1094,11 @@ class WebGLRenderer {
 			background.dispose();
 			renderLists.dispose();
 			renderStates.dispose();
+			textures.dispose();
 			properties.dispose();
 			environments.dispose();
 			objects.dispose();
+			geometries.dispose();
 			bindingStates.dispose();
 			uniformsGroups.dispose();
 			programCache.dispose();
@@ -1684,7 +1688,16 @@ class WebGLRenderer {
 			renderStateStack.push( currentRenderState );
 
 			_projScreenMatrix.multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse );
-			_frustum.setFromProjectionMatrix( _projScreenMatrix, WebGLCoordinateSystem, camera.reversedDepth );
+
+			if ( camera.isArrayCamera ) {
+
+				_frustumArray.setFromArrayCamera( camera );
+
+			} else {
+
+				_frustum.setFromProjectionMatrix( _projScreenMatrix, WebGLCoordinateSystem, camera.reversedDepth );
+
+			}
 
 			_localClippingEnabled = this.localClippingEnabled;
 			_clippingEnabled = clipping.init( this.clippingPlanes, _localClippingEnabled );
@@ -1694,6 +1707,8 @@ class WebGLRenderer {
 
 			renderListStack.push( currentRenderList );
 
+			this.info.render.frame ++; // increment before projectObject(), see #35099
+
 			if ( xr.enabled === true && xr.isPresenting === true ) {
 
 				const depthSensingMesh = _this.xr.getDepthSensingMesh();
@@ -1726,8 +1741,6 @@ class WebGLRenderer {
 
 			//
 
-			this.info.render.frame ++;
-
 			if ( this.info.autoReset === true ) this.info.reset();
 
 			if ( _clippingEnabled === true ) clipping.beginShadows();
@@ -1873,10 +1886,6 @@ class WebGLRenderer {
 
 					if ( object.autoUpdate === true ) object.update( camera );
 
-				} else if ( object.isLightProbeGrid ) {
-
-					currentRenderState.pushLightProbeGrid( object );
-
 				} else if ( object.isLight ) {
 
 					currentRenderState.pushLight( object );
@@ -1889,7 +1898,9 @@ class WebGLRenderer {
 
 				} else if ( object.isSprite ) {
 
-					if ( ! object.frustumCulled || object.intersectsFrustum( _frustum ) ) {
+					const frustum = camera.isArrayCamera ? _frustumArray : _frustum;
+
+					if ( ! object.frustumCulled || object.intersectsFrustum( frustum ) ) {
 
 						if ( sortObjects ) {
 
@@ -1911,7 +1922,9 @@ class WebGLRenderer {
 
 				} else if ( object.isMesh || object.isLine || object.isPoints ) {
 
-					if ( ! object.frustumCulled || object.intersectsFrustum( _frustum ) ) {
+					const frustum = camera.isArrayCamera ? _frustumArray : _frustum;
+
+					if ( ! object.frustumCulled || object.intersectsFrustum( frustum ) ) {
 
 						const geometry = objects.update( object );
 						const material = object.material;
@@ -2184,6 +2197,16 @@ class WebGLRenderer {
 
 		}
 
+		function countLightProbeGrids( grids ) {
+
+			let count = 0;
+
+			for ( const grid of grids ) if ( grid.texture !== null ) count ++;
+
+			return count;
+
+		}
+
 		function getProgram( material, scene, object ) {
 
 			if ( scene.isScene !== true ) scene = _emptyScene; // scene could be a Mesh, Line, Points, ...
@@ -2217,6 +2240,7 @@ class WebGLRenderer {
 
 				programs = new Map();
 				materialProperties.programs = programs;
+				materialProperties.programVariants = new Map();
 
 			}
 
@@ -2298,7 +2322,7 @@ class WebGLRenderer {
 
 			}
 
-			materialProperties.lightProbeGrid = currentRenderState.state.lightProbeGridArray.length > 0;
+			materialProperties.numLightProbeGrids = countLightProbeGrids( currentRenderState.state.lightProbeGridArray );
 
 			materialProperties.currentProgram = program;
 			materialProperties.uniformsList = null;
@@ -2307,6 +2331,33 @@ class WebGLRenderer {
 
 		}
 
+		function getProgramVariant( material, scene, object, colorSpace, toneMapping ) {
+
+			const materialProperties = properties.get( material );
+
+			const programVariantKey = materialProperties.currentProgram.id + ',' + colorSpace + ',' + toneMapping;
+
+			let program = materialProperties.programVariants.get( programVariantKey );
+
+			if ( program === undefined ) {
+
+				program = getProgram( material, scene, object );
+
+				materialProperties.programVariants.set( programVariantKey, program );
+
+			} else {
+
+				materialProperties.currentProgram = program;
+				materialProperties.uniformsList = null;
+				materialProperties.outputColorSpace = colorSpace;
+				materialProperties.toneMapping = toneMapping;
+
+			}
+
+			return program;
+
+		}
+
 		function getUniformList( materialProperties ) {
 
 			if ( materialProperties.uniformsList === null ) {
@@ -2343,30 +2394,6 @@ class WebGLRenderer {
 
 		}
 
-		function findLightProbeGrid( volumes, object ) {
-
-			if ( volumes.length === 0 ) return null;
-
-			if ( volumes.length === 1 ) {
-
-				return volumes[ 0 ].texture !== null ? volumes[ 0 ] : null;
-
-			}
-
-			objectPosition.setFromMatrixPosition( object.matrixWorld );
-
-			for ( let i = 0, l = volumes.length; i < l; i ++ ) {
-
-				const v = volumes[ i ];
-
-				if ( v.texture !== null && v.boundingBox.containsPoint( objectPosition ) ) return v;
-
-			}
-
-			return null;
-
-		}
-
 		function setProgram( camera, scene, geometry, material, object ) {
 
 			if ( scene.isScene !== true ) scene = _emptyScene; // scene could be a Mesh, Line, Points, ...
@@ -2422,6 +2449,7 @@ class WebGLRenderer {
 			//
 
 			let needsProgramChange = false;
+			let needsProgramVariant = false;
 
 			if ( material.version === materialProperties.__version ) {
 
@@ -2429,10 +2457,6 @@ class WebGLRenderer {
 
 					needsProgramChange = true;
 
-				} else if ( materialProperties.outputColorSpace !== colorSpace ) {
-
-					needsProgramChange = true;
-
 				} else if ( object.isBatchedMesh && materialProperties.batching === false ) {
 
 					needsProgramChange = true;
@@ -2515,17 +2539,17 @@ class WebGLRenderer {
 
 					needsProgramChange = true;
 
-				} else if ( materialProperties.toneMapping !== toneMapping ) {
+				} else if ( materialProperties.morphTargetsCount !== morphTargetsCount ) {
 
 					needsProgramChange = true;
 
-				} else if ( materialProperties.morphTargetsCount !== morphTargetsCount ) {
+				} else if ( materialProperties.numLightProbeGrids !== countLightProbeGrids( currentRenderState.state.lightProbeGridArray ) ) {
 
 					needsProgramChange = true;
 
-				} else if ( !! materialProperties.lightProbeGrid !== ( currentRenderState.state.lightProbeGridArray.length > 0 ) ) {
+				} else if ( materialProperties.outputColorSpace !== colorSpace || materialProperties.toneMapping !== toneMapping ) {
 
-					needsProgramChange = true;
+					needsProgramVariant = true;
 
 				}
 
@@ -2540,9 +2564,9 @@ class WebGLRenderer {
 
 			let program = materialProperties.currentProgram;
 
-			if ( needsProgramChange === true ) {
+			if ( needsProgramChange === true || needsProgramVariant === true ) {
 
-				program = getProgram( material, scene, object );
+				program = ( needsProgramVariant === true ) ? getProgramVariant( material, scene, object, colorSpace, toneMapping ) : getProgram( material, scene, object );
 
 				// notify the node builder that the program has changed so uniforms and update nodes can
 				// be cached and triggered.
@@ -2577,19 +2601,6 @@ class WebGLRenderer {
 
 			}
 
-			if ( materialProperties.needsLights ) {
-
-				const objectVolume = findLightProbeGrid( currentRenderState.state.lightProbeGridArray, object );
-
-				if ( materialProperties.lightProbeGrid !== objectVolume ) {
-
-					materialProperties.lightProbeGrid = objectVolume;
-					refreshMaterial = true;
-
-				}
-
-			}
-
 			if ( refreshProgram || _currentCamera !== camera ) {
 
 				// common camera uniforms
@@ -2777,14 +2788,29 @@ class WebGLRenderer {
 
 				// light probe volume
 
-				if ( materialProperties.needsLights && materialProperties.lightProbeGrid ) {
+				if ( materialProperties.needsLights && materialProperties.numLightProbeGrids > 0 ) {
+
+					const grids = lightProbeGridUniforms;
+					let count = 0;
+
+					for ( const grid of currentRenderState.state.lightProbeGridArray ) {
 
-					const volume = materialProperties.lightProbeGrid;
+						if ( grid.texture === null ) continue;
 
-					m_uniforms.probesSH.value = volume.texture;
-					m_uniforms.probesMin.value.copy( volume.boundingBox.min );
-					m_uniforms.probesMax.value.copy( volume.boundingBox.max );
-					m_uniforms.probesResolution.value.copy( volume.resolution );
+						grids.textures[ count ] = grid.texture;
+						grids.min[ count ] = grid.boundingBox.min;
+						grids.max[ count ] = grid.boundingBox.max;
+						grids.resolution[ count ] = grid.resolution;
+						count ++;
+
+					}
+
+					for ( const key in grids ) grids[ key ].length = count;
+
+					m_uniforms.probesSH.value = grids.textures;
+					m_uniforms.probesMin.value = grids.min;
+					m_uniforms.probesMax.value = grids.max;
+					m_uniforms.probesResolution.value = grids.resolution;
 
 				}
 
@@ -3144,6 +3170,9 @@ class WebGLRenderer {
 
 				framebuffer = framebuffer[ activeCubeFaceIndex ];
 
+				// Custom mip chains store one framebuffer per level; read level 0.
+				if ( Array.isArray( framebuffer ) ) framebuffer = framebuffer[ 0 ];
+
 			}
 
 			if ( framebuffer ) {
@@ -3226,6 +3255,9 @@ class WebGLRenderer {
 
 				framebuffer = framebuffer[ activeCubeFaceIndex ];
 
+				// Custom mip chains store one framebuffer per level; read level 0.
+				if ( Array.isArray( framebuffer ) ) framebuffer = framebuffer[ 0 ];
+
 			}
 
 			if ( framebuffer ) {
@@ -3450,7 +3482,7 @@ class WebGLRenderer {
 
 					}
 
-					_gl.blitFramebuffer( minX, minY, width, height, dstX, dstY, width, height, _gl.DEPTH_BUFFER_BIT, _gl.NEAREST );
+					_gl.blitFramebuffer( minX, minY, minX + width, minY + height, dstX, dstY, dstX + width, dstY + height, _gl.DEPTH_BUFFER_BIT, _gl.NEAREST );
 
 				}
 
@@ -3493,7 +3525,7 @@ class WebGLRenderer {
 					// copy the data using the fastest function that can achieve the copy
 					if ( srcLevel !== 0 ) {
 
-						_gl.blitFramebuffer( minX, minY, width, height, dstX, dstY, width, height, _gl.COLOR_BUFFER_BIT, _gl.NEAREST );
+						_gl.blitFramebuffer( minX, minY, minX + width, minY + height, dstX, dstY, dstX + width, dstY + height, _gl.COLOR_BUFFER_BIT, _gl.NEAREST );
 
 					} else if ( isDst3D ) {
 
@@ -3559,7 +3591,7 @@ class WebGLRenderer {
 			state.pixelStorei( _gl.UNPACK_SKIP_IMAGES, currentUnpackSkipImages );
 
 			// Generate mipmaps only when copying level 0
-			if ( dstLevel === 0 && dstTexture.generateMipmaps ) {
+			if ( dstLevel === 0 && dstTexture.generateMipmaps === true && dstTexture.mipmapsAutoUpdate === true ) {
 
 				_gl.generateMipmap( glTarget );
 
@@ -3698,6 +3730,7 @@ class WebGLRenderer {
  * @property {boolean} [depth=true] Whether the drawing buffer has a depth buffer of at least 16 bits.
  * @property {boolean} [logarithmicDepthBuffer=false] Whether to use a logarithmic depth buffer. It may be necessary to use this if dealing with huge differences in scale in a single scene.
  * Note that this setting uses `gl_FragDepth` if available which disables the Early Fragment Test optimization and can cause a decrease in performance.
+ * It is ignored when a reversed depth buffer is in use.
  * @property {boolean} [reversedDepthBuffer=false] Whether to use a reverse depth buffer. Requires the `EXT_clip_control` extension.
  * This is a more faster and accurate version than logarithmic depth buffer.
  * @property {number} [outputBufferType=UnsignedByteType] Defines the type of the output buffer. Use `HalfFloatType` for HDR rendering with tone mapping and post-processing support.
@@ -3709,7 +3742,8 @@ class WebGLRenderer {
  * @typedef {Object} WebGLRenderer~Capabilities
  * @property {Function} getMaxAnisotropy - Returns the maximum available anisotropy.
  * @property {Function} getMaxPrecision - Returns the maximum available precision for vertex and fragment shaders.
- * @property {boolean} logarithmicDepthBuffer - `true` if `logarithmicDepthBuffer` was set to `true` in the constructor.
+ * @property {boolean} logarithmicDepthBuffer - `true` if `logarithmicDepthBuffer` was set to `true` in the constructor
+ * and no reversed depth buffer is in use.
  * @property {number} maxAttributes - The number of shader attributes that can be used by the vertex shader.
  * @property {number} maxCubemapSize - Maximum height * width of cube map textures that a shader can use.
  * @property {number} maxFragmentUniforms - The number of uniforms that can be used by a fragment shader.

package/src/renderers/common/Animation.js

@@ -64,10 +64,12 @@ class Animation {
 	}
 
 	/**
-	 * Starts the internal animation loop.
+	 * Starts the internal animation loop, if it is not running yet.
 	 */
 	start() {
 
+		if ( this._requestId !== null ) return;
+
 		const update = ( time, xrFrame ) => {
 
 			this._requestId = this._context.requestAnimationFrame( update );
@@ -162,6 +164,8 @@ class Animation {
 
 		this.stop();
 
+		this._animationLoop = null;
+
 	}
 
 }