super-three 0.154.1 → 0.155.0

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

@@ -33,24 +33,11 @@ class WebGPUPipelineUtils {
 		const utils = backend.utils;
 
 		const pipelineData = backend.get( pipeline );
-
-		// determine shader attributes
-
-		const shaderAttributes = backend.attributeUtils.createShaderAttributes( renderObject );
+		const bindingsData = backend.get( renderObject.getBindings() );
 
 		// vertex buffers
 
-		const vertexBuffers = [];
-
-		for ( const attribute of shaderAttributes ) {
-
-			vertexBuffers.push( {
-				arrayStride: attribute.arrayStride,
-				attributes: [ { shaderLocation: attribute.slot, offset: attribute.offset, format: attribute.format } ],
-				stepMode: attribute.stepMode
-			} );
-
-		}
+		const vertexBuffers = backend.attributeUtils.createShaderVertexBuffers( renderObject );
 
 		// blending
 
@@ -58,10 +45,7 @@ class WebGPUPipelineUtils {
 
 		if ( material.transparent === true && material.blending !== NoBlending ) {
 
-			blending = {
-				alpha: this._getAlphaBlend( material ),
-				color: this._getColorBlend( material )
-			};
+			blending = this._getBlending( material );
 
 		}
 
@@ -112,12 +96,14 @@ class WebGPUPipelineUtils {
 			multisample: {
 				count: sampleCount
 			},
-			layout: 'auto'
+			layout: device.createPipelineLayout( {
+				bindGroupLayouts: [ bindingsData.layout ]
+			} )
 		} );
 
 	}
 
