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