@needle-tools/three 0.145.4 → 0.146.2

package/examples/js/misc/ProgressiveLightMap.js

@@ -16,7 +16,6 @@
  * @param {WebGLRenderer} renderer A WebGL Rendering Context
  * @param {number} res The side-long dimension of you total lightmap
  */
-
 	class ProgressiveLightMap {
 
 		constructor( renderer, res = 1024 ) {
@@ -30,59 +29,62 @@
 			this.tinyTarget = new THREE.WebGLRenderTarget( 1, 1 );
 			this.buffer1Active = false;
 			this.firstUpdate = true;
-			this.warned = false; // Create the Progressive LightMap Texture
+			this.warned = false;
 
+			// Create the Progressive LightMap Texture
 			const format = /(Android|iPad|iPhone|iPod)/g.test( navigator.userAgent ) ? THREE.HalfFloatType : THREE.FloatType;
 			this.progressiveLightMap1 = new THREE.WebGLRenderTarget( this.res, this.res, {
 				type: format
 			} );
 			this.progressiveLightMap2 = new THREE.WebGLRenderTarget( this.res, this.res, {
 				type: format
-			} ); // Inject some spicy new logic into a standard phong material
+			} );
 
+			// Inject some spicy new logic into a standard phong material
 			this.uvMat = new THREE.MeshPhongMaterial();
 			this.uvMat.uniforms = {};
-
 			this.uvMat.onBeforeCompile = shader => {
 
 				// Vertex Shader: Set Vertex Positions to the Unwrapped UV Positions
-				shader.vertexShader = '#define USE_LIGHTMAP\n' + shader.vertexShader.slice( 0, - 1 ) + '	gl_Position = vec4((uv2 - 0.5) * 2.0, 1.0, 1.0); }'; // Fragment Shader: Set Pixels to average in the Previous frame's Shadows
+				shader.vertexShader = '#define USE_LIGHTMAP\n' + shader.vertexShader.slice( 0, - 1 ) + '	gl_Position = vec4((uv2 - 0.5) * 2.0, 1.0, 1.0); }';
 
+				// Fragment Shader: Set Pixels to average in the Previous frame's Shadows
 				const bodyStart = shader.fragmentShader.indexOf( 'void main() {' );
 				shader.fragmentShader = 'varying vec2 vUv2;\n' + shader.fragmentShader.slice( 0, bodyStart ) + '	uniform sampler2D previousShadowMap;\n	uniform float averagingWindow;\n' + shader.fragmentShader.slice( bodyStart - 1, - 1 ) + `\nvec3 texelOld = texture2D(previousShadowMap, vUv2).rgb;
 				gl_FragColor.rgb = mix(texelOld, gl_FragColor.rgb, 1.0/averagingWindow);
-			}`; // Set the Previous Frame's Texture Buffer and Averaging Window
+			}`;
 
+				// Set the Previous Frame's Texture Buffer and Averaging Window
 				shader.uniforms.previousShadowMap = {
 					value: this.progressiveLightMap1.texture
 				};
 				shader.uniforms.averagingWindow = {
 					value: 100
 				};
-				this.uvMat.uniforms = shader.uniforms; // Set the new Shader to this
+				this.uvMat.uniforms = shader.uniforms;
 
+				// Set the new Shader to this
 				this.uvMat.userData.shader = shader;
 				this.compiled = true;
 
 			};
 
 		}
+
 		/**
    * Sets these objects' materials' lightmaps and modifies their uv2's.
    * @param {Object3D} objects An array of objects and lights to set up your lightmap.
    */
-
-
 		addObjectsToLightMap( objects ) {
 
 			// Prepare list of UV bounding boxes for packing later...
 			this.uv_boxes = [];
 			const padding = 3 / this.res;
-
 			for ( let ob = 0; ob < objects.length; ob ++ ) {
 
-				const object = objects[ ob ]; // If this object is a light, simply add it to the internal scene
+				const object = objects[ ob ];
 
+				// If this object is a light, simply add it to the internal scene
 				if ( object.isLight ) {
 
 					this.scene.attach( object );
@@ -101,16 +103,17 @@
 
 					this._initializeBlurPlane( this.res, this.progressiveLightMap1 );
 
-				} // Apply the lightmap to the object
-
+				}
 
+				// Apply the lightmap to the object
 				object.material.lightMap = this.progressiveLightMap2.texture;
 				object.material.dithering = true;
 				object.castShadow = true;
 				object.receiveShadow = true;
-				object.renderOrder = 1000 + ob; // Prepare UV boxes for potpack
-				// TODO: Size these by object surface area
+				object.renderOrder = 1000 + ob;
 
+				// Prepare UV boxes for potpack
+				// TODO: Size these by object surface area
 				this.uv_boxes.push( {
 					w: 1 + padding * 2,
 					h: 1 + padding * 2,
@@ -122,14 +125,13 @@
 				} );
 				this.compiled = false;
 
-			} // Pack the objects' lightmap UVs into the same global space
-
+			}
 
+			// Pack the objects' lightmap UVs into the same global space
 			const dimensions = potpack( this.uv_boxes );
 			this.uv_boxes.forEach( box => {
 
 				const uv2 = objects[ box.index ].geometry.getAttribute( 'uv' ).clone();
-
 				for ( let i = 0; i < uv2.array.length; i += uv2.itemSize ) {
 
 					uv2.array[ i ] = ( uv2.array[ i ] + box.x + padding ) / dimensions.w;
@@ -143,45 +145,45 @@
 			} );
 
 		}
+
 		/**
    * This function renders each mesh one at a time into their respective surface maps
    * @param {Camera} camera Standard Rendering Camera
    * @param {number} blendWindow When >1, samples will accumulate over time.
    * @param {boolean} blurEdges  Whether to fix UV Edges via blurring
    */
-
-
 		update( camera, blendWindow = 100, blurEdges = true ) {
 
 			if ( this.blurringPlane == null ) {
 
 				return;
 
-			} // Store the original Render Target
-
+			}
 
-			const oldTarget = this.renderer.getRenderTarget(); // The blurring plane applies blur to the seams of the lightmap
+			// Store the original Render Target
+			const oldTarget = this.renderer.getRenderTarget();
 
-			this.blurringPlane.visible = blurEdges; // Steal the Object3D from the real world to our special dimension
+			// The blurring plane applies blur to the seams of the lightmap
+			this.blurringPlane.visible = blurEdges;
 
+			// Steal the Object3D from the real world to our special dimension
 			for ( let l = 0; l < this.lightMapContainers.length; l ++ ) {
 
 				this.lightMapContainers[ l ].object.oldScene = this.lightMapContainers[ l ].object.parent;
 				this.scene.attach( this.lightMapContainers[ l ].object );
 
-			} // Render once normally to initialize everything
-
+			}
 
+			// Render once normally to initialize everything
 			if ( this.firstUpdate ) {
 
 				this.renderer.setRenderTarget( this.tinyTarget ); // Tiny for Speed
-
 				this.renderer.render( this.scene, camera );
 				this.firstUpdate = false;
 
-			} // Set each object's material to the UV Unwrapped Surface Mapping Version
-
+			}
 
+			// Set each object's material to the UV Unwrapped Surface Mapping Version
 			for ( let l = 0; l < this.lightMapContainers.length; l ++ ) {
 
 				this.uvMat.uniforms.averagingWindow = {
@@ -191,12 +193,13 @@
 				this.lightMapContainers[ l ].object.oldFrustumCulled = this.lightMapContainers[ l ].object.frustumCulled;
 				this.lightMapContainers[ l ].object.frustumCulled = false;
 
-			} // Ping-pong two surface buffers for reading/writing
-
+			}
 
+			// Ping-pong two surface buffers for reading/writing
 			const activeMap = this.buffer1Active ? this.progressiveLightMap1 : this.progressiveLightMap2;
-			const inactiveMap = this.buffer1Active ? this.progressiveLightMap2 : this.progressiveLightMap1; // Render the object's surface maps
+			const inactiveMap = this.buffer1Active ? this.progressiveLightMap2 : this.progressiveLightMap1;
 
+			// Render the object's surface maps
 			this.renderer.setRenderTarget( activeMap );
 			this.uvMat.uniforms.previousShadowMap = {
 				value: inactiveMap.texture
@@ -205,27 +208,27 @@
 				value: inactiveMap.texture
 			};
 			this.buffer1Active = ! this.buffer1Active;
-			this.renderer.render( this.scene, camera ); // Restore the object's Real-time Material and add it back to the original world
+			this.renderer.render( this.scene, camera );
 
+			// Restore the object's Real-time Material and add it back to the original world
 			for ( let l = 0; l < this.lightMapContainers.length; l ++ ) {
 
 				this.lightMapContainers[ l ].object.frustumCulled = this.lightMapContainers[ l ].object.oldFrustumCulled;
 				this.lightMapContainers[ l ].object.material = this.lightMapContainers[ l ].basicMat;
 				this.lightMapContainers[ l ].object.oldScene.attach( this.lightMapContainers[ l ].object );
 
-			} // Restore the original Render Target
-
+			}
 
+			// Restore the original Render Target
 			this.renderer.setRenderTarget( oldTarget );
 
 		}
+
 		/** DEBUG
    * Draw the lightmap in the main scene.  Call this after adding the objects to it.
    * @param {boolean} visible Whether the debug plane should be visible
    * @param {Vector3} position Where the debug plane should be drawn
   */
-
-
 		showDebugLightmap( visible, position = undefined ) {
 
 			if ( this.lightMapContainers.length == 0 ) {
@@ -263,13 +266,12 @@
 			this.labelMesh.visible = visible;
 
 		}
+
 		/**
    * INTERNAL Creates the Blurring Plane
    * @param {number} res The square resolution of this object's lightMap.
    * @param {WebGLRenderTexture} lightMap The lightmap to initialize the plane with.
    */
-
-
 		_initializeBlurPlane( res, lightMap = null ) {
 
 			const blurMaterial = new THREE.MeshBasicMaterial();
@@ -284,12 +286,12 @@
 				polygonOffsetFactor: - 1,
 				polygonOffsetUnits: 3.0
 			};
-
 			blurMaterial.onBeforeCompile = shader => {
 
 				// Vertex Shader: Set Vertex Positions to the Unwrapped UV Positions
-				shader.vertexShader = '#define USE_UV\n' + shader.vertexShader.slice( 0, - 1 ) + '	gl_Position = vec4((uv - 0.5) * 2.0, 1.0, 1.0); }'; // Fragment Shader: Set Pixels to 9-tap box blur the current frame's Shadows
+				shader.vertexShader = '#define USE_UV\n' + shader.vertexShader.slice( 0, - 1 ) + '	gl_Position = vec4((uv - 0.5) * 2.0, 1.0, 1.0); }';
 
+				// Fragment Shader: Set Pixels to 9-tap box blur the current frame's Shadows
 				const bodyStart = shader.fragmentShader.indexOf( 'void main() {' );
 				shader.fragmentShader = '#define USE_UV\n' + shader.fragmentShader.slice( 0, bodyStart ) + '	uniform sampler2D previousShadowMap;\n	uniform float pixelOffset;\n' + shader.fragmentShader.slice( bodyStart - 1, - 1 ) + `	gl_FragColor.rgb = (
 									texture2D(previousShadowMap, vUv + vec2( pixelOffset,  0.0        )).rgb +
@@ -300,16 +302,18 @@
 									texture2D(previousShadowMap, vUv + vec2(-pixelOffset,  pixelOffset)).rgb +
 									texture2D(previousShadowMap, vUv + vec2( pixelOffset, -pixelOffset)).rgb +
 									texture2D(previousShadowMap, vUv + vec2(-pixelOffset, -pixelOffset)).rgb)/8.0;
-				}`; // Set the LightMap Accumulation Buffer
+				}`;
 
+				// Set the LightMap Accumulation Buffer
 				shader.uniforms.previousShadowMap = {
 					value: lightMap.texture
 				};
 				shader.uniforms.pixelOffset = {
 					value: 0.5 / res
 				};
-				blurMaterial.uniforms = shader.uniforms; // Set the new Shader to this
+				blurMaterial.uniforms = shader.uniforms;
 
+				// Set the new Shader to this
 				blurMaterial.userData.shader = shader;
 				this.compiled = true;
 

package/examples/js/misc/RollerCoaster.js

@@ -18,13 +18,14 @@
 			prevQuaternion.setFromAxisAngle( up, Math.PI / 2 );
 			const point = new THREE.Vector3();
 			const prevPoint = new THREE.Vector3();
-			prevPoint.copy( curve.getPointAt( 0 ) ); // shapes
+			prevPoint.copy( curve.getPointAt( 0 ) );
+
+			// shapes
 
 			const step = [ new THREE.Vector3( - 0.225, 0, 0 ), new THREE.Vector3( 0, - 0.050, 0 ), new THREE.Vector3( 0, - 0.175, 0 ), new THREE.Vector3( 0, - 0.050, 0 ), new THREE.Vector3( 0.225, 0, 0 ), new THREE.Vector3( 0, - 0.175, 0 ) ];
 			const PI2 = Math.PI * 2;
 			let sides = 5;
 			const tube1 = [];
-
 			for ( let i = 0; i < sides; i ++ ) {
 
 				const angle = i / sides * PI2;
@@ -34,7 +35,6 @@
 
 			sides = 6;
 			const tube2 = [];
-
 			for ( let i = 0; i < sides; i ++ ) {
 
 				const angle = i / sides * PI2;
@@ -44,11 +44,9 @@
 
 			const vector = new THREE.Vector3();
 			const normal = new THREE.Vector3();
-
 			function drawShape( shape, color ) {
 
 				normal.set( 0, 0, - 1 ).applyQuaternion( quaternion );
-
 				for ( let j = 0; j < shape.length; j ++ ) {
 
 					vector.copy( shape[ j ] );
@@ -61,7 +59,6 @@
 				}
 
 				normal.set( 0, 0, 1 ).applyQuaternion( quaternion );
-
 				for ( let j = shape.length - 1; j >= 0; j -- ) {
 
 					vector.copy( shape[ j ] );
@@ -83,7 +80,6 @@
 			const normal2 = new THREE.Vector3();
 			const normal3 = new THREE.Vector3();
 			const normal4 = new THREE.Vector3();
-
 			function extrudeShape( shape, offset, color ) {
 
 				for ( let j = 0, jl = shape.length; j < jl; j ++ ) {
@@ -107,7 +103,9 @@
 					vertices.push( vector4.x, vector4.y, vector4.z );
 					vertices.push( vector2.x, vector2.y, vector2.z );
 					vertices.push( vector3.x, vector3.y, vector3.z );
-					vertices.push( vector4.x, vector4.y, vector4.z ); //
+					vertices.push( vector4.x, vector4.y, vector4.z );
+
+					//
 
 					normal1.copy( point1 );
 					normal1.applyQuaternion( quaternion );
@@ -139,7 +137,6 @@
 			}
 
 			const offset = new THREE.Vector3();
-
 			for ( let i = 1; i <= divisions; i ++ ) {
 
 				point.copy( curve.getPointAt( i / divisions ) );
@@ -149,7 +146,6 @@
 				up.crossVectors( forward, right );
 				const angle = Math.atan2( forward.x, forward.z );
 				quaternion.setFromAxisAngle( up, angle );
-
 				if ( i % 2 === 0 ) {
 
 					drawShape( step, color2 );
@@ -162,8 +158,9 @@
 				prevPoint.copy( point );
 				prevQuaternion.copy( quaternion );
 
-			} // console.log( vertices.length );
+			}
 
+			// console.log( vertices.length );
 
 			this.setAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
 			this.setAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( normals ), 3 ) );
@@ -172,7 +169,6 @@
 		}
 
 	}
-
 	class RollerCoasterLiftersGeometry extends THREE.BufferGeometry {
 
 		constructor( curve, divisions ) {
@@ -183,7 +179,9 @@
 			const quaternion = new THREE.Quaternion();
 			const up = new THREE.Vector3( 0, 1, 0 );
 			const point = new THREE.Vector3();
-			const tangent = new THREE.Vector3(); // shapes
+			const tangent = new THREE.Vector3();
+
+			// shapes
 
 			const tube1 = [ new THREE.Vector3( 0, 0.05, - 0.05 ), new THREE.Vector3( 0, 0.05, 0.05 ), new THREE.Vector3( 0, - 0.05, 0 ) ];
 			const tube2 = [ new THREE.Vector3( - 0.05, 0, 0.05 ), new THREE.Vector3( - 0.05, 0, - 0.05 ), new THREE.Vector3( 0.05, 0, 0 ) ];
@@ -196,7 +194,6 @@
 			const normal2 = new THREE.Vector3();
 			const normal3 = new THREE.Vector3();
 			const normal4 = new THREE.Vector3();
-
 			function extrudeShape( shape, fromPoint, toPoint ) {
 
 				for ( let j = 0, jl = shape.length; j < jl; j ++ ) {
@@ -220,7 +217,9 @@
 					vertices.push( vector4.x, vector4.y, vector4.z );
 					vertices.push( vector2.x, vector2.y, vector2.z );
 					vertices.push( vector3.x, vector3.y, vector3.z );
-					vertices.push( vector4.x, vector4.y, vector4.z ); //
+					vertices.push( vector4.x, vector4.y, vector4.z );
+
+					//
 
 					normal1.copy( point1 );
 					normal1.applyQuaternion( quaternion );
@@ -247,13 +246,14 @@
 
 			const fromPoint = new THREE.Vector3();
 			const toPoint = new THREE.Vector3();
-
 			for ( let i = 1; i <= divisions; i ++ ) {
 
 				point.copy( curve.getPointAt( i / divisions ) );
 				tangent.copy( curve.getTangentAt( i / divisions ) );
 				const angle = Math.atan2( tangent.x, tangent.z );
-				quaternion.setFromAxisAngle( up, angle ); //
+				quaternion.setFromAxisAngle( up, angle );
+
+				//
 
 				if ( point.y > 10 ) {
 
@@ -299,7 +299,6 @@
 		}
 
 	}
-
 	class RollerCoasterShadowGeometry extends THREE.BufferGeometry {
 
 		constructor( curve, divisions ) {
@@ -319,7 +318,6 @@
 			const vector2 = new THREE.Vector3();
 			const vector3 = new THREE.Vector3();
 			const vector4 = new THREE.Vector3();
-
 			for ( let i = 1; i <= divisions; i ++ ) {
 
 				point.copy( curve.getPointAt( i / divisions ) );
@@ -355,14 +353,12 @@
 		}
 
 	}
-
 	class SkyGeometry extends THREE.BufferGeometry {
 
 		constructor() {
 
 			super();
 			const vertices = [];
-
 			for ( let i = 0; i < 100; i ++ ) {
 
 				const x = Math.random() * 800 - 400;
@@ -383,7 +379,6 @@
 		}
 
 	}
-
 	class TreesGeometry extends THREE.BufferGeometry {
 
 		constructor( landscape ) {
@@ -393,7 +388,6 @@
 			const colors = [];
 			const raycaster = new THREE.Raycaster();
 			raycaster.ray.direction.set( 0, - 1, 0 );
-
 			for ( let i = 0; i < 2000; i ++ ) {
 
 				const x = Math.random() * 500 - 250;
@@ -412,7 +406,6 @@
 				vertices.push( x, y + height, z );
 				vertices.push( x + Math.sin( angle + Math.PI ), y, z + Math.cos( angle + Math.PI ) );
 				const random = Math.random() * 0.1;
-
 				for ( let j = 0; j < 6; j ++ ) {
 
 					colors.push( 0.2 + random, 0.4 + random, 0 );

package/examples/js/misc/TubePainter.js

@@ -18,7 +18,9 @@
 			vertexColors: true
 		} );
 		const mesh = new THREE.Mesh( geometry, material );
-		mesh.frustumCulled = false; //
+		mesh.frustumCulled = false;
+
+		//
 
 		function getPoints( size ) {
 
@@ -26,7 +28,6 @@
 			const sides = 10;
 			const array = [];
 			const radius = 0.01 * size;
-
 			for ( let i = 0; i < sides; i ++ ) {
 
 				const angle = i / sides * PI2;
@@ -36,8 +37,9 @@
 
 			return array;
 
-		} //
+		}
 
+		//
 
 		const vector1 = new THREE.Vector3();
 		const vector2 = new THREE.Vector3();
@@ -45,17 +47,17 @@
 		const vector4 = new THREE.Vector3();
 		const color = new THREE.Color( 0xffffff );
 		let size = 1;
-
 		function stroke( position1, position2, matrix1, matrix2 ) {
 
 			if ( position1.distanceToSquared( position2 ) === 0 ) return;
 			let count = geometry.drawRange.count;
 			const points = getPoints( size );
-
 			for ( let i = 0, il = points.length; i < il; i ++ ) {
 
 				const vertex1 = points[ i ];
-				const vertex2 = points[ ( i + 1 ) % il ]; // positions
+				const vertex2 = points[ ( i + 1 ) % il ];
+
+				// positions
 
 				vector1.copy( vertex1 ).applyMatrix4( matrix2 ).add( position2 );
 				vector2.copy( vertex2 ).applyMatrix4( matrix2 ).add( position2 );
@@ -66,7 +68,9 @@
 				vector4.toArray( positions.array, ( count + 2 ) * 3 );
 				vector2.toArray( positions.array, ( count + 3 ) * 3 );
 				vector3.toArray( positions.array, ( count + 4 ) * 3 );
-				vector4.toArray( positions.array, ( count + 5 ) * 3 ); // normals
+				vector4.toArray( positions.array, ( count + 5 ) * 3 );
+
+				// normals
 
 				vector1.copy( vertex1 ).applyMatrix4( matrix2 ).normalize();
 				vector2.copy( vertex2 ).applyMatrix4( matrix2 ).normalize();
@@ -77,7 +81,9 @@
 				vector4.toArray( normals.array, ( count + 2 ) * 3 );
 				vector2.toArray( normals.array, ( count + 3 ) * 3 );
 				vector3.toArray( normals.array, ( count + 4 ) * 3 );
-				vector4.toArray( normals.array, ( count + 5 ) * 3 ); // colors
+				vector4.toArray( normals.array, ( count + 5 ) * 3 );
+
+				// colors
 
 				color.toArray( colors.array, ( count + 0 ) * 3 );
 				color.toArray( colors.array, ( count + 1 ) * 3 );
@@ -91,15 +97,15 @@
 
 			geometry.drawRange.count = count;
 
-		} //
+		}
 
+		//
 
 		const up = new THREE.Vector3( 0, 1, 0 );
 		const point1 = new THREE.Vector3();
 		const point2 = new THREE.Vector3();
 		const matrix1 = new THREE.Matrix4();
 		const matrix2 = new THREE.Matrix4();
-
 		function moveTo( position ) {
 
 			point1.copy( position );
@@ -123,11 +129,11 @@
 
 			size = value;
 
-		} //
+		}
 
+		//
 
 		let count = 0;
-
 		function update() {
 
 			const start = count;