Updated examples builds.

examples/js/controls/TransformControls.js

@@ -541,10 +541,8 @@
 				this.object.position.copy( this._positionStart );
 				this.object.quaternion.copy( this._quaternionStart );
 				this.object.scale.copy( this._scaleStart );
-
 				this.dispatchEvent( _changeEvent );
 				this.dispatchEvent( _objectChangeEvent );
-
 				this.pointStart.copy( this.pointEnd );
 
 			}

examples/js/interactive/SelectionBox.js

@@ -215,6 +215,8 @@
 
 						_matrix.decompose( _center, _quaternion, _scale );
 
+						_center.applyMatrix4( object.matrixWorld );
+
 						if ( frustum.containsPoint( _center ) ) {
 
 							this.instances[ object.uuid ].push( instanceId );

examples/js/interactive/SelectionHelper.js

@@ -12,13 +12,15 @@
 			this.pointTopLeft = new THREE.Vector2();
 			this.pointBottomRight = new THREE.Vector2();
 			this.isDown = false;
-			this.renderer.domElement.addEventListener( 'pointerdown', function ( event ) {
+
+			this.onPointerDown = function ( event ) {
 
 				this.isDown = true;
 				this.onSelectStart( event );
 
-			}.bind( this ) );
-			this.renderer.domElement.addEventListener( 'pointermove', function ( event ) {
+			}.bind( this );
+
+			this.onPointerMove = function ( event ) {
 
 				if ( this.isDown ) {
 
@@ -26,13 +28,26 @@
 
 				}
 
-			}.bind( this ) );
-			this.renderer.domElement.addEventListener( 'pointerup', function ( event ) {
+			}.bind( this );
+
+			this.onPointerUp = function () {
 
 				this.isDown = false;
-				this.onSelectOver( event );
+				this.onSelectOver();
+
+			}.bind( this );
+
+			this.renderer.domElement.addEventListener( 'pointerdown', this.onPointerDown );
+			this.renderer.domElement.addEventListener( 'pointermove', this.onPointerMove );
+			this.renderer.domElement.addEventListener( 'pointerup', this.onPointerUp );
+
+		}
+
+		dispose() {
 
-			}.bind( this ) );
+			this.renderer.domElement.removeEventListener( 'pointerdown', this.onPointerDown );
+			this.renderer.domElement.removeEventListener( 'pointermove', this.onPointerMove );
+			this.renderer.domElement.removeEventListener( 'pointerup', this.onPointerUp );
 
 		}
 

examples/js/lights/RectAreaLightUniformsLib.js

@@ -28,6 +28,8 @@
 			const ltc_float_2 = new Float32Array( LTC_MAT_2 );
 			THREE.UniformsLib.LTC_FLOAT_1 = new THREE.DataTexture( ltc_float_1, 64, 64, THREE.RGBAFormat, THREE.FloatType, THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.LinearFilter, THREE.NearestFilter, 1 );
 			THREE.UniformsLib.LTC_FLOAT_2 = new THREE.DataTexture( ltc_float_2, 64, 64, THREE.RGBAFormat, THREE.FloatType, THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.LinearFilter, THREE.NearestFilter, 1 );
+			THREE.UniformsLib.LTC_FLOAT_1.needsUpdate = true;
+			THREE.UniformsLib.LTC_FLOAT_2.needsUpdate = true;
 			const ltc_half_1 = new Uint16Array( LTC_MAT_1.length );
 			LTC_MAT_1.forEach( function ( x, index ) {
 
@@ -42,6 +44,8 @@
 			} );
 			THREE.UniformsLib.LTC_HALF_1 = new THREE.DataTexture( ltc_half_1, 64, 64, THREE.RGBAFormat, THREE.HalfFloatType, THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.LinearFilter, THREE.NearestFilter, 1 );
 			THREE.UniformsLib.LTC_HALF_2 = new THREE.DataTexture( ltc_half_2, 64, 64, THREE.RGBAFormat, THREE.HalfFloatType, THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.LinearFilter, THREE.NearestFilter, 1 );
