Examples: Clean up. (#21664)

examples/js/loaders/3DMLoader.js

@@ -68,11 +68,11 @@
 
 		decodeObjects( buffer, url ) {
 
-			var worker;
-			var taskID;
-			var taskCost = buffer.byteLength;
+			let worker;
+			let taskID;
+			const taskCost = buffer.byteLength;
 
-			var objectPending = this._getWorker( taskCost ).then( _worker => {
+			const objectPending = this._getWorker( taskCost ).then( _worker => {
 
 				worker = _worker;
 				taskID = this.workerNextTaskID ++; //hmmm
@@ -122,7 +122,7 @@
 
 		_compareMaterials( material ) {
 
-			var mat = {};
+			const mat = {};
 			mat.name = material.name;
 			mat.color = {};
 			mat.color.r = material.color.r;
@@ -130,10 +130,10 @@
 			mat.color.b = material.color.b;
 			mat.type = material.type;
 
-			for ( var i = 0; i < this.materials.length; i ++ ) {
+			for ( let i = 0; i < this.materials.length; i ++ ) {
 
-				var m = this.materials[ i ];
-				var _mat = {};
+				const m = this.materials[ i ];
+				const _mat = {};
 				_mat.name = m.name;
 				_mat.color = {};
 				_mat.color.r = m.color.r;
@@ -167,8 +167,8 @@
 
 			}
 
-			var _diffuseColor = material.diffuseColor;
-			var diffusecolor = new THREE.Color( _diffuseColor.r / 255.0, _diffuseColor.g / 255.0, _diffuseColor.b / 255.0 );
+			const _diffuseColor = material.diffuseColor;
+			const diffusecolor = new THREE.Color( _diffuseColor.r / 255.0, _diffuseColor.g / 255.0, _diffuseColor.b / 255.0 );
 
 			if ( _diffuseColor.r === 0 && _diffuseColor.g === 0 && _diffuseColor.b === 0 ) {
 
@@ -179,22 +179,22 @@
 			} // console.log( material );
 
 
-			var mat = new THREE.MeshStandardMaterial( {
+			const mat = new THREE.MeshStandardMaterial( {
 				color: diffusecolor,
 				name: material.name,
 				side: 2,
 				transparent: material.transparency > 0 ? true : false,
 				opacity: 1.0 - material.transparency
 			} );
-			var textureLoader = new THREE.TextureLoader();
+			const textureLoader = new THREE.TextureLoader();
 
-			for ( var i = 0; i < material.textures.length; i ++ ) {
+			for ( let i = 0; i < material.textures.length; i ++ ) {
 
-				var texture = material.textures[ i ];
+				const texture = material.textures[ i ];
 
 				if ( texture.image !== null ) {
 
-					var map = textureLoader.load( texture.image );
+					const map = textureLoader.load( texture.image );
 
 					switch ( texture.type ) {
 
@@ -228,23 +228,23 @@
 		_createGeometry( data ) {
 
 			// console.log(data);
-			var object = new THREE.Object3D();
-			var instanceDefinitionObjects = [];
-			var instanceDefinitions = [];
-			var instanceReferences = [];
+			const object = new THREE.Object3D();
+			const instanceDefinitionObjects = [];
+			const instanceDefinitions = [];
+			const instanceReferences = [];
 			object.userData[ 'layers' ] = data.layers;
 			object.userData[ 'groups' ] = data.groups;
 			object.userData[ 'settings' ] = data.settings;
 			object.userData[ 'objectType' ] = 'File3dm';
 			object.userData[ 'materials' ] = null;
 			object.name = this.url;
-			var objects = data.objects;
-			var materials = data.materials;
+			let objects = data.objects;
+			const materials = data.materials;
 
-			for ( var i = 0; i < objects.length; i ++ ) {
+			for ( let i = 0; i < objects.length; i ++ ) {
 
-				var obj = objects[ i ];
-				var attributes = obj.attributes;
+				const obj = objects[ i ];
+				const attributes = obj.attributes;
 
 				switch ( obj.objectType ) {
 
@@ -257,21 +257,22 @@
 						break;
 
 					default:
+						let _object;
+
 						if ( attributes.materialIndex >= 0 ) {
 
-							var rMaterial = materials[ attributes.materialIndex ];
+							const rMaterial = materials[ attributes.materialIndex ];
 
-							var material = this._createMaterial( rMaterial );
+							let material = this._createMaterial( rMaterial );
 
 							material = this._compareMaterials( material );
-
-							var _object = this._createObject( obj, material );
+							_object = this._createObject( obj, material );
 
 						} else {
 
-							var material = this._createMaterial();
+							const material = this._createMaterial();
 
-							var _object = this._createObject( obj, material );
+							_object = this._createObject( obj, material );
 
 						}
 
@@ -281,7 +282,7 @@
 
 						}
 
-						var layer = data.layers[ attributes.layerIndex ];
+						const layer = data.layers[ attributes.layerIndex ];
 						_object.visible = layer ? data.layers[ attributes.layerIndex ].visible : true;
 
 						if ( attributes.isInstanceDefinitionObject ) {
@@ -300,18 +301,18 @@
 
 			}
 
-			for ( var i = 0; i < instanceDefinitions.length; i ++ ) {
+			for ( let i = 0; i < instanceDefinitions.length; i ++ ) {
 
-				var iDef = instanceDefinitions[ i ];
-				var objects = [];
+				const iDef = instanceDefinitions[ i ];
+				objects = [];
 
-				for ( var j = 0; j < iDef.attributes.objectIds.length; j ++ ) {
+				for ( let j = 0; j < iDef.attributes.objectIds.length; j ++ ) {
 
-					var objId = iDef.attributes.objectIds[ j ];
+					const objId = iDef.attributes.objectIds[ j ];
 
-					for ( var p = 0; p < instanceDefinitionObjects.length; p ++ ) {
+					for ( let p = 0; p < instanceDefinitionObjects.length; p ++ ) {
 
-						var idoId = instanceDefinitionObjects[ p ].userData.attributes.id;
+						const idoId = instanceDefinitionObjects[ p ].userData.attributes.id;
 
 						if ( objId === idoId ) {
 
@@ -324,19 +325,19 @@
 				} // Currently clones geometry and does not take advantage of instancing
 
 
-				for ( var j = 0; j < instanceReferences.length; j ++ ) {
+				for ( let j = 0; j < instanceReferences.length; j ++ ) {
 
-					var iRef = instanceReferences[ j ];
+					const iRef = instanceReferences[ j ];
 
 					if ( iRef.geometry.parentIdefId === iDef.attributes.id ) {
 
-						var iRefObject = new THREE.Object3D();
-						var xf = iRef.geometry.xform.array;
-						var matrix = new THREE.Matrix4();
+						const iRefObject = new THREE.Object3D();
+						const xf = iRef.geometry.xform.array;
+						const matrix = new THREE.Matrix4();
 						matrix.set( xf[ 0 ], xf[ 1 ], xf[ 2 ], xf[ 3 ], xf[ 4 ], xf[ 5 ], xf[ 6 ], xf[ 7 ], xf[ 8 ], xf[ 9 ], xf[ 10 ], xf[ 11 ], xf[ 12 ], xf[ 13 ], xf[ 14 ], xf[ 15 ] );
 						iRefObject.applyMatrix4( matrix );
 
-						for ( var p = 0; p < objects.length; p ++ ) {
+						for ( let p = 0; p < objects.length; p ++ ) {
 
 							iRefObject.add( objects[ p ].clone( true ) );
 
@@ -357,15 +358,16 @@
 
 		_createObject( obj, mat ) {
 
-			var loader = new THREE.BufferGeometryLoader();
-			var attributes = obj.attributes;
+			const loader = new THREE.BufferGeometryLoader();
+			const attributes = obj.attributes;
+
+			let geometry, material, _color, color;
 
 			switch ( obj.objectType ) {
 
 				case 'Point':
 				case 'PointSet':
-					var geometry = loader.parse( obj.geometry );
-					var material = null;
+					geometry = loader.parse( obj.geometry );
 
 					if ( geometry.attributes.hasOwnProperty( 'color' ) ) {
 
@@ -377,8 +379,8 @@
 
 					} else {
 
-						var _color = attributes.drawColor;
-						var color = new THREE.Color( _color.r / 255.0, _color.g / 255.0, _color.b / 255.0 );
+						_color = attributes.drawColor;
+						color = new THREE.Color( _color.r / 255.0, _color.g / 255.0, _color.b / 255.0 );
 						material = new THREE.PointsMaterial( {
 							color: color,
 							sizeAttenuation: false,
@@ -388,7 +390,7 @@
 					}
 
 					material = this._compareMaterials( material );
-					var points = new THREE.Points( geometry, material );
+					const points = new THREE.Points( geometry, material );
 					points.userData[ 'attributes' ] = attributes;
 					points.userData[ 'objectType' ] = obj.objectType;
 
@@ -405,7 +407,7 @@
 				case 'SubD':
 				case 'Brep':
 					if ( obj.geometry === null ) return;
-					var geometry = loader.parse( obj.geometry );
+					geometry = loader.parse( obj.geometry );
 
 					if ( geometry.attributes.hasOwnProperty( 'color' ) ) {
 
@@ -420,7 +422,7 @@
 
 					}
 
-					var mesh = new THREE.Mesh( geometry, mat );
+					const mesh = new THREE.Mesh( geometry, mat );
 					mesh.castShadow = attributes.castsShadows;
 					mesh.receiveShadow = attributes.receivesShadows;
 					mesh.userData[ 'attributes' ] = attributes;
@@ -436,13 +438,13 @@
 
 				case 'Curve':
 					geometry = loader.parse( obj.geometry );
-					var _color = attributes.drawColor;
-					var color = new THREE.Color( _color.r / 255.0, _color.g / 255.0, _color.b / 255.0 );
-					var material = new THREE.LineBasicMaterial( {
+					_color = attributes.drawColor;
+					color = new THREE.Color( _color.r / 255.0, _color.g / 255.0, _color.b / 255.0 );
+					material = new THREE.LineBasicMaterial( {
 						color: color
 					} );
 					material = this._compareMaterials( material );
-					var lines = new THREE.Line( geometry, material );
+					const lines = new THREE.Line( geometry, material );
 					lines.userData[ 'attributes' ] = attributes;
 					lines.userData[ 'objectType' ] = obj.objectType;
 
@@ -456,12 +458,12 @@
 
 				case 'TextDot':
 					geometry = obj.geometry;
-					var ctx = document.createElement( 'canvas' ).getContext( '2d' );
-					var font = `${geometry.fontHeight}px ${geometry.fontFace}`;
+					const ctx = document.createElement( 'canvas' ).getContext( '2d' );
+					const font = `${geometry.fontHeight}px ${geometry.fontFace}`;
 					ctx.font = font;
-					var width = ctx.measureText( geometry.text ).width + 10;
-					var height = geometry.fontHeight + 10;
-					var r = window.devicePixelRatio;
+					const width = ctx.measureText( geometry.text ).width + 10;
+					const height = geometry.fontHeight + 10;
+					const r = window.devicePixelRatio;
 					ctx.canvas.width = width * r;
 					ctx.canvas.height = height * r;
 					ctx.canvas.style.width = width + 'px';
@@ -470,20 +472,20 @@
 					ctx.font = font;
 					ctx.textBaseline = 'middle';
 					ctx.textAlign = 'center';
-					var color = attributes.drawColor;
+					color = attributes.drawColor;
 					ctx.fillStyle = `rgba(${color.r},${color.g},${color.b},${color.a})`;
 					ctx.fillRect( 0, 0, width, height );
 					ctx.fillStyle = 'white';
 					ctx.fillText( geometry.text, width / 2, height / 2 );
-					var texture = new THREE.CanvasTexture( ctx.canvas );
+					const texture = new THREE.CanvasTexture( ctx.canvas );
 					texture.minFilter = THREE.LinearFilter;
 					texture.wrapS = THREE.ClampToEdgeWrapping;
 					texture.wrapT = THREE.ClampToEdgeWrapping;
-					var material = new THREE.SpriteMaterial( {
+					material = new THREE.SpriteMaterial( {
 						map: texture,
 						depthTest: false
 					} );
-					var sprite = new THREE.Sprite( material );
+					const sprite = new THREE.Sprite( material );
 					sprite.position.set( geometry.point[ 0 ], geometry.point[ 1 ], geometry.point[ 2 ] );
 					sprite.scale.set( width / 10, height / 10, 1.0 );
 					sprite.userData[ 'attributes' ] = attributes;
@@ -499,7 +501,7 @@
 
 				case 'Light':
 					geometry = obj.geometry;
-					var light;
+					let light;
 
 					if ( geometry.isDirectionalLight ) {
 
@@ -519,8 +521,8 @@
 					} else if ( geometry.isRectangularLight ) {
 
 						light = new THREE.RectAreaLight();
-						var width = Math.abs( geometry.width[ 2 ] );
-						var height = Math.abs( geometry.length[ 0 ] );
+						const width = Math.abs( geometry.width[ 2 ] );
+						const height = Math.abs( geometry.length[ 0 ] );
 						light.position.set( geometry.location[ 0 ] - height / 2, geometry.location[ 1 ], geometry.location[ 2 ] - width / 2 );
 						light.height = height;
 						light.width = width;
@@ -545,8 +547,8 @@
 					if ( light ) {
 
 						light.intensity = geometry.intensity;
-						var _color = geometry.diffuse;
-						var color = new THREE.Color( _color.r / 255.0, _color.g / 255.0, _color.b / 255.0 );
+						_color = geometry.diffuse;
+						color = new THREE.Color( _color.r / 255.0, _color.g / 255.0, _color.b / 255.0 );
 						light.color = color;
 						light.userData[ 'attributes' ] = attributes;
 						light.userData[ 'objectType' ] = obj.objectType;
@@ -564,18 +566,18 @@
 			if ( ! this.libraryPending ) {
 
 				// Load rhino3dm wrapper.
-				var jsLoader = new THREE.FileLoader( this.manager );
+				const jsLoader = new THREE.FileLoader( this.manager );
 				jsLoader.setPath( this.libraryPath );
-				var jsContent = new Promise( ( resolve, reject ) => {
+				const jsContent = new Promise( ( resolve, reject ) => {
 
 					jsLoader.load( 'rhino3dm.js', resolve, undefined, reject );
 
 				} ); // Load rhino3dm WASM binary.
 
-				var binaryLoader = new THREE.FileLoader( this.manager );
+				const binaryLoader = new THREE.FileLoader( this.manager );
 				binaryLoader.setPath( this.libraryPath );
 				binaryLoader.setResponseType( 'arraybuffer' );
-				var binaryContent = new Promise( ( resolve, reject ) => {
+				const binaryContent = new Promise( ( resolve, reject ) => {
 
 					binaryLoader.load( 'rhino3dm.wasm', resolve, undefined, reject );
 
@@ -584,8 +586,8 @@
 
 					//this.libraryBinary = binaryContent;
 					this.libraryConfig.wasmBinary = binaryContent;
-					var fn = Rhino3dmWorker.toString();
-					var body = [ '/* rhino3dm.js */', jsContent, '/* worker */', fn.substring( fn.indexOf( '{' ) + 1, fn.lastIndexOf( '}' ) ) ].join( '\n' );
+					const fn = Rhino3dmWorker.toString();
+					const body = [ '/* rhino3dm.js */', jsContent, '/* worker */', fn.substring( fn.indexOf( '{' ) + 1, fn.lastIndexOf( '}' ) ) ].join( '\n' );
 					this.workerSourceURL = URL.createObjectURL( new Blob( [ body ] ) );
 
 				} );
@@ -602,7 +604,7 @@
 
 				if ( this.workerPool.length < this.workerLimit ) {
 
-					var worker = new Worker( this.workerSourceURL );
+					const worker = new Worker( this.workerSourceURL );
 					worker._callbacks = {};
 					worker._taskCosts = {};
 					worker._taskLoad = 0;
@@ -613,7 +615,7 @@
 
 					worker.onmessage = function ( e ) {
 
-						var message = e.data;
+						const message = e.data;
 
 						switch ( message.type ) {
 
@@ -646,7 +648,7 @@
 
 				}
 
-				var worker = this.workerPool[ this.workerPool.length - 1 ];
+				const worker = this.workerPool[ this.workerPool.length - 1 ];
 				worker._taskLoad += taskCost;
 				return worker;
 
@@ -664,7 +666,7 @@
 
 		dispose() {
 
-			for ( var i = 0; i < this.workerPool.length; ++ i ) {
+			for ( let i = 0; i < this.workerPool.length; ++ i ) {
 
 				this.workerPool[ i ].terminate();
 
@@ -681,20 +683,20 @@
 
 	function Rhino3dmWorker() {
 
-		var libraryPending;
-		var libraryConfig;
-		var rhino;
+		let libraryPending;
+		let libraryConfig;
+		let rhino;
 
 		onmessage = function ( e ) {
 
-			var message = e.data;
+			const message = e.data;
 
 			switch ( message.type ) {
 
 				case 'init':
 					libraryConfig = message.libraryConfig;
-					var wasmBinary = libraryConfig.wasmBinary;
-					var RhinoModule;
+					const wasmBinary = libraryConfig.wasmBinary;
+					let RhinoModule;
 					libraryPending = new Promise( function ( resolve ) {
 
 						/* Like Basis THREE.Loader */
@@ -712,10 +714,10 @@
 					break;
 
 				case 'decode':
-					var buffer = message.buffer;
+					const buffer = message.buffer;
 					libraryPending.then( () => {
 
-						var data = decodeObjects( rhino, buffer );
+						const data = decodeObjects( rhino, buffer );
 						self.postMessage( {
 							type: 'decode',
 							id: message.id,
@@ -731,23 +733,23 @@
 
 		function decodeObjects( rhino, buffer ) {
 
-			var arr = new Uint8Array( buffer );
-			var doc = rhino.File3dm.fromByteArray( arr );
-			var objects = [];
-			var materials = [];
-			var layers = [];
-			var views = [];
-			var namedViews = [];
-			var groups = []; //Handle objects
+			const arr = new Uint8Array( buffer );
+			const doc = rhino.File3dm.fromByteArray( arr );
+			const objects = [];
+			const materials = [];
+			const layers = [];
+			const views = [];
+			const namedViews = [];
+			const groups = []; //Handle objects
 
-			var objs = doc.objects();
-			var cnt = objs.count;
+			const objs = doc.objects();
+			const cnt = objs.count;
 
-			for ( var i = 0; i < cnt; i ++ ) {
+			for ( let i = 0; i < cnt; i ++ ) {
 
-				var _object = objs.get( i );
+				const _object = objs.get( i );
 
-				var object = extractObjectData( _object, doc );
+				const object = extractObjectData( _object, doc );
 
 				_object.delete();
 
@@ -761,10 +763,10 @@
 			// console.log( `Instance Definitions Count: ${doc.instanceDefinitions().count()}` );
 
 
-			for ( var i = 0; i < doc.instanceDefinitions().count(); i ++ ) {
+			for ( let i = 0; i < doc.instanceDefinitions().count(); i ++ ) {
 
-				var idef = doc.instanceDefinitions().get( i );
-				var idefAttributes = extractProperties( idef );
+				const idef = doc.instanceDefinitions().get( i );
+				const idefAttributes = extractProperties( idef );
 				idefAttributes.objectIds = idef.getObjectIds();
 				objects.push( {
 					geometry: null,
@@ -775,31 +777,31 @@
 			} // Handle materials
 
 
-			var textureTypes = [// rhino.TextureType.Bitmap,
+			const textureTypes = [// rhino.TextureType.Bitmap,
 				rhino.TextureType.Diffuse, rhino.TextureType.Bump, rhino.TextureType.Transparency, rhino.TextureType.Opacity, rhino.TextureType.Emap ];
-			var pbrTextureTypes = [ rhino.TextureType.PBR_BaseColor, rhino.TextureType.PBR_Subsurface, rhino.TextureType.PBR_SubsurfaceScattering, rhino.TextureType.PBR_SubsurfaceScatteringRadius, rhino.TextureType.PBR_Metallic, rhino.TextureType.PBR_Specular, rhino.TextureType.PBR_SpecularTint, rhino.TextureType.PBR_Roughness, rhino.TextureType.PBR_Anisotropic, rhino.TextureType.PBR_Anisotropic_Rotation, rhino.TextureType.PBR_Sheen, rhino.TextureType.PBR_SheenTint, rhino.TextureType.PBR_Clearcoat, rhino.TextureType.PBR_ClearcoatBump, rhino.TextureType.PBR_ClearcoatRoughness, rhino.TextureType.PBR_OpacityIor, rhino.TextureType.PBR_OpacityRoughness, rhino.TextureType.PBR_Emission, rhino.TextureType.PBR_AmbientOcclusion, rhino.TextureType.PBR_Displacement ];
+			const pbrTextureTypes = [ rhino.TextureType.PBR_BaseColor, rhino.TextureType.PBR_Subsurface, rhino.TextureType.PBR_SubsurfaceScattering, rhino.TextureType.PBR_SubsurfaceScatteringRadius, rhino.TextureType.PBR_Metallic, rhino.TextureType.PBR_Specular, rhino.TextureType.PBR_SpecularTint, rhino.TextureType.PBR_Roughness, rhino.TextureType.PBR_Anisotropic, rhino.TextureType.PBR_Anisotropic_Rotation, rhino.TextureType.PBR_Sheen, rhino.TextureType.PBR_SheenTint, rhino.TextureType.PBR_Clearcoat, rhino.TextureType.PBR_ClearcoatBump, rhino.TextureType.PBR_ClearcoatRoughness, rhino.TextureType.PBR_OpacityIor, rhino.TextureType.PBR_OpacityRoughness, rhino.TextureType.PBR_Emission, rhino.TextureType.PBR_AmbientOcclusion, rhino.TextureType.PBR_Displacement ];
 
-			for ( var i = 0; i < doc.materials().count(); i ++ ) {
+			for ( let i = 0; i < doc.materials().count(); i ++ ) {
 
-				var _material = doc.materials().get( i );
+				const _material = doc.materials().get( i );
 
-				var _pbrMaterial = _material.physicallyBased();
+				const _pbrMaterial = _material.physicallyBased();
 
-				var material = extractProperties( _material );
-				var textures = [];
+				let material = extractProperties( _material );
+				const textures = [];
 
-				for ( var j = 0; j < textureTypes.length; j ++ ) {
+				for ( let j = 0; j < textureTypes.length; j ++ ) {
 
-					var _texture = _material.getTexture( textureTypes[ j ] );
+					const _texture = _material.getTexture( textureTypes[ j ] );
 
 					if ( _texture ) {
 
-						var textureType = textureTypes[ j ].constructor.name;
+						let textureType = textureTypes[ j ].constructor.name;
 						textureType = textureType.substring( 12, textureType.length );
-						var texture = {
+						const texture = {
 							type: textureType
 						};
-						var image = doc.getEmbeddedFileAsBase64( _texture.fileName );
+						const image = doc.getEmbeddedFileAsBase64( _texture.fileName );
 
 						if ( image ) {
 
@@ -826,16 +828,16 @@
 
 					console.log( 'pbr true' );
 
-					for ( var j = 0; j < pbrTextureTypes.length; j ++ ) {
+					for ( let j = 0; j < pbrTextureTypes.length; j ++ ) {
 
-						var _texture = _material.getTexture( textureTypes[ j ] );
+						const _texture = _material.getTexture( textureTypes[ j ] );
 
 						if ( _texture ) {
 
-							var image = doc.getEmbeddedFileAsBase64( _texture.fileName );
-							var textureType = textureTypes[ j ].constructor.name;
+							const image = doc.getEmbeddedFileAsBase64( _texture.fileName );
+							let textureType = textureTypes[ j ].constructor.name;
 							textureType = textureType.substring( 12, textureType.length );
-							var texture = {
+							const texture = {
 								type: textureType,
 								image: 'data:image/png;base64,' + image
 							};
@@ -847,7 +849,7 @@
 
 					}
 
-					var pbMaterialProperties = extractProperties( _material.physicallyBased() );
+					const pbMaterialProperties = extractProperties( _material.physicallyBased() );
 					material = Object.assign( pbMaterialProperties, material );
 
 				}
@@ -861,11 +863,11 @@
 			} // Handle layers
 
 
-			for ( var i = 0; i < doc.layers().count(); i ++ ) {
+			for ( let i = 0; i < doc.layers().count(); i ++ ) {
 
-				var _layer = doc.layers().get( i );
+				const _layer = doc.layers().get( i );
 
-				var layer = extractProperties( _layer );
+				const layer = extractProperties( _layer );
 				layers.push( layer );
 
 				_layer.delete();
@@ -873,11 +875,11 @@
 			} // Handle views
 
 
-			for ( var i = 0; i < doc.views().count(); i ++ ) {
+			for ( let i = 0; i < doc.views().count(); i ++ ) {
 
-				var _view = doc.views().get( i );
+				const _view = doc.views().get( i );
 
-				var view = extractProperties( _view );
+				const view = extractProperties( _view );
 				views.push( view );
 
 				_view.delete();
@@ -885,11 +887,11 @@
 			} // Handle named views
 
 
-			for ( var i = 0; i < doc.namedViews().count(); i ++ ) {
+			for ( let i = 0; i < doc.namedViews().count(); i ++ ) {
 
-				var _namedView = doc.namedViews().get( i );
+				const _namedView = doc.namedViews().get( i );
 
-				var namedView = extractProperties( _namedView );
+				const namedView = extractProperties( _namedView );
 				namedViews.push( namedView );
 
 				_namedView.delete();
@@ -897,11 +899,11 @@
 			} // Handle groups
 
 
-			for ( var i = 0; i < doc.groups().count(); i ++ ) {
+			for ( let i = 0; i < doc.groups().count(); i ++ ) {
 
-				var _group = doc.groups().get( i );
+				const _group = doc.groups().get( i );
 
-				var group = extractProperties( _group );
+				const group = extractProperties( _group );
 				groups.push( group );
 
 				_group.delete();
@@ -909,7 +911,7 @@
 			} // Handle settings
 
 
-			var settings = extractProperties( doc.settings() ); //TODO: Handle other document stuff like dimstyles, instance definitions, bitmaps etc.
+			const settings = extractProperties( doc.settings() ); //TODO: Handle other document stuff like dimstyles, instance definitions, bitmaps etc.
 			// Handle dimstyles
 			// console.log( `Dimstyle Count: ${doc.dimstyles().count()}` );
 			// Handle bitmaps
@@ -942,28 +944,27 @@
 
 		function extractObjectData( object, doc ) {
 
-			var _geometry = object.geometry();
+			const _geometry = object.geometry();
 
-			var _attributes = object.attributes();
+			const _attributes = object.attributes();
 
-			var objectType = _geometry.objectType;
-			var geometry = null;
-			var attributes = null; // skip instance definition objects
+			let objectType = _geometry.objectType;
+			let geometry, attributes, position, data, mesh; // skip instance definition objects
 			//if( _attributes.isInstanceDefinitionObject ) { continue; }
 			// TODO: handle other geometry types
 
 			switch ( objectType ) {
 
 				case rhino.ObjectType.Curve:
-					var pts = curveToPoints( _geometry, 100 );
-					var position = {};
-					var attributes = {};
-					var data = {};
+					const pts = curveToPoints( _geometry, 100 );
+					position = {};
+					attributes = {};
+					data = {};
 					position.itemSize = 3;
 					position.type = 'Float32Array';
 					position.array = [];
 
-					for ( var j = 0; j < pts.length; j ++ ) {
+					for ( let j = 0; j < pts.length; j ++ ) {
 
 						position.array.push( pts[ j ][ 0 ] );
 						position.array.push( pts[ j ][ 1 ] );
@@ -979,16 +980,16 @@
 					break;
 
 				case rhino.ObjectType.Point:
-					var pt = _geometry.location;
-					var position = {};
-					var color = {};
-					var attributes = {};
-					var data = {};
+					const pt = _geometry.location;
+					position = {};
+					const color = {};
+					attributes = {};
+					data = {};
 					position.itemSize = 3;
 					position.type = 'Float32Array';
 					position.array = [ pt[ 0 ], pt[ 1 ], pt[ 2 ] ];
 
-					var _color = _attributes.drawColor( doc );
+					const _color = _attributes.drawColor( doc );
 
 					color.itemSize = 3;
 					color.type = 'Float32Array';
@@ -1007,15 +1008,15 @@
 					break;
 
 				case rhino.ObjectType.Brep:
-					var faces = _geometry.faces();
+					const faces = _geometry.faces();
 
-					var mesh = new rhino.Mesh();
+					mesh = new rhino.Mesh();
 
-					for ( var faceIndex = 0; faceIndex < faces.count; faceIndex ++ ) {
+					for ( let faceIndex = 0; faceIndex < faces.count; faceIndex ++ ) {
 
-						var face = faces.get( faceIndex );
+						const face = faces.get( faceIndex );
 
-						var _mesh = face.getMesh( rhino.MeshType.Any );
+						const _mesh = face.getMesh( rhino.MeshType.Any );
 
 						if ( _mesh ) {
 
@@ -1041,7 +1042,7 @@
 					break;
 
 				case rhino.ObjectType.Extrusion:
-					var mesh = _geometry.getMesh( rhino.MeshType.Any );
+					mesh = _geometry.getMesh( rhino.MeshType.Any );
 
 					if ( mesh ) {
 
@@ -1070,7 +1071,7 @@
 				// TODO: precalculate resulting vertices and faces and warn on excessive results
 					_geometry.subdivide( 3 );
 
-					var mesh = rhino.Mesh.createFromSubDControlNet( _geometry );
+					mesh = rhino.Mesh.createFromSubDControlNet( _geometry );
 
 					if ( mesh ) {
 
@@ -1095,7 +1096,7 @@
 
 			if ( geometry ) {
 
-				var attributes = extractProperties( _attributes );
+				attributes = extractProperties( _attributes );
 				attributes.geometry = extractProperties( _geometry );
 
 				if ( _attributes.groupCount > 0 ) {
@@ -1135,11 +1136,11 @@
 
 		function extractProperties( object ) {
 
-			var result = {};
+			const result = {};
 
-			for ( var property in object ) {
+			for ( const property in object ) {
 
-				var value = object[ property ];
+				const value = object[ property ];
 
 				if ( typeof value !== 'function' ) {
 
@@ -1168,9 +1169,9 @@
 
 		function curveToPoints( curve, pointLimit ) {
 
-			var pointCount = pointLimit;
-			var rc = [];
-			var ts = [];
+			let pointCount = pointLimit;
+			let rc = [];
+			const ts = [];
 
 			if ( curve instanceof rhino.LineCurve ) {
 
@@ -1182,7 +1183,7 @@
 
 				pointCount = curve.pointCount;
 
-				for ( var i = 0; i < pointCount; i ++ ) {
+				for ( let i = 0; i < pointCount; i ++ ) {
 
 					rc.push( curve.point( i ) );
 
@@ -1194,12 +1195,12 @@
 
 			if ( curve instanceof rhino.PolyCurve ) {
 
-				var segmentCount = curve.segmentCount;
+				const segmentCount = curve.segmentCount;
 
-				for ( var i = 0; i < segmentCount; i ++ ) {
+				for ( let i = 0; i < segmentCount; i ++ ) {
 
-					var segment = curve.segmentCurve( i );
-					var segmentArray = curveToPoints( segment, pointCount );
+					const segment = curve.segmentCurve( i );
+					const segmentArray = curveToPoints( segment, pointCount );
 					rc = rc.concat( segmentArray );
 					segment.delete();
 
@@ -1220,7 +1221,7 @@
 
 				const pLine = curve.tryGetPolyline();
 
-				for ( var i = 0; i < pLine.count; i ++ ) {
+				for ( let i = 0; i < pLine.count; i ++ ) {
 
 					rc.push( pLine.get( i ) );
 
@@ -1231,12 +1232,12 @@
 
 			}
 
-			var domain = curve.domain;
-			var divisions = pointCount - 1.0;
+			const domain = curve.domain;
+			const divisions = pointCount - 1.0;
 
-			for ( var j = 0; j < pointCount; j ++ ) {
+			for ( let j = 0; j < pointCount; j ++ ) {
 
-				var t = domain[ 0 ] + j / divisions * ( domain[ 1 ] - domain[ 0 ] );
+				const t = domain[ 0 ] + j / divisions * ( domain[ 1 ] - domain[ 0 ] );
 
 				if ( t === domain[ 0 ] || t === domain[ 1 ] ) {
 
@@ -1245,14 +1246,14 @@
 
 				}
 
-				var tan = curve.tangentAt( t );
-				var prevTan = curve.tangentAt( ts.slice( - 1 )[ 0 ] ); // Duplicated from THREE.Vector3
+				const tan = curve.tangentAt( t );
+				const prevTan = curve.tangentAt( ts.slice( - 1 )[ 0 ] ); // Duplicated from THREE.Vector3
 				// How to pass imports to worker?
 
-				var tS = tan[ 0 ] * tan[ 0 ] + tan[ 1 ] * tan[ 1 ] + tan[ 2 ] * tan[ 2 ];
-				var ptS = prevTan[ 0 ] * prevTan[ 0 ] + prevTan[ 1 ] * prevTan[ 1 ] + prevTan[ 2 ] * prevTan[ 2 ];
-				var denominator = Math.sqrt( tS * ptS );
-				var angle;
+				const tS = tan[ 0 ] * tan[ 0 ] + tan[ 1 ] * tan[ 1 ] + tan[ 2 ] * tan[ 2 ];
+				const ptS = prevTan[ 0 ] * prevTan[ 0 ] + prevTan[ 1 ] * prevTan[ 1 ] + prevTan[ 2 ] * prevTan[ 2 ];
+				const denominator = Math.sqrt( tS * ptS );
+				let angle;
 
 				if ( denominator === 0 ) {
 
@@ -1260,7 +1261,7 @@
 
 				} else {
 
-					var theta = ( tan.x * prevTan.x + tan.y * prevTan.y + tan.z * prevTan.z ) / denominator;
+					const theta = ( tan.x * prevTan.x + tan.y * prevTan.y + tan.z * prevTan.z ) / denominator;
 					angle = Math.acos( Math.max( - 1, Math.min( 1, theta ) ) );
 
 				}

examples/js/postprocessing/SSRPass.js

@@ -26,7 +26,7 @@
 			this.opacity = THREE.SSRShader.uniforms.opacity.value;
 			this.output = 0;
 			this.maxDistance = THREE.SSRShader.uniforms.maxDistance.value;
-			this.surfDist = THREE.SSRShader.uniforms.surfDist.value;
+			this.thickness = THREE.SSRShader.uniforms.thickness.value;
 			this.encoding = encoding;
 			this.tempColor = new THREE.Color();
 			this._selects = selects;
@@ -140,24 +140,23 @@
 
 				}
 
-			} );
-			this.thickTolerance = THREE.SSRShader.uniforms.thickTolerance.value; // beauty render target with depth buffer
+			} ); // beauty render target with depth buffer
 
 			const depthTexture = new THREE.DepthTexture();
 			depthTexture.type = THREE.UnsignedShortType;
 			depthTexture.minFilter = THREE.NearestFilter;
 			depthTexture.magFilter = THREE.NearestFilter;
 			this.beautyRenderTarget = new THREE.WebGLRenderTarget( this.width, this.height, {
-				minFilter: THREE.LinearFilter,
-				magFilter: THREE.LinearFilter,
+				minFilter: THREE.NearestFilter,
+				magFilter: THREE.NearestFilter,
 				format: THREE.RGBAFormat,
 				depthTexture: depthTexture,
 				depthBuffer: true
 			} ); //for bouncing
 
 			this.prevRenderTarget = new THREE.WebGLRenderTarget( this.width, this.height, {
-				minFilter: THREE.LinearFilter,
-				magFilter: THREE.LinearFilter,
+				minFilter: THREE.NearestFilter,
+				magFilter: THREE.NearestFilter,
 				format: THREE.RGBAFormat
 			} ); // normal render target
 
@@ -175,8 +174,8 @@
 			} ); // ssr render target
 
 			this.ssrRenderTarget = new THREE.WebGLRenderTarget( this.width, this.height, {
-				minFilter: THREE.LinearFilter,
-				magFilter: THREE.LinearFilter,
+				minFilter: THREE.NearestFilter,
+				magFilter: THREE.NearestFilter,
 				format: THREE.RGBAFormat
 			} );
 			this.blurRenderTarget = this.ssrRenderTarget.clone();
@@ -206,7 +205,7 @@
 			this.ssrMaterial.uniforms[ 'tDepth' ].value = this.beautyRenderTarget.depthTexture;
 			this.ssrMaterial.uniforms[ 'cameraNear' ].value = this.camera.near;
 			this.ssrMaterial.uniforms[ 'cameraFar' ].value = this.camera.far;
-			this.ssrMaterial.uniforms[ 'surfDist' ].value = this.surfDist;
+			this.ssrMaterial.uniforms[ 'thickness' ].value = this.thickness;
 			this.ssrMaterial.uniforms[ 'resolution' ].value.set( this.width, this.height );
 			this.ssrMaterial.uniforms[ 'cameraProjectionMatrix' ].value.copy( this.camera.projectionMatrix );
 			this.ssrMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse ); // normal material
@@ -337,8 +336,7 @@
 
 			this.ssrMaterial.uniforms[ 'opacity' ].value = this.opacity;
 			this.ssrMaterial.uniforms[ 'maxDistance' ].value = this.maxDistance;
-			this.ssrMaterial.uniforms[ 'surfDist' ].value = this.surfDist;
-			this.ssrMaterial.uniforms[ 'thickTolerance' ].value = this.thickTolerance;
+			this.ssrMaterial.uniforms[ 'thickness' ].value = this.thickness;
 			this.renderPass( renderer, this.ssrMaterial, this.ssrRenderTarget ); // render blur
 
 			if ( this.blur ) {

examples/js/shaders/SSRShader.js

@@ -51,11 +51,8 @@
 			'cameraRange': {
 				value: 0
 			},
-			'surfDist': {
-				value: .007
-			},
-			'thickTolerance': {
-				value: .03
+			'thickness': {
+				value: .018
 			}
 		},
 		vertexShader:
@@ -89,10 +86,9 @@
 		uniform float cameraNear;
 		uniform float cameraFar;
 		uniform float maxDistance;
-		uniform float surfDist;
+		uniform float thickness;
 		uniform mat4 cameraProjectionMatrix;
 		uniform mat4 cameraInverseProjectionMatrix;
-		uniform float thickTolerance;
 		#include <packing>
 		float pointToLineDistance(vec3 x0, vec3 x1, vec3 x2) {
 			//x0: point, x1: linePointA, x2: linePointB
@@ -204,25 +200,36 @@
 					// https://www.comp.nus.edu.sg/~lowkl/publications/lowk_persp_interp_techrep.pdf
 					float recipVPZ=1./viewPosition.z;
 					float viewReflectRayZ=1./(recipVPZ+s*(1./d1viewPosition.z-recipVPZ));
-					float sD=surfDist*cW;
 				#else
 					float viewReflectRayZ=viewPosition.z+s*(d1viewPosition.z-viewPosition.z);
-					float sD=surfDist;
 				#endif
-				if(viewReflectRayZ-sD>vZ) continue;
 
+				if(viewReflectRayZ>vZ) continue;
+
+				bool hit;
 				#ifdef INFINITE_THICK
-					if(viewReflectRayZ+thickTolerance*clipW<vP.z) break;
+					hit=true;
+				#else
+					float away=pointToLineDistance(vP,viewPosition,d1viewPosition);
+
+					float minThickness;
+					vec2 xyNeighbor=xy;
+					xyNeighbor.x+=1.;
+					vec2 uvNeighbor=xyNeighbor/resolution;
+					vec3 vPNeighbor=getViewPosition(uvNeighbor,d,cW);
+					minThickness=vPNeighbor.x-vP.x;
+					minThickness*=3.;
+					float tk=max(minThickness,thickness);
+
+					hit=away<=tk;
 				#endif
-				float away=pointToLineDistance(vP,viewPosition,d1viewPosition);
-
-				float op=opacity;
 
-				if(away<sD){
+				if(hit){
 					vec3 vN=getViewNormal( uv );
 					if(dot(viewReflectDir,vN)>=0.) continue;
 					float distance=pointPlaneDistance(vP,viewPosition,viewNormal);
 					if(distance>maxDistance) break;
+					float op=opacity;
 					#ifdef DISTANCE_ATTENUATION
 						float ratio=1.-(distance/maxDistance);
 						float attenuation=ratio*ratio;

examples/jsm/loaders/3DMLoader.js

@@ -906,7 +906,7 @@ function Rhino3dmWorker() {
 			const _material = doc.materials().get( i );
 			const _pbrMaterial = _material.physicallyBased();
 
-			const material = extractProperties( _material );
+			let material = extractProperties( _material );
 
 			const textures = [];
 
@@ -915,7 +915,7 @@ function Rhino3dmWorker() {
 				const _texture = _material.getTexture( textureTypes[ j ] );
 				if ( _texture ) {
 
-					const textureType = textureTypes[ j ].constructor.name;
+					let textureType = textureTypes[ j ].constructor.name;
 					textureType = textureType.substring( 12, textureType.length );
 					const texture = { type: textureType };
 
@@ -952,7 +952,7 @@ function Rhino3dmWorker() {
 					if ( _texture ) {
 
 						const image = doc.getEmbeddedFileAsBase64( _texture.fileName );
-						const textureType = textureTypes[ j ].constructor.name;
+						let textureType = textureTypes[ j ].constructor.name;
 						textureType = textureType.substring( 12, textureType.length );
 						const texture = { type: textureType, image: 'data:image/png;base64,' + image };
 						textures.push( texture );