Version 2 (modified by osg, 6 years ago)

added uniforms for screen center and in/out range

A Quick Shader to Simulate Graying-Out (GLOC)

Current State

Here's a fragment shader that will fade to a constant gray based on pixel distance from the center of the screen.

    uniform sampler2D testTexture;
    uniform vec4 grayScaleWeights; // [0.3, 0.59, 0.11, 1.0]
    uniform vec4 screenCenterAndInOut; // [screenCenterX, screenCenterY, inRange, outRange]

    void main( void )
    {
        // Fetch the regular RGB texel color from the texture
        vec4 texelColor = texture2D( testTexture, gl_TexCoord[0].xy );

        //
        // Converting to grayscale:
        //
        // Converting an image to grayscale is done by taking a weighted average of
        // the red, green and blue color components. The standard weights for this 
        // type of conversion are (0.30, 0.59, 0.11). Therefore, the gray component 
        // or luminance that we need to compute can be defined as a luminance 
        // filter like so:
        //
        // luminance = 0.30*R + 0.59*G + 0.11*B
        //
        // If we think of our RGB colors as vectors, we can see that this 
        // calculation is actually just a dot product.
        //

        vec4 scaledColor = texelColor * grayScaleWeights;
        float luminance = scaledColor.r + scaledColor.g + scaledColor.b;

        float deltaX = screenCenterAndInOut.x - gl_FragCoord.x;
        float deltaY = screenCenterAndInOut.y - gl_FragCoord.y;

        float dist = sqrt(deltaX * deltaX + deltaY * deltaY); 
        float inRange = screenCenterAndInOut.z;
        float outRange = screenCenterAndInOut.w;

        if (dist < inRange)
        {
           gl_FragColor = texelColor;
        }
        else
        {
           if ( dist > outRange)
           { 
              gl_FragColor = vec4(0.25,0.25,0.25,1);
           }

           else
           {
              float scale = (dist < outRange) ? (outRange - dist) / (outRange - inRange) : 1 ;

              float smooth = smoothstep(0,1,scale);
              luminance = clamp(luminance, 0, .25);

              gl_FragColor = mix(texelColor,luminance,(1.-smooth));
           }
        }
        
    }