From 9b260d8970dc68df2cd5cd48c50dfc2c3b792197 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Tue, 20 Jun 2017 12:33:07 -0700 Subject: [PATCH] WebGLRenderer: Moved background code to WebGLBackground. --- src/renderers/WebGLRenderer.js | 130 ++--------------------- src/renderers/webgl/WebGLBackground.js | 139 +++++++++++++++++++++++++ 2 files changed, 148 insertions(+), 121 deletions(-) create mode 100644 src/renderers/webgl/WebGLBackground.js diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 68fd57a591..b0448a8cdf 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -1,4 +1,4 @@ -import { REVISION, MaxEquation, MinEquation, RGB_ETC1_Format, RGBA_PVRTC_2BPPV1_Format, RGBA_PVRTC_4BPPV1_Format, RGB_PVRTC_2BPPV1_Format, RGB_PVRTC_4BPPV1_Format, RGBA_S3TC_DXT5_Format, RGBA_S3TC_DXT3_Format, RGBA_S3TC_DXT1_Format, RGB_S3TC_DXT1_Format, SrcAlphaSaturateFactor, OneMinusDstColorFactor, DstColorFactor, OneMinusDstAlphaFactor, DstAlphaFactor, OneMinusSrcAlphaFactor, SrcAlphaFactor, OneMinusSrcColorFactor, SrcColorFactor, OneFactor, ZeroFactor, ReverseSubtractEquation, SubtractEquation, AddEquation, DepthFormat, DepthStencilFormat, LuminanceAlphaFormat, LuminanceFormat, RGBAFormat, RGBFormat, AlphaFormat, HalfFloatType, FloatType, UnsignedIntType, IntType, UnsignedShortType, ShortType, ByteType, UnsignedInt248Type, UnsignedShort565Type, UnsignedShort5551Type, UnsignedShort4444Type, UnsignedByteType, LinearMipMapLinearFilter, LinearMipMapNearestFilter, LinearFilter, NearestMipMapLinearFilter, NearestMipMapNearestFilter, NearestFilter, MirroredRepeatWrapping, ClampToEdgeWrapping, RepeatWrapping, FrontFaceDirectionCW, NoBlending, BackSide, TriangleFanDrawMode, TriangleStripDrawMode, TrianglesDrawMode, NoColors, FlatShading, LinearToneMapping } from '../constants'; +import { REVISION, MaxEquation, MinEquation, RGB_ETC1_Format, RGBA_PVRTC_2BPPV1_Format, RGBA_PVRTC_4BPPV1_Format, RGB_PVRTC_2BPPV1_Format, RGB_PVRTC_4BPPV1_Format, RGBA_S3TC_DXT5_Format, RGBA_S3TC_DXT3_Format, RGBA_S3TC_DXT1_Format, RGB_S3TC_DXT1_Format, SrcAlphaSaturateFactor, OneMinusDstColorFactor, DstColorFactor, OneMinusDstAlphaFactor, DstAlphaFactor, OneMinusSrcAlphaFactor, SrcAlphaFactor, OneMinusSrcColorFactor, SrcColorFactor, OneFactor, ZeroFactor, ReverseSubtractEquation, SubtractEquation, AddEquation, DepthFormat, DepthStencilFormat, LuminanceAlphaFormat, LuminanceFormat, RGBAFormat, RGBFormat, AlphaFormat, HalfFloatType, FloatType, UnsignedIntType, IntType, UnsignedShortType, ShortType, ByteType, UnsignedInt248Type, UnsignedShort565Type, UnsignedShort5551Type, UnsignedShort4444Type, UnsignedByteType, LinearMipMapLinearFilter, LinearMipMapNearestFilter, LinearFilter, NearestMipMapLinearFilter, NearestMipMapNearestFilter, NearestFilter, MirroredRepeatWrapping, ClampToEdgeWrapping, RepeatWrapping, FrontFaceDirectionCW, NoBlending, TriangleFanDrawMode, TriangleStripDrawMode, TrianglesDrawMode, NoColors, FlatShading, LinearToneMapping } from '../constants'; import { _Math } from '../math/Math'; import { Matrix4 } from '../math/Matrix4'; import { DataTexture } from '../textures/DataTexture'; @@ -9,14 +9,8 @@ import { ShaderLib } from './shaders/ShaderLib'; import { LensFlarePlugin } from './webgl/plugins/LensFlarePlugin'; import { SpritePlugin } from './webgl/plugins/SpritePlugin'; import { WebGLShadowMap } from './webgl/WebGLShadowMap'; -import { ShaderMaterial } from '../materials/ShaderMaterial'; -import { Mesh } from '../objects/Mesh'; -import { BoxBufferGeometry } from '../geometries/BoxGeometry'; -import { PlaneBufferGeometry } from '../geometries/PlaneGeometry'; -import { MeshBasicMaterial } from '../materials/MeshBasicMaterial'; -import { PerspectiveCamera } from '../cameras/PerspectiveCamera'; -import { OrthographicCamera } from '../cameras/OrthographicCamera'; import { WebGLAttributes } from './webgl/WebGLAttributes'; +import { WebGLBackground } from './webgl/WebGLBackground'; import { WebGLRenderLists } from './webgl/WebGLRenderLists'; import { WebGLIndexedBufferRenderer } from './webgl/WebGLIndexedBufferRenderer'; import { WebGLBufferRenderer } from './webgl/WebGLBufferRenderer'; @@ -36,7 +30,6 @@ import { Vector3 } from '../math/Vector3'; import { WebGLClipping } from './webgl/WebGLClipping'; import { Frustum } from '../math/Frustum'; import { Vector4 } from '../math/Vector4'; -import { Color } from '../math/Color'; /** * @author supereggbert / http://www.paulbrunt.co.uk/ @@ -139,9 +132,6 @@ function WebGLRenderer( parameters ) { // - _clearColor = new Color( 0x000000 ), - _clearAlpha = 0, - _width = _canvas.width, _height = _canvas.height, @@ -298,6 +288,8 @@ function WebGLRenderer( parameters ) { var programCache = new WebGLPrograms( this, capabilities ); var lightCache = new WebGLLights(); var renderLists = new WebGLRenderLists(); + + var background = new WebGLBackground( this, state, objects, _premultipliedAlpha ); var vr = new WebVRManager( this ); this.info.programs = programCache.programs; @@ -307,11 +299,6 @@ function WebGLRenderer( parameters ) { // - var backgroundPlaneCamera, backgroundPlaneMesh; - var backgroundBoxCamera, backgroundBoxMesh; - - // - function getTargetPixelRatio() { return _currentRenderTarget === null ? _pixelRatio : 1; @@ -325,8 +312,6 @@ function WebGLRenderer( parameters ) { state.scissor( _currentScissor.copy( _scissor ).multiplyScalar( _pixelRatio ) ); state.viewport( _currentViewport.copy( _viewport ).multiplyScalar( _pixelRatio ) ); - state.buffers.color.setClear( _clearColor.r, _clearColor.g, _clearColor.b, _clearAlpha, _premultipliedAlpha ); - } function resetGLState() { @@ -462,35 +447,10 @@ function WebGLRenderer( parameters ) { // Clearing - this.getClearColor = function () { - - return _clearColor; - - }; - - this.setClearColor = function ( color, alpha ) { - - _clearColor.set( color ); - - _clearAlpha = alpha !== undefined ? alpha : 1; - - state.buffers.color.setClear( _clearColor.r, _clearColor.g, _clearColor.b, _clearAlpha, _premultipliedAlpha ); - - }; - - this.getClearAlpha = function () { - - return _clearAlpha; - - }; - - this.setClearAlpha = function ( alpha ) { - - _clearAlpha = alpha; - - state.buffers.color.setClear( _clearColor.r, _clearColor.g, _clearColor.b, _clearAlpha, _premultipliedAlpha ); - - }; + this.getClearColor = background.getClearColor; + this.setClearColor = background.setClearColor; + this.getClearAlpha = background.getClearAlpha; + this.setClearAlpha = background.setClearAlpha; this.clear = function ( color, depth, stencil ) { @@ -1183,79 +1143,7 @@ function WebGLRenderer( parameters ) { // - var background = scene.background; - - if ( background === null ) { - - state.buffers.color.setClear( _clearColor.r, _clearColor.g, _clearColor.b, _clearAlpha, _premultipliedAlpha ); - - } else if ( background && background.isColor ) { - - state.buffers.color.setClear( background.r, background.g, background.b, 1, _premultipliedAlpha ); - forceClear = true; - - } - - if ( this.autoClear || forceClear ) { - - this.clear( this.autoClearColor, this.autoClearDepth, this.autoClearStencil ); - - } - - if ( background && background.isCubeTexture ) { - - if ( backgroundBoxCamera === undefined ) { - - backgroundBoxCamera = new PerspectiveCamera(); - - backgroundBoxMesh = new Mesh( - new BoxBufferGeometry( 5, 5, 5 ), - new ShaderMaterial( { - uniforms: ShaderLib.cube.uniforms, - vertexShader: ShaderLib.cube.vertexShader, - fragmentShader: ShaderLib.cube.fragmentShader, - side: BackSide, - depthTest: false, - depthWrite: false, - fog: false - } ) - ); - - } - - backgroundBoxCamera.projectionMatrix.copy( camera.projectionMatrix ); - - backgroundBoxCamera.matrixWorld.extractRotation( camera.matrixWorld ); - backgroundBoxCamera.matrixWorldInverse.getInverse( backgroundBoxCamera.matrixWorld ); - - - backgroundBoxMesh.material.uniforms[ "tCube" ].value = background; - backgroundBoxMesh.modelViewMatrix.multiplyMatrices( backgroundBoxCamera.matrixWorldInverse, backgroundBoxMesh.matrixWorld ); - - objects.update( backgroundBoxMesh ); - - _this.renderBufferDirect( backgroundBoxCamera, null, backgroundBoxMesh.geometry, backgroundBoxMesh.material, backgroundBoxMesh, null ); - - } else if ( background && background.isTexture ) { - - if ( backgroundPlaneCamera === undefined ) { - - backgroundPlaneCamera = new OrthographicCamera( - 1, 1, 1, - 1, 0, 1 ); - - backgroundPlaneMesh = new Mesh( - new PlaneBufferGeometry( 2, 2 ), - new MeshBasicMaterial( { depthTest: false, depthWrite: false, fog: false } ) - ); - - } - - backgroundPlaneMesh.material.map = background; - - objects.update( backgroundPlaneMesh ); - - _this.renderBufferDirect( backgroundPlaneCamera, null, backgroundPlaneMesh.geometry, backgroundPlaneMesh.material, backgroundPlaneMesh, null ); - - } + background.render( scene, camera, forceClear ); // render scene diff --git a/src/renderers/webgl/WebGLBackground.js b/src/renderers/webgl/WebGLBackground.js new file mode 100644 index 0000000000..565c0cca06 --- /dev/null +++ b/src/renderers/webgl/WebGLBackground.js @@ -0,0 +1,139 @@ +/** + * @author mrdoob / http://mrdoob.com/ + */ + +import { BackSide } from '../../constants'; +import { OrthographicCamera } from '../../cameras/OrthographicCamera'; +import { PerspectiveCamera } from '../../cameras/PerspectiveCamera'; +import { BoxBufferGeometry } from '../../geometries/BoxGeometry'; +import { PlaneBufferGeometry } from '../../geometries/PlaneGeometry'; +import { MeshBasicMaterial } from '../../materials/MeshBasicMaterial'; +import { ShaderMaterial } from '../../materials/ShaderMaterial'; +import { Color } from '../../math/Color'; +import { Mesh } from '../../objects/Mesh'; +import { ShaderLib } from '../shaders/ShaderLib'; + +function WebGLBackground( renderer, state, objects, premultipliedAlpha ) { + + var clearColor = new Color( 0x000000 ); + var clearAlpha = 0; + + var planeCamera, planeMesh; + var boxCamera, boxMesh; + + function render( scene, camera, forceClear ) { + + var background = scene.background; + + if ( background === null ) { + + setClear( clearColor, clearAlpha ); + + } else if ( background && background.isColor ) { + + setClear( background, 1 ); + forceClear = true; + + } + + if ( renderer.autoClear || forceClear ) { + + renderer.clear( renderer.autoClearColor, renderer.autoClearDepth, renderer.autoClearStencil ); + + } + + if ( background && background.isCubeTexture ) { + + if ( boxCamera === undefined ) { + + boxCamera = new PerspectiveCamera(); + + boxMesh = new Mesh( + new BoxBufferGeometry( 5, 5, 5 ), + new ShaderMaterial( { + uniforms: ShaderLib.cube.uniforms, + vertexShader: ShaderLib.cube.vertexShader, + fragmentShader: ShaderLib.cube.fragmentShader, + side: BackSide, + depthTest: false, + depthWrite: false, + fog: false + } ) + ); + + } + + boxCamera.projectionMatrix.copy( camera.projectionMatrix ); + + boxCamera.matrixWorld.extractRotation( camera.matrixWorld ); + boxCamera.matrixWorldInverse.getInverse( boxCamera.matrixWorld ); + + boxMesh.material.uniforms[ "tCube" ].value = background; + boxMesh.modelViewMatrix.multiplyMatrices( boxCamera.matrixWorldInverse, boxMesh.matrixWorld ); + + objects.update( boxMesh ); + + renderer.renderBufferDirect( boxCamera, null, boxMesh.geometry, boxMesh.material, boxMesh, null ); + + } else if ( background && background.isTexture ) { + + if ( planeCamera === undefined ) { + + planeCamera = new OrthographicCamera( - 1, 1, 1, - 1, 0, 1 ); + + planeMesh = new Mesh( + new PlaneBufferGeometry( 2, 2 ), + new MeshBasicMaterial( { depthTest: false, depthWrite: false, fog: false } ) + ); + + } + + planeMesh.material.map = background; + + objects.update( planeMesh ); + + renderer.renderBufferDirect( planeCamera, null, planeMesh.geometry, planeMesh.material, planeMesh, null ); + + } + + } + + function setClear( color, alpha ) { + + state.buffers.color.setClear( color.r, color.g, color.b, alpha, premultipliedAlpha ); + + } + + return { + + getClearColor: function () { + + return clearColor; + + }, + setClearColor: function ( color, alpha ) { + + clearColor.set( color ); + clearAlpha = alpha !== undefined ? alpha : 1; + setClear( clearColor, clearAlpha ); + + }, + getClearAlpha: function () { + + return clearAlpha; + + }, + setClearAlpha: function ( alpha ) { + + clearAlpha = alpha; + setClear( clearColor, clearAlpha ); + + }, + render: render + + }; + +} + + +export { WebGLBackground }; -- GitLab