Improve DepthOfFieldEffect

vanruesc · vanruesc · commit 479deb1a393e · 2023-09-18T01:29:03.000+02:00
Fixes pmndrs#529
diff --git a/src/effects/DepthOfFieldEffect.js b/src/effects/DepthOfFieldEffect.js
@@ -59,6 +59,7 @@ export class DepthOfFieldEffect extends Effect {
 				["nearColorBuffer", new Uniform(null)],
 				["farColorBuffer", new Uniform(null)],
 				["nearCoCBuffer", new Uniform(null)],
+				["farCoCBuffer", new Uniform(null)],
 				["scale", new Uniform(1.0)]
 			])
 		});
@@ -126,6 +127,7 @@ export class DepthOfFieldEffect extends Effect {
 
 		this.renderTargetCoC = this.renderTarget.clone();
 		this.renderTargetCoC.texture.name = "DoF.CoC";
+		this.uniforms.get("farCoCBuffer").value = this.renderTargetCoC.texture;
 
 		/**
 		 * A render target that stores a blurred copy of the circle of confusion.
@@ -180,7 +182,7 @@ export class DepthOfFieldEffect extends Effect {
 
 		this.maskPass = new ShaderPass(new MaskMaterial(this.renderTargetCoC.texture));
 		const maskMaterial = this.maskPass.fullscreenMaterial;
-		maskMaterial.maskFunction = MaskFunction.MULTIPLY_RGB_SET_ALPHA;
+		maskMaterial.maskFunction = MaskFunction.MULTIPLY_RGB;
 		maskMaterial.colorChannel = ColorChannel.GREEN;
 
 		/**
@@ -508,12 +510,12 @@ export class DepthOfFieldEffect extends Effect {
 		this.maskPass.setSize(width, height);
 
 		// These buffers require full resolution to prevent color bleeding.
+		this.renderTargetFar.setSize(width, height);
 		this.renderTargetCoC.setSize(width, height);
 		this.renderTargetMasked.setSize(width, height);
 
 		this.renderTarget.setSize(w, h);
 		this.renderTargetNear.setSize(w, h);
-		this.renderTargetFar.setSize(w, h);
 		this.renderTargetCoCBlurred.setSize(w, h);
 
 		// Optimization: 1 / (TexelSize * ResolutionScale) = FullResolution
diff --git a/src/effects/glsl/depth-of-field.frag b/src/effects/glsl/depth-of-field.frag
@@ -11,19 +11,24 @@
 #endif
 
 uniform lowp sampler2D nearCoCBuffer;
+uniform lowp sampler2D farCoCBuffer;
 uniform float scale;
 
 void mainImage(const in vec4 inputColor, const in vec2 uv, const in float depth, out vec4 outputColor) {
 
 	vec4 colorNear = texture2D(nearColorBuffer, uv);
 	vec4 colorFar = texture2D(farColorBuffer, uv);
 
-	float cocNear = texture2D(nearCoCBuffer, uv).r;
-	cocNear = min(cocNear * scale, 1.0);
+	vec2 cocNearFar = vec2(
+		texture2D(nearCoCBuffer, uv).r,
+		texture2D(farCoCBuffer, uv).g
+	);
+
+	cocNearFar = min(cocNearFar * scale, 1.0);
 
 	// The far color buffer has been premultiplied with the CoC buffer.
-	vec4 result = inputColor * (1.0 - colorFar.a) + colorFar;
-	result = mix(result, colorNear, cocNear);
+	vec4 result = inputColor * (1.0 - cocNearFar.y) + colorFar;
+	result = mix(result, colorNear, cocNearFar.x);
 
 	outputColor = result;
 
