super-three 0.152.0 → 0.154.0

package/examples/jsm/renderers/common/CubeRenderTarget.js

@@ -0,0 +1,65 @@
+import { WebGLCubeRenderTarget, Scene, CubeCamera, BoxGeometry, Mesh, BackSide, NoBlending, LinearFilter, LinearMipmapLinearFilter } from 'three';
+import { equirectUV } from '../../nodes/utils/EquirectUVNode.js';
+import { texture as TSL_Texture } from '../../nodes/accessors/TextureNode.js';
+import { positionWorldDirection } from '../../nodes/accessors/PositionNode.js';
+import { createNodeMaterialFromType } from '../../nodes/materials/NodeMaterial.js';
+
+// @TODO: Consider rename WebGLCubeRenderTarget to just CubeRenderTarget
+
+class CubeRenderTarget extends WebGLCubeRenderTarget {
+
+	constructor( size = 1, options = {} ) {
+
+		super( size, options );
+
+		this.isCubeRenderTarget = true;
+
+	}
+
+	fromEquirectangularTexture( renderer, texture ) {
+
+		const currentMinFilter = texture.minFilter;
+		const currentGenerateMipmaps = texture.generateMipmaps;
+
+		texture.generateMipmaps = true;
+
+		this.texture.type = texture.type;
+		this.texture.colorSpace = texture.colorSpace;
+
+		this.texture.generateMipmaps = texture.generateMipmaps;
+		this.texture.minFilter = texture.minFilter;
+		this.texture.magFilter = texture.magFilter;
+
+		const geometry = new BoxGeometry( 5, 5, 5 );
+
+		const uvNode = equirectUV( positionWorldDirection );
+
+		const material = createNodeMaterialFromType( 'MeshBasicNodeMaterial' );
+		material.colorNode = TSL_Texture( texture, uvNode, 0 );
+		material.side = BackSide;
+		material.blending = NoBlending;
+
+		const mesh = new Mesh( geometry, material );
+
+		const scene = new Scene();
+		scene.add( mesh );
+
+		// Avoid blurred poles
+		if ( texture.minFilter === LinearMipmapLinearFilter ) texture.minFilter = LinearFilter;
+
+		const camera = new CubeCamera( 1, 10, this );
+		camera.update( renderer, scene );
+
+		texture.minFilter = currentMinFilter;
+		texture.currentGenerateMipmaps = currentGenerateMipmaps;
+
+		mesh.geometry.dispose();
+		mesh.material.dispose();
+
+		return this;
+
+	}
+
+}
+
+export default CubeRenderTarget;

package/examples/jsm/renderers/common/DataMap.js

@@ -0,0 +1,54 @@
+class DataMap {
+
+	constructor() {
+
+		this.data = new WeakMap();
+
+	}
+
+	get( object ) {
+
+		let map = this.data.get( object );
+
+		if ( map === undefined ) {
+
+			map = {};
+			this.data.set( object, map );
+
+		}
+
+		return map;
+
+	}
+
+	delete( object ) {
+
+		let map;
+
+		if ( this.data.has( object ) ) {
+
+			map = this.data.get( object );
+
+			this.data.delete( object );
+
+		}
+
+		return map;
+
+	}
+
+	has( object ) {
+
+		return this.data.has( object );
+
+	}
+
+	dispose() {
+
+		this.data.clear();
+
+	}
+
+}
+
+export default DataMap;

package/examples/jsm/renderers/{webgpu/WebGPUGeometries.js → common/Geometries.js}

@@ -1,3 +1,5 @@
+import DataMap from './DataMap.js';
+import { AttributeType } from './Constants.js';
 import { Uint32BufferAttribute, Uint16BufferAttribute } from 'three';
 
 function arrayNeedsUint32( array ) {
@@ -64,16 +66,17 @@ function getWireframeIndex( geometry ) {
 
 }
 
-class WebGPUGeometries {
+class Geometries extends DataMap {
 
-	constructor( attributes, properties, info ) {
+	constructor( attributes, info ) {
+
+		super();
 
 		this.attributes = attributes;
-		this.properties = properties;
 		this.info = info;
 
 		this.wireframes = new WeakMap();
-		this.geometryFrame = new WeakMap();
+		this.attributeFrame = new WeakMap();
 
 	}
 
@@ -81,7 +84,7 @@ class WebGPUGeometries {
 
 		const geometry = renderObject.geometry;
 
-		return this.properties.has( geometry ) && this.properties.get( geometry ).initialized === true;
+		return super.has( geometry ) && this.get( geometry ).initialized === true;
 
 	}
 
@@ -89,33 +92,35 @@ class WebGPUGeometries {
 
 		if ( this.has( renderObject ) === false ) this.initGeometry( renderObject );
 
-		this.updateFrameAttributes( renderObject );
+		this.updateAttributes( renderObject );
 
 	}
 
 	initGeometry( renderObject ) {
 
 		const geometry = renderObject.geometry;
-		const geometryProperties = this.properties.get( geometry );
+		const geometryData = this.get( geometry );
+
+		geometryData.initialized = true;
 
-		geometryProperties.initialized = true;
+		this.info.memory.geometries ++;
 
-		const dispose = () => {
+		const onDispose = () => {
 
 			this.info.memory.geometries --;
 
 			const index = geometry.index;
-			const geometryAttributes = geometry.attributes;
+			const geometryAttributes = renderObject.getAttributes();
 
 			if ( index !== null ) {
 
-				this.attributes.remove( index );
+				this.attributes.delete( index );
 
 			}
 
-			for ( const name in geometryAttributes ) {
+			for ( const geometryAttribute of geometryAttributes ) {
 
-				this.attributes.remove( geometryAttributes[ name ] );
+				this.attributes.delete( geometryAttribute );
 
 			}
 
@@ -123,51 +128,47 @@ class WebGPUGeometries {
 
 			if ( wireframeAttribute !== undefined ) {
 
-				this.attributes.remove( wireframeAttribute );
+				this.attributes.delete( wireframeAttribute );
 
 			}
 
-			geometry.removeEventListener( 'dispose', dispose );
+			geometry.removeEventListener( 'dispose', onDispose );
 
 		};
 
-		this.info.memory.geometries ++;
-
-		geometry.addEventListener( 'dispose', dispose );
+		geometry.addEventListener( 'dispose', onDispose );
 
 	}
 
-	updateFrameAttributes( renderObject ) {
-
-		const frame = this.info.render.frame;
-		const geometry = renderObject.geometry;
+	updateAttributes( renderObject ) {
 
-		if ( this.geometryFrame.get( geometry ) !== frame ) {
+		const attributes = renderObject.getAttributes();
 
-			this.updateAttributes( renderObject );
+		for ( const attribute of attributes ) {
 
-			this.geometryFrame.set( geometry, frame );
+			this.updateAttribute( attribute, AttributeType.VERTEX );
 
 		}
 
-	}
+		const index = this.getIndex( renderObject );
 
-	updateAttributes( renderObject ) {
+		if ( index !== null ) {
 
-		const geometry = renderObject.geometry;
-		const geometryAttributes = geometry.attributes;
+			this.updateAttribute( index, AttributeType.INDEX );
+
+		}
 
-		for ( const name in geometryAttributes ) {
+	}
 
-			this.attributes.update( geometryAttributes[ name ] );
+	updateAttribute( attribute, type ) {
 
-		}
+		const frame = this.info.render.frame;
 
-		const index = this.getIndex( renderObject );
+		if ( this.attributeFrame.get( attribute ) !== frame ) {
 
-		if ( index !== null ) {
+			this.attributes.update( attribute, type );
 
-			this.attributes.update( index, true );
+			this.attributeFrame.set( attribute, frame );
 
 		}
 
@@ -193,7 +194,7 @@ class WebGPUGeometries {
 
 			} else if ( wireframeAttribute.version !== getWireframeVersion( geometry ) ) {
 
-				this.attributes.remove( wireframeAttribute );
+				this.attributes.delete( wireframeAttribute );
 
 				wireframeAttribute = getWireframeIndex( geometry );
 
@@ -211,4 +212,4 @@ class WebGPUGeometries {
 
 }
 
-export default WebGPUGeometries;
+export default Geometries;

package/examples/jsm/renderers/{webgpu/WebGPUInfo.js → common/Info.js}

@@ -1,4 +1,4 @@
-class WebGPUInfo {
+class Info {
 
 	constructor() {
 
@@ -49,7 +49,6 @@ class WebGPUInfo {
 
 	reset() {
 
-		this.render.frame ++;
 		this.render.drawCalls = 0;
 		this.render.triangles = 0;
 		this.render.points = 0;
@@ -71,4 +70,4 @@ class WebGPUInfo {
 }
 
 
-export default WebGPUInfo;
+export default Info;

package/examples/jsm/renderers/common/Pipeline.js

@@ -0,0 +1,13 @@
+class Pipeline {
+
+	constructor( cacheKey ) {
+
+		this.cacheKey = cacheKey;
+
+		this.usedTimes = 0;
+
+	}
+
+}
+
+export default Pipeline;

package/examples/jsm/renderers/common/Pipelines.js

@@ -0,0 +1,321 @@
+import DataMap from './DataMap.js';
+import RenderPipeline from './RenderPipeline.js';
+import ComputePipeline from './ComputePipeline.js';
+import ProgrammableStage from './ProgrammableStage.js';
+
+class Pipelines extends DataMap {
+
+	constructor( backend, nodes ) {
+
+		super();
+
+		this.backend = backend;
+		this.nodes = nodes;
+
+		this.bindings = null; // set by the bindings
+
+		this.caches = new Map();
+		this.programs = {
+			vertex: new Map(),
+			fragment: new Map(),
+			compute: new Map()
+		};
+
+	}
+
+	getForCompute( computeNode ) {
+
+		const { backend } = this;
+
+		const data = this.get( computeNode );
+
+		if ( data.pipeline === undefined ) {
+
+			// release previous cache
+
+			const previousPipeline = this._releasePipeline( computeNode );
+
+			// get shader
+
+			const nodeBuilder = this.nodes.getForCompute( computeNode );
+
+			// programmable stage
+
+			let stageCompute = this.programs.compute.get( nodeBuilder.computeShader );
+
+			if ( stageCompute === undefined ) {
+
+				if ( previousPipeline ) this._releaseProgram( previousPipeline.computeShader );
+
+				stageCompute = new ProgrammableStage( nodeBuilder.computeShader, 'compute' );
+				this.programs.compute.set( nodeBuilder.computeShader, stageCompute );
+
+				backend.createProgram( stageCompute );
+
+			}
+
+			// determine compute pipeline
+
+			const pipeline = this._getComputePipeline( stageCompute );
+
+			// keep track of all used times
+
+			pipeline.usedTimes ++;
+			stageCompute.usedTimes ++;
+
+			//
+
+			data.pipeline = pipeline;
+
+		}
+
+		return data.pipeline;
+
+	}
+
+	getForRender( renderObject ) {
+
+		const { backend } = this;
+
+		const data = this.get( renderObject );
+
+		if ( this._needsUpdate( renderObject ) ) {
+
+			// release previous cache
+
+			const previousPipeline = this._releasePipeline( renderObject );
+
+			// get shader
+
+			const nodeBuilder = this.nodes.getForRender( renderObject );
+
+			// programmable stages
+
+			let stageVertex = this.programs.vertex.get( nodeBuilder.vertexShader );
+
+			if ( stageVertex === undefined ) {
+
+				if ( previousPipeline ) this._releaseProgram( previousPipeline.vertexProgram );
+
+				stageVertex = new ProgrammableStage( nodeBuilder.vertexShader, 'vertex' );
+				this.programs.vertex.set( nodeBuilder.vertexShader, stageVertex );
+
+				backend.createProgram( stageVertex );
+
+			}
+
+			let stageFragment = this.programs.fragment.get( nodeBuilder.fragmentShader );
+
+			if ( stageFragment === undefined ) {
+
+				if ( previousPipeline ) this._releaseProgram( previousPipeline.fragmentShader );
+
+				stageFragment = new ProgrammableStage( nodeBuilder.fragmentShader, 'fragment' );
+				this.programs.fragment.set( nodeBuilder.fragmentShader, stageFragment );
+
+				backend.createProgram( stageFragment );
+
+			}
+
+			// determine render pipeline
+
+			const pipeline = this._getRenderPipeline( renderObject, stageVertex, stageFragment );
+
+			// keep track of all used times
+
+			pipeline.usedTimes ++;
+			stageVertex.usedTimes ++;
+			stageFragment.usedTimes ++;
+
+			//
+
+			data.pipeline = pipeline;
+
+		}
+
+		return data.pipeline;
+
+	}
+
+	delete( object ) {
+
+		const pipeline = this._releasePipeline( object );
+
+		if ( pipeline && pipeline.usedTimes === 0 ) {
+
+			if ( pipeline.isComputePipeline ) {
+
+				this._releaseProgram( pipeline.computeProgram );
+
+			} else {
+
+				this._releaseProgram( pipeline.vertexProgram );
+				this._releaseProgram( pipeline.fragmentProgram );
+
+			}
+
+		}
+
+		super.delete( object );
+
+	}
+
+	dispose() {
+
+		super.dispose();
+
+		this.caches = new Map();
+		this.programs = {
+			vertex: new Map(),
+			fragment: new Map(),
+			compute: new Map()
+		};
+
+	}
+
+	_getComputePipeline( stageCompute ) {
+
+		// check for existing pipeline
+
+		const cacheKey = 'compute:' + stageCompute.id;
+
+		let pipeline = this.caches.get( cacheKey );
+
+		if ( pipeline === undefined ) {
+
+			pipeline = new ComputePipeline( cacheKey, stageCompute );
+
+			this.caches.set( cacheKey, pipeline );
+
+			this.backend.createComputePipeline( pipeline );
+
+		}
+
+		return pipeline;
+
+	}
+
+	_getRenderPipeline( renderObject, stageVertex, stageFragment ) {
+
+		// check for existing pipeline
+
+		const cacheKey = this._getRenderCacheKey( renderObject, stageVertex, stageFragment );
+
+		let pipeline = this.caches.get( cacheKey );
+
+		if ( pipeline === undefined ) {
+
+			pipeline = new RenderPipeline( cacheKey, stageVertex, stageFragment );
+
+			this.caches.set( cacheKey, pipeline );
+
+			renderObject.pipeline = pipeline;
+
+			this.backend.createRenderPipeline( renderObject );
+
+		} else {
+
+			// assign a shared pipeline to renderObject
+
+			renderObject.pipeline = pipeline;
+
+		}
+
+		return pipeline;
+
+	}
+
+	_getRenderCacheKey( renderObject, stageVertex, stageFragment ) {
+
+		const { material } = renderObject;
+
+		const parameters = [
+			stageVertex.id, stageFragment.id,
+			material.transparent, material.blending, material.premultipliedAlpha,
+			material.blendSrc, material.blendDst, material.blendEquation,
+			material.blendSrcAlpha, material.blendDstAlpha, material.blendEquationAlpha,
+			material.colorWrite,
+			material.depthWrite, material.depthTest, material.depthFunc,
+			material.stencilWrite, material.stencilFunc,
+			material.stencilFail, material.stencilZFail, material.stencilZPass,
+			material.stencilFuncMask, material.stencilWriteMask,
+			material.side,
+			this.backend.getCacheKey( renderObject )
+		];
+
+		return parameters.join();
+
+	}
+
+	_releasePipeline( object ) {
+
+		const pipeline = this.get( object ).pipeline;
+
+		//this.bindings.delete( object );
+
+		if ( pipeline && -- pipeline.usedTimes === 0 ) {
+
+			this.caches.delete( pipeline.cacheKey );
+
+		}
+
+		return pipeline;
+
+	}
+
+	_releaseProgram( program ) {
+
+		if ( -- program.usedTimes === 0 ) {
+
+			const code = program.code;
+			const stage = program.stage;
+
+			this.programs[ stage ].delete( code );
+
+		}
+
+	}
+
+	_needsUpdate( renderObject ) {
+
+		const data = this.get( renderObject );
+		const material = renderObject.material;
+
+		let needsUpdate = this.backend.needsUpdate( renderObject );
+
+		// check material state
+
+		if ( data.material !== material || data.materialVersion !== material.version ||
+			data.transparent !== material.transparent || data.blending !== material.blending || data.premultipliedAlpha !== material.premultipliedAlpha ||
+			data.blendSrc !== material.blendSrc || data.blendDst !== material.blendDst || data.blendEquation !== material.blendEquation ||
+			data.blendSrcAlpha !== material.blendSrcAlpha || data.blendDstAlpha !== material.blendDstAlpha || data.blendEquationAlpha !== material.blendEquationAlpha ||
+			data.colorWrite !== material.colorWrite ||
+			data.depthWrite !== material.depthWrite || data.depthTest !== material.depthTest || data.depthFunc !== material.depthFunc ||
+			data.stencilWrite !== material.stencilWrite || data.stencilFunc !== material.stencilFunc ||
+			data.stencilFail !== material.stencilFail || data.stencilZFail !== material.stencilZFail || data.stencilZPass !== material.stencilZPass ||
+			data.stencilFuncMask !== material.stencilFuncMask || data.stencilWriteMask !== material.stencilWriteMask ||
+			data.side !== material.side
+		) {
+
+			data.material = material; data.materialVersion = material.version;
+			data.transparent = material.transparent; data.blending = material.blending; data.premultipliedAlpha = material.premultipliedAlpha;
+			data.blendSrc = material.blendSrc; data.blendDst = material.blendDst; data.blendEquation = material.blendEquation;
+			data.blendSrcAlpha = material.blendSrcAlpha; data.blendDstAlpha = material.blendDstAlpha; data.blendEquationAlpha = material.blendEquationAlpha;
+			data.colorWrite = material.colorWrite;
+			data.depthWrite = material.depthWrite; data.depthTest = material.depthTest; data.depthFunc = material.depthFunc;
+			data.stencilWrite = material.stencilWrite; data.stencilFunc = material.stencilFunc;
+			data.stencilFail = material.stencilFail; data.stencilZFail = material.stencilZFail; data.stencilZPass = material.stencilZPass;
+			data.stencilFuncMask = material.stencilFuncMask; data.stencilWriteMask = material.stencilWriteMask;
+			data.side = material.side;
+
+			needsUpdate = true;
+
+		}
+
+		return needsUpdate || data.pipeline !== undefined;
+
+	}
+
+}
+
+export default Pipelines;

package/examples/jsm/renderers/common/ProgrammableStage.js

@@ -0,0 +1,18 @@
+let _id = 0;
+
+class ProgrammableStage {
+
+	constructor( code, type ) {
+
+		this.id = _id ++;
+
+		this.code = code;
+		this.stage = type;
+
+		this.usedTimes = 0;
+
+	}
+
+}
+
+export default ProgrammableStage;

package/examples/jsm/renderers/common/RenderContext.js

@@ -0,0 +1,37 @@
+import { Vector4 } from 'three';
+
+let id = 0;
+
+class RenderContext {
+
+	constructor() {
+
+		this.id = id ++;
+
+		this.color = true;
+		this.clearColor = true;
+		this.clearColorValue = { r: 0, g: 0, b: 0, a: 1 };
+
+		this.depth = true;
+		this.clearDepth = true;
+		this.clearDepthValue = 1;
+
+		this.stencil = true;
+		this.clearStencil = true;
+		this.clearStencilValue = 1;
+
+		this.viewport = false;
+		this.viewportValue = new Vector4();
+
+		this.scissor = false;
+		this.scissorValue = new Vector4();
+
+		this.texture = null;
+		this.depthTexture = null;
+		this.activeCubeFace = 0;
+
+	}
+
+}
+
+export default RenderContext;