super-three 0.163.0 → 0.164.0

package/examples/jsm/renderers/webgpu/WebGPUBackend.js

@@ -14,7 +14,6 @@ import WebGPUAttributeUtils from './utils/WebGPUAttributeUtils.js';
 import WebGPUBindingUtils from './utils/WebGPUBindingUtils.js';
 import WebGPUPipelineUtils from './utils/WebGPUPipelineUtils.js';
 import WebGPUTextureUtils from './utils/WebGPUTextureUtils.js';
-import WebGPU from '../../capabilities/WebGPU.js';
 
 //
 
@@ -45,7 +44,6 @@ class WebGPUBackend extends Backend {
 
 		this.trackTimestamp = ( parameters.trackTimestamp === true );
 
-		this.adapter = null;
 		this.device = null;
 		this.context = null;
 		this.colorBuffer = null;
@@ -68,44 +66,55 @@ class WebGPUBackend extends Backend {
 
 		const parameters = this.parameters;
 
-		const adapterOptions = {
-			powerPreference: parameters.powerPreference
-		};
+		// create the device if it is not passed with parameters
+
+		let device;
 
-		const adapter = await navigator.gpu.requestAdapter( adapterOptions );
+		if ( parameters.device === undefined ) {
 
-		if ( adapter === null ) {
+			const adapterOptions = {
+				powerPreference: parameters.powerPreference
+			};
 
-			throw new Error( 'WebGPUBackend: Unable to create WebGPU adapter.' );
+			const adapter = await navigator.gpu.requestAdapter( adapterOptions );
 
-		}
+			if ( adapter === null ) {
+
+				throw new Error( 'WebGPUBackend: Unable to create WebGPU adapter.' );
+
+			}
+
+			// feature support
 
-		// feature support
+			const features = Object.values( GPUFeatureName );
 
-		const features = Object.values( GPUFeatureName );
+			const supportedFeatures = [];
 
-		const supportedFeatures = [];
+			for ( const name of features ) {
 
-		for ( const name of features ) {
+				if ( adapter.features.has( name ) ) {
 
-			if ( adapter.features.has( name ) ) {
+					supportedFeatures.push( name );
 
-				supportedFeatures.push( name );
+				}
 
 			}
 
-		}
+			const deviceDescriptor = {
+				requiredFeatures: supportedFeatures,
+				requiredLimits: parameters.requiredLimits
+			};
 
-		const deviceDescriptor = {
-			requiredFeatures: supportedFeatures,
-			requiredLimits: parameters.requiredLimits
-		};
+			device = await adapter.requestDevice( deviceDescriptor );
 
-		const device = await adapter.requestDevice( deviceDescriptor );
+		} else {
+
+			device = parameters.device;
+
+		}
 
 		const context = ( parameters.context !== undefined ) ? parameters.context : renderer.domElement.getContext( 'webgpu' );
 
-		this.adapter = adapter;
 		this.device = device;
 		this.context = context;
 
@@ -871,7 +880,7 @@ class WebGPUBackend extends Backend {
 
 		// draw
 
-		const drawRange = geometry.drawRange;
+		const drawRange = renderObject.drawRange;
 		const firstVertex = drawRange.start;
 
 		const instanceCount = this.getInstanceCount( renderObject );
@@ -1220,27 +1229,9 @@ class WebGPUBackend extends Backend {
 
 	}
 
-	async hasFeatureAsync( name ) {
-
-		const adapter = this.adapter || await WebGPU.getStaticAdapter();
-
-		//
-
-		return adapter.features.has( name );
-
-	}
-
 	hasFeature( name ) {
 
-		if ( ! this.adapter ) {
-
-			console.warn( 'WebGPUBackend: WebGPU adapter has not been initialized yet. Please use hasFeatureAsync instead' );
-
-			return false;
-
-		}
-
-		return this.adapter.features.has( name );
+		return this.device.features.has( name );
 
 	}
 
@@ -1272,9 +1263,6 @@ class WebGPUBackend extends Backend {
 
 	}
 
-
-
-
 	copyFramebufferToTexture( texture, renderContext ) {
 
 		const renderContextData = this.get( renderContext );

package/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js

@@ -254,6 +254,21 @@ class WGSLNodeBuilder extends NodeBuilder {
 
 	}
 
+	generateTextureGrad( texture, textureProperty, uvSnippet, gradSnippet, depthSnippet, shaderStage = this.shaderStage ) {
+
+		if ( shaderStage === 'fragment' ) {
+
+			// TODO handle i32 or u32 --> uvSnippet, array_index: A, ddx, ddy
+			return `textureSampleGrad( ${ textureProperty }, ${ textureProperty }_sampler, ${ uvSnippet },  ${ gradSnippet[ 0 ] }, ${ gradSnippet[ 1 ] } )`;
+
+		} else {
+
+			console.error( `WebGPURenderer: THREE.TextureNode.gradient() does not support ${ shaderStage } shader.` );
+
+		}
+
+	}
+
 	generateTextureCompare( texture, textureProperty, uvSnippet, compareSnippet, depthSnippet, shaderStage = this.shaderStage ) {
 
 		if ( shaderStage === 'fragment' ) {
@@ -522,7 +537,7 @@ ${ flowData.code }
 
 	getFragCoord() {
 
-		return this.getBuiltin( 'position', 'fragCoord', 'vec4<f32>' ) + '.xy';
+		return this.getBuiltin( 'position', 'fragCoord', 'vec4<f32>' ) + '.xyz';
 
 	}
 

package/examples/jsm/renderers/webgpu/utils/WebGPUAttributeUtils.js

@@ -64,7 +64,6 @@ class WebGPUAttributeUtils {
 
 			if ( ( bufferAttribute.isStorageBufferAttribute || bufferAttribute.isStorageInstancedBufferAttribute ) && bufferAttribute.itemSize === 3 ) {
 
-				bufferAttribute.itemSize = 4;
 				array = new array.constructor( bufferAttribute.count * 4 );
 
 				for ( let i = 0; i < bufferAttribute.count; i ++ ) {
@@ -73,6 +72,10 @@ class WebGPUAttributeUtils {
 
 				}
 
+				// Update BufferAttribute
+				bufferAttribute.itemSize = 4;
+				bufferAttribute.array = array;
+
 			}
 
 			const size = array.byteLength + ( ( 4 - ( array.byteLength % 4 ) ) % 4 ); // ensure 4 byte alignment, see #20441

package/examples/jsm/transpiler/GLSLDecoder.js

@@ -218,7 +218,7 @@ class GLSLDecoder {
 
 		this._currentFunction = null;
 
-		this.addPolyfill( 'gl_FragCoord', 'vec2 gl_FragCoord = vec2( viewportCoordinate.x, viewportCoordinate.y.oneMinus() );' );
+		this.addPolyfill( 'gl_FragCoord', 'vec3 gl_FragCoord = vec3( viewportCoordinate.x, viewportCoordinate.y.oneMinus(), viewportCoordinate.z );' );
 
 	}
 

package/examples/jsm/transpiler/ShaderToyDecoder.js

@@ -9,7 +9,7 @@ class ShaderToyDecoder extends GLSLDecoder {
 
 		this.addPolyfill( 'iTime', 'float iTime = timerGlobal();' );
 		this.addPolyfill( 'iResolution', 'vec2 iResolution = viewportResolution;' );
-		this.addPolyfill( 'fragCoord', 'vec2 fragCoord = vec2( viewportCoordinate.x, viewportResolution.y - viewportCoordinate.y );' );
+		this.addPolyfill( 'fragCoord', 'vec3 fragCoord = vec3( viewportCoordinate.x, viewportResolution.y - viewportCoordinate.y, viewportCoordinate.z );' );
 
 	}
 

package/examples/jsm/utils/SceneUtils.js

@@ -245,10 +245,69 @@ function sortInstancedMesh( mesh, compareFn ) {
 
 }
 
+/**
+ * @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 ] );
+
+	}
+
+}
+
+/**
+ * @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 ] );
+
+	}
+
+}
+
+/**
+ * @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
+	sortInstancedMesh,
+	traverseGenerator,
+	traverseVisibleGenerator,
+	traverseAncestorsGenerator
 };

package/examples/jsm/webxr/OculusHandModel.js

@@ -6,7 +6,7 @@ const POINTING_JOINT = 'index-finger-tip';
 
 class OculusHandModel extends Object3D {
 
-	constructor( controller, loader = null ) {
+	constructor( controller, loader = null, onLoad = null ) {
 
 		super();
 
@@ -14,6 +14,7 @@ class OculusHandModel extends Object3D {
 		this.motionController = null;
 		this.envMap = null;
 		this.loader = loader;
+		this.onLoad = onLoad;
 
 		this.mesh = null;
 
@@ -25,7 +26,7 @@ class OculusHandModel extends Object3D {
 
 				this.xrInputSource = xrInputSource;
 
-				this.motionController = new XRHandMeshModel( this, controller, this.path, xrInputSource.handedness, this.loader );
+				this.motionController = new XRHandMeshModel( this, controller, this.path, xrInputSource.handedness, this.loader, this.onLoad );
 
 			}
 

package/examples/jsm/webxr/XRHandModelFactory.js

@@ -40,9 +40,11 @@ class XRHandModel extends Object3D {
 
 class XRHandModelFactory {
 
-	constructor() {
+	constructor( gltfLoader = null, onLoad = null ) {
 
+		this.gltfLoader = gltfLoader;
 		this.path = null;
+		this.onLoad = onLoad;
 
 	}
 
@@ -77,7 +79,7 @@ class XRHandModelFactory {
 
 				} else if ( profile === 'mesh' ) {
 
-					handModel.motionController = new XRHandMeshModel( handModel, controller, this.path, xrInputSource.handedness );
+					handModel.motionController = new XRHandMeshModel( handModel, controller, this.path, xrInputSource.handedness, this.gltfLoader, this.onLoad );
 
 				}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "super-three",
-  "version": "0.163.0",
+  "version": "0.164.0",
   "description": "JavaScript 3D library",
   "type": "module",
   "main": "./build/three.cjs",

package/src/constants.js

@@ -1,4 +1,4 @@
-export const REVISION = '163';
+export const REVISION = '164';
 
 export const MOUSE = { LEFT: 0, MIDDLE: 1, RIGHT: 2, ROTATE: 0, DOLLY: 1, PAN: 2 };
 export const TOUCH = { ROTATE: 0, PAN: 1, DOLLY_PAN: 2, DOLLY_ROTATE: 3 };

package/src/core/RenderTarget.js

@@ -34,6 +34,8 @@ class RenderTarget extends EventDispatcher {
 			minFilter: LinearFilter,
 			depthBuffer: true,
 			stencilBuffer: false,
+			resolveDepthBuffer: true,
+			resolveStencilBuffer: true,
 			depthTexture: null,
 			samples: 0,
 			count: 1
@@ -58,6 +60,9 @@ class RenderTarget extends EventDispatcher {
 		this.depthBuffer = options.depthBuffer;
 		this.stencilBuffer = options.stencilBuffer;
 
+		this.resolveDepthBuffer = options.resolveDepthBuffer;
+		this.resolveStencilBuffer = options.resolveStencilBuffer;
+
 		this.depthTexture = options.depthTexture;
 
 		this.samples = options.samples;
@@ -135,6 +140,9 @@ class RenderTarget extends EventDispatcher {
 		this.depthBuffer = source.depthBuffer;
 		this.stencilBuffer = source.stencilBuffer;
 
+		this.resolveDepthBuffer = source.resolveDepthBuffer;
+		this.resolveStencilBuffer = source.resolveStencilBuffer;
+
 		if ( source.depthTexture !== null ) this.depthTexture = source.depthTexture.clone();
 
 		this.samples = source.samples;

package/src/extras/PMREMGenerator.js

@@ -49,16 +49,16 @@ const INV_PHI = 1 / PHI;
 // Vertices of a dodecahedron (except the opposites, which represent the
 // same axis), used as axis directions evenly spread on a sphere.
 const _axisDirections = [
-	/*@__PURE__*/ new Vector3( 1, 1, 1 ),
-	/*@__PURE__*/ new Vector3( - 1, 1, 1 ),
-	/*@__PURE__*/ new Vector3( 1, 1, - 1 ),
-	/*@__PURE__*/ new Vector3( - 1, 1, - 1 ),
-	/*@__PURE__*/ new Vector3( 0, PHI, INV_PHI ),
-	/*@__PURE__*/ new Vector3( 0, PHI, - INV_PHI ),
-	/*@__PURE__*/ new Vector3( INV_PHI, 0, PHI ),
-	/*@__PURE__*/ new Vector3( - INV_PHI, 0, PHI ),
+	/*@__PURE__*/ new Vector3( - PHI, INV_PHI, 0 ),
 	/*@__PURE__*/ new Vector3( PHI, INV_PHI, 0 ),
-	/*@__PURE__*/ new Vector3( - PHI, INV_PHI, 0 ) ];
+	/*@__PURE__*/ new Vector3( - INV_PHI, 0, PHI ),
+	/*@__PURE__*/ new Vector3( INV_PHI, 0, PHI ),
+	/*@__PURE__*/ new Vector3( 0, PHI, - INV_PHI ),
+	/*@__PURE__*/ new Vector3( 0, PHI, INV_PHI ),
+	/*@__PURE__*/ new Vector3( - 1, 1, - 1 ),
+	/*@__PURE__*/ new Vector3( 1, 1, - 1 ),
+	/*@__PURE__*/ new Vector3( - 1, 1, 1 ),
+	/*@__PURE__*/ new Vector3( 1, 1, 1 ) ];
 
 /**
  * This class generates a Prefiltered, Mipmapped Radiance Environment Map
@@ -444,12 +444,13 @@ class PMREMGenerator {
 		const renderer = this._renderer;
 		const autoClear = renderer.autoClear;
 		renderer.autoClear = false;
+		const n = this._lodPlanes.length;
 
-		for ( let i = 1; i < this._lodPlanes.length; i ++ ) {
+		for ( let i = 1; i < n; i ++ ) {
 
 			const sigma = Math.sqrt( this._sigmas[ i ] * this._sigmas[ i ] - this._sigmas[ i - 1 ] * this._sigmas[ i - 1 ] );
 
-			const poleAxis = _axisDirections[ ( i - 1 ) % _axisDirections.length ];
+			const poleAxis = _axisDirections[ ( n - i - 1 ) % _axisDirections.length ];
 
 			this._blur( cubeUVRenderTarget, i - 1, i, sigma, poleAxis );
 

package/src/loaders/FileLoader.js

@@ -112,7 +112,7 @@ class FileLoader extends Loader {
 
 					// Nginx needs X-File-Size check
 					// https://serverfault.com/questions/482875/why-does-nginx-remove-content-length-header-for-chunked-content
-					const contentLength = response.headers.get( 'Content-Length' ) || response.headers.get( 'X-File-Size' );
+					const contentLength = response.headers.get( 'X-File-Size' ) || response.headers.get( 'Content-Length' );
 					const total = contentLength ? parseInt( contentLength ) : 0;
 					const lengthComputable = total !== 0;
 					let loaded = 0;

package/src/loaders/MaterialLoader.js

@@ -103,6 +103,7 @@ class MaterialLoader extends Loader {
 		if ( json.shininess !== undefined ) material.shininess = json.shininess;
 		if ( json.clearcoat !== undefined ) material.clearcoat = json.clearcoat;
 		if ( json.clearcoatRoughness !== undefined ) material.clearcoatRoughness = json.clearcoatRoughness;
+		if ( json.dispersion !== undefined ) material.dispersion = json.dispersion;
 		if ( json.iridescence !== undefined ) material.iridescence = json.iridescence;
 		if ( json.iridescenceIOR !== undefined ) material.iridescenceIOR = json.iridescenceIOR;
 		if ( json.iridescenceThicknessRange !== undefined ) material.iridescenceThicknessRange = json.iridescenceThicknessRange;

package/src/materials/Material.js

@@ -218,6 +218,8 @@ class Material extends EventDispatcher {
 
 		}
 
+		if ( this.dispersion !== undefined ) data.dispersion = this.dispersion;
+
 		if ( this.iridescence !== undefined ) data.iridescence = this.iridescence;
 		if ( this.iridescenceIOR !== undefined ) data.iridescenceIOR = this.iridescenceIOR;
 		if ( this.iridescenceThicknessRange !== undefined ) data.iridescenceThicknessRange = this.iridescenceThicknessRange;

package/src/materials/MeshPhysicalMaterial.js

@@ -68,6 +68,7 @@ class MeshPhysicalMaterial extends MeshStandardMaterial {
 
 		this._anisotropy = 0;
 		this._clearcoat = 0;
+		this._dispersion = 0;
 		this._iridescence = 0;
 		this._sheen = 0.0;
 		this._transmission = 0;
@@ -130,6 +131,24 @@ class MeshPhysicalMaterial extends MeshStandardMaterial {
 
 	}
 
+	get dispersion() {
+
+		return this._dispersion;
+
+	}
+
+	set dispersion( value ) {
+
+		if ( this._dispersion > 0 !== value > 0 ) {
+
+			this.version ++;
+
+		}
+
+		this._dispersion = value;
+
+	}
+
 	get sheen() {
 
 		return this._sheen;
@@ -188,6 +207,7 @@ class MeshPhysicalMaterial extends MeshStandardMaterial {
 		this.clearcoatNormalMap = source.clearcoatNormalMap;
 		this.clearcoatNormalScale.copy( source.clearcoatNormalScale );
 
+		this.dispersion = source.dispersion;
 		this.ior = source.ior;
 
 		this.iridescence = source.iridescence;

package/src/objects/BatchedMesh.js

@@ -152,6 +152,7 @@ class BatchedMesh extends Mesh {
 		this._multiDrawCounts = new Int32Array( maxGeometryCount );
 		this._multiDrawStarts = new Int32Array( maxGeometryCount );
 		this._multiDrawCount = 0;
+		this._multiDrawInstances = null;
 		this._visibilityChanged = true;
 
 		// Local matrix per geometry by using data texture
@@ -593,6 +594,28 @@ class BatchedMesh extends Mesh {
 
 	}
 
+	getInstanceCountAt( id ) {
+
+		if ( this._multiDrawInstances === null ) return null;
+
+		return this._multiDrawInstances[ id ];
+
+	}
+
+	setInstanceCountAt( id, instanceCount ) {
+
+		if ( this._multiDrawInstances === null ) {
+
+			this._multiDrawInstances = new Int32Array( this._maxGeometryCount ).fill( 1 );
+
+		}
+
+		this._multiDrawInstances[ id ] = instanceCount;
+
+		return id;
+
+	}
+
 	// get bounding box and compute it if it doesn't exist
 	getBoundingBoxAt( id, target ) {