浏览代码

OutlinePass: Enable renderToScreen

Mugen87 7 年之前
父节点
当前提交
599a3dfff7
共有 1 个文件被更改,包括 92 次插入82 次删除
  1. 92 82
      examples/js/postprocessing/OutlinePass.js

+ 92 - 82
examples/js/postprocessing/OutlinePass.js

@@ -243,106 +243,116 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
 
 
 	render: function ( renderer, writeBuffer, readBuffer, delta, maskActive ) {
 	render: function ( renderer, writeBuffer, readBuffer, delta, maskActive ) {
 
 
-		if ( this.selectedObjects.length === 0 ) return;
+		if ( this.selectedObjects.length > 0 ) {
 
 
-		this.oldClearColor.copy( renderer.getClearColor() );
-		this.oldClearAlpha = renderer.getClearAlpha();
-		var oldAutoClear = renderer.autoClear;
+			this.oldClearColor.copy( renderer.getClearColor() );
+			this.oldClearAlpha = renderer.getClearAlpha();
+			var oldAutoClear = renderer.autoClear;
 
 
-		renderer.autoClear = false;
+			renderer.autoClear = false;
 
 
-		if ( maskActive ) renderer.context.disable( renderer.context.STENCIL_TEST );
+			if ( maskActive ) renderer.context.disable( renderer.context.STENCIL_TEST );
 
 
-		renderer.setClearColor( 0xffffff, 1 );
+			renderer.setClearColor( 0xffffff, 1 );
 
 
-		// Make selected objects invisible
-		this.changeVisibilityOfSelectedObjects( false );
+			// Make selected objects invisible
+			this.changeVisibilityOfSelectedObjects( false );
 
 
-		var currentBackground = this.renderScene.background;
-		this.renderScene.background = null;
+			var currentBackground = this.renderScene.background;
+			this.renderScene.background = null;
 
 
-		// 1. Draw Non Selected objects in the depth buffer
-		this.renderScene.overrideMaterial = this.depthMaterial;
-		renderer.render( this.renderScene, this.renderCamera, this.renderTargetDepthBuffer, true );
+			// 1. Draw Non Selected objects in the depth buffer
+			this.renderScene.overrideMaterial = this.depthMaterial;
+			renderer.render( this.renderScene, this.renderCamera, this.renderTargetDepthBuffer, true );
 
 
-		// Make selected objects visible
-		this.changeVisibilityOfSelectedObjects( true );
+			// Make selected objects visible
+			this.changeVisibilityOfSelectedObjects( true );
 
 
-		// Update Texture Matrix for Depth compare
-		this.updateTextureMatrix();
+			// Update Texture Matrix for Depth compare
+			this.updateTextureMatrix();
 
 
-		// Make non selected objects invisible, and draw only the selected objects, by comparing the depth buffer of non selected objects
-		this.changeVisibilityOfNonSelectedObjects( false );
-		this.renderScene.overrideMaterial = this.prepareMaskMaterial;
-		this.prepareMaskMaterial.uniforms[ "cameraNearFar" ].value = new THREE.Vector2( this.renderCamera.near, this.renderCamera.far );
-		this.prepareMaskMaterial.uniforms[ "depthTexture" ].value = this.renderTargetDepthBuffer.texture;
-		this.prepareMaskMaterial.uniforms[ "textureMatrix" ].value = this.textureMatrix;
-		renderer.render( this.renderScene, this.renderCamera, this.renderTargetMaskBuffer, true );
-		this.renderScene.overrideMaterial = null;
-		this.changeVisibilityOfNonSelectedObjects( true );
+			// Make non selected objects invisible, and draw only the selected objects, by comparing the depth buffer of non selected objects
+			this.changeVisibilityOfNonSelectedObjects( false );
+			this.renderScene.overrideMaterial = this.prepareMaskMaterial;
+			this.prepareMaskMaterial.uniforms[ "cameraNearFar" ].value = new THREE.Vector2( this.renderCamera.near, this.renderCamera.far );
+			this.prepareMaskMaterial.uniforms[ "depthTexture" ].value = this.renderTargetDepthBuffer.texture;
+			this.prepareMaskMaterial.uniforms[ "textureMatrix" ].value = this.textureMatrix;
+			renderer.render( this.renderScene, this.renderCamera, this.renderTargetMaskBuffer, true );
+			this.renderScene.overrideMaterial = null;
+			this.changeVisibilityOfNonSelectedObjects( true );
 
 
-		this.renderScene.background = currentBackground;
+			this.renderScene.background = currentBackground;
 
 
-		// 2. Downsample to Half resolution
-		this.quad.material = this.materialCopy;
-		this.copyUniforms[ "tDiffuse" ].value = this.renderTargetMaskBuffer.texture;
-		renderer.render( this.scene, this.camera, this.renderTargetMaskDownSampleBuffer, true );
+			// 2. Downsample to Half resolution
+			this.quad.material = this.materialCopy;
+			this.copyUniforms[ "tDiffuse" ].value = this.renderTargetMaskBuffer.texture;
+			renderer.render( this.scene, this.camera, this.renderTargetMaskDownSampleBuffer, true );
 
 
-		this.tempPulseColor1.copy( this.visibleEdgeColor );
-		this.tempPulseColor2.copy( this.hiddenEdgeColor );
+			this.tempPulseColor1.copy( this.visibleEdgeColor );
+			this.tempPulseColor2.copy( this.hiddenEdgeColor );
 
 
-		if ( this.pulsePeriod > 0 ) {
+			if ( this.pulsePeriod > 0 ) {
 
 
-			var scalar = ( 1 + 0.25 ) / 2 + Math.cos( performance.now() * 0.01 / this.pulsePeriod ) * ( 1.0 - 0.25 ) / 2;
-			this.tempPulseColor1.multiplyScalar( scalar );
-			this.tempPulseColor2.multiplyScalar( scalar );
+				var scalar = ( 1 + 0.25 ) / 2 + Math.cos( performance.now() * 0.01 / this.pulsePeriod ) * ( 1.0 - 0.25 ) / 2;
+				this.tempPulseColor1.multiplyScalar( scalar );
+				this.tempPulseColor2.multiplyScalar( scalar );
+
+			}
+
+			// 3. Apply Edge Detection Pass
+			this.quad.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.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
+
+			// 4. Apply Blur on Half res
+			this.quad.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.render( this.scene, this.camera, this.renderTargetBlurBuffer1, true );
+			this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer1.texture;
+			this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
+			renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
+
+			// Apply Blur on quarter res
+			this.quad.material = this.separableBlurMaterial2;
+			this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture;
+			this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX;
+			renderer.render( this.scene, this.camera, this.renderTargetBlurBuffer2, true );
+			this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer2.texture;
+			this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
+			renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer2, true );
+
+			// Blend it additively over the input texture
+			this.quad.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;
+			this.overlayMaterial.uniforms[ "patternTexture" ].value = this.patternTexture;
+			this.overlayMaterial.uniforms[ "edgeStrength" ].value = this.edgeStrength;
+			this.overlayMaterial.uniforms[ "edgeGlow" ].value = this.edgeGlow;
+			this.overlayMaterial.uniforms[ "usePatternTexture" ].value = this.usePatternTexture;
+
+
+			if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST );
+
+			renderer.render( this.scene, this.camera, readBuffer, false );
+
+			renderer.setClearColor( this.oldClearColor, this.oldClearAlpha );
+			renderer.autoClear = oldAutoClear;
 
 
 		}
 		}
 
 
