Back to shaders

Shader test bench

Line Move Alpha V1 (P.O.).fs

misc-isf-shaders utility glsl runnable fragment MIT
Source
runnable fragment

Complete GLSL fragment shader. Stronghold runs it directly when the browser can compile it.

Code

uniform sampler2D imageInput;
uniform float lineWidth;
uniform float speed;
uniform float numLines;
uniform float rotation;
uniform float feather;
precision mediump float;
/*{
    "CATEGORIES": ["Generators"],
    "CREDIT": "ProjectileObjects",
    "DESCRIPTION": "Moving Lines",
    "INPUTS": [
        {
            "NAME": "imageInput",
            "TYPE": "image"
        },
        {
            "DEFAULT": 2,
            "MAX": 100,
            "MIN": 1,
            "NAME": "lineWidth",
            "TYPE": "float"
        },
        {
            "DEFAULT": 1,
            "MAX": 10,
            "MIN": 0.1,
            "NAME": "speed",
            "TYPE": "float"
        },
        {
            "DEFAULT": 10,
            "MAX": 50,
            "MIN": 1,
            "NAME": "numLines",
            "TYPE": "float"
        },
        {
            "DEFAULT": 0.0,
            "MAX": 6.28319,
            "MIN": 0.0,
            "NAME": "rotation",
            "TYPE": "float"
        },
        {
    "DEFAULT": 0.5,
    "MAX": 100.0,
    "MIN": 0.0,
    "NAME": "feather",
    "TYPE": "float"
}
    ],
    "ISFVSN": "2"
}
*/

void main() {
    float spacing = u_resolution.x / numLines;
    float doubleLineWidth = 2.0 * lineWidth;

    vec2 centeredCoord = gl_FragCoord.xy - u_resolution.xy * 0.5;

    // Rotation transformation
    float cosR = cos(rotation);
    float sinR = sin(rotation);
    vec2 rotatedCoord = vec2(centeredCoord.x * cosR - centeredCoord.y * sinR, 
                             centeredCoord.x * sinR + centeredCoord.y * cosR);

    rotatedCoord += u_resolution.xy * 0.5;

    float x = rotatedCoord.x;
    float s = spacing - mod(float(FRAMEINDEX) * speed, spacing);

    float distToLine = abs(mod(x + s, spacing) - lineWidth / 2.0);

    // Apply feathering while keeping lines thick
    float featheredAlpha = clamp(1.0 - (distToLine - (lineWidth / 2.0)) / feather, 0.0, 1.0);
    
    vec2 normalizedCoord = gl_FragCoord.xy / u_resolution.xy;
    vec4 imageColor = texture2D(imageInput, normalizedCoord);

    gl_FragColor = mix(imageColor, vec4(0.0, 0.0, 0.0, 0.0), featheredAlpha);
}