+			THREE.UniformsLib.LTC_HALF_1.needsUpdate = true;
+			THREE.UniformsLib.LTC_HALF_2.needsUpdate = true;
 
 		}
 

examples/js/loaders/ColladaLoader.js

@@ -1145,7 +1145,7 @@
 
 						case 'transparent':
 							data[ child.nodeName ] = {
-								opaque: child.getAttribute( 'opaque' ),
+								opaque: child.hasAttribute( 'opaque' ) ? child.getAttribute( 'opaque' ) : 'A_ONE',
 								data: parseEffectParameter( child )
 							};
 							break;
@@ -1597,7 +1597,6 @@
 								break;
 
 							default:
-								material.opacity = 1 - transparency.float;
 								console.warn( 'THREE.ColladaLoader: Invalid opaque type "%s" of transparent tag.', transparent.opaque );
 
 						}

examples/js/loaders/KTX2Loader.js

@@ -63,6 +63,14 @@
 				bptcSupported: renderer.extensions.has( 'EXT_texture_compression_bptc' ),
 				pvrtcSupported: renderer.extensions.has( 'WEBGL_compressed_texture_pvrtc' ) || renderer.extensions.has( 'WEBKIT_WEBGL_compressed_texture_pvrtc' )
 			};
+
+			if ( renderer.capabilities.isWebGL2 ) {
+
+				// https://github.com/mrdoob/three.js/pull/22928
+				this.workerConfig.etc1Supported = false;
+
+			}
+
 			return this;
 
 		}
@@ -487,8 +495,8 @@
 		}, {
 			if: 'etc1Supported',
 			basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC_4x4 ],
-			transcoderFormat: [ TranscoderFormat.ETC1, TranscoderFormat.ETC1 ],
-			engineFormat: [ EngineFormat.RGB_ETC1_Format, EngineFormat.RGB_ETC1_Format ],
+			transcoderFormat: [ TranscoderFormat.ETC1 ],
+			engineFormat: [ EngineFormat.RGB_ETC1_Format ],
 			priorityETC1S: 2,
 			priorityUASTC: 4,
 			needsPowerOfTwo: false
@@ -523,6 +531,7 @@
 				const opt = options[ i ];
 				if ( ! config[ opt.if ] ) continue;
 				if ( ! opt.basisFormat.includes( basisFormat ) ) continue;
+				if ( hasAlpha && opt.transcoderFormat.length < 2 ) continue;
 				if ( opt.needsPowerOfTwo && ! ( isPowerOfTwo( width ) && isPowerOfTwo( height ) ) ) continue;
 				transcoderFormat = opt.transcoderFormat[ hasAlpha ? 1 : 0 ];
 				engineFormat = opt.engineFormat[ hasAlpha ? 1 : 0 ];

examples/js/loaders/LDrawLoader.js

@@ -916,11 +916,12 @@
 				mainEdgeColourCode: parentScope ? parentScope.mainEdgeColourCode : '24',
 				currentMatrix: new THREE.Matrix4(),
 				matrix: new THREE.Matrix4(),
+				type: 'Model',
 				// If false, it is a root material scope previous to parse
 				isFromParse: true,
-				faces: null,
-				lineSegments: null,
-				conditionalSegments: null,
+				faces: [],
+				lineSegments: [],
+				conditionalSegments: [],
 				totalFaces: 0,
 				// If true, this object is the start of a construction step
 				startingConstructionStep: false
@@ -1135,21 +1136,11 @@
 					break;
 
 				case FINISH_TYPE_PEARLESCENT:
