@needle-tools/three 0.145.0

package/examples/js/objects/Lensflare.js

@@ -0,0 +1,347 @@
+( function () {
+
+	class Lensflare extends THREE.Mesh {
+
+		constructor() {
+
+			super( Lensflare.Geometry, new THREE.MeshBasicMaterial( {
+				opacity: 0,
+				transparent: true
+			} ) );
+			this.isLensflare = true;
+			this.type = 'Lensflare';
+			this.frustumCulled = false;
+			this.renderOrder = Infinity; //
+
+			const positionScreen = new THREE.Vector3();
+			const positionView = new THREE.Vector3(); // textures
+
+			const tempMap = new THREE.FramebufferTexture( 16, 16, THREE.RGBAFormat );
+			const occlusionMap = new THREE.FramebufferTexture( 16, 16, THREE.RGBAFormat ); // material
+
+			const geometry = Lensflare.Geometry;
+			const material1a = new THREE.RawShaderMaterial( {
+				uniforms: {
+					'scale': {
+						value: null
+					},
+					'screenPosition': {
+						value: null
+					}
+				},
+				vertexShader:
+      /* glsl */
+      `
+
+				precision highp float;
+
+				uniform vec3 screenPosition;
+				uniform vec2 scale;
+
+				attribute vec3 position;
+
+				void main() {
+
+					gl_Position = vec4( position.xy * scale + screenPosition.xy, screenPosition.z, 1.0 );
+
+				}`,
+				fragmentShader:
+      /* glsl */
+      `
+
+				precision highp float;
+
+				void main() {
+
+					gl_FragColor = vec4( 1.0, 0.0, 1.0, 1.0 );
+
+				}`,
+				depthTest: true,
+				depthWrite: false,
+				transparent: false
+			} );
+			const material1b = new THREE.RawShaderMaterial( {
+				uniforms: {
+					'map': {
+						value: tempMap
+					},
+					'scale': {
+						value: null
+					},
+					'screenPosition': {
+						value: null
+					}
+				},
+				vertexShader:
+      /* glsl */
+      `
+
+				precision highp float;
+
+				uniform vec3 screenPosition;
+				uniform vec2 scale;
+
+				attribute vec3 position;
+				attribute vec2 uv;
+
+				varying vec2 vUV;
+
+				void main() {
+
+					vUV = uv;
+
+					gl_Position = vec4( position.xy * scale + screenPosition.xy, screenPosition.z, 1.0 );
+
+				}`,
+				fragmentShader:
+      /* glsl */
+      `
+
+				precision highp float;
+
+				uniform sampler2D map;
+
+				varying vec2 vUV;
+
+				void main() {
+
+					gl_FragColor = texture2D( map, vUV );
+
+				}`,
+				depthTest: false,
+				depthWrite: false,
+				transparent: false
+			} ); // the following object is used for occlusionMap generation
+
+			const mesh1 = new THREE.Mesh( geometry, material1a ); //
+
+			const elements = [];
+			const shader = LensflareElement.Shader;
+			const material2 = new THREE.RawShaderMaterial( {
+				uniforms: {
+					'map': {
+						value: null
+					},
+					'occlusionMap': {
+						value: occlusionMap
+					},
+					'color': {
+						value: new THREE.Color( 0xffffff )
+					},
+					'scale': {
+						value: new THREE.Vector2()
+					},
+					'screenPosition': {
+						value: new THREE.Vector3()
+					}
+				},
+				vertexShader: shader.vertexShader,
+				fragmentShader: shader.fragmentShader,
+				blending: THREE.AdditiveBlending,
+				transparent: true,
+				depthWrite: false
+			} );
+			const mesh2 = new THREE.Mesh( geometry, material2 );
+
+			this.addElement = function ( element ) {
+
+				elements.push( element );
+
+			}; //
+
+
+			const scale = new THREE.Vector2();
+			const screenPositionPixels = new THREE.Vector2();
+			const validArea = new THREE.Box2();
+			const viewport = new THREE.Vector4();
+
+			this.onBeforeRender = function ( renderer, scene, camera ) {
+
+				renderer.getCurrentViewport( viewport );
+				const invAspect = viewport.w / viewport.z;
+				const halfViewportWidth = viewport.z / 2.0;
+				const halfViewportHeight = viewport.w / 2.0;
+				let size = 16 / viewport.w;
+				scale.set( size * invAspect, size );
+				validArea.min.set( viewport.x, viewport.y );
+				validArea.max.set( viewport.x + ( viewport.z - 16 ), viewport.y + ( viewport.w - 16 ) ); // calculate position in screen space
+
+				positionView.setFromMatrixPosition( this.matrixWorld );
+				positionView.applyMatrix4( camera.matrixWorldInverse );
+				if ( positionView.z > 0 ) return; // lensflare is behind the camera
+
+				positionScreen.copy( positionView ).applyMatrix4( camera.projectionMatrix ); // horizontal and vertical coordinate of the lower left corner of the pixels to copy
+
+				screenPositionPixels.x = viewport.x + positionScreen.x * halfViewportWidth + halfViewportWidth - 8;
+				screenPositionPixels.y = viewport.y + positionScreen.y * halfViewportHeight + halfViewportHeight - 8; // screen cull
+
+				if ( validArea.containsPoint( screenPositionPixels ) ) {
+
+					// save current RGB to temp texture
+					renderer.copyFramebufferToTexture( screenPositionPixels, tempMap ); // render pink quad
+
+					let uniforms = material1a.uniforms;
+					uniforms[ 'scale' ].value = scale;
+					uniforms[ 'screenPosition' ].value = positionScreen;
+					renderer.renderBufferDirect( camera, null, geometry, material1a, mesh1, null ); // copy result to occlusionMap
+
+					renderer.copyFramebufferToTexture( screenPositionPixels, occlusionMap ); // restore graphics
+
+					uniforms = material1b.uniforms;
+					uniforms[ 'scale' ].value = scale;
+					uniforms[ 'screenPosition' ].value = positionScreen;
+					renderer.renderBufferDirect( camera, null, geometry, material1b, mesh1, null ); // render elements
+
+					const vecX = - positionScreen.x * 2;
+					const vecY = - positionScreen.y * 2;
+
+					for ( let i = 0, l = elements.length; i < l; i ++ ) {
+
+						const element = elements[ i ];
+						const uniforms = material2.uniforms;
+						uniforms[ 'color' ].value.copy( element.color );
+						uniforms[ 'map' ].value = element.texture;
+						uniforms[ 'screenPosition' ].value.x = positionScreen.x + vecX * element.distance;
+						uniforms[ 'screenPosition' ].value.y = positionScreen.y + vecY * element.distance;
+						size = element.size / viewport.w;
+						const invAspect = viewport.w / viewport.z;
+						uniforms[ 'scale' ].value.set( size * invAspect, size );
+						material2.uniformsNeedUpdate = true;
+						renderer.renderBufferDirect( camera, null, geometry, material2, mesh2, null );
+
+					}
+
+				}
+
+			};
+
+			this.dispose = function () {
+
+				material1a.dispose();
+				material1b.dispose();
+				material2.dispose();
+				tempMap.dispose();
+				occlusionMap.dispose();
+
+				for ( let i = 0, l = elements.length; i < l; i ++ ) {
+
+					elements[ i ].texture.dispose();
+
+				}
+
+			};
+
+		}
+
+	} //
+
+
+	class LensflareElement {
+
+		constructor( texture, size = 1, distance = 0, color = new THREE.Color( 0xffffff ) ) {
+
+			this.texture = texture;
+			this.size = size;
+			this.distance = distance;
+			this.color = color;
+
+		}
+
+	}
+
+	LensflareElement.Shader = {
+		uniforms: {
+			'map': {
+				value: null
+			},
+			'occlusionMap': {
+				value: null
+			},
+			'color': {
+				value: null
+			},
+			'scale': {
+				value: null
+			},
+			'screenPosition': {
+				value: null
+			}
+		},
+		vertexShader:
+  /* glsl */
+  `
+
+		precision highp float;
+
+		uniform vec3 screenPosition;
+		uniform vec2 scale;
+
+		uniform sampler2D occlusionMap;
+
+		attribute vec3 position;
+		attribute vec2 uv;
+
+		varying vec2 vUV;
+		varying float vVisibility;
+
+		void main() {
+
+			vUV = uv;
+
+			vec2 pos = position.xy;
+
+			vec4 visibility = texture2D( occlusionMap, vec2( 0.1, 0.1 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.5, 0.1 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.9, 0.1 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.9, 0.5 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.9, 0.9 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.5, 0.9 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.1, 0.9 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.1, 0.5 ) );
+			visibility += texture2D( occlusionMap, vec2( 0.5, 0.5 ) );
+
+			vVisibility =        visibility.r / 9.0;
+			vVisibility *= 1.0 - visibility.g / 9.0;
+			vVisibility *=       visibility.b / 9.0;
+
+			gl_Position = vec4( ( pos * scale + screenPosition.xy ).xy, screenPosition.z, 1.0 );
+
+		}`,
+		fragmentShader:
+  /* glsl */
+  `
+
+		precision highp float;
+
+		uniform sampler2D map;
+		uniform vec3 color;
+
+		varying vec2 vUV;
+		varying float vVisibility;
+
+		void main() {
+
+			vec4 texture = texture2D( map, vUV );
+			texture.a *= vVisibility;
+			gl_FragColor = texture;
+			gl_FragColor.rgb *= color;
+
+		}`
+	};
+
+	Lensflare.Geometry = function () {
+
+		const geometry = new THREE.BufferGeometry();
+		const float32Array = new Float32Array( [ - 1, - 1, 0, 0, 0, 1, - 1, 0, 1, 0, 1, 1, 0, 1, 1, - 1, 1, 0, 0, 1 ] );
+		const interleavedBuffer = new THREE.InterleavedBuffer( float32Array, 5 );
+		geometry.setIndex( [ 0, 1, 2, 0, 2, 3 ] );
+		geometry.setAttribute( 'position', new THREE.InterleavedBufferAttribute( interleavedBuffer, 3, 0, false ) );
+		geometry.setAttribute( 'uv', new THREE.InterleavedBufferAttribute( interleavedBuffer, 2, 3, false ) );
+		return geometry;
+
+	}();
+
+	THREE.Lensflare = Lensflare;
+	THREE.LensflareElement = LensflareElement;
+
+} )();

