1437 lines
		
	
	
		
			31 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
		
		
			
		
	
	
			1437 lines
		
	
	
		
			31 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| 
								 | 
							
								import Animation from './Animation.js';
							 | 
						||
| 
								 | 
							
								import RenderObjects from './RenderObjects.js';
							 | 
						||
| 
								 | 
							
								import Attributes from './Attributes.js';
							 | 
						||
| 
								 | 
							
								import Geometries from './Geometries.js';
							 | 
						||
| 
								 | 
							
								import Info from './Info.js';
							 | 
						||
| 
								 | 
							
								import Pipelines from './Pipelines.js';
							 | 
						||
| 
								 | 
							
								import Bindings from './Bindings.js';
							 | 
						||
| 
								 | 
							
								import RenderLists from './RenderLists.js';
							 | 
						||
| 
								 | 
							
								import RenderContexts from './RenderContexts.js';
							 | 
						||
| 
								 | 
							
								import Textures from './Textures.js';
							 | 
						||
| 
								 | 
							
								import Background from './Background.js';
							 | 
						||
| 
								 | 
							
								import Nodes from './nodes/Nodes.js';
							 | 
						||
| 
								 | 
							
								import Color4 from './Color4.js';
							 | 
						||
| 
								 | 
							
								import ClippingContext from './ClippingContext.js';
							 | 
						||
| 
								 | 
							
								import { Scene, Frustum, Matrix4, Vector2, Vector3, Vector4, DoubleSide, BackSide, FrontSide, SRGBColorSpace, NoColorSpace, NoToneMapping, LinearFilter, LinearSRGBColorSpace, RenderTarget, HalfFloatType, RGBAFormat } from 'three';
							 | 
						||
| 
								 | 
							
								import { NodeMaterial } from '../../nodes/Nodes.js';
							 | 
						||
| 
								 | 
							
								import QuadMesh from '../../objects/QuadMesh.js';
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								const _scene = new Scene();
							 | 
						||
| 
								 | 
							
								const _drawingBufferSize = new Vector2();
							 | 
						||
| 
								 | 
							
								const _screen = new Vector4();
							 | 
						||
| 
								 | 
							
								const _frustum = new Frustum();
							 | 
						||
| 
								 | 
							
								const _projScreenMatrix = new Matrix4();
							 | 
						||
| 
								 | 
							
								const _vector3 = new Vector3();
							 | 
						||
