Back to shaders
Shader test bench
Doorway.fs
runnable fragment
Complete GLSL fragment shader. Stronghold runs it directly when the browser can compile it.
Code
uniform sampler2D startImage;
uniform sampler2D endImage;
uniform float progress;
uniform float reflection;
uniform float perspective;
uniform float depth;
precision mediump float;
/*{
"CATEGORIES": [
"Wipe"
],
"CREDIT": "Automatically converted from https://www.github.com/gl-transitions/gl-transitions/tree/master/doorway.glsl",
"DESCRIPTION": "",
"INPUTS": [
{
"NAME": "startImage",
"TYPE": "image"
},
{
"NAME": "endImage",
"TYPE": "image"
},
{
"DEFAULT": 0,
"MAX": 1,
"MIN": 0,
"NAME": "progress",
"TYPE": "float"
},
{
"DEFAULT": 0.4,
"MAX": 1,
"MIN": 0,
"NAME": "reflection",
"TYPE": "float"
},
{
"DEFAULT": 0.4,
"MAX": 1,
"MIN": 0,
"NAME": "perspective",
"TYPE": "float"
},
{
"DEFAULT": 3,
"MAX": 10,
"MIN": 0,
"NAME": "depth",
"TYPE": "float"
}
],
"ISFVSN": "2"
}
*/
vec4 getFromColor(vec2 inUV) {
return texture2D(startImage, inUV);
}
vec4 getToColor(vec2 inUV) {
return texture2D(endImage, inUV);
}
// author: gre
// License: MIT
const vec4 black = vec4(0.0, 0.0, 0.0, 1.0);
const vec2 boundMin = vec2(0.0, 0.0);
const vec2 boundMax = vec2(1.0, 1.0);
bool inBounds (vec2 p) {
return all(lessThan(boundMin, p)) && all(lessThan(p, boundMax));
}
vec2 project (vec2 p) {
return p * vec2(1.0, -1.2) + vec2(0.0, -0.02);
}
vec4 bgColor (vec2 p, vec2 pto) {
vec4 c = black;
pto = project(pto);
if (inBounds(pto)) {
c += mix(black, getToColor(pto), reflection * mix(1.0, 0.0, pto.y));
}
return c;
}
vec4 transition (vec2 p) {
vec2 pfr = vec2(-1.), pto = vec2(-1.);
float middleSlit = 2.0 * abs(p.x-0.5) - progress;
if (middleSlit > 0.0) {
pfr = p + (p.x > 0.5 ? -1.0 : 1.0) * vec2(0.5*progress, 0.0);
float d = 1.0/(1.0+perspective*progress*(1.0-middleSlit));
pfr.y -= d/2.;
pfr.y *= d;
pfr.y += d/2.;
}
float size = mix(1.0, depth, 1.-progress);
pto = (p + vec2(-0.5, -0.5)) * vec2(size, size) + vec2(0.5, 0.5);
if (inBounds(pfr)) {
return getFromColor(pfr);
}
else if (inBounds(pto)) {
return getToColor(pto);
}
else {
return bgColor(p, pto);
}
}
void main() {
gl_FragColor = transition((gl_FragCoord.xy / u_resolution.xy).xy);
}