Replacing bilateral blur with kernel blur in SSAO Rendering Pipeline

src/PostProcess/RenderPipeline/Pipelines/babylon.ssaoRenderingPipeline.ts

@@ -74,8 +74,8 @@
 
         private _originalColorPostProcess: PassPostProcess;
         private _ssaoPostProcess: PostProcess;
-        private _blurHPostProcess: PostProcess;
-        private _blurVPostProcess: PostProcess;
+        private _blurHPostProcess: BlurPostProcess;
+        private _blurVPostProcess: BlurPostProcess;
         private _ssaoCombinePostProcess: PostProcess;
 
         private _firstUpdate: boolean = true;
@@ -153,39 +153,20 @@
 
         // Private Methods
         private _createBlurPostProcess(ratio: number): void {
-            /*
-            var samplerOffsets = [
-                -8.0, -6.0, -4.0, -2.0,
-                0.0,
-                2.0, 4.0, 6.0, 8.0
-            ];
-            */
-            var samplerOffsets = new Array<number>();
-
-            for (var i = -8; i < 8; i++) {
-                samplerOffsets.push(i * 2);
-            }
+            var size = 16;
 
-            this._blurHPostProcess = new PostProcess("BlurH", "ssao", ["outSize", "samplerOffsets"], ["depthSampler"], ratio, null, Texture.TRILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, "#define BILATERAL_BLUR\n#define BILATERAL_BLUR_H\n#define SAMPLES 16");
-            this._blurHPostProcess.onApply = (effect: Effect) => {
-                effect.setFloat("outSize", this._ssaoCombinePostProcess.width);
-                effect.setTexture("depthSampler", this._depthTexture);
-
-                if (this._firstUpdate) {
-                    effect.setArray("samplerOffsets", samplerOffsets);
-                }
-            };
+            this._blurHPostProcess = new BlurPostProcess("BlurH", new Vector2(1, 0), size, ratio, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, Engine.TEXTURETYPE_UNSIGNED_INT);
+            this._blurVPostProcess = new BlurPostProcess("BlurV", new Vector2(0, 1), size, ratio, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, Engine.TEXTURETYPE_UNSIGNED_INT);
 
-            this._blurVPostProcess = new PostProcess("BlurV", "ssao", ["outSize", "samplerOffsets"], ["depthSampler"], ratio, null, Texture.TRILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, "#define BILATERAL_BLUR\n#define SAMPLES 16");
-            this._blurVPostProcess.onApply = (effect: Effect) => {
-                effect.setFloat("outSize", this._ssaoCombinePostProcess.height);
-                effect.setTexture("depthSampler", this._depthTexture);
+            this._blurHPostProcess.onActivateObservable.add(() => {
+                let dw = this._blurHPostProcess.width / this._scene.getEngine().getRenderWidth();
+                this._blurHPostProcess.kernel = size * dw;
+            });
 
-                if (this._firstUpdate) {
-                    effect.setArray("samplerOffsets", samplerOffsets);
-                    this._firstUpdate = false;
-                }
-            };
+            this._blurVPostProcess.onActivateObservable.add(() => {
+                let dw = this._blurVPostProcess.height / this._scene.getEngine().getRenderHeight();
+                this._blurVPostProcess.kernel = size * dw;
+            });
         }
 
         public _rebuild() {

src/Shaders/ssao.fragment.fx

@@ -67,39 +67,3 @@ void main()
 	gl_FragColor.a = 1.0;
 }
 #endif
-
-#ifdef BILATERAL_BLUR
-uniform sampler2D depthSampler;
-uniform float outSize;
-uniform float samplerOffsets[SAMPLES];
-
-void main()
-{
-
-	float texelsize = 1.0 / outSize;
-	float compareDepth = texture2D(depthSampler, vUV).r;
-	float result = 0.0;
-	float weightSum = 0.0;
-
-	for (int i = 0; i < SAMPLES; ++i)
-	{
-		#ifdef BILATERAL_BLUR_H
-		vec2 sampleOffset = vec2(texelsize * samplerOffsets[i], 0.0);
-		#else
-		vec2 sampleOffset = vec2(0.0, texelsize * samplerOffsets[i]);
-		#endif
-		vec2 samplePos = vUV + sampleOffset;
-
-		float sampleDepth = texture2D(depthSampler, samplePos).r;
-		float weight = (1.0 / (0.0001 + abs(compareDepth - sampleDepth)));
-
-		result += texture2D(textureSampler, samplePos).r * weight;
-		weightSum += weight;
-	}
-
-	result /= weightSum;
-
-	gl_FragColor.rgb = vec3(result);
-	gl_FragColor.a = 1.0;
-}
-#endif