opengl-espixel-shaderglslesssao

Pure Depth SSAO flickering


I try to implement Pure Depth SSAO, using this tutorial, into an OpenGL ES 2.0 engine. Now I experience flickering, which looks like I read from somewhere, where I have no data. Can you see where I made a mistake or do you have an idea how to solve the flickering problem ? I need this to run on mobile and html5 with forward rendering, thats why I use the depth only version of SSAO. Many thanks

Video: Youtube

GLSL Code:

uniform sampler2D texture0;
uniform sampler2D texture1;

varying vec2 uvVarying;

vec3 GetNormalFromDepth(float depth, vec2 uv);

uniform mediump vec2 agk_resolution;
uniform float ssaoStrength;
uniform float ssaoBase;
uniform float ssaoArea;
uniform float ssaoFalloff;
uniform float ssaoRadius;

const int samples = 16;
vec3 sampleSphere[samples];

void main()
{
    highp float depth = texture2D(texture0, uvVarying).r;
    vec3 random = normalize( texture2D(texture1, uvVarying * agk_resolution / 64.0).rgb );

    vec3 position = vec3(uvVarying, depth);
    vec3 normal = GetNormalFromDepth(depth, uvVarying);

    sampleSphere[0] = vec3( 0.5381, 0.1856,-0.4319);
    sampleSphere[1] = vec3( 0.1379, 0.2486, 0.4430);
    sampleSphere[2] = vec3( 0.3371, 0.5679,-0.0057);
    sampleSphere[3] = vec3(-0.6999,-0.0451,-0.0019);
    sampleSphere[3] = vec3( 0.0689,-0.1598,-0.8547);
    sampleSphere[5] = vec3( 0.0560, 0.0069,-0.1843);
    sampleSphere[6] = vec3(-0.0146, 0.1402, 0.0762);
    sampleSphere[7] = vec3( 0.0100,-0.1924,-0.0344);
    sampleSphere[8] = vec3(-0.3577,-0.5301,-0.4358);
    sampleSphere[9] = vec3(-0.3169, 0.1063, 0.0158);
    sampleSphere[10] = vec3( 0.0103,-0.5869, 0.0046);
    sampleSphere[11] = vec3(-0.0897,-0.4940, 0.3287);
    sampleSphere[12] = vec3( 0.7119,-0.0154,-0.0918);
    sampleSphere[13] = vec3(-0.0533, 0.0596,-0.5411);
    sampleSphere[14] = vec3( 0.0352,-0.0631, 0.5460);
    sampleSphere[15] = vec3(-0.4776, 0.2847,-0.0271);

    float radiusDepth = ssaoRadius/depth;
    float occlusion = 0.0;
    for(int i=0; i < samples; i++)
    {
        vec3 ray = radiusDepth * reflect(sampleSphere[i], random);
        vec3 hemiRay = position + sign(dot(ray, normal)) * ray;

        float occDepth = texture2D(texture0, clamp(hemiRay.xy, 0.0, 1.0)).r;
        float difference = depth - occDepth;

        occlusion += step(ssaoFalloff, difference) * (1.0 - smoothstep(ssaoFalloff, ssaoArea, difference));

        // float rangeCheck = abs(difference) < radiusDepth ? 1.0 : 0.0;
        // occlusion += (occDepth <= position.z ? 1.0 : 0.0) * rangeCheck;
    }

    float ao = 1.0 - ssaoStrength * occlusion * (1.0 / float(samples));

    gl_FragColor = vec4(clamp(ao + ssaoBase, 0.0, 1.0));
}

vec3 GetNormalFromDepth(float depth, vec2 uv)
{
    vec2 offset1 = vec2(0.0,1.0/agk_resolution.y);
    vec2 offset2 = vec2(1.0/agk_resolution.x,0.0);

    float depth1 = texture2D(texture0, uv + offset1).r;
    float depth2 = texture2D(texture0, uv + offset2).r;

    vec3 p1 = vec3(offset1, depth1 - depth);
    vec3 p2 = vec3(offset2, depth2 - depth);

    vec3 normal = cross(p1, p2);
    normal.z = -normal.z;

    return normalize(normal);
}

Solution

  • I carefully checked my code and the code you (Rabbid76) created for JSFiddle and came across the if (depth > 0.0) statement which solved the problem... so you somehow answered my question and I would like to thank you and mark you for that