-		// 3. Apply Edge Detection Pass
-		this.quad.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.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
-
-		// 4. Apply Blur on Half res
-		this.quad.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.render( this.scene, this.camera, this.renderTargetBlurBuffer1, true );
-		this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer1.texture;
-		this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
-		renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
-
-		// Apply Blur on quarter res
-		this.quad.material = this.separableBlurMaterial2;
-		this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture;
-		this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX;
-		renderer.render( this.scene, this.camera, this.renderTargetBlurBuffer2, true );
-		this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer2.texture;
-		this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
-		renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer2, true );
-
-		// Blend it additively over the input texture
-		this.quad.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;
-		this.overlayMaterial.uniforms[ "patternTexture" ].value = this.patternTexture;
-		this.overlayMaterial.uniforms[ "edgeStrength" ].value = this.edgeStrength;
-		this.overlayMaterial.uniforms[ "edgeGlow" ].value = this.edgeGlow;
-		this.overlayMaterial.uniforms[ "usePatternTexture" ].value = this.usePatternTexture;
-
-
-		if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST );
-
-		renderer.render( this.scene, this.camera, readBuffer, false );
-
-		renderer.setClearColor( this.oldClearColor, this.oldClearAlpha );
-		renderer.autoClear = oldAutoClear;
+		if ( this.renderToScreen ) {
+
+			this.quad.material = this.materialCopy;
+			this.copyUniforms[ "tDiffuse" ].value = readBuffer.texture;
+			renderer.render( this.scene, this.camera );
+
+		}
 
 
 	},
 	},