-	createComputePipeline( pipeline ) {
+	createComputePipeline( pipeline, bindings ) {
 
 		const backend = this.backend;
 		const device = backend.device;
@@ -125,100 +111,119 @@ class WebGPUPipelineUtils {
 		const computeProgram = backend.get( pipeline.computeProgram ).module;
 
 		const pipelineGPU = backend.get( pipeline );
+		const bindingsData = backend.get( bindings );
 
 		pipelineGPU.pipeline = device.createComputePipeline( {
 			compute: computeProgram,
-			layout: 'auto'
+			layout: device.createPipelineLayout( {
+				bindGroupLayouts: [ bindingsData.layout ]
+			} )
 		} );
 
 	}
 
-	_getAlphaBlend( material ) {
+	_getBlending( material ) {
+
+		let color, alpha;
 
 		const blending = material.blending;
-		const premultipliedAlpha = material.premultipliedAlpha;
 
-		let alphaBlend = undefined;
+		if ( blending === CustomBlending ) {
 
-		switch ( blending ) {
+			const blendSrcAlpha = material.blendSrcAlpha !== null ? material.blendSrcAlpha : GPUBlendFactor.One;
+			const blendDstAlpha = material.blendDstAlpha !== null ? material.blendDstAlpha : GPUBlendFactor.Zero;
+			const blendEquationAlpha = material.blendEquationAlpha !== null ? material.blendEquationAlpha : GPUBlendFactor.Add;
 
-			case NormalBlending:
+			color = {
+				srcFactor: this._getBlendFactor( material.blendSrc ),
+				dstFactor: this._getBlendFactor( material.blendDst ),
+				operation: this._getBlendOperation( material.blendEquation )
+			};
 
-				if ( premultipliedAlpha === false ) {
+			alpha = {
+				srcFactor: this._getBlendFactor( blendSrcAlpha ),
+				dstFactor: this._getBlendFactor( blendDstAlpha ),
+				operation: this._getBlendOperation( blendEquationAlpha )
+			};
 
-					alphaBlend = {
-						srcFactor: GPUBlendFactor.One,
-						dstFactor: GPUBlendFactor.OneMinusSrcAlpha,
-						operation: GPUBlendOperation.Add
-					};
+		} else {
 
-				}
+			const premultipliedAlpha = material.premultipliedAlpha;
 
-				break;
+			const setBlend = ( srcRGB, dstRGB, srcAlpha, dstAlpha ) => {
 
-			case AdditiveBlending:
+				color = {
+					srcFactor: srcRGB,
+					dstFactor: dstRGB,
+					operation: GPUBlendOperation.Add
+				};
 
-				alphaBlend = {
-					srcFactor: GPUBlendFactor.Zero,
-					dstFactor: GPUBlendFactor.One,
+				alpha = {
+					srcFactor: srcAlpha,
+					dstFactor: dstAlpha,
 					operation: GPUBlendOperation.Add
 				};
 
-				break;
+			};
+
+			if ( premultipliedAlpha ) {
 
-			case SubtractiveBlending:
+				switch ( blending ) {
 
-				if ( premultipliedAlpha === true ) {
+					case NormalBlending:
+						setBlend( GPUBlendFactor.SrcAlpha, GPUBlendFactor.OneMinusSrcAlpha, GPUBlendFactor.One, GPUBlendFactor.OneMinusSrcAlpha );
+						break;
 
-					alphaBlend = {
-						srcFactor: GPUBlendFactor.OneMinusSrcColor,
-						dstFactor: GPUBlendFactor.OneMinusSrcAlpha,
-						operation: GPUBlendOperation.Add
-					};
+					case AdditiveBlending:
+						setBlend( GPUBlendFactor.SrcAlpha, GPUBlendFactor.One, GPUBlendFactor.One, GPUBlendFactor.One );
+						break;
+
+					case SubtractiveBlending:
+						setBlend( GPUBlendFactor.Zero, GPUBlendFactor.OneMinusSrc, GPUBlendFactor.Zero, GPUBlendFactor.One );
+						break;
+
+					case MultiplyBlending:
+						setBlend( GPUBlendFactor.Zero, GPUBlendFactor.Src, GPUBlendFactor.Zero, GPUBlendFactor.SrcAlpha );
+						break;
 
 				}
 
-				break;
+			} else {
 
-			case MultiplyBlending:
+				switch ( blending ) {
 
-				if ( premultipliedAlpha === true ) {
+					case NormalBlending:
+						setBlend( GPUBlendFactor.SrcAlpha, GPUBlendFactor.OneMinusSrcAlpha, GPUBlendFactor.One, GPUBlendFactor.OneMinusSrcAlpha );
+						break;
 
-					alphaBlend = {
-						srcFactor: GPUBlendFactor.Zero,
-						dstFactor: GPUBlendFactor.SrcAlpha,
-						operation: GPUBlendOperation.Add
-					};
+					case AdditiveBlending:
+						setBlend( GPUBlendFactor.SrcAlpha, GPUBlendFactor.One, GPUBlendFactor.SrcAlpha, GPUBlendFactor.One );
+						break;
 
-				}
+					case SubtractiveBlending:
+						setBlend( GPUBlendFactor.Zero, GPUBlendFactor.OneMinusSrc, GPUBlendFactor.Zero, GPUBlendFactor.One );
+						break;
 
-				break;
+					case MultiplyBlending:
+						setBlend( GPUBlendFactor.Zero, GPUBlendFactor.Src, GPUBlendFactor.Zero, GPUBlendFactor.Src );
+						break;
 
-			case CustomBlending:
+				}
 
-				const blendSrcAlpha = material.blendSrcAlpha;
-				const blendDstAlpha = material.blendDstAlpha;
-				const blendEquationAlpha = material.blendEquationAlpha;
+			}
 
-				if ( blendSrcAlpha !== null && blendDstAlpha !== null && blendEquationAlpha !== null ) {
+		}
 
-					alphaBlend = {
-						srcFactor: this._getBlendFactor( blendSrcAlpha ),
-						dstFactor: this._getBlendFactor( blendDstAlpha ),
-						operation: this._getBlendOperation( blendEquationAlpha )
-					};
+		if ( color !== undefined && alpha !== undefined ) {
 
-				}
+			return { color, alpha };
 
-				break;
+		} else {
 
-			default:
-				console.error( 'THREE.WebGPURenderer: Blending not supported.', blending );
+			console.error( 'THREE.WebGPURenderer: Invalid blending: ', blending );
 
 		}
 
-		return alphaBlend;
-
 	}
 
 	_getBlendFactor( blend ) {
@@ -236,11 +241,11 @@ class WebGPUPipelineUtils {
 				break;
 
 			case SrcColorFactor:
-				blendFactor = GPUBlendFactor.SrcColor;
+				blendFactor = GPUBlendFactor.Src;
 				break;
 
 			case OneMinusSrcColorFactor:
-				blendFactor = GPUBlendFactor.OneMinusSrcColor;
+				blendFactor = GPUBlendFactor.OneMinusSrc;
 				break;
 
 			case SrcAlphaFactor:
@@ -252,7 +257,7 @@ class WebGPUPipelineUtils {
 				break;
 
 			case DstColorFactor:
-				blendFactor = GPUBlendFactor.DstColor;
+				blendFactor = GPUBlendFactor.Dst;
 				break;
 
 			case OneMinusDstColorFactor:
@@ -272,11 +277,11 @@ class WebGPUPipelineUtils {
 				break;
 
 			case BlendColorFactor:
-				blendFactor = GPUBlendFactor.BlendColor;
+				blendFactor = GPUBlendFactor.Constant;
 				break;
 
 			case OneMinusBlendColorFactor:
-				blendFactor = GPUBlendFactor.OneMinusBlendColor;
+				blendFactor = GPUBlendFactor.OneMinusConstant;
 				break;
 
 			default:
@@ -288,58 +293,6 @@ class WebGPUPipelineUtils {
 
 	}
 
-	_getColorBlend( material ) {
-
-		const blending = material.blending;
-		const premultipliedAlpha = material.premultipliedAlpha;
-
-		const colorBlend = {
-			srcFactor: null,
-			dstFactor: null,
-			operation: null
-		};
-
-		switch ( blending ) {
-
-			case NormalBlending:
-				colorBlend.srcFactor = ( premultipliedAlpha === true ) ? GPUBlendFactor.One : GPUBlendFactor.SrcAlpha;
-				colorBlend.dstFactor = GPUBlendFactor.OneMinusSrcAlpha;
-				colorBlend.operation = GPUBlendOperation.Add;
-				break;
-
-			case AdditiveBlending:
-				colorBlend.srcFactor = ( premultipliedAlpha === true ) ? GPUBlendFactor.One : GPUBlendFactor.SrcAlpha;
-				colorBlend.dstFactor = GPUBlendFactor.One;
-				colorBlend.operation = GPUBlendOperation.Add;
-				break;
-
-			case SubtractiveBlending:
-				colorBlend.srcFactor = GPUBlendFactor.Zero;
-				colorBlend.dstFactor = ( premultipliedAlpha === true ) ? GPUBlendFactor.Zero : GPUBlendFactor.OneMinusSrcColor;
-				colorBlend.operation = GPUBlendOperation.Add;
-				break;
-
-			case MultiplyBlending:
-				colorBlend.srcFactor = GPUBlendFactor.Zero;
-				colorBlend.dstFactor = GPUBlendFactor.SrcColor;
-				colorBlend.operation = GPUBlendOperation.Add;
-				break;
-
-			case CustomBlending:
-				colorBlend.srcFactor = this._getBlendFactor( material.blendSrc );
-				colorBlend.dstFactor = this._getBlendFactor( material.blendDst );
-				colorBlend.operation = this._getBlendOperation( material.blendEquation );
-				break;
-
-			default:
-				console.error( 'THREE.WebGPURenderer: Blending not supported.', blending );
-
-		}
-
-		return colorBlend;
-
-	}
-
 	_getStencilCompare( material ) {
 
 		let stencilCompare;

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

@@ -19,13 +19,13 @@ import WebGPUTextureMipmapUtils from './WebGPUTextureMipmapUtils.js';
 
 const _compareToWebGPU = {
 	[ NeverCompare ]: 'never',
-	[ AlwaysCompare ]: 'less',
-	[ LessCompare ]: 'equal',
+	[ LessCompare ]: 'less',
+	[ EqualCompare ]: 'equal',
 	[ LessEqualCompare ]: 'less-equal',
-	[ EqualCompare ]: 'greater',
-	[ GreaterEqualCompare ]: 'not-equal',
-	[ GreaterCompare ]: 'greater-equal',
-	[ NotEqualCompare ]: 'always'
+	[ GreaterCompare ]: 'greater',
+	[ GreaterEqualCompare ]: 'greater-equal',
+	[ AlwaysCompare ]: 'always',
+	[ NotEqualCompare ]: 'not-equal'
 };
 
 class WebGPUTextureUtils {
@@ -103,8 +103,9 @@ class WebGPUTextureUtils {
 		const dimension = this._getDimension( texture );
 		const mipLevelCount = this._getMipLevelCount( texture, width, height, needsMipmaps );
 		const format = texture.internalFormat || this._getFormat( texture );
-		//const sampleCount = texture.isRenderTargetTexture || texture.isDepthTexture ? backend.utils.getSampleCount( renderContext ) : 1;
+
 		const sampleCount = options.sampleCount !== undefined ? options.sampleCount : 1;
+		const primarySampleCount = texture.isRenderTargetTexture ? 1 : sampleCount;
 
 		let usage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC;
 
@@ -122,7 +123,7 @@ class WebGPUTextureUtils {
 				depthOrArrayLayers: depth,
 			},
 			mipLevelCount: mipLevelCount,
-			sampleCount: sampleCount,
+			sampleCount: primarySampleCount,
 			dimension: dimension,
 			format: format,
 			usage: usage
@@ -144,10 +145,29 @@ class WebGPUTextureUtils {
 
 		} else {
 
+			if ( format === undefined ) {
+
+				console.warn( 'WebGPURenderer: Texture format not supported.' );
+
+				return this.createDefaultTexture( texture );
+
+			}
+
 			textureData.texture = backend.device.createTexture( textureDescriptorGPU );
 
 		}
 
+		if ( texture.isRenderTargetTexture && sampleCount > 1 ) {
+
+			const msaaTextureDescriptorGPU = Object.assign( {}, textureDescriptorGPU );
+
+			msaaTextureDescriptorGPU.label = msaaTextureDescriptorGPU.label + '-msaa';
+			msaaTextureDescriptorGPU.sampleCount = sampleCount;
+
+			textureData.msaaTexture = backend.device.createTexture( msaaTextureDescriptorGPU );
+
+		}
+
 		textureData.initialized = true;
 
 		textureData.needsMipmaps = needsMipmaps;
@@ -162,6 +182,8 @@ class WebGPUTextureUtils {
 
 		textureData.texture.destroy();
 
+		if ( textureData.msaaTexture !== undefined ) textureData.msaaTexture.destroy();
+
 		backend.delete( texture );
 
 	}
@@ -201,6 +223,9 @@ class WebGPUTextureUtils {
 
 		const { needsMipmaps, textureDescriptorGPU } = textureData;
 
+		if ( textureDescriptorGPU === undefined ) // unsupported texture format
+			return;
+
 		// transfer texture data
 
 		if ( texture.isDataTexture || texture.isDataArrayTexture || texture.isData3DTexture ) {
@@ -243,6 +268,8 @@ class WebGPUTextureUtils {
 
 		textureData.version = texture.version;
 
+		if ( texture.onUpdate ) texture.onUpdate( texture );
+
 	}
 
 	async copyTextureToBuffer( texture, x, y, width, height ) {

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

@@ -79,7 +79,7 @@ class WebGPUUtils {
 
 		if ( renderContext.texture !== null ) {
 
-			return 1;
+			return renderContext.sampleCount;
 
 		}
 

package/examples/jsm/shaders/OutputShader.js

@@ -1,3 +1,7 @@
+import {
+	ShaderChunk
+} from 'three';
+
 const OutputShader = {
 
 	uniforms: {
@@ -8,6 +12,13 @@ const OutputShader = {
 	},
 
 	vertexShader: /* glsl */`
+		precision highp float;
+
+		uniform mat4 modelViewMatrix;
+		uniform mat4 projectionMatrix;
+
+		attribute vec3 position;
+		attribute vec2 uv;
 
 		varying vec2 vUv;
 
@@ -19,10 +30,12 @@ const OutputShader = {
 		}`,
 
 	fragmentShader: /* glsl */`
+	
+		precision highp float;
 
 		uniform sampler2D tDiffuse;
 
-		#include <tonemapping_pars_fragment>
+		` + ShaderChunk[ 'tonemapping_pars_fragment' ] + ShaderChunk[ 'colorspace_pars_fragment' ] + `
 
 		varying vec2 vUv;
 
@@ -52,7 +65,11 @@ const OutputShader = {
 
 			// color space
 
-			gl_FragColor = LinearTosRGB( gl_FragColor );
+			#ifdef SRGB_COLOR_SPACE
+
+				gl_FragColor = LinearTosRGB( gl_FragColor );
+
+			#endif
 
 		}`
 

package/examples/jsm/utils/BufferGeometryUtils.js

@@ -1229,14 +1229,21 @@ function mergeGroups( geometry ) {
 }
 
 
-// Creates a new, non-indexed geometry with smooth normals everywhere except faces that meet at
-// an angle greater than the crease angle.
+/**
+ * Modifies the supplied geometry if it is non-indexed, otherwise creates a new,
+ * non-indexed geometry. Returns the geometry with smooth normals everywhere except
+ * faces that meet at an angle greater than the crease angle.
+ *
+ * @param {BufferGeometry} geometry
+ * @param {number} [creaseAngle]
+ * @return {BufferGeometry}
+ */
 function toCreasedNormals( geometry, creaseAngle = Math.PI / 3 /* 60 degrees */ ) {
 
 	const creaseDot = Math.cos( creaseAngle );
 	const hashMultiplier = ( 1 + 1e-10 ) * 1e2;
 
-	// reusable vertors
+	// reusable vectors
 	const verts = [ new Vector3(), new Vector3(), new Vector3() ];
 	const tempVec1 = new Vector3();
 	const tempVec2 = new Vector3();
@@ -1253,7 +1260,9 @@ function toCreasedNormals( geometry, creaseAngle = Math.PI / 3 /* 60 degrees */
 
 	}
 
-	const resultGeometry = geometry.toNonIndexed();
+	// BufferGeometry.toNonIndexed() warns if the geometry is non-indexed
+	// and returns the original geometry
+	const resultGeometry = geometry.index ? geometry.toNonIndexed() : geometry;
 	const posAttr = resultGeometry.attributes.position;
 	const vertexMap = {};
 

package/examples/jsm/webxr/OculusHandPointerModel.js

@@ -70,8 +70,8 @@ class OculusHandPointerModel extends THREE.Object3D {
 		this.visible = false;
 		this.xrInputSource = null;
 
-		this.pointerGeometry.dispose();
-		this.pointerMesh.material.dispose();
+		if ( this.pointerGeometry ) this.pointerGeometry.dispose();
+		if ( this.pointerMesh && this.pointerMesh.material ) this.pointerMesh.material.dispose();
 
 		this.clear();
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "super-three",
-  "version": "0.154.1",
+  "version": "0.155.0",
   "description": "JavaScript 3D library",
   "type": "module",
   "main": "./build/three.js",
@@ -103,7 +103,7 @@
     "rollup": "^3.20.2",
     "rollup-plugin-filesize": "^10.0.0",
     "rollup-plugin-visualizer": "^5.9.0",
-    "servez": "^1.14.2"
+    "servez": "^2.0.0"
   },
   "overrides": {
     "jpeg-js": "^0.4.4"

package/src/Three.js

@@ -34,6 +34,7 @@ export { DataArrayTexture } from './textures/DataArrayTexture.js';
 export { Data3DTexture } from './textures/Data3DTexture.js';
 export { CompressedTexture } from './textures/CompressedTexture.js';
 export { CompressedArrayTexture } from './textures/CompressedArrayTexture.js';
+export { CompressedCubeTexture } from './textures/CompressedCubeTexture.js';
 export { CubeTexture } from './textures/CubeTexture.js';
 export { CanvasTexture } from './textures/CanvasTexture.js';
 export { DepthTexture } from './textures/DepthTexture.js';
@@ -91,6 +92,7 @@ export { AnimationObjectGroup } from './animation/AnimationObjectGroup.js';
 export { AnimationMixer } from './animation/AnimationMixer.js';
 export { AnimationClip } from './animation/AnimationClip.js';
 export { AnimationAction } from './animation/AnimationAction.js';
+export { RenderTarget } from './core/RenderTarget.js';
 export { Uniform } from './core/Uniform.js';
 export { UniformsGroup } from './core/UniformsGroup.js';
 export { InstancedBufferGeometry } from './core/InstancedBufferGeometry.js';

package/src/animation/PropertyBinding.js

@@ -436,7 +436,7 @@ class PropertyBinding {
 		// ensure there is a value node
 		if ( ! targetObject ) {
 
-			console.error( 'THREE.PropertyBinding: Trying to update node for track: ' + this.path + ' but it wasn\'t found.' );
+			console.warn( 'THREE.PropertyBinding: No target node found for track: ' + this.path + '.' );
 			return;
 
 		}

package/src/cameras/CubeCamera.js

@@ -1,4 +1,4 @@
-import { NoToneMapping, WebGLCoordinateSystem, WebGPUCoordinateSystem } from '../constants.js';
+import { WebGLCoordinateSystem, WebGPUCoordinateSystem } from '../constants.js';
 import { Object3D } from '../core/Object3D.js';
 import { PerspectiveCamera } from './PerspectiveCamera.js';
 
@@ -126,10 +126,8 @@ class CubeCamera extends Object3D {
 
 		const currentRenderTarget = renderer.getRenderTarget();
 
-		const currentToneMapping = renderer.toneMapping;
 		const currentXrEnabled = renderer.xr.enabled;
 
-		renderer.toneMapping = NoToneMapping;
 		renderer.xr.enabled = false;
 
 		const generateMipmaps = renderTarget.texture.generateMipmaps;
@@ -158,7 +156,6 @@ class CubeCamera extends Object3D {
 
 		renderer.setRenderTarget( currentRenderTarget );
 
-		renderer.toneMapping = currentToneMapping;
 		renderer.xr.enabled = currentXrEnabled;
 
 		renderTarget.texture.needsPMREMUpdate = true;

package/src/constants.js

@@ -1,4 +1,4 @@
-export const REVISION = '154';
+export const REVISION = '155';
 
 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/BufferAttribute.js

@@ -175,6 +175,26 @@ class BufferAttribute {
 
 	}
 
+	getComponent( index, component ) {
+
+		let value = this.array[ index * this.itemSize + component ];
+
+		if ( this.normalized ) value = denormalize( value, this.array );
+
+		return value;
+
+	}
+
+	setComponent( index, component, value ) {
+
+		if ( this.normalized ) value = normalize( value, this.array );
+
+		this.array[ index * this.itemSize + component ] = value;
+
+		return this;
+
+	}
+
 	getX( index ) {
 
 		let x = this.array[ index * this.itemSize ];

package/src/core/Object3D.js

@@ -945,7 +945,7 @@ class Object3D extends EventDispatcher {
 		this.frustumCulled = source.frustumCulled;
 		this.renderOrder = source.renderOrder;
 
-		this.animations = source.animations;
+		this.animations = source.animations.slice();
 
 		this.userData = JSON.parse( JSON.stringify( source.userData ) );