package/examples/js/objects/LightningStorm.js

@@ -0,0 +1,209 @@
+( function () {
+
+	/**
+ * @fileoverview Lightning strike object generator
+ *
+ *
+ * Usage
+ *
+ * const myStorm = new LightningStorm( paramsObject );
+ * myStorm.position.set( ... );
+ * scene.add( myStorm );
+ * ...
+ * myStorm.update( currentTime );
+ *
+ * The "currentTime" can only go forwards or be stopped.
+ *
+ *
+ * LightningStorm parameters:
+ *
+ * @param {double} size Size of the storm. If no 'onRayPosition' parameter is defined, it means the side of the rectangle the storm covers.
+ *
+ * @param {double} minHeight Minimum height a ray can start at. If no 'onRayPosition' parameter is defined, it means the height above plane y = 0.
+ *
+ * @param {double} maxHeight Maximum height a ray can start at. If no 'onRayPosition' parameter is defined, it means the height above plane y = 0.
+ *
+ * @param {double} maxSlope The maximum inclination slope of a ray. If no 'onRayPosition' parameter is defined, it means the slope relative to plane y = 0.
+ *
+ * @param {integer} maxLightnings Greater than 0. The maximum number of simultaneous rays.
+ *
+ * @param {double} lightningMinPeriod minimum time between two consecutive rays.
+ *
+ * @param {double} lightningMaxPeriod maximum time between two consecutive rays.
+ *
+ * @param {double} lightningMinDuration The minimum time a ray can last.
+ *
+ * @param {double} lightningMaxDuration The maximum time a ray can last.
+ *
+ * @param {Object} lightningParameters The parameters for created rays. See THREE.LightningStrike (geometry)
+ *
+ * @param {Material} lightningMaterial The THREE.Material used for the created rays.
+ *
+ * @param {function} onRayPosition Optional callback with two Vector3 parameters (source, dest). You can set here the start and end points for each created ray, using the standard size, minHeight, etc parameters and other values in your algorithm.
+ *
+ * @param {function} onLightningDown This optional callback is called with one parameter (lightningStrike) when a ray ends propagating, so it has hit the ground.
+ *
+ *
+*/
+
+	class LightningStorm extends THREE.Object3D {
+
+		constructor( stormParams = {} ) {
+
+			super();
+			this.isLightningStorm = true; // Parameters
+
+			this.stormParams = stormParams;
+			stormParams.size = stormParams.size !== undefined ? stormParams.size : 1000.0;
+			stormParams.minHeight = stormParams.minHeight !== undefined ? stormParams.minHeight : 80.0;
+			stormParams.maxHeight = stormParams.maxHeight !== undefined ? stormParams.maxHeight : 100.0;
+			stormParams.maxSlope = stormParams.maxSlope !== undefined ? stormParams.maxSlope : 1.1;
+			stormParams.maxLightnings = stormParams.maxLightnings !== undefined ? stormParams.maxLightnings : 3;
+			stormParams.lightningMinPeriod = stormParams.lightningMinPeriod !== undefined ? stormParams.lightningMinPeriod : 3.0;
+			stormParams.lightningMaxPeriod = stormParams.lightningMaxPeriod !== undefined ? stormParams.lightningMaxPeriod : 7.0;
+			stormParams.lightningMinDuration = stormParams.lightningMinDuration !== undefined ? stormParams.lightningMinDuration : 1.0;
+			stormParams.lightningMaxDuration = stormParams.lightningMaxDuration !== undefined ? stormParams.lightningMaxDuration : 2.5;
+			this.lightningParameters = THREE.LightningStrike.copyParameters( stormParams.lightningParameters, stormParams.lightningParameters );
+			this.lightningParameters.isEternal = false;
+			this.lightningMaterial = stormParams.lightningMaterial !== undefined ? stormParams.lightningMaterial : new THREE.MeshBasicMaterial( {
+				color: 0xB0FFFF
+			} );
+
+			if ( stormParams.onRayPosition !== undefined ) {
+
+				this.onRayPosition = stormParams.onRayPosition;
+
+			} else {
+
+				this.onRayPosition = function ( source, dest ) {
+
+					dest.set( ( Math.random() - 0.5 ) * stormParams.size, 0, ( Math.random() - 0.5 ) * stormParams.size );
+					const height = THREE.MathUtils.lerp( stormParams.minHeight, stormParams.maxHeight, Math.random() );
+					source.set( stormParams.maxSlope * ( 2 * Math.random() - 1 ), 1, stormParams.maxSlope * ( 2 * Math.random() - 1 ) ).multiplyScalar( height ).add( dest );
+
+				};
+
+			}
+
+			this.onLightningDown = stormParams.onLightningDown; // Internal state
+
+			this.inited = false;
+			this.nextLightningTime = 0;
+			this.lightningsMeshes = [];
+			this.deadLightningsMeshes = [];
+
+			for ( let i = 0; i < this.stormParams.maxLightnings; i ++ ) {
+
+				const lightning = new THREE.LightningStrike( THREE.LightningStrike.copyParameters( {}, this.lightningParameters ) );
+				const mesh = new THREE.Mesh( lightning, this.lightningMaterial );
+				this.deadLightningsMeshes.push( mesh );
+
+			}
+
+		}
+
+		update( time ) {
+
+			if ( ! this.inited ) {
+
+				this.nextLightningTime = this.getNextLightningTime( time ) * Math.random();
+				this.inited = true;
+
+			}
+
+			if ( time >= this.nextLightningTime ) {
+
+				// Lightning creation
+				const lightningMesh = this.deadLightningsMeshes.pop();
+
+				if ( lightningMesh ) {
+
+					const lightningParams1 = THREE.LightningStrike.copyParameters( lightningMesh.geometry.rayParameters, this.lightningParameters );
+					lightningParams1.birthTime = time;
+					lightningParams1.deathTime = time + THREE.MathUtils.lerp( this.stormParams.lightningMinDuration, this.stormParams.lightningMaxDuration, Math.random() );
+					this.onRayPosition( lightningParams1.sourceOffset, lightningParams1.destOffset );
+					lightningParams1.noiseSeed = Math.random();
+					this.add( lightningMesh );
+					this.lightningsMeshes.push( lightningMesh );
+
+				} // Schedule next lightning
+
+
+				this.nextLightningTime = this.getNextLightningTime( time );
+
+			}
+
+			let i = 0,
+				il = this.lightningsMeshes.length;
+
+			while ( i < il ) {
+
+				const mesh = this.lightningsMeshes[ i ];
+				const lightning = mesh.geometry;
+				const prevState = lightning.state;
+				lightning.update( time );
+
+				if ( prevState === THREE.LightningStrike.RAY_PROPAGATING && lightning.state > prevState ) {
+
+					if ( this.onLightningDown ) {
+
+						this.onLightningDown( lightning );
+
+					}
+
+				}
+
+				if ( lightning.state === THREE.LightningStrike.RAY_EXTINGUISHED ) {
+
+					// Lightning is to be destroyed
+					this.lightningsMeshes.splice( this.lightningsMeshes.indexOf( mesh ), 1 );
+					this.deadLightningsMeshes.push( mesh );
+					this.remove( mesh );
+					il --;
+
+				} else {
+
+					i ++;
+
+				}
+
+			}
+
+		}
+
+		getNextLightningTime( currentTime ) {
+
+			return currentTime + THREE.MathUtils.lerp( this.stormParams.lightningMinPeriod, this.stormParams.lightningMaxPeriod, Math.random() ) / ( this.stormParams.maxLightnings + 1 );
+
+		}
+
+		copy( source, recursive ) {
+
+			super.copy( source, recursive );
+			this.stormParams.size = source.stormParams.size;
+			this.stormParams.minHeight = source.stormParams.minHeight;
+			this.stormParams.maxHeight = source.stormParams.maxHeight;
+			this.stormParams.maxSlope = source.stormParams.maxSlope;
+			this.stormParams.maxLightnings = source.stormParams.maxLightnings;
+			this.stormParams.lightningMinPeriod = source.stormParams.lightningMinPeriod;
+			this.stormParams.lightningMaxPeriod = source.stormParams.lightningMaxPeriod;
+			this.stormParams.lightningMinDuration = source.stormParams.lightningMinDuration;
+			this.stormParams.lightningMaxDuration = source.stormParams.lightningMaxDuration;
+			this.lightningParameters = THREE.LightningStrike.copyParameters( {}, source.lightningParameters );
+			this.lightningMaterial = source.stormParams.lightningMaterial;
+			this.onLightningDown = source.onLightningDown;
+			return this;
+
+		}
+
+		clone() {
+
+			return new this.constructor( this.stormParams ).copy( this );
+
+		}
+
+	}
+
+	THREE.LightningStorm = LightningStorm;
+
+} )();