| 
								 | 
							
								const _quad = new QuadMesh( new NodeMaterial() );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								class Renderer {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									constructor( backend, parameters = {} ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.isRenderer = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const {
							 | 
						||
| 
								 | 
							
											logarithmicDepthBuffer = false,
							 | 
						||
| 
								 | 
							
											alpha = true
							 | 
						||
| 
								 | 
							
										} = parameters;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// public
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.domElement = backend.getDomElement();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend = backend;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.autoClear = true;
							 | 
						||
| 
								 | 
							
										this.autoClearColor = true;
							 | 
						||
| 
								 | 
							
										this.autoClearDepth = true;
							 | 
						||
| 
								 | 
							
										this.autoClearStencil = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.alpha = alpha;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.logarithmicDepthBuffer = logarithmicDepthBuffer;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.outputColorSpace = SRGBColorSpace;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.toneMapping = NoToneMapping;
							 | 
						||
| 
								 | 
							
										this.toneMappingExposure = 1.0;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.sortObjects = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.depth = true;
							 | 
						||
| 
								 | 
							
										this.stencil = false;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.clippingPlanes = [];
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.info = new Info();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// nodes
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.toneMappingNode = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// internals
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._pixelRatio = 1;
							 | 
						||
| 
								 | 
							
										this._width = this.domElement.width;
							 | 
						||
| 
								 | 
							
										this._height = this.domElement.height;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._viewport = new Vector4( 0, 0, this._width, this._height );
							 | 
						||
| 
								 | 
							
										this._scissor = new Vector4( 0, 0, this._width, this._height );
							 | 
						||
| 
								 | 
							
										this._scissorTest = false;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._attributes = null;
							 | 
						||
| 
								 | 
							
										this._geometries = null;
							 | 
						||
| 
								 | 
							
										this._nodes = null;
							 | 
						||
| 
								 | 
							
										this._animation = null;
							 | 
						||
| 
								 | 
							
										this._bindings = null;
							 | 
						||
| 
								 | 
							
										this._objects = null;
							 | 
						||
| 
								 | 
							
										this._pipelines = null;
							 | 
						||
| 
								 | 
							
										this._renderLists = null;
							 | 
						||
| 
								 | 
							
										this._renderContexts = null;
							 | 
						||
| 
								 | 
							
										this._textures = null;
							 | 
						||
| 
								 | 
							
										this._background = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._currentRenderContext = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._opaqueSort = null;
							 | 
						||
| 
								 | 
							
										this._transparentSort = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._frameBufferTarget = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const alphaClear = this.alpha === true ? 0 : 1;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._clearColor = new Color4( 0, 0, 0, alphaClear );
							 | 
						||
| 
								 | 
							
										this._clearDepth = 1;
							 | 
						||
| 
								 | 
							
										this._clearStencil = 0;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._renderTarget = null;
							 | 
						||
| 
								 | 
							
										this._activeCubeFace = 0;
							 | 
						||
| 
								 | 
							
										this._activeMipmapLevel = 0;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._renderObjectFunction = null;
							 | 
						||
| 
								 | 
							
										this._currentRenderObjectFunction = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._handleObjectFunction = this._renderObjectDirect;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._initialized = false;
							 | 
						||
| 
								 | 
							
										this._initPromise = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._compilationPromises = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// backwards compatibility
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.shadowMap = {
							 | 
						||
| 
								 | 
							
											enabled: false,
							 | 
						||
| 
								 | 
							
											type: null
							 | 
						||
| 
								 | 
							
										};
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.xr = {
							 | 
						||
| 
								 | 
							
											enabled: false
							 | 
						||
| 
								 | 
							
										};
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async init() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											throw new Error( 'Renderer: Backend has already been initialized.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initPromise !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											return this._initPromise;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._initPromise = new Promise( async ( resolve, reject ) => {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const backend = this.backend;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											try {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												await backend.init( this );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} catch ( error ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												reject( error );
							 | 
						||
| 
								 | 
							
												return;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._nodes = new Nodes( this, backend );
							 | 
						||
| 
								 | 
							
											this._animation = new Animation( this._nodes, this.info );
							 | 
						||
| 
								 | 
							
											this._attributes = new Attributes( backend );
							 | 
						||
| 
								 | 
							
											this._background = new Background( this, this._nodes );
							 | 
						||
| 
								 | 
							
											this._geometries = new Geometries( this._attributes, this.info );
							 | 
						||
| 
								 | 
							
											this._textures = new Textures( this, backend, this.info );
							 | 
						||
| 
								 | 
							
											this._pipelines = new Pipelines( backend, this._nodes );
							 | 
						||
| 
								 | 
							
											this._bindings = new Bindings( backend, this._nodes, this._textures, this._attributes, this._pipelines, this.info );
							 | 
						||
| 
								 | 
							
											this._objects = new RenderObjects( this, this._nodes, this._geometries, this._pipelines, this._bindings, this.info );
							 | 
						||
| 
								 | 
							
											this._renderLists = new RenderLists();
							 | 
						||
| 
								 | 
							
											this._renderContexts = new RenderContexts();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._initialized = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											resolve();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._initPromise;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									get coordinateSystem() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.backend.coordinateSystem;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async compileAsync( scene, camera, targetScene = null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) await this.init();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// preserve render tree
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const nodeFrame = this._nodes.nodeFrame;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const previousRenderId = nodeFrame.renderId;
							 | 
						||
| 
								 | 
							
										const previousRenderContext = this._currentRenderContext;
							 | 
						||
| 
								 | 
							
										const previousRenderObjectFunction = this._currentRenderObjectFunction;
							 | 
						||
| 
								 | 
							
										const previousCompilationPromises = this._compilationPromises;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const sceneRef = ( scene.isScene === true ) ? scene : _scene;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( targetScene === null ) targetScene = scene;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderTarget = this._renderTarget;
							 | 
						||
| 
								 | 
							
										const renderContext = this._renderContexts.get( targetScene, camera, renderTarget );
							 | 
						||
| 
								 | 
							
										const activeMipmapLevel = this._activeMipmapLevel;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const compilationPromises = [];
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._currentRenderContext = renderContext;
							 | 
						||
| 
								 | 
							
										this._currentRenderObjectFunction = this.renderObject;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._handleObjectFunction = this._createObjectPipeline;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._compilationPromises = compilationPromises;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.renderId ++;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.update();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										renderContext.depth = this.depth;
							 | 
						||
| 
								 | 
							
										renderContext.stencil = this.stencil;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( ! renderContext.clippingContext ) renderContext.clippingContext = new ClippingContext();
							 | 
						||
| 
								 | 
							
										renderContext.clippingContext.updateGlobal( this, camera );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										sceneRef.onBeforeRender( this, scene, camera, renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderList = this._renderLists.get( scene, camera );
							 | 
						||
| 
								 | 
							
										renderList.begin();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._projectObject( scene, camera, 0, renderList );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// include lights from target scene
							 | 
						||
| 
								 | 
							
										if ( targetScene !== scene ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											targetScene.traverseVisible( function ( object ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( object.isLight && object.layers.test( camera.layers ) ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													renderList.pushLight( object );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										renderList.finish();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( renderTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._textures.updateRenderTarget( renderTarget, activeMipmapLevel );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const renderTargetData = this._textures.get( renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderContext.textures = renderTargetData.textures;
							 | 
						||
| 
								 | 
							
											renderContext.depthTexture = renderTargetData.depthTexture;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderContext.textures = null;
							 | 
						||
| 
								 | 
							
											renderContext.depthTexture = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._nodes.updateScene( sceneRef );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._background.update( sceneRef, renderList, renderContext );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// process render lists
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const opaqueObjects = renderList.opaque;
							 | 
						||
| 
								 | 
							
										const transparentObjects = renderList.transparent;
							 | 
						||
| 
								 | 
							
										const lightsNode = renderList.lightsNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( opaqueObjects.length > 0 ) this._renderObjects( opaqueObjects, camera, sceneRef, lightsNode );
							 | 
						||
| 
								 | 
							
										if ( transparentObjects.length > 0 ) this._renderObjects( transparentObjects, camera, sceneRef, lightsNode );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// restore render tree
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.renderId = previousRenderId;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._currentRenderContext = previousRenderContext;
							 | 
						||
| 
								 | 
							
										this._currentRenderObjectFunction = previousRenderObjectFunction;
							 | 
						||
| 
								 | 
							
										this._compilationPromises = previousCompilationPromises;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._handleObjectFunction = this._renderObjectDirect;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// wait for all promises setup by backends awaiting compilation/linking/pipeline creation to complete
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										await Promise.all( compilationPromises );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async renderAsync( scene, camera ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) await this.init();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderContext = this._renderScene( scene, camera );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										await this.backend.resolveTimestampAsync( renderContext, 'render' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									render( scene, camera ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											console.warn( 'THREE.Renderer: .render() called before the backend is initialized. Try using .renderAsync() instead.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											return this.renderAsync( scene, camera );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._renderScene( scene, camera );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									_getFrameBufferTarget() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const { currentColorSpace } = this;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const useToneMapping = this._renderTarget === null && ( this.toneMapping !== NoToneMapping || this.toneMappingNode !== null );
							 | 
						||
| 
								 | 
							
										const useColorSpace = currentColorSpace !== LinearSRGBColorSpace && currentColorSpace !== NoColorSpace;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( useToneMapping === false && useColorSpace === false ) return null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const { width, height } = this.getDrawingBufferSize( _drawingBufferSize );
							 | 
						||
| 
								 | 
							
										const { depth, stencil } = this;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										let frameBufferTarget = this._frameBufferTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( frameBufferTarget === null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											frameBufferTarget = new RenderTarget( width, height, {
							 | 
						||
| 
								 | 
							
												depthBuffer: depth,
							 | 
						||
| 
								 | 
							
												stencilBuffer: stencil,
							 | 
						||
| 
								 | 
							
												type: HalfFloatType, // FloatType
							 | 
						||
| 
								 | 
							
												format: RGBAFormat,
							 | 
						||
| 
								 | 
							
												colorSpace: LinearSRGBColorSpace,
							 | 
						||
| 
								 | 
							
												generateMipmaps: false,
							 | 
						||
| 
								 | 
							
												minFilter: LinearFilter,
							 | 
						||
| 
								 | 
							
												magFilter: LinearFilter,
							 | 
						||
| 
								 | 
							
												samples: this.backend.parameters.antialias ? 4 : 0
							 | 
						||
| 
								 | 
							
											} );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											frameBufferTarget.isPostProcessingRenderTarget = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._frameBufferTarget = frameBufferTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										frameBufferTarget.depthBuffer = depth;
							 | 
						||
| 
								 | 
							
										frameBufferTarget.stencilBuffer = stencil;
							 | 
						||
| 
								 | 
							
										frameBufferTarget.setSize( width, height );
							 | 
						||
| 
								 | 
							
										frameBufferTarget.viewport.copy( this._viewport );
							 | 
						||
| 
								 | 
							
										frameBufferTarget.scissor.copy( this._scissor );
							 | 
						||
| 
								 | 
							
										frameBufferTarget.viewport.multiplyScalar( this._pixelRatio );
							 | 
						||
| 
								 | 
							
										frameBufferTarget.scissor.multiplyScalar( this._pixelRatio );
							 | 
						||
| 
								 | 
							
										frameBufferTarget.scissorTest = this._scissorTest;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return frameBufferTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									_renderScene( scene, camera, useFrameBufferTarget = true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const frameBufferTarget = useFrameBufferTarget ? this._getFrameBufferTarget() : null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// preserve render tree
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const nodeFrame = this._nodes.nodeFrame;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const previousRenderId = nodeFrame.renderId;
							 | 
						||
| 
								 | 
							
										const previousRenderContext = this._currentRenderContext;
							 | 
						||
| 
								 | 
							
										const previousRenderObjectFunction = this._currentRenderObjectFunction;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const sceneRef = ( scene.isScene === true ) ? scene : _scene;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const outputRenderTarget = this._renderTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const activeCubeFace = this._activeCubeFace;
							 | 
						||
| 
								 | 
							
										const activeMipmapLevel = this._activeMipmapLevel;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										let renderTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( frameBufferTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderTarget = frameBufferTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this.setRenderTarget( renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderTarget = outputRenderTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderContext = this._renderContexts.get( scene, camera, renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._currentRenderContext = renderContext;
							 | 
						||
| 
								 | 
							
										this._currentRenderObjectFunction = this._renderObjectFunction || this.renderObject;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.info.calls ++;
							 | 
						||
| 
								 | 
							
										this.info.render.calls ++;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.renderId = this.info.calls;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const coordinateSystem = this.coordinateSystem;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( camera.coordinateSystem !== coordinateSystem ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											camera.coordinateSystem = coordinateSystem;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											camera.updateProjectionMatrix();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( scene.matrixWorldAutoUpdate === true ) scene.updateMatrixWorld();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( camera.parent === null && camera.matrixWorldAutoUpdate === true ) camera.updateMatrixWorld();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										let viewport = this._viewport;
							 | 
						||
| 
								 | 
							
										let scissor = this._scissor;
							 | 
						||
| 
								 | 
							
										let pixelRatio = this._pixelRatio;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( renderTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											viewport = renderTarget.viewport;
							 | 
						||
| 
								 | 
							
											scissor = renderTarget.scissor;
							 | 
						||
| 
								 | 
							
											pixelRatio = 1;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.getDrawingBufferSize( _drawingBufferSize );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										_screen.set( 0, 0, _drawingBufferSize.width, _drawingBufferSize.height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const minDepth = ( viewport.minDepth === undefined ) ? 0 : viewport.minDepth;
							 | 
						||
| 
								 | 
							
										const maxDepth = ( viewport.maxDepth === undefined ) ? 1 : viewport.maxDepth;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										renderContext.viewportValue.copy( viewport ).multiplyScalar( pixelRatio ).floor();
							 | 
						||
| 
								 | 
							
										renderContext.viewportValue.width >>= activeMipmapLevel;
							 | 
						||
| 
								 | 
							
										renderContext.viewportValue.height >>= activeMipmapLevel;
							 | 
						||
| 
								 | 
							
										renderContext.viewportValue.minDepth = minDepth;
							 | 
						||
| 
								 | 
							
										renderContext.viewportValue.maxDepth = maxDepth;
							 | 
						||
| 
								 | 
							
										renderContext.viewport = renderContext.viewportValue.equals( _screen ) === false;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										renderContext.scissorValue.copy( scissor ).multiplyScalar( pixelRatio ).floor();
							 | 
						||
| 
								 | 
							
										renderContext.scissor = this._scissorTest && renderContext.scissorValue.equals( _screen ) === false;
							 | 
						||
| 
								 | 
							
										renderContext.scissorValue.width >>= activeMipmapLevel;
							 | 
						||
| 
								 | 
							
										renderContext.scissorValue.height >>= activeMipmapLevel;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( ! renderContext.clippingContext ) renderContext.clippingContext = new ClippingContext();
							 | 
						||
| 
								 | 
							
										renderContext.clippingContext.updateGlobal( this, camera );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										sceneRef.onBeforeRender( this, scene, camera, renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										_projScreenMatrix.multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse );
							 | 
						||
| 
								 | 
							
										_frustum.setFromProjectionMatrix( _projScreenMatrix, coordinateSystem );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderList = this._renderLists.get( scene, camera );
							 | 
						||
| 
								 | 
							
										renderList.begin();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._projectObject( scene, camera, 0, renderList );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										renderList.finish();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this.sortObjects === true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderList.sort( this._opaqueSort, this._transparentSort );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( renderTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._textures.updateRenderTarget( renderTarget, activeMipmapLevel );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const renderTargetData = this._textures.get( renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderContext.textures = renderTargetData.textures;
							 | 
						||
| 
								 | 
							
											renderContext.depthTexture = renderTargetData.depthTexture;
							 | 
						||
| 
								 | 
							
											renderContext.width = renderTargetData.width;
							 | 
						||
| 
								 | 
							
											renderContext.height = renderTargetData.height;
							 | 
						||
| 
								 | 
							
											renderContext.renderTarget = renderTarget;
							 | 
						||
| 
								 | 
							
											renderContext.depth = renderTarget.depthBuffer;
							 | 
						||
| 
								 | 
							
											renderContext.stencil = renderTarget.stencilBuffer;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderContext.textures = null;
							 | 
						||
| 
								 | 
							
											renderContext.depthTexture = null;
							 | 
						||
| 
								 | 
							
											renderContext.width = this.domElement.width;
							 | 
						||
| 
								 | 
							
											renderContext.height = this.domElement.height;
							 | 
						||
| 
								 | 
							
											renderContext.depth = this.depth;
							 | 
						||
| 
								 | 
							
											renderContext.stencil = this.stencil;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										renderContext.width >>= activeMipmapLevel;
							 | 
						||
| 
								 | 
							
										renderContext.height >>= activeMipmapLevel;
							 | 
						||
| 
								 | 
							
										renderContext.activeCubeFace = activeCubeFace;
							 | 
						||
| 
								 | 
							
										renderContext.activeMipmapLevel = activeMipmapLevel;
							 | 
						||
| 
								 | 
							
										renderContext.occlusionQueryCount = renderList.occlusionQueryCount;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._nodes.updateScene( sceneRef );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._background.update( sceneRef, renderList, renderContext );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.beginRender( renderContext );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// process render lists
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const opaqueObjects = renderList.opaque;
							 | 
						||
| 
								 | 
							
										const transparentObjects = renderList.transparent;
							 | 
						||
| 
								 | 
							
										const lightsNode = renderList.lightsNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( opaqueObjects.length > 0 ) this._renderObjects( opaqueObjects, camera, sceneRef, lightsNode );
							 | 
						||
| 
								 | 
							
										if ( transparentObjects.length > 0 ) this._renderObjects( transparentObjects, camera, sceneRef, lightsNode );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// finish render pass
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.finishRender( renderContext );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// restore render tree
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.renderId = previousRenderId;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._currentRenderContext = previousRenderContext;
							 | 
						||
| 
								 | 
							
										this._currentRenderObjectFunction = previousRenderObjectFunction;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( frameBufferTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this.setRenderTarget( outputRenderTarget, activeCubeFace, activeMipmapLevel );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											_quad.material.fragmentNode = this._nodes.getOutputNode( renderTarget.texture );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._renderScene( _quad, _quad.camera, false );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										sceneRef.onAfterRender( this, scene, camera, renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return renderContext;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getMaxAnisotropy() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.backend.getMaxAnisotropy();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getActiveCubeFace() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._activeCubeFace;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getActiveMipmapLevel() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._activeMipmapLevel;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async setAnimationLoop( callback ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) await this.init();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._animation.setAnimationLoop( callback );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getArrayBuffer( attribute ) { // @deprecated, r155
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										console.warn( 'THREE.Renderer: getArrayBuffer() is deprecated. Use getArrayBufferAsync() instead.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.getArrayBufferAsync( attribute );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async getArrayBufferAsync( attribute ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return await this.backend.getArrayBufferAsync( attribute );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getContext() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.backend.getContext();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getPixelRatio() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._pixelRatio;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getDrawingBufferSize( target ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return target.set( this._width * this._pixelRatio, this._height * this._pixelRatio ).floor();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getSize( target ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return target.set( this._width, this._height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setPixelRatio( value = 1 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._pixelRatio = value;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.setSize( this._width, this._height, false );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setDrawingBufferSize( width, height, pixelRatio ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._width = width;
							 | 
						||
| 
								 | 
							
										this._height = height;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._pixelRatio = pixelRatio;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.domElement.width = Math.floor( width * pixelRatio );
							 | 
						||
| 
								 | 
							
										this.domElement.height = Math.floor( height * pixelRatio );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.setViewport( 0, 0, width, height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized ) this.backend.updateSize();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setSize( width, height, updateStyle = true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._width = width;
							 | 
						||
| 
								 | 
							
										this._height = height;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.domElement.width = Math.floor( width * this._pixelRatio );
							 | 
						||
| 
								 | 
							
										this.domElement.height = Math.floor( height * this._pixelRatio );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( updateStyle === true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this.domElement.style.width = width + 'px';
							 | 
						||
| 
								 | 
							
											this.domElement.style.height = height + 'px';
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.setViewport( 0, 0, width, height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized ) this.backend.updateSize();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setOpaqueSort( method ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._opaqueSort = method;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setTransparentSort( method ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._transparentSort = method;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getScissor( target ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const scissor = this._scissor;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										target.x = scissor.x;
							 | 
						||
| 
								 | 
							
										target.y = scissor.y;
							 | 
						||
| 
								 | 
							
										target.width = scissor.width;
							 | 
						||
| 
								 | 
							
										target.height = scissor.height;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return target;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setScissor( x, y, width, height ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const scissor = this._scissor;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( x.isVector4 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											scissor.copy( x );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											scissor.set( x, y, width, height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getScissorTest() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._scissorTest;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setScissorTest( boolean ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._scissorTest = boolean;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.setScissorTest( boolean );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getViewport( target ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return target.copy( this._viewport );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setViewport( x, y, width, height, minDepth = 0, maxDepth = 1 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const viewport = this._viewport;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( x.isVector4 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											viewport.copy( x );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											viewport.set( x, y, width, height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										viewport.minDepth = minDepth;
							 | 
						||
| 
								 | 
							
										viewport.maxDepth = maxDepth;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getClearColor( target ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return target.copy( this._clearColor );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setClearColor( color, alpha = 1 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._clearColor.set( color );
							 | 
						||
| 
								 | 
							
										this._clearColor.a = alpha;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getClearAlpha() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._clearColor.a;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setClearAlpha( alpha ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._clearColor.a = alpha;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getClearDepth() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._clearDepth;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setClearDepth( depth ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._clearDepth = depth;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getClearStencil() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._clearStencil;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setClearStencil( stencil ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._clearStencil = stencil;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									isOccluded( object ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderContext = this._currentRenderContext;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return renderContext && this.backend.isOccluded( renderContext, object );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clear( color = true, depth = true, stencil = true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											console.warn( 'THREE.Renderer: .clear() called before the backend is initialized. Try using .clearAsync() instead.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											return this.clearAsync( color, depth, stencil );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderTarget = this._renderTarget || this._getFrameBufferTarget();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										let renderTargetData = null;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( renderTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._textures.updateRenderTarget( renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											renderTargetData = this._textures.get( renderTarget );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.clear( color, depth, stencil, renderTargetData );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clearColor() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.clear( true, false, false );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clearDepth() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.clear( false, true, false );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clearStencil() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.clear( false, false, true );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async clearAsync( color = true, depth = true, stencil = true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) await this.init();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.clear( color, depth, stencil );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clearColorAsync() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.clearAsync( true, false, false );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clearDepthAsync() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.clearAsync( false, true, false );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									clearStencilAsync() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.clearAsync( false, false, true );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									get currentColorSpace() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderTarget = this._renderTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( renderTarget !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const texture = renderTarget.texture;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											return ( Array.isArray( texture ) ? texture[ 0 ] : texture ).colorSpace;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.outputColorSpace;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									dispose() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.info.dispose();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._animation.dispose();
							 | 
						||
| 
								 | 
							
										this._objects.dispose();
							 | 
						||
| 
								 | 
							
										this._pipelines.dispose();
							 | 
						||
| 
								 | 
							
										this._nodes.dispose();
							 | 
						||
| 
								 | 
							
										this._bindings.dispose();
							 | 
						||
| 
								 | 
							
										this._renderLists.dispose();
							 | 
						||
| 
								 | 
							
										this._renderContexts.dispose();
							 | 
						||
| 
								 | 
							
										this._textures.dispose();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.setRenderTarget( null );
							 | 
						||
| 
								 | 
							
										this.setAnimationLoop( null );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setRenderTarget( renderTarget, activeCubeFace = 0, activeMipmapLevel = 0 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._renderTarget = renderTarget;
							 | 
						||
| 
								 | 
							
										this._activeCubeFace = activeCubeFace;
							 | 
						||
| 
								 | 
							
										this._activeMipmapLevel = activeMipmapLevel;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getRenderTarget() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._renderTarget;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									setRenderObjectFunction( renderObjectFunction ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._renderObjectFunction = renderObjectFunction;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									getRenderObjectFunction() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this._renderObjectFunction;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async computeAsync( computeNodes ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) await this.init();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const nodeFrame = this._nodes.nodeFrame;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const previousRenderId = nodeFrame.renderId;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.info.calls ++;
							 | 
						||
| 
								 | 
							
										this.info.compute.calls ++;
							 | 
						||
| 
								 | 
							
										this.info.compute.computeCalls ++;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.renderId = this.info.calls;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const backend = this.backend;
							 | 
						||
| 
								 | 
							
										const pipelines = this._pipelines;
							 | 
						||
| 
								 | 
							
										const bindings = this._bindings;
							 | 
						||
| 
								 | 
							
										const nodes = this._nodes;
							 | 
						||
| 
								 | 
							
										const computeList = Array.isArray( computeNodes ) ? computeNodes : [ computeNodes ];
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( computeList[ 0 ] === undefined || computeList[ 0 ].isComputeNode !== true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											throw new Error( 'THREE.Renderer: .compute() expects a ComputeNode.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										backend.beginCompute( computeNodes );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										for ( const computeNode of computeList ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											// onInit
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											if ( pipelines.has( computeNode ) === false ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												const dispose = () => {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													computeNode.removeEventListener( 'dispose', dispose );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													pipelines.delete( computeNode );
							 | 
						||
| 
								 | 
							
													bindings.delete( computeNode );
							 | 
						||
| 
								 | 
							
													nodes.delete( computeNode );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												};
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												computeNode.addEventListener( 'dispose', dispose );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												computeNode.onInit( { renderer: this } );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											nodes.updateForCompute( computeNode );
							 | 
						||
| 
								 | 
							
											bindings.updateForCompute( computeNode );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const computeBindings = bindings.getForCompute( computeNode );
							 | 
						||
| 
								 | 
							
											const computePipeline = pipelines.getForCompute( computeNode, computeBindings );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											backend.compute( computeNodes, computeNode, computeBindings, computePipeline );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										backend.finishCompute( computeNodes );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										await this.backend.resolveTimestampAsync( computeNodes, 'compute' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										nodeFrame.renderId = previousRenderId;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									async hasFeatureAsync( name ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) await this.init();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.backend.hasFeature( name );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									hasFeature( name ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( this._initialized === false ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											console.warn( 'THREE.Renderer: .hasFeature() called before the backend is initialized. Try using .hasFeatureAsync() instead.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											return false;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.backend.hasFeature( name );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									copyFramebufferToTexture( framebufferTexture ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderContext = this._currentRenderContext;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._textures.updateTexture( framebufferTexture );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.copyFramebufferToTexture( framebufferTexture, renderContext );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									copyTextureToTexture( position, srcTexture, dstTexture, level = 0 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._textures.updateTexture( srcTexture );
							 | 
						||
| 
								 | 
							
										this._textures.updateTexture( dstTexture );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.copyTextureToTexture( position, srcTexture, dstTexture, level );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									readRenderTargetPixelsAsync( renderTarget, x, y, width, height, index = 0 ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.backend.copyTextureToBuffer( renderTarget.textures[ index ], x, y, width, height );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									_projectObject( object, camera, groupOrder, renderList ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( object.visible === false ) return;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const visible = object.layers.test( camera.layers );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( visible ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											if ( object.isGroup ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												groupOrder = object.renderOrder;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} else if ( object.isLOD ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( object.autoUpdate === true ) object.update( camera );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} else if ( object.isLight ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												renderList.pushLight( object );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} else if ( object.isSprite ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( ! object.frustumCulled || _frustum.intersectsSprite( object ) ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													if ( this.sortObjects === true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														_vector3.setFromMatrixPosition( object.matrixWorld ).applyMatrix4( _projScreenMatrix );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													const geometry = object.geometry;
							 | 
						||
| 
								 | 
							
													const material = object.material;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													if ( material.visible ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														renderList.push( object, geometry, material, groupOrder, _vector3.z, null );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} else if ( object.isLineLoop ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												console.error( 'THREE.Renderer: Objects of type THREE.LineLoop are not supported. Please use THREE.Line or THREE.LineSegments.' );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} else if ( object.isMesh || object.isLine || object.isPoints ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( ! object.frustumCulled || _frustum.intersectsObject( object ) ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													const geometry = object.geometry;
							 | 
						||
| 
								 | 
							
													const material = object.material;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													if ( this.sortObjects === true ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														if ( geometry.boundingSphere === null ) geometry.computeBoundingSphere();
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														_vector3
							 | 
						||
| 
								 | 
							
															.copy( geometry.boundingSphere.center )
							 | 
						||
| 
								 | 
							
															.applyMatrix4( object.matrixWorld )
							 | 
						||
| 
								 | 
							
															.applyMatrix4( _projScreenMatrix );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													if ( Array.isArray( material ) ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														const groups = geometry.groups;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														for ( let i = 0, l = groups.length; i < l; i ++ ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
															const group = groups[ i ];
							 | 
						||
| 
								 | 
							
															const groupMaterial = material[ group.materialIndex ];
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
															if ( groupMaterial && groupMaterial.visible ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
																renderList.push( object, geometry, groupMaterial, groupOrder, _vector3.z, group );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
															}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													} else if ( material.visible ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														renderList.push( object, geometry, material, groupOrder, _vector3.z, null );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const children = object.children;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										for ( let i = 0, l = children.length; i < l; i ++ ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._projectObject( children[ i ], camera, groupOrder, renderList );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									_renderObjects( renderList, camera, scene, lightsNode ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										// process renderable objects
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										for ( let i = 0, il = renderList.length; i < il; i ++ ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const renderItem = renderList[ i ];
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											// @TODO: Add support for multiple materials per object. This will require to extract
							 | 
						||
| 
								 | 
							
											// the material from the renderItem object and pass it with its group data to renderObject().
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const { object, geometry, material, group } = renderItem;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											if ( camera.isArrayCamera ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												const cameras = camera.cameras;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												for ( let j = 0, jl = cameras.length; j < jl; j ++ ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													const camera2 = cameras[ j ];
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													if ( object.layers.test( camera2.layers ) ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														const vp = camera2.viewport;
							 | 
						||
| 
								 | 
							
														const minDepth = ( vp.minDepth === undefined ) ? 0 : vp.minDepth;
							 | 
						||
| 
								 | 
							
														const maxDepth = ( vp.maxDepth === undefined ) ? 1 : vp.maxDepth;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														const viewportValue = this._currentRenderContext.viewportValue;
							 | 
						||
| 
								 | 
							
														viewportValue.copy( vp ).multiplyScalar( this._pixelRatio ).floor();
							 | 
						||
| 
								 | 
							
														viewportValue.minDepth = minDepth;
							 | 
						||
| 
								 | 
							
														viewportValue.maxDepth = maxDepth;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														this.backend.updateViewport( this._currentRenderContext );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														this._currentRenderObjectFunction( object, scene, camera2, geometry, material, group, lightsNode );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												this._currentRenderObjectFunction( object, scene, camera, geometry, material, group, lightsNode );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									renderObject( object, scene, camera, geometry, material, group, lightsNode ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										let overridePositionNode;
							 | 
						||
| 
								 | 
							
										let overrideFragmentNode;
							 | 
						||
| 
								 | 
							
										let overrideDepthNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										object.onBeforeRender( this, scene, camera, geometry, material, group );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										material.onBeforeRender( this, scene, camera, geometry, material, group );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( scene.overrideMaterial !== null ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											const overrideMaterial = scene.overrideMaterial;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											if ( material.positionNode && material.positionNode.isNode ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												overridePositionNode = overrideMaterial.positionNode;
							 | 
						||
| 
								 | 
							
												overrideMaterial.positionNode = material.positionNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											if ( overrideMaterial.isShadowNodeMaterial ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												overrideMaterial.side = material.shadowSide === null ? material.side : material.shadowSide;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( material.depthNode && material.depthNode.isNode ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													overrideDepthNode = overrideMaterial.depthNode;
							 | 
						||
| 
								 | 
							
													overrideMaterial.depthNode = material.depthNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( material.shadowNode && material.shadowNode.isNode ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													overrideFragmentNode = overrideMaterial.fragmentNode;
							 | 
						||
| 
								 | 
							
													overrideMaterial.fragmentNode = material.shadowNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												if ( this.localClippingEnabled ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													if ( material.clipShadows ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														if ( overrideMaterial.clippingPlanes !== material.clippingPlanes ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
															overrideMaterial.clippingPlanes = material.clippingPlanes;
							 | 
						||
| 
								 | 
							
															overrideMaterial.needsUpdate = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														if ( overrideMaterial.clipIntersection !== material.clipIntersection ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
															overrideMaterial.clipIntersection = material.clipIntersection;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													} else if ( Array.isArray( overrideMaterial.clippingPlanes ) ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
														overrideMaterial.clippingPlanes = null;
							 | 
						||
| 
								 | 
							
														overrideMaterial.needsUpdate = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
													}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
												}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											material = overrideMaterial;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( material.transparent === true && material.side === DoubleSide && material.forceSinglePass === false ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											material.side = BackSide;
							 | 
						||
| 
								 | 
							
											this._handleObjectFunction( object, material, scene, camera, lightsNode, group, 'backSide' ); // create backSide pass id
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											material.side = FrontSide;
							 | 
						||
| 
								 | 
							
											this._handleObjectFunction( object, material, scene, camera, lightsNode, group ); // use default pass id
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											material.side = DoubleSide;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										} else {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											this._handleObjectFunction( object, material, scene, camera, lightsNode, group );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( overridePositionNode !== undefined ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											scene.overrideMaterial.positionNode = overridePositionNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( overrideDepthNode !== undefined ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											scene.overrideMaterial.depthNode = overrideDepthNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										if ( overrideFragmentNode !== undefined ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
											scene.overrideMaterial.fragmentNode = overrideFragmentNode;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										object.onAfterRender( this, scene, camera, geometry, material, group );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									_renderObjectDirect( object, material, scene, camera, lightsNode, group, passId ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderObject = this._objects.get( object, material, scene, camera, lightsNode, this._currentRenderContext, passId );
							 | 
						||
| 
								 | 
							
										renderObject.drawRange = group || object.geometry.drawRange;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._nodes.updateBefore( renderObject );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										object.modelViewMatrix.multiplyMatrices( camera.matrixWorldInverse, object.matrixWorld );
							 | 
						||
| 
								 | 
							
										object.normalMatrix.getNormalMatrix( object.modelViewMatrix );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._nodes.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
										this._geometries.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
										this._bindings.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
										this._pipelines.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this.backend.draw( renderObject, this.info );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									_createObjectPipeline( object, material, scene, camera, lightsNode, passId ) {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										const renderObject = this._objects.get( object, material, scene, camera, lightsNode, this._currentRenderContext, passId );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._nodes.updateBefore( renderObject );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										//
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._nodes.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
										this._geometries.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
										this._bindings.updateForRender( renderObject );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										this._pipelines.getForRender( renderObject, this._compilationPromises );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									get compute() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.computeAsync;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									get compile() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
										return this.compileAsync;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
									}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								export default Renderer;
							 |