-					// Try to imitate pearlescency by setting the specular to the complementary of the color, and low shininess
-					const specular = new THREE.Color( colour );
-					const hsl = specular.getHSL( {
-						h: 0,
-						s: 0,
-						l: 0
-					} );
-					hsl.h = ( hsl.h + 0.5 ) % 1;
-					hsl.l = Math.min( 1, hsl.l + ( 1 - hsl.l ) * 0.7 );
-					specular.setHSL( hsl.h, hsl.s, hsl.l );
-					material = new THREE.MeshPhongMaterial( {
+					// Try to imitate pearlescency by making the surface glossy
+					material = new THREE.MeshStandardMaterial( {
 						color: colour,
-						specular: specular,
-						shininess: 10,
-						reflectivity: 0.3
+						roughness: 0.3,
+						metalness: 0.25
 					} );
 					break;
 
@@ -1375,9 +1366,6 @@
 
 								case '!LDRAW_ORG':
 									type = lp.getToken();
-									currentParseScope.faces = [];
-									currentParseScope.lineSegments = [];
-									currentParseScope.conditionalSegments = [];
 									currentParseScope.type = type;
 									const isRoot = ! parentParseScope.isFromParse;
 
@@ -1737,6 +1725,13 @@
 
 		finalizeObject( subobjectParseScope ) {
 
+			// fail gracefully if an object could not be loaded
+			if ( subobjectParseScope === null ) {
+
+				return;
+
+			}
+
 			const parentParseScope = subobjectParseScope.parentScope; // Smooth the normals if this is a part or if this is a case where the subpart
 			// is added directly into the parent model (meaning it will never get smoothed by
 			// being added to a part)
@@ -1919,6 +1914,7 @@
 				} ).catch( function () {
 
 					console.warn( 'LDrawLoader: Subobject "' + subobject.fileName + '" could not be found.' );
+					return null;
 
 				} );
 

examples/js/loaders/LUT3dlLoader.js

@@ -102,6 +102,7 @@
 			texture.wrapS = THREE.ClampToEdgeWrapping;
 			texture.wrapT = THREE.ClampToEdgeWrapping;
 			texture.generateMipmaps = false;
+			texture.needsUpdate = true;
 			const texture3D = new THREE.DataTexture3D();
 			texture3D.image.data = data;
 			texture3D.image.width = size;
@@ -115,6 +116,7 @@
 			texture3D.wrapT = THREE.ClampToEdgeWrapping;
 			texture3D.wrapR = THREE.ClampToEdgeWrapping;
 			texture3D.generateMipmaps = false;
+			texture3D.needsUpdate = true;
 			return {
 				size,
 				texture,

examples/js/loaders/LUTCubeLoader.js

@@ -108,6 +108,7 @@
 			texture.wrapS = THREE.ClampToEdgeWrapping;
 			texture.wrapT = THREE.ClampToEdgeWrapping;
 			texture.generateMipmaps = false;
+			texture.needsUpdate = true;
 			const texture3D = new THREE.DataTexture3D();
 			texture3D.image.data = data;
 			texture3D.image.width = size;
@@ -121,6 +122,7 @@
 			texture3D.wrapT = THREE.ClampToEdgeWrapping;
 			texture3D.wrapR = THREE.ClampToEdgeWrapping;
 			texture3D.generateMipmaps = false;
+			texture3D.needsUpdate = true;
 			return {
 				title,
 				size,

examples/js/loaders/SVGLoader.js

@@ -225,7 +225,7 @@
 
 								}
 
-								if ( j === 0 && doSetFirstPoint === true ) firstPoint.copy( point );
+								if ( j === 0 ) firstPoint.copy( point );
 
 							}
 
@@ -382,7 +382,7 @@
 
 								}
 
-								if ( j === 0 && doSetFirstPoint === true ) firstPoint.copy( point );
+								if ( j === 0 ) firstPoint.copy( point );
 
 							}
 

examples/js/loaders/VOXLoader.js

@@ -236,6 +236,7 @@
 			this.minFilter = THREE.NearestFilter;
 			this.magFilter = THREE.LinearFilter;
 			this.unpackAlignment = 1;
+			this.needsUpdate = true;
 
 		}
 

examples/js/loaders/VRMLLoader.js

