let program;

function setup() {
	pixelDensity(1);
	const canvas = createCanvas(windowWidth, windowHeight,WEBGL);
	rectMode(CENTER);
	noStroke();
	fill(1);
	program = createShader(vert,frag);
}

function draw() {
  shader(program);
  background(0);
	program.setUniform('res',[width,height]);
	program.setUniform('t', frameCount / 720);
  rect(0,0,width,height);
}

const vert=`
#ifdef GL_ES
precision highp float;
precision highp int;
#endif

#extension GL_OES_standard_derivatives : enable
attribute vec3 aPosition;
uniform mat4 uModelViewMatrix;
uniform mat4 uProjectionMatrix;
uniform mat3 uNormalMatrix;
void main() {
  gl_Position = uProjectionMatrix * uModelViewMatrix * vec4(aPosition, 1.0);
}`;

const frag=`
#ifdef GL_ES
precision highp float;
#endif

#define PI 3.14159265358979323846

uniform vec2 res;
uniform float t;

//https://iquilezles.org/articles/distfunctions2d/
float sdBox( in vec2 p, in vec2 b ) {
    vec2 d = abs(p)-b;
    return length(max(d,0.0)) + min(max(d.x,d.y),0.0);
}

float powerInOut(float t, float a) {
  float tt = max(0.0, min(t, 1.0));
  if (tt < 0.5) {
    return pow(tt * 2.0, a) * 0.5;
  } else {
    return 1.0 - pow((1.0 - tt) * 2.0, a) * 0.5;
  }
}
  
vec2 walk(float t) {
  float tt = fract(t);
  int ph = int(tt * 4.0);
  float ft = powerInOut(fract(tt * 4.0), 4.0);
  if (ph == 0) { return mix(vec2(-0.5, -0.5), vec2(0.5, -0.5), ft);} else
  if (ph == 1) { return mix(vec2(0.5, -0.5), vec2(0.5, 0.5), ft);} else
  if (ph == 2) { return mix(vec2(0.5, 0.5), vec2(-0.5, 0.5), ft);}
  return mix(vec2(-0.5, 0.5), vec2(-0.5, -0.5), ft);
}

float sdf(vec2 p) {
  float dist = 10.0;
  for (float i = 0.0; i < 2.0; i ++) {
    vec2 pp = p - walk(t * pow(-4.0, i) * 2.0) * 0.25;
    dist = min(sdBox(pp, vec2(0.025)), dist);
  }
  return dist;
}

float rayMarch(vec2 p, vec2 lightPos) {
  vec2 rayDir = normalize((lightPos - p));
  float dist = 0.0;
  float threshold = 0.005;
  for(int i = 0 ; i < 16 ; ++i) {
    vec2 head = p + rayDir * dist;
    if (dot(head - lightPos, rayDir) > 0.0) { return - 1.0; }
    float d = sdf(head);
    if(d < threshold) { return dist; }
    dist += d;
  }
  return -1.0;
}

vec4 render(vec2 p, float t) {
  vec2 lightPos[3];
  lightPos[0] = walk(t * 2.0);
  lightPos[1] = walk(t * 4.0);
  lightPos[2] = walk(t * 8.0);
  vec3 lightColors[3];
  lightColors[0] = vec3(0.3, 0.2, 0.0);
  lightColors[1] = vec3(0.0, 0.5, 0.2);
  lightColors[2] = vec3(0.5, 0.2, 0.5);
  vec3 l = vec3(0.0);
  for (int i = 0; i < 3; i ++) {
    float dist = rayMarch(p, lightPos[i] * 0.5);
    l += lightColors[i] * (dist > 0.0 ? 0.0 : 1.0);
  }
  l = pow(l, vec3(1.0/ 2.2));
  return vec4(l, 1.0);
}

void main(void)
{
  vec2 crd = (gl_FragCoord.xy - res * 0.5) / min(res.x, res.y);
	vec4 color = render(crd, t);
  gl_FragColor = color;
}`;