Created
May 23, 2020 17:58
-
-
Save CharStiles/39ac653485e137a76292e1d14ca2a2ee to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
float circ(vec2 p){ | |
return length(p) - .50; | |
} | |
// Repeat in two dimensions | |
vec2 pMod2(inout vec2 p, vec2 size) { | |
vec2 c = floor((p + size*0.5)/size); | |
p = mod(p + size*0.5,size) - size*0.5; | |
return c; | |
} | |
// http://www.iquilezles.org/www/articles/palettes/palettes.htm | |
// As t runs from 0 to 1 (our normalized palette index or domain), | |
//the cosine oscilates c times with a phase of d. | |
//The result is scaled and biased by a and b to meet the desired constrast and brightness. | |
vec3 cosPalette( float t, vec3 a, vec3 b, vec3 c, vec3 d ) | |
{ | |
return a + b*cos( 6.28318*(c*t+d) ); | |
} | |
float sdBox( in vec2 p, in vec2 b ) | |
{ | |
vec2 d = abs(p)-b; | |
return length(max(d,vec2(0))) + min(max(d.x,d.y),0.0); | |
} | |
void main() | |
{ | |
// distance metric | |
vec2 position = uv(); | |
// move everything left to right by adding sin(time) in the x component | |
// sin goes from -1 to 1 as time increases | |
position = position + vec2(sin(time),0); | |
// this modifies the position in place, notice how we dont do anything with | |
// the output of pMod2. we repeat the space every 1 unit in both x and y direction | |
// hence why it looks like a grid | |
pMod2(position, vec2(1)); | |
// create our shape! we scale position by 4 so the circle appears smaller | |
float shape = circ( position * vec2(4.0)); | |
// here we modify position so the box can move back and forth | |
// scale the range down by multiplying by 0.5 so it doesnt go off screen | |
position = position + vec2(cos(time)*0.5,0); | |
// create our box | |
float shape2 = sdBox(position, vec2(0.06)); | |
// this makes the box have a hard edge, ceil takes any floating point number | |
// and brings it up to the first whole number. short for ceiling i guess | |
shape2 = ceil(shape2); | |
// we want to color the pixel according to whatever shape is closer, so we | |
// take the minimum of the shapes! | |
shape = min(shape,shape2); | |
// get our color | |
vec3 col = cosPalette(time/20.,vec3(0.5),vec3(0.5),vec3(1),vec3(0.1,0.2,0.8)); | |
// shape is 1 when there is no shape and 0 when there is a shape so multiplying col by | |
// shape colors where shape is 1 aka where there is no shape! | |
col = vec3(shape) * col; | |
// output: pixel color | |
gl_FragColor = min(vec4( col, 1.0 ), vec4(0.8)); | |
// we take the min of the output color and a very light grey color because The Force makes | |
// all of their controls white at the bottom all white without any sort of outline, which is | |
// silly, so you can make it vec4(col.rgb,1.0) in other softwares or if you dont care | |
// about seeing the controls | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment