Version 1 (modified by osg, 7 years ago)

Initial copy of NPS Version

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 vec4 grayScaleWeights;

    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.
        //

        //  grayScaleWeights = vec4(1,1,1,1);

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

        //
        float screenCenterX = 640;
        float screenCenterY = 512;

        float deltaX = screenCenterX - gl_FragCoord.x;
        float deltaY = screenCenterY - gl_FragCoord.y;

        float dist = sqrt(deltaX * deltaX + deltaY * deltaY); 
        float inRange = 50.;
        float outRange = 600.;

        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));
           }
        }
        
    }

Todo:

  • Need to pass uniforms to vary the cone of visibility.
  • Need to pass parameters in for center of screen.