@@ -1282,6 +1282,7 @@
 							}
 
 							texture = new THREE.DataTexture( data, width, height, useAlpha === true ? THREE.RGBAFormat : THREE.RGBFormat );
+							texture.needsUpdate = true;
 							texture.__type = textureType; // needed for material modifications
 
 							break;

examples/js/misc/GPUComputationRenderer.js

@@ -310,7 +310,9 @@
 			this.createTexture = function () {
 
 				const data = new Float32Array( sizeX * sizeY * 4 );
-				return new THREE.DataTexture( data, sizeX, sizeY, THREE.RGBAFormat, THREE.FloatType );
+				const texture = new THREE.DataTexture( data, sizeX, sizeY, THREE.RGBAFormat, THREE.FloatType );
+				texture.needsUpdate = true;
+				return texture;
 
 			};
 

examples/js/objects/Lensflare.js

@@ -15,16 +15,8 @@
 			const positionScreen = new THREE.Vector3();
 			const positionView = new THREE.Vector3(); // textures
 
-			const tempMap = new THREE.DataTexture( new Uint8Array( 16 * 16 * 3 ), 16, 16, THREE.RGBFormat );
-			tempMap.minFilter = THREE.NearestFilter;
-			tempMap.magFilter = THREE.NearestFilter;
-			tempMap.wrapS = THREE.ClampToEdgeWrapping;
-			tempMap.wrapT = THREE.ClampToEdgeWrapping;
-			const occlusionMap = new THREE.DataTexture( new Uint8Array( 16 * 16 * 3 ), 16, 16, THREE.RGBFormat );
-			occlusionMap.minFilter = THREE.NearestFilter;
-			occlusionMap.magFilter = THREE.NearestFilter;
-			occlusionMap.wrapS = THREE.ClampToEdgeWrapping;
-			occlusionMap.wrapT = THREE.ClampToEdgeWrapping; // material
+			const tempMap = new THREE.FramebufferTexture( 16, 16, THREE.RGBFormat );
+			const occlusionMap = new THREE.FramebufferTexture( 16, 16, THREE.RGBFormat ); // material
 
 			const geometry = Lensflare.Geometry;
 			const material1a = new THREE.RawShaderMaterial( {

examples/js/objects/Reflector.js

@@ -135,6 +135,13 @@
 
 			};
 
+			this.dispose = function () {
+
+				renderTarget.dispose();
+				scope.material.dispose();
+
+			};
+
 		}
 
 	}

examples/js/objects/Refractor.js

@@ -189,6 +189,13 @@
 
 			};
 
+			this.dispose = function () {
+
+				renderTarget.dispose();
+				scope.material.dispose();
+
+			};
+
 		}
 
 	}

examples/js/objects/Water2.js

@@ -23,7 +23,6 @@
 			const reflectivity = options.reflectivity || 0.02;
 			const scale = options.scale || 1;
 			const shader = options.shader || Water.WaterShader;
-			const encoding = options.encoding !== undefined ? options.encoding : THREE.LinearEncoding;
 			const textureLoader = new THREE.TextureLoader();
 			const flowMap = options.flowMap || undefined;
 			const normalMap0 = options.normalMap0 || textureLoader.load( 'textures/water/Water_1_M_Normal.jpg' );
@@ -51,14 +50,12 @@
 			const reflector = new THREE.Reflector( geometry, {
 				textureWidth: textureWidth,
 				textureHeight: textureHeight,
-				clipBias: clipBias,
-				encoding: encoding
+				clipBias: clipBias
 			} );
 			const refractor = new THREE.Refractor( geometry, {
 				textureWidth: textureWidth,
 				textureHeight: textureHeight,
-				clipBias: clipBias,
-				encoding: encoding
+				clipBias: clipBias
 			} );
 			reflector.matrixAutoUpdate = false;
 			refractor.matrixAutoUpdate = false; // material

examples/js/postprocessing/GlitchPass.js

@@ -93,7 +93,9 @@
 
 			}
 
