@lampdotdev/lamp 0.0.0-stage → 0.36.2-nightly.16

package/Resources/WebLibraries/three/addons/utils/SceneUtils.js

@@ -0,0 +1,363 @@
+import {
+	BufferAttribute,
+	BufferGeometry,
+	Color,
+	Group,
+	Matrix4,
+	Mesh,
+	Vector3
+} from 'three';
+
+import { mergeGroups, deepCloneAttribute } from './BufferGeometryUtils.js';
+
+/**
+ * @module SceneUtils
+ * @three_import import * as SceneUtils from 'three/addons/utils/SceneUtils.js';
+ */
+
+const _color = /*@__PURE__*/new Color();
+const _matrix = /*@__PURE__*/new Matrix4();
+
+/**
+ * This function creates a mesh for each instance of the given instanced mesh and
+ * adds it to a group. Each mesh will honor the current 3D transformation of its
+ * corresponding instance.
+ *
+ * @param {InstancedMesh} instancedMesh - The instanced mesh.
+ * @return {Group} A group of meshes.
+ */
+function createMeshesFromInstancedMesh( instancedMesh ) {
+
+	const group = new Group();
+
+	const count = instancedMesh.count;
+	const geometry = instancedMesh.geometry;
+	const material = instancedMesh.material;
+
+	for ( let i = 0; i < count; i ++ ) {
+
+		const mesh = new Mesh( geometry, material );
+
+		instancedMesh.getMatrixAt( i, mesh.matrix );
+		mesh.matrix.decompose( mesh.position, mesh.quaternion, mesh.scale );
+
+		group.add( mesh );
+
+	}
+
+	group.copy( instancedMesh );
+	group.updateMatrixWorld(); // ensure correct world matrices of meshes
+
+	return group;
+
+}
+
+/**
+ * This function creates a mesh for each geometry-group of the given multi-material mesh and
+ * adds it to a group.
+ *
+ * @param {Mesh} mesh - The multi-material mesh.
+ * @return {Group} A group of meshes.
+ */
+function createMeshesFromMultiMaterialMesh( mesh ) {
+
+	if ( Array.isArray( mesh.material ) === false ) {
+
+		console.warn( 'THREE.SceneUtils.createMeshesFromMultiMaterialMesh(): The given mesh has no multiple materials.' );
+		return mesh;
+
+	}
+
+	const object = new Group();
+	object.copy( mesh );
+
+	// merge groups (which automatically sorts them)
+
+	const geometry = mergeGroups( mesh.geometry );
+
+	const index = geometry.index;
+	const groups = geometry.groups;
+	const attributeNames = Object.keys( geometry.attributes );
+
+	// create a mesh for each group by extracting the buffer data into a new geometry
+
+	for ( let i = 0; i < groups.length; i ++ ) {
+
+		const group = groups[ i ];
+
+		const start = group.start;
+		const end = start + group.count;
+
+		const newGeometry = new BufferGeometry();
+		const newMaterial = mesh.material[ group.materialIndex ];
+
+		// process all buffer attributes
+
+		for ( let j = 0; j < attributeNames.length; j ++ ) {
+
+			const name = attributeNames[ j ];
+			const attribute = geometry.attributes[ name ];
+			const itemSize = attribute.itemSize;
+
+			const newLength = group.count * itemSize;
+			const type = attribute.array.constructor;
+
+			const newArray = new type( newLength );
+			const newAttribute = new BufferAttribute( newArray, itemSize, attribute.normalized );
+
+			for ( let k = start, n = 0; k < end; k ++, n ++ ) {
+
+				const ind = index.getX( k );
+
+				if ( itemSize >= 1 ) newAttribute.setX( n, attribute.getX( ind ) );
+				if ( itemSize >= 2 ) newAttribute.setY( n, attribute.getY( ind ) );
+				if ( itemSize >= 3 ) newAttribute.setZ( n, attribute.getZ( ind ) );
+				if ( itemSize >= 4 ) newAttribute.setW( n, attribute.getW( ind ) );
+
+			}
+
+
+			newGeometry.setAttribute( name, newAttribute );
+
+		}
+
+		const newMesh = new Mesh( newGeometry, newMaterial );
+		object.add( newMesh );
+
+	}
+
+	return object;
+
+}
+
+/**
+ * This function represents an alternative way to create 3D objects with multiple materials.
+ * Normally, {@link BufferGeometry#groups} are used which might introduce issues e.g. when
+ * exporting the object to a 3D format. This function accepts a geometry and an array of
+ * materials and creates for each material a mesh that is added to a group.
+ *
+ * @param {BufferGeometry} geometry - The geometry.
+ * @param {Array<Material>} materials - An array of materials.
+ * @return {Group} A group representing a multi-material object.
+ */
+function createMultiMaterialObject( geometry, materials ) {
+
+	const group = new Group();
+
+	for ( let i = 0, l = materials.length; i < l; i ++ ) {
+
+		group.add( new Mesh( geometry, materials[ i ] ) );
+
+	}
+
+	return group;
+
+}
+
+
+/**
+ * Executes a reducer function for each vertex of the given 3D object.
+ * `reduceVertices()` returns a single value: the function's accumulated result.
+ *
+ * @param {Object3D} object - The 3D object that should be processed. It must have a
+ * geometry with a `position` attribute.
+ * @param {function(number,Vector3):number} func - The reducer function. First argument
+ * is the current value, second argument the current vertex.
+ * @param {any} initialValue - The initial value.
+ * @return {any} The result.
+ */
+function reduceVertices( object, func, initialValue ) {
+
+	let value = initialValue;
+	const vertex = new Vector3();
+
+	object.updateWorldMatrix( true, true );
+
+	object.traverseVisible( ( child ) => {
+
+		const { geometry } = child;
+
+		if ( geometry !== undefined ) {
+
+			const { position } = geometry.attributes;
+
+			if ( position !== undefined ) {
+
+				for ( let i = 0, l = position.count; i < l; i ++ ) {
+
+					if ( child.isMesh ) {
+
+						child.getVertexPosition( i, vertex );
+
+					} else {
+
+						vertex.fromBufferAttribute( position, i );
+
+					}
+
+					if ( ! child.isSkinnedMesh ) {
+
+						vertex.applyMatrix4( child.matrixWorld );
+
+					}
+
+					value = func( value, vertex );
+
+				}
+
+			}
+
+		}
+
+	} );
+
+	return value;
+
+}
+
+/**
+ * Sorts the instances of the given instanced mesh.
+ *
+ * @param {InstancedMesh} mesh - The instanced mesh to sort.
+ * @param {function(number, number):number} compareFn - A custom compare function for the sort.
+ */
+function sortInstancedMesh( mesh, compareFn ) {
+
+	// store copy of instanced attributes for lookups
+
+	const instanceMatrixRef = deepCloneAttribute( mesh.instanceMatrix );
+	const instanceColorRef = mesh.instanceColor ? deepCloneAttribute( mesh.instanceColor ) : null;
+
+	const attributeRefs = new Map();
+
+	for ( const name in mesh.geometry.attributes ) {
+
+		const attribute = mesh.geometry.attributes[ name ];
+
+		if ( attribute.isInstancedBufferAttribute ) {
+
+			attributeRefs.set( attribute, deepCloneAttribute( attribute ) );
+
+		}
+
+	}
+
+
+	// compute sort order
+
+	const tokens = [];
+
+	for ( let i = 0; i < mesh.count; i ++ ) tokens.push( i );
+
+	tokens.sort( compareFn );
+
+
+	// apply sort order
+
+	for ( let i = 0; i < tokens.length; i ++ ) {
+
+		const refIndex = tokens[ i ];
+
+		_matrix.fromArray( instanceMatrixRef.array, refIndex * mesh.instanceMatrix.itemSize );
+		_matrix.toArray( mesh.instanceMatrix.array, i * mesh.instanceMatrix.itemSize );
+
+		if ( mesh.instanceColor ) {
+
+			_color.fromArray( instanceColorRef.array, refIndex * mesh.instanceColor.itemSize );
+			_color.toArray( mesh.instanceColor.array, i * mesh.instanceColor.itemSize );
+
+		}
+
+		for ( const name in mesh.geometry.attributes ) {
+
+			const attribute = mesh.geometry.attributes[ name ];
+
+			if ( attribute.isInstancedBufferAttribute ) {
+
+				const attributeRef = attributeRefs.get( attribute );
+
+				attribute.setX( i, attributeRef.getX( refIndex ) );
+				if ( attribute.itemSize > 1 ) attribute.setY( i, attributeRef.getY( refIndex ) );
+				if ( attribute.itemSize > 2 ) attribute.setZ( i, attributeRef.getZ( refIndex ) );
+				if ( attribute.itemSize > 3 ) attribute.setW( i, attributeRef.getW( refIndex ) );
+
+			}
+
+		}
+
+	}
+
+}
+
+/**
+ * Generator based alternative to {@link Object3D#traverse}.
+ *
+ * @param {Object3D} object - Object to traverse.
+ * @yields {Object3D} Objects that passed the filter condition.
+ */
+function* traverseGenerator( object ) {
+
+	yield object;
+
+	const children = object.children;
+
+	for ( let i = 0, l = children.length; i < l; i ++ ) {
+
+		yield* traverseGenerator( children[ i ] );
+
+	}
+
+}
+
+/**
+ * Generator based alternative to {@link Object3D#traverseVisible}.
+ *
+ * @param {Object3D} object Object to traverse.
+ * @yields {Object3D} Objects that passed the filter condition.
+ */
+function* traverseVisibleGenerator( object ) {
+
+	if ( object.visible === false ) return;
+
+	yield object;
+
+	const children = object.children;
+
+	for ( let i = 0, l = children.length; i < l; i ++ ) {
+
+		yield* traverseVisibleGenerator( children[ i ] );
+
+	}
+
+}
+
+/**
+ * Generator based alternative to {@link Object3D#traverseAncestors}.
+ *
+ * @param {Object3D} object Object to traverse.
+ * @yields {Object3D} Objects that passed the filter condition.
+ */
+function* traverseAncestorsGenerator( object ) {
+
+	const parent = object.parent;
+
+	if ( parent !== null ) {
+
+		yield parent;
+
+		yield* traverseAncestorsGenerator( parent );
+
+	}
+
+}
+
+export {
+	createMeshesFromInstancedMesh,
+	createMeshesFromMultiMaterialMesh,
+	createMultiMaterialObject,
+	reduceVertices,
+	sortInstancedMesh,
+	traverseGenerator,
+	traverseVisibleGenerator,
+	traverseAncestorsGenerator
+};

package/Resources/WebLibraries/three/addons/utils/ShadowMapViewer.js

@@ -0,0 +1,244 @@
+import {
+	DoubleSide,
+	CanvasTexture,
+	Mesh,
+	MeshBasicMaterial,
+	OrthographicCamera,
+	PlaneGeometry,
+	Scene,
+	ShaderMaterial
+} from 'three';
+
+/**
+ * This is a helper for visualising a given light's shadow map.
+ * It works for shadow casting lights: DirectionalLight and SpotLight.
+ * It renders out the shadow map and displays it on a HUD.
+ *
+ * This module can only be used with {@link WebGLRenderer}. When using {@link WebGPURenderer},
+ * import the class from `ShadowMapViewerGPU.js`.
+ *
+ * ```js
+ * const lightShadowMapViewer = new ShadowMapViewer( light );
+ * lightShadowMapViewer.position.x = 10;
+ * lightShadowMapViewer.position.y = SCREEN_HEIGHT - ( SHADOW_MAP_HEIGHT / 4 ) - 10;
+ * lightShadowMapViewer.size.width = SHADOW_MAP_WIDTH / 4;
+ * lightShadowMapViewer.size.height = SHADOW_MAP_HEIGHT / 4;
+ * lightShadowMapViewer.update();
+ * ```
+ *
+ * @three_import import { ShadowMapViewer } from 'three/addons/utils/ShadowMapViewer.js';
+ */
+class ShadowMapViewer {
+
+	/**
+	 * Constructs a new shadow map viewer.
+	 *
+	 * @param {Light} light - The shadow casting light.
+	 */
+	constructor( light ) {
+
+		//- Internals
+		const scope = this;
+		const doRenderLabel = ( light.name !== undefined && light.name !== '' );
+		let userAutoClearSetting;
+
+		//Holds the initial position and dimension of the HUD
+		const frame = {
+			x: 10,
+			y: 10,
+			width: 256,
+			height: 256
+		};
+
+		const camera = new OrthographicCamera( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, 1, 10 );
+		camera.position.set( 0, 0, 2 );
+		const scene = new Scene();
+
+		//HUD for shadow map
+		const material = new ShaderMaterial( {
+			uniforms: {
+				tDiffuse: { value: null },
+				opacity: { value: 1.0 }
+			},
+			vertexShader: /* glsl */`
+				varying vec2 vUv;
+				void main() {
+					vUv = uv;
+					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+				}`,
+			fragmentShader: /* glsl */`
+				uniform float opacity;
+				uniform sampler2D tDiffuse;
+				varying vec2 vUv;
+				void main() {
+					float depth = texture2D( tDiffuse, vUv ).r;
+					#ifdef USE_REVERSED_DEPTH_BUFFER
+						gl_FragColor = vec4( vec3( depth ), opacity );
+					#else
+						gl_FragColor = vec4( vec3( 1.0 - depth ), opacity );
+					#endif
+				}`
+		} );
+		const plane = new PlaneGeometry( frame.width, frame.height );
+		const mesh = new Mesh( plane, material );
+
+		scene.add( mesh );
+
+
+		//Label for light's name
+		let labelCanvas, labelMesh;
+
+		if ( doRenderLabel ) {
+
+			labelCanvas = document.createElement( 'canvas' );
+
+			const context = labelCanvas.getContext( '2d' );
+			context.font = 'Bold 20px Arial';
+
+			const labelWidth = context.measureText( light.name ).width;
+			labelCanvas.width = labelWidth;
+			labelCanvas.height = 25;	//25 to account for g, p, etc.
+
+			context.font = 'Bold 20px Arial';
+			context.fillStyle = 'rgba( 255, 0, 0, 1 )';
+			context.fillText( light.name, 0, 20 );
+
+			const labelTexture = new CanvasTexture( labelCanvas );
+
+			const labelMaterial = new MeshBasicMaterial( { map: labelTexture, side: DoubleSide, transparent: true } );
+
+			const labelPlane = new PlaneGeometry( labelCanvas.width, labelCanvas.height );
+			labelMesh = new Mesh( labelPlane, labelMaterial );
+
+			scene.add( labelMesh );
+
+		}
+
+
+		function resetPosition() {
+
+			scope.position.set( scope.position.x, scope.position.y );
+
+		}
+
+		/**
+		 * Whether to display the shadow map viewer or not.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
+		this.enabled = true;
+
+		/**
+		 * The size of the viewer. When changing this property, make sure
+		 * to call {@link ShadowMapViewer#update}.
+		 *
+		 * @type {{width:number,height:number}}
+		 * @default true
+		 */
+		this.size = {
+			width: frame.width,
+			height: frame.height,
+			set: function ( width, height ) {
+
+				this.width = width;
+				this.height = height;
+
+				mesh.scale.set( this.width / frame.width, this.height / frame.height, 1 );
+
+				//Reset the position as it is off when we scale stuff
+				resetPosition();
+
+			}
+		};
+
+		/**
+		 * The position of the viewer. When changing this property, make sure
+		 * to call {@link ShadowMapViewer#update}.
+		 *
+		 * @type {{x:number,y:number, set:function(number,number)}}
+		 * @default true
+		 */
+		this.position = {
+			x: frame.x,
+			y: frame.y,
+			set: function ( x, y ) {
+
+				this.x = x;
+				this.y = y;
+
+				const width = scope.size.width;
+				const height = scope.size.height;
+
+				mesh.position.set( - window.innerWidth / 2 + width / 2 + this.x, window.innerHeight / 2 - height / 2 - this.y, 0 );
+
+				if ( doRenderLabel ) labelMesh.position.set( mesh.position.x, mesh.position.y - scope.size.height / 2 + labelCanvas.height / 2, 0 );
+
+			}
+		};
+
+		/**
+		 * Renders the viewer. This method must be called in the app's animation loop.
+		 *
+		 * @param {WebGLRenderer} renderer - The renderer.
+		 */
+		this.render = function ( renderer ) {
+
+			if ( this.enabled ) {
+
+				//Because a light's .shadowMap is only initialised after the first render pass
+				//we have to make sure the correct map is sent into the shader, otherwise we
+				//always end up with the scene's first added shadow casting light's shadowMap
+				//in the shader
+				//See: https://github.com/mrdoob/three.js/issues/5932
+				material.uniforms.tDiffuse.value = light.shadow.map.texture;
+
+				userAutoClearSetting = renderer.autoClear;
+				renderer.autoClear = false; // To allow render overlay
+				renderer.clearDepth();
+				renderer.render( scene, camera );
+				renderer.autoClear = userAutoClearSetting;	//Restore user's setting
+
+			}
+
+		};
+
+		/**
+		 * Resizes the viewer. This method should be called whenever the app's
+		 * window is resized.
+		 */
+		this.updateForWindowResize = function () {
+
+			if ( this.enabled ) {
+
+				 camera.left = window.innerWidth / - 2;
+				 camera.right = window.innerWidth / 2;
+				 camera.top = window.innerHeight / 2;
+				 camera.bottom = window.innerHeight / - 2;
+				 camera.updateProjectionMatrix();
+
+				 this.update();
+
+			}
+
+		};
+
+		/**
+		 * Updates the viewer.
+		 */
+		this.update = function () {
+
+			this.position.set( this.position.x, this.position.y );
+			this.size.set( this.size.width, this.size.height );
+
+		};
+
+		//Force an update to set position/size
+		this.update();
+
+	}
+
+}
+
+
+export { ShadowMapViewer };