diff --git a/examples/js/postprocessing/AdaptiveToneMappingPass.js b/examples/js/postprocessing/AdaptiveToneMappingPass.js index c20b21494297404da5d95311de80c7720e7a296a..93d81504f35dddd7bcc94054f71d41bab406fd71 100644 --- a/examples/js/postprocessing/AdaptiveToneMappingPass.js +++ b/examples/js/postprocessing/AdaptiveToneMappingPass.js @@ -117,7 +117,7 @@ THREE.AdaptiveToneMappingPass = function ( adaptive, resolution ) { blending: THREE.NoBlending } ); - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); }; @@ -141,35 +141,35 @@ THREE.AdaptiveToneMappingPass.prototype = Object.assign( Object.create( THREE.Pa if ( this.adaptive ) { //Render the luminance of the current scene into a render target with mipmapping enabled - this.fillQuad.quad.material = this.materialLuminance; + this.fsQuad.material = this.materialLuminance; this.materialLuminance.uniforms.tDiffuse.value = readBuffer.texture; renderer.setRenderTarget( this.currentLuminanceRT ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); //Use the new luminance values, the previous luminance and the frame delta to //adapt the luminance over time. - this.fillQuad.quad.material = this.materialAdaptiveLum; + this.fsQuad.material = this.materialAdaptiveLum; this.materialAdaptiveLum.uniforms.delta.value = deltaTime; this.materialAdaptiveLum.uniforms.lastLum.value = this.previousLuminanceRT.texture; this.materialAdaptiveLum.uniforms.currentLum.value = this.currentLuminanceRT.texture; renderer.setRenderTarget( this.luminanceRT ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); //Copy the new adapted luminance value so that it can be used by the next frame. - this.fillQuad.quad.material = this.materialCopy; + this.fsQuad.material = this.materialCopy; this.copyUniforms.tDiffuse.value = this.luminanceRT.texture; renderer.setRenderTarget( this.previousLuminanceRT ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } - this.fillQuad.quad.material = this.materialToneMap; + this.fsQuad.material = this.materialToneMap; this.materialToneMap.uniforms.tDiffuse.value = readBuffer.texture; if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { @@ -177,7 +177,7 @@ THREE.AdaptiveToneMappingPass.prototype = Object.assign( Object.create( THREE.Pa if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } @@ -225,7 +225,7 @@ THREE.AdaptiveToneMappingPass.prototype = Object.assign( Object.create( THREE.Pa } //Put something in the adaptive luminance texture so that the scene can render initially - this.fillQuad.quad.material = new THREE.MeshBasicMaterial( { color: 0x777777 } ); + this.fsQuad.material = new THREE.MeshBasicMaterial( { color: 0x777777 } ); this.materialLuminance.needsUpdate = true; this.materialAdaptiveLum.needsUpdate = true; this.materialToneMap.needsUpdate = true; diff --git a/examples/js/postprocessing/AfterimagePass.js b/examples/js/postprocessing/AfterimagePass.js index 42d1b4cb651d093447e55acf36ff8e4f82c9f6d4..be3d3aca65fecd3316ad2d560d09e7413da51ede 100644 --- a/examples/js/postprocessing/AfterimagePass.js +++ b/examples/js/postprocessing/AfterimagePass.js @@ -39,12 +39,12 @@ THREE.AfterimagePass = function ( damp ) { } ); - this.compFillQuad = THREE.Pass.createFillQuadScene( this.shaderMaterial ); + this.compFsQuad = new THREE.Pass.FullScreenQuad( this.shaderMaterial ); var material = new THREE.MeshBasicMaterial( { map: this.textureComp.texture } ); - this.screenFillQuad = THREE.Pass.createFillQuadScene( material ); + this.screenFsQuad = new THREE.Pass.FullScreenQuad( material ); }; @@ -58,15 +58,15 @@ THREE.AfterimagePass.prototype = Object.assign( Object.create( THREE.Pass.protot this.uniforms[ "tNew" ].value = readBuffer.texture; renderer.setRenderTarget( this.textureComp ); - renderer.render( this.compFillQuad.quad, this.compFillQuad.camera ); + this.compFsQuad.render( renderer ); renderer.setRenderTarget( this.textureOld ); - renderer.render( this.screenFillQuad.quad, this.screenFillQuad.camera ); + this.screenFsQuad.render( renderer ); if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.screenFillQuad.quad, this.screenFillQuad.camera ); + this.screenFsQuad.render( renderer ); } else { @@ -74,7 +74,7 @@ THREE.AfterimagePass.prototype = Object.assign( Object.create( THREE.Pass.protot if ( this.clear ) renderer.clear(); - renderer.render( this.screenFillQuad.quad, this.screenFillQuad.camera ); + this.screenFsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/BloomPass.js b/examples/js/postprocessing/BloomPass.js index ea16e9021b84beebe65a3e0a6a11238cb4f173be..ee055b57f5503f13172801651bfb3a573c9ac50e 100644 --- a/examples/js/postprocessing/BloomPass.js +++ b/examples/js/postprocessing/BloomPass.js @@ -67,7 +67,7 @@ THREE.BloomPass = function ( strength, kernelSize, sigma, resolution ) { this.needsSwap = false; - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); }; @@ -81,14 +81,14 @@ THREE.BloomPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ) // Render quad with blured scene into texture (convolution pass 1) - this.fillQuad.quad.material = this.materialConvolution; + this.fsQuad.material = this.materialConvolution; this.convolutionUniforms[ "tDiffuse" ].value = readBuffer.texture; this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurX; renderer.setRenderTarget( this.renderTargetX ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // Render quad with blured scene into texture (convolution pass 2) @@ -98,11 +98,11 @@ THREE.BloomPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ) renderer.setRenderTarget( this.renderTargetY ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // Render original scene with superimposed blur to texture - this.fillQuad.quad.material = this.materialCopy; + this.fsQuad.material = this.materialCopy; this.copyUniforms[ "tDiffuse" ].value = this.renderTargetY.texture; @@ -110,7 +110,7 @@ THREE.BloomPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ) renderer.setRenderTarget( readBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/BokehPass.js b/examples/js/postprocessing/BokehPass.js index 5759c286cdaa839199dc9e02f7ffe672c863c2e5..6e1525b794ce41ff78e92f5273cb99d62ca6e383 100644 --- a/examples/js/postprocessing/BokehPass.js +++ b/examples/js/postprocessing/BokehPass.js @@ -66,7 +66,7 @@ THREE.BokehPass = function ( scene, camera, params ) { this.uniforms = bokehUniforms; this.needsSwap = false; - this.fillQuad = THREE.Pass.createFillQuadScene( this.materialBokeh ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.materialBokeh ); this.oldClearColor = new THREE.Color(); this.oldClearAlpha = 1; @@ -103,13 +103,13 @@ THREE.BokehPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ) if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/DotScreenPass.js b/examples/js/postprocessing/DotScreenPass.js index a543eb021cdd052b5faf7db9bb9b852b16de05c6..1de397386152f090b9ce266183b1cb884334742c 100644 --- a/examples/js/postprocessing/DotScreenPass.js +++ b/examples/js/postprocessing/DotScreenPass.js @@ -25,7 +25,7 @@ THREE.DotScreenPass = function ( center, angle, scale ) { } ); - this.fillQuad = THREE.Pass.createFillQuadScene( this.material ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.material ); }; @@ -41,13 +41,13 @@ THREE.DotScreenPass.prototype = Object.assign( Object.create( THREE.Pass.prototy if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/EffectComposer.js b/examples/js/postprocessing/EffectComposer.js index f1c7e43cc558f7ed14c2d4cbcb46209a076fdda2..459fe135dd18e394fb6fbeb5da95e002f77044c5 100644 --- a/examples/js/postprocessing/EffectComposer.js +++ b/examples/js/postprocessing/EffectComposer.js @@ -192,28 +192,50 @@ THREE.Pass = function () { }; -// Helper for passes that need a scene that simply has the whole viewport filled with a single quad. -THREE.Pass.createFillQuadScene = function( material ) { +Object.assign( THREE.Pass.prototype, { + + setSize: function ( width, height ) {}, + + render: function ( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) { + + console.error( 'THREE.Pass: .render() must be implemented in derived pass.' ); - var fillQuad = {}; + } - fillQuad.camera = new THREE.OrthographicCamera( - 1, 1, 1, - 1, 0, 1 ); +} ); - fillQuad.quad = new THREE.Mesh( new THREE.PlaneBufferGeometry( 2, 2 ), material ); - fillQuad.quad.frustumCulled = false; // Avoid getting clipped +// Helper for passes that need to fill the viewport with a single quad. +THREE.Pass.FullScreenQuad = function ( material ) { - return fillQuad; + this._mesh = new THREE.Mesh( THREE.Pass.FullScreenQuad._geometry, material ); }; -Object.assign( THREE.Pass.prototype, { +Object.defineProperty( THREE.Pass.FullScreenQuad.prototype, 'material', { - setSize: function ( width, height ) {}, + get: function () { - render: function ( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) { + return this._mesh.material; - console.error( 'THREE.Pass: .render() must be implemented in derived pass.' ); + }, + + set: function ( value ) { + + this._mesh.material = value; + + } + +} ); + +Object.assign( THREE.Pass.FullScreenQuad.prototype, { + + render: function ( renderer ) { + + renderer.render( this._mesh, THREE.Pass.FullScreenQuad._camera ); } } ); + +THREE.Pass.FullScreenQuad._camera = new THREE.OrthographicCamera( - 1, 1, 1, - 1, 0, 1 ); +THREE.Pass.FullScreenQuad._geometry = new THREE.PlaneBufferGeometry( 2, 2 ); diff --git a/examples/js/postprocessing/FilmPass.js b/examples/js/postprocessing/FilmPass.js index 2a8d9da88b3d2577bcd53183dc741ba9c436cf7e..bfa057b5b32ef03506e5a87c2936922c1a28a83b 100644 --- a/examples/js/postprocessing/FilmPass.js +++ b/examples/js/postprocessing/FilmPass.js @@ -26,7 +26,7 @@ THREE.FilmPass = function ( noiseIntensity, scanlinesIntensity, scanlinesCount, if ( scanlinesIntensity !== undefined ) this.uniforms.sIntensity.value = scanlinesIntensity; if ( scanlinesCount !== undefined ) this.uniforms.sCount.value = scanlinesCount; - this.fillQuad = THREE.Pass.createFillQuadScene( this.material ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.material ); }; @@ -42,13 +42,13 @@ THREE.FilmPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/GlitchPass.js b/examples/js/postprocessing/GlitchPass.js index 20dd964c9c4cfa93e76bcd34f23939c36571f2f7..9d85c5e4d924b3c5bcdcf36d3be95a5a8259d0fd 100644 --- a/examples/js/postprocessing/GlitchPass.js +++ b/examples/js/postprocessing/GlitchPass.js @@ -23,7 +23,7 @@ THREE.GlitchPass = function ( dt_size ) { fragmentShader: shader.fragmentShader } ); - this.fillQuad = THREE.Pass.createFillQuadScene( this.material ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.material ); this.goWild = false; this.curF = 0; @@ -72,13 +72,13 @@ THREE.GlitchPass.prototype = Object.assign( Object.create( THREE.Pass.prototype if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/HalftonePass.js b/examples/js/postprocessing/HalftonePass.js index c4d64d9a60f9a3bf3b55c1dd787907b66bfbacbd..5fa841c1248c6232dd7a0373880b868f602e272f 100644 --- a/examples/js/postprocessing/HalftonePass.js +++ b/examples/js/postprocessing/HalftonePass.js @@ -36,7 +36,7 @@ THREE.HalftonePass = function ( width, height, params ) { } - this.fillQuad = THREE.Pass.createFillQuadScene( this.material ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.material ); }; @@ -51,13 +51,13 @@ THREE.HalftonePass.prototype = Object.assign( Object.create( THREE.Pass.prototyp if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/OutlinePass.js b/examples/js/postprocessing/OutlinePass.js index 25f203aacaf17ec965320ca56c98eaa757291f45..56dcba11c83b0fe0241bf42695bbc8706dae5f68 100644 --- a/examples/js/postprocessing/OutlinePass.js +++ b/examples/js/postprocessing/OutlinePass.js @@ -101,7 +101,7 @@ THREE.OutlinePass = function ( resolution, scene, camera, selectedObjects ) { this.oldClearColor = new THREE.Color(); this.oldClearAlpha = 1; - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); this.tempPulseColor1 = new THREE.Color(); this.tempPulseColor2 = new THREE.Color(); @@ -297,11 +297,11 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype this.renderScene.background = currentBackground; // 2. Downsample to Half resolution - this.fillQuad.quad.material = this.materialCopy; + this.fsQuad.material = this.materialCopy; this.copyUniforms[ "tDiffuse" ].value = this.renderTargetMaskBuffer.texture; renderer.setRenderTarget( this.renderTargetMaskDownSampleBuffer ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); this.tempPulseColor1.copy( this.visibleEdgeColor ); this.tempPulseColor2.copy( this.hiddenEdgeColor ); @@ -315,44 +315,44 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype } // 3. Apply Edge Detection Pass - this.fillQuad.quad.material = this.edgeDetectionMaterial; + this.fsQuad.material = this.edgeDetectionMaterial; this.edgeDetectionMaterial.uniforms[ "maskTexture" ].value = this.renderTargetMaskDownSampleBuffer.texture; this.edgeDetectionMaterial.uniforms[ "texSize" ].value = new THREE.Vector2( this.renderTargetMaskDownSampleBuffer.width, this.renderTargetMaskDownSampleBuffer.height ); this.edgeDetectionMaterial.uniforms[ "visibleEdgeColor" ].value = this.tempPulseColor1; this.edgeDetectionMaterial.uniforms[ "hiddenEdgeColor" ].value = this.tempPulseColor2; renderer.setRenderTarget( this.renderTargetEdgeBuffer1 ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // 4. Apply Blur on Half res - this.fillQuad.quad.material = this.separableBlurMaterial1; + this.fsQuad.material = this.separableBlurMaterial1; this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture; this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX; this.separableBlurMaterial1.uniforms[ "kernelRadius" ].value = this.edgeThickness; renderer.setRenderTarget( this.renderTargetBlurBuffer1 ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer1.texture; this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY; renderer.setRenderTarget( this.renderTargetEdgeBuffer1 ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // Apply Blur on quarter res - this.fillQuad.quad.material = this.separableBlurMaterial2; + this.fsQuad.material = this.separableBlurMaterial2; this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture; this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX; renderer.setRenderTarget( this.renderTargetBlurBuffer2 ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer2.texture; this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY; renderer.setRenderTarget( this.renderTargetEdgeBuffer2 ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // Blend it additively over the input texture - this.fillQuad.quad.material = this.overlayMaterial; + this.fsQuad.material = this.overlayMaterial; this.overlayMaterial.uniforms[ "maskTexture" ].value = this.renderTargetMaskBuffer.texture; this.overlayMaterial.uniforms[ "edgeTexture1" ].value = this.renderTargetEdgeBuffer1.texture; this.overlayMaterial.uniforms[ "edgeTexture2" ].value = this.renderTargetEdgeBuffer2.texture; @@ -365,7 +365,7 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST ); renderer.setRenderTarget( readBuffer ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); renderer.setClearColor( this.oldClearColor, this.oldClearAlpha ); renderer.autoClear = oldAutoClear; @@ -374,10 +374,10 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype if ( this.renderToScreen ) { - this.fillQuad.quad.material = this.materialCopy; + this.fsQuad.material = this.materialCopy; this.copyUniforms[ "tDiffuse" ].value = readBuffer.texture; renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/SAOPass.js b/examples/js/postprocessing/SAOPass.js index a039a1b3e4927ad3d2e1295d1b2033c762069799..2bb2c628f109af88f753a6f474bfee818ef50a8e 100644 --- a/examples/js/postprocessing/SAOPass.js +++ b/examples/js/postprocessing/SAOPass.js @@ -160,7 +160,7 @@ THREE.SAOPass = function ( scene, camera, depthTexture, useNormals, resolution ) blending: THREE.NoBlending } ); - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); }; @@ -328,8 +328,8 @@ THREE.SAOPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), } - this.fillQuad.quad.material = passMaterial; - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.material = passMaterial; + this.fsQuad.render( renderer ); // restore original state renderer.autoClear = originalAutoClear; diff --git a/examples/js/postprocessing/SMAAPass.js b/examples/js/postprocessing/SMAAPass.js index a28c96ed0c00cdec38ce186389a6c1f7bba1e6c8..2a8d4a92f102df01f0f2eec4e95f2313335924ad 100644 --- a/examples/js/postprocessing/SMAAPass.js +++ b/examples/js/postprocessing/SMAAPass.js @@ -109,7 +109,7 @@ THREE.SMAAPass = function ( width, height ) { this.needsSwap = false; - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); }; @@ -123,36 +123,36 @@ THREE.SMAAPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), this.uniformsEdges[ "tDiffuse" ].value = readBuffer.texture; - this.fillQuad.quad.material = this.materialEdges; + this.fsQuad.material = this.materialEdges; renderer.setRenderTarget( this.edgesRT ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // pass 2 - this.fillQuad.quad.material = this.materialWeights; + this.fsQuad.material = this.materialWeights; renderer.setRenderTarget( this.weightsRT ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // pass 3 this.uniformsBlend[ "tColor" ].value = readBuffer.texture; - this.fillQuad.quad.material = this.materialBlend; + this.fsQuad.material = this.materialBlend; if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/SSAARenderPass.js b/examples/js/postprocessing/SSAARenderPass.js index 04174fcda8c5495187160c70489edc990c1f59aa..76c1848ff5abda06a3fec8cc6eaa8d6ebac05675 100644 --- a/examples/js/postprocessing/SSAARenderPass.js +++ b/examples/js/postprocessing/SSAARenderPass.js @@ -40,7 +40,7 @@ THREE.SSAARenderPass = function ( scene, camera, clearColor, clearAlpha ) { depthWrite: false } ); - this.fillQuad = THREE.Pass.createFillQuadScene( this.copyMaterial ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.copyMaterial ); }; @@ -129,7 +129,7 @@ THREE.SSAARenderPass.prototype = Object.assign( Object.create( THREE.Pass.protot } - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/SSAOPass.js b/examples/js/postprocessing/SSAOPass.js index 535e011d62fef3dbd8592220714546f5825daebe..98b2ef170e28a668f69b7197184d2424ac0ed4f0 100644 --- a/examples/js/postprocessing/SSAOPass.js +++ b/examples/js/postprocessing/SSAOPass.js @@ -134,7 +134,7 @@ THREE.SSAOPass = function ( scene, camera, width, height ) { blendEquationAlpha: THREE.AddEquation } ); - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); this.originalClearColor = new THREE.Color(); @@ -269,8 +269,8 @@ THREE.SSAOPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), } - this.fillQuad.quad.material = passMaterial; - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.material = passMaterial; + this.fsQuad.render( renderer ); // restore original state renderer.autoClear = originalAutoClear; diff --git a/examples/js/postprocessing/SavePass.js b/examples/js/postprocessing/SavePass.js index 5b1aae467f5595a67d2ee2211823950f73acb626..2eb319c71a97ad2dc6bb4f88bbcdd46118405cda 100644 --- a/examples/js/postprocessing/SavePass.js +++ b/examples/js/postprocessing/SavePass.js @@ -34,7 +34,7 @@ THREE.SavePass = function ( renderTarget ) { this.needsSwap = false; - this.fillQuad = THREE.Pass.createFillQuadScene( this.material ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.material ); }; @@ -52,7 +52,7 @@ THREE.SavePass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), renderer.setRenderTarget( this.renderTarget ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/ShaderPass.js b/examples/js/postprocessing/ShaderPass.js index cca913e2e8a12063ebf8bda1c6f0d9c0294ff167..b6a34d8ed6b5d49cc98402fce4dfff8a5ec4abf7 100644 --- a/examples/js/postprocessing/ShaderPass.js +++ b/examples/js/postprocessing/ShaderPass.js @@ -29,7 +29,7 @@ THREE.ShaderPass = function ( shader, textureID ) { } - this.fillQuad = THREE.Pass.createFillQuadScene( this.material ); + this.fsQuad = new THREE.Pass.FullScreenQuad( this.material ); }; THREE.ShaderPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), { @@ -44,19 +44,19 @@ THREE.ShaderPass.prototype = Object.assign( Object.create( THREE.Pass.prototype } - this.fillQuad.quad.material = this.material; + this.fsQuad.material = this.material; if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( writeBuffer ); // TODO: Avoid using autoClear properties, see https://github.com/mrdoob/three.js/pull/15571#issuecomment-465669600 if ( this.clear ) renderer.clear( renderer.autoClearColor, renderer.autoClearDepth, renderer.autoClearStencil ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/TAARenderPass.js b/examples/js/postprocessing/TAARenderPass.js index fdd1eff1c553d89f5d6df00455137dbf6ddc59b3..fe11a076fb7b8bae5aee4824e9bf31616ca584b2 100644 --- a/examples/js/postprocessing/TAARenderPass.js +++ b/examples/js/postprocessing/TAARenderPass.js @@ -99,7 +99,7 @@ THREE.TAARenderPass.prototype = Object.assign( Object.create( THREE.SSAARenderPa renderer.setRenderTarget( this.sampleRenderTarget ); if ( this.accumulateIndex === 0 ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); this.accumulateIndex ++; @@ -119,7 +119,7 @@ THREE.TAARenderPass.prototype = Object.assign( Object.create( THREE.SSAARenderPa this.copyUniforms[ "tDiffuse" ].value = this.sampleRenderTarget.texture; renderer.setRenderTarget( writeBuffer ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } @@ -129,7 +129,7 @@ THREE.TAARenderPass.prototype = Object.assign( Object.create( THREE.SSAARenderPa this.copyUniforms[ "tDiffuse" ].value = this.holdRenderTarget.texture; renderer.setRenderTarget( writeBuffer ); if ( accumulationWeight === 0 ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } diff --git a/examples/js/postprocessing/TexturePass.js b/examples/js/postprocessing/TexturePass.js index b8232284996529d96be3c9486d6aca627c95dc70..1ae56ac249618c81dde6a488a7e4b225b84868d0 100644 --- a/examples/js/postprocessing/TexturePass.js +++ b/examples/js/postprocessing/TexturePass.js @@ -28,7 +28,7 @@ THREE.TexturePass = function ( map, opacity ) { this.needsSwap = false; - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); }; @@ -41,7 +41,7 @@ THREE.TexturePass.prototype = Object.assign( Object.create( THREE.Pass.prototype var oldAutoClear = renderer.autoClear; renderer.autoClear = false; - this.fillQuad.quad.material = this.material; + this.fsQuad.material = this.material; this.uniforms[ "opacity" ].value = this.opacity; this.uniforms[ "tDiffuse" ].value = this.map; @@ -49,7 +49,7 @@ THREE.TexturePass.prototype = Object.assign( Object.create( THREE.Pass.prototype renderer.setRenderTarget( this.renderToScreen ? null : readBuffer ); if ( this.clear ) renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); renderer.autoClear = oldAutoClear; } diff --git a/examples/js/postprocessing/UnrealBloomPass.js b/examples/js/postprocessing/UnrealBloomPass.js index fee7197eac5c87cd155146c166115e31d1f74206..5f04412ae641a11f6fb31b0fad88df130d3b5303 100644 --- a/examples/js/postprocessing/UnrealBloomPass.js +++ b/examples/js/postprocessing/UnrealBloomPass.js @@ -133,7 +133,7 @@ THREE.UnrealBloomPass = function ( resolution, strength, radius, threshold ) { this.basic = new THREE.MeshBasicMaterial(); - this.fillQuad = THREE.Pass.createFillQuadScene( null ); + this.fsQuad = new THREE.Pass.FullScreenQuad( null ); }; @@ -195,12 +195,12 @@ THREE.UnrealBloomPass.prototype = Object.assign( Object.create( THREE.Pass.proto if ( this.renderToScreen ) { - this.fillQuad.quad.material = this.basic; + this.fsQuad.material = this.basic; this.basic.map = readBuffer.texture; renderer.setRenderTarget( null ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } @@ -208,11 +208,11 @@ THREE.UnrealBloomPass.prototype = Object.assign( Object.create( THREE.Pass.proto this.highPassUniforms[ "tDiffuse" ].value = readBuffer.texture; this.highPassUniforms[ "luminosityThreshold" ].value = this.threshold; - this.fillQuad.quad.material = this.materialHighPassFilter; + this.fsQuad.material = this.materialHighPassFilter; renderer.setRenderTarget( this.renderTargetBright ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // 2. Blur All the mips progressively @@ -220,19 +220,19 @@ THREE.UnrealBloomPass.prototype = Object.assign( Object.create( THREE.Pass.proto for ( var i = 0; i < this.nMips; i ++ ) { - this.fillQuad.quad.material = this.separableBlurMaterials[ i ]; + this.fsQuad.material = this.separableBlurMaterials[ i ]; this.separableBlurMaterials[ i ].uniforms[ "colorTexture" ].value = inputRenderTarget.texture; this.separableBlurMaterials[ i ].uniforms[ "direction" ].value = THREE.UnrealBloomPass.BlurDirectionX; renderer.setRenderTarget( this.renderTargetsHorizontal[ i ] ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); this.separableBlurMaterials[ i ].uniforms[ "colorTexture" ].value = this.renderTargetsHorizontal[ i ].texture; this.separableBlurMaterials[ i ].uniforms[ "direction" ].value = THREE.UnrealBloomPass.BlurDirectionY; renderer.setRenderTarget( this.renderTargetsVertical[ i ] ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); inputRenderTarget = this.renderTargetsVertical[ i ]; @@ -240,18 +240,18 @@ THREE.UnrealBloomPass.prototype = Object.assign( Object.create( THREE.Pass.proto // Composite All the mips - this.fillQuad.quad.material = this.compositeMaterial; + this.fsQuad.material = this.compositeMaterial; this.compositeMaterial.uniforms[ "bloomStrength" ].value = this.strength; this.compositeMaterial.uniforms[ "bloomRadius" ].value = this.radius; this.compositeMaterial.uniforms[ "bloomTintColors" ].value = this.bloomTintColors; renderer.setRenderTarget( this.renderTargetsHorizontal[ 0 ] ); renderer.clear(); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); // Blend it additively over the input texture - this.fillQuad.quad.material = this.materialCopy; + this.fsQuad.material = this.materialCopy; this.copyUniforms[ "tDiffuse" ].value = this.renderTargetsHorizontal[ 0 ].texture; if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST ); @@ -260,12 +260,12 @@ THREE.UnrealBloomPass.prototype = Object.assign( Object.create( THREE.Pass.proto if ( this.renderToScreen ) { renderer.setRenderTarget( null ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); } else { renderer.setRenderTarget( readBuffer ); - renderer.render( this.fillQuad.quad, this.fillQuad.camera ); + this.fsQuad.render( renderer ); }