2025-02-12 03:17:45 -08:00
|
|
|
#version 300 es
|
|
|
|
precision highp float;
|
|
|
|
|
|
|
|
uniform float u_time;
|
|
|
|
|
|
|
|
uniform float u_canvasWidth;
|
|
|
|
uniform float u_canvasHeight;
|
|
|
|
|
|
|
|
|
|
|
|
out vec4 fragColor;
|
|
|
|
|
2025-02-13 16:15:03 -08:00
|
|
|
// See https://thebookofshaders.com/10/
|
|
|
|
float random (vec2 st) {
|
|
|
|
return fract(sin(dot(st.xy, vec2(12.9898,78.233)))* 43758.5453123);
|
|
|
|
}
|
|
|
|
|
2025-02-14 16:56:15 -08:00
|
|
|
vec4 boxFade(vec4 inputColor, float boxSize, float period) {
|
|
|
|
float canvasSize = max(u_canvasWidth, u_canvasHeight);
|
|
|
|
|
|
|
|
vec2 uv = gl_FragCoord.xy/vec2(canvasSize, canvasSize);
|
2025-02-14 17:01:09 -08:00
|
|
|
uv.x = floor(uv.x / boxSize) * boxSize;
|
|
|
|
uv.y = floor(uv.y / boxSize) * boxSize;
|
2025-02-14 16:56:15 -08:00
|
|
|
|
|
|
|
float rand = random(uv);
|
2025-02-15 03:30:50 -08:00
|
|
|
float mask = mod(u_time / period, 2.4);
|
2025-02-14 16:56:15 -08:00
|
|
|
|
|
|
|
return rand < mask ? inputColor : vec4(0.0, 0.0, 0.0, 1.0);
|
|
|
|
}
|
|
|
|
|
2025-02-15 03:30:50 -08:00
|
|
|
vec2 pixellate(vec2 inputVec, float size) {
|
|
|
|
return vec2(
|
|
|
|
floor(inputVec.x / size) * size,
|
|
|
|
floor(inputVec.y / size) * size
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2025-02-15 03:32:43 -08:00
|
|
|
void pixelatedSinWave() {
|
2025-02-15 03:30:50 -08:00
|
|
|
vec2 uv = gl_FragCoord.xy/vec2(u_canvasWidth, u_canvasHeight);
|
|
|
|
|
2025-02-15 03:32:43 -08:00
|
|
|
float amount = 1.0/(u_time * 9.0);
|
2025-02-15 03:30:50 -08:00
|
|
|
|
|
|
|
uv = pixellate(uv, amount);
|
2025-02-13 03:24:51 -08:00
|
|
|
|
2025-02-15 03:30:50 -08:00
|
|
|
//vec4 outputColor = vec4(uv.x, 0., uv.y, 1.0);
|
|
|
|
float dist = distance(uv, vec2(0.5, 0.5));
|
|
|
|
float curve = sin(dist * 60.0);
|
|
|
|
vec4 outputColor = vec4(0.5, 0.1, curve, 1.0);
|
2025-02-13 03:24:51 -08:00
|
|
|
|
2025-02-13 16:34:00 -08:00
|
|
|
float size = 0.01;
|
2025-02-15 03:30:50 -08:00
|
|
|
float period = 1.0;
|
2025-02-13 16:15:03 -08:00
|
|
|
|
2025-02-15 03:30:50 -08:00
|
|
|
fragColor = boxFade(outputColor, size, period);
|
2025-02-13 03:24:51 -08:00
|
|
|
|
2025-02-12 03:17:45 -08:00
|
|
|
}
|
2025-02-14 12:58:58 -08:00
|
|
|
|
2025-02-15 03:32:43 -08:00
|
|
|
|
|
|
|
void main() {
|
|
|
|
|
|
|
|
pixelatedSinWave();
|
|
|
|
|
|
|
|
}
|