-			return new THREE.DataTexture( data_arr, dt_size, dt_size, THREE.RGBFormat, THREE.FloatType );
+			const texture = new THREE.DataTexture( data_arr, dt_size, dt_size, THREE.RGBFormat, THREE.FloatType );
+			texture.needsUpdate = true;
+			return texture;
 
 		}
 

examples/js/postprocessing/SSAOPass.js

@@ -316,6 +316,7 @@
 			this.noiseTexture = new THREE.DataTexture( data, width, height, THREE.RGBAFormat, THREE.FloatType );
 			this.noiseTexture.wrapS = THREE.RepeatWrapping;
 			this.noiseTexture.wrapT = THREE.RepeatWrapping;
+			this.noiseTexture.needsUpdate = true;
 
 		}
 

examples/js/utils/RoughnessMipmapper.js

@@ -55,34 +55,21 @@
 
 			}
 
-			if ( width !== roughnessMap.image.width || height !== roughnessMap.image.height ) {
-
-				const params = {
-					wrapS: roughnessMap.wrapS,
-					wrapT: roughnessMap.wrapT,
-					magFilter: roughnessMap.magFilter,
-					minFilter: roughnessMap.minFilter,
-					depthBuffer: false
-				};
-				const newRoughnessTarget = new THREE.WebGLRenderTarget( width, height, params );
-				newRoughnessTarget.texture.generateMipmaps = true; // Setting the render target causes the memory to be allocated.
-
-				_renderer.setRenderTarget( newRoughnessTarget );
-
-				material.roughnessMap = newRoughnessTarget.texture;
-				if ( material.metalnessMap == roughnessMap ) material.metalnessMap = material.roughnessMap;
-				if ( material.aoMap == roughnessMap ) material.aoMap = material.roughnessMap; // Copy UV transform parameters
-
-				material.roughnessMap.offset.copy( roughnessMap.offset );
-				material.roughnessMap.repeat.copy( roughnessMap.repeat );
-				material.roughnessMap.center.copy( roughnessMap.center );
-				material.roughnessMap.rotation = roughnessMap.rotation;
-				material.roughnessMap.image = roughnessMap.image;
-				material.roughnessMap.matrixAutoUpdate = roughnessMap.matrixAutoUpdate;
-				material.roughnessMap.matrix.copy( roughnessMap.matrix );
-
-			}
-
+			const newRoughnessTexture = new THREE.FramebufferTexture( width, height, roughnessMap.format );
+			newRoughnessTexture.wrapS = roughnessMap.wrapS;
+			newRoughnessTexture.wrapT = roughnessMap.wrapT;
+			newRoughnessTexture.minFilter = roughnessMap.minFilter;
+			newRoughnessTexture.magFilter = roughnessMap.magFilter;
+			material.roughnessMap = newRoughnessTexture;
+			if ( material.metalnessMap == roughnessMap ) material.metalnessMap = material.roughnessMap;
+			if ( material.aoMap == roughnessMap ) material.aoMap = material.roughnessMap; // Copy UV transform parameters
+
+			material.roughnessMap.offset.copy( roughnessMap.offset );
+			material.roughnessMap.repeat.copy( roughnessMap.repeat );
+			material.roughnessMap.center.copy( roughnessMap.center );
+			material.roughnessMap.rotation = roughnessMap.rotation;
+			material.roughnessMap.matrixAutoUpdate = roughnessMap.matrixAutoUpdate;
+			material.roughnessMap.matrix.copy( roughnessMap.matrix );
 			_mipmapMaterial.uniforms.roughnessMap.value = roughnessMap;
 			_mipmapMaterial.uniforms.normalMap.value = normalMap;
 			const position = new THREE.Vector2( 0, 0 );
@@ -110,7 +97,7 @@
 
 			}
 
-			if ( roughnessMap !== material.roughnessMap ) roughnessMap.dispose();
+			roughnessMap.dispose();
 
 			_renderer.setRenderTarget( oldTarget );