So... Yeah. That's the new filter that we'll be making - a variable-controlled blur filter. This is actually pretty simple. In fact, the script is mostly the same as the blur script - the only difference is that we interpolate between the blurred texture and the non-blurred texture with a variable. Here's the script...
filter.shaderText = """
uniform sampler2D bgl_RenderedTexture;
uniform float percent;
float value = 0.0015; // Here, value = distance away to check for pixel color
vec4 color = texture2D(bgl_RenderedTexture, vec2(gl_TexCoord.st.x + value, gl_TexCoord.st.y + value)); // Sample area around current pixel
color += texture2D(bgl_RenderedTexture, vec2(gl_TexCoord.st.x - value, gl_TexCoord.st.y - value));
color += texture2D(bgl_RenderedTexture, vec2(gl_TexCoord.st.x + value, gl_TexCoord.st.y - value));
color += texture2D(bgl_RenderedTexture, vec2(gl_TexCoord.st.x - value, gl_TexCoord.st.y + value));
color /= 4.0; // And average out the final color by number of samples; this could be in a for-loop
vec4 origcolor = texture2D(bgl_RenderedTexture, gl_TexCoord.st); // This is a slight difference from the blur filter;
gl_FragColor = origcolor + percent * (color - origcolor); // Here, we use a simple formula where if percent = 0, then we simply use the original color. Otherwise, we use the blurred color;
// This forumla is called linear interpolation, and is a + scaler * (b - a), so then when scaler = 0, a is returned, and when scaler = 1, then b is returned
// By using this, we can control how powerful our filter is.
"""There's really not too much of a difference between the Blur script in part 2, and this script. Let's examine the changes in the code in detail.
vec4 origcolor = texture2D(bgl_RenderedTexture, gl_TexCoord.st);
gl_FragColor = origcolor + percent * (color - origcolor);
As you can see, we don't simply set gl_FragColor to be the color variable as we did in the previous part of this series. In the first line, we create a new vector, the original color of the pixel that we're altering. So, we have two vector variables at this point - the blurred color, and the original color. Then, we set gl_FragColor to be the result of a simple formula, one called a linear interpolation.
The formula for a linear interpolation is (a + scaler * (b - a)). This formula essentially is saying that when scaler is 0, then you will get the value of a, and when scaler is 1, you will get the value of b.You can use different number values for a or b, which is what we do in our example, using our two color vectors.
3/21/11 Addition: The linear interpolation formula works, and is a good formula to have around, but you can also use the mix function in a GLSL screen filter script, which takes as arguments for the first a color vector, the second another color, and the third a percentage.
So, we should be able to control how blurry our image is by controlling the scaler variable, which is in this case, percent. Where is percent created in the script, though? Well, it isn't created in the script at all - we actually create it outside of the shader script, and it is passed into the script in the line near the top - the line that says uniform float percent. That is the point of uniform variables - they allow us to pass values from variables elsewhere into our shader script. Another example of a uniform variable is the bgl_RenderedTexture, which we don't create - the BGE creates and passes it to the shader script for us.
Now, you should be able to control a 2D filter through means of a user-defined uniform variable, one that the BGE automatically passes from an object variable. Download the source code for Part 3 of the Basic OpenGL 2D Screen Filters series here. As always, have fun!