improved circle shader

assets/circleShader.glsl

@@ -1,10 +1,46 @@
 #version 100
+#define PI 3.1415926538
+#define TAO 6.2831853076
+#define GRID_SCALE 10.0
 precision mediump float;
 uniform float uTime;
 uniform vec2 uResolution;
 uniform vec4 uFragColor;
-void main() {
-  vec2 uv = gl_FragCoord.xy / uResolution.xy;
-  // gl_FragColor = vec4(uv.x, uv.y, sin(uTime * 1.0), 1.0);
-  gl_FragColor = vec4(0.0, 0.0, 1.0, 1.0);
+
+vec3 rgb(float r, float g, float b) {
+  // normalize rgb
+  return vec3(r/255.0, g/255.0, b/255.0);
+}
+
+vec4 circle (vec2 uv, vec2 pos, float rad, vec3 color) {
+  float d = length(pos - uv) - rad;
+  float t = clamp(d, 0.0, 1.0);
+  return vec4(color, 1.0 - t);
+}
+
+void main() {
+  vec2 uv = gl_FragCoord.xy;
+  vec2 sp = gl_FragCoord.xy / uResolution.xy;
+  vec2 center = uResolution.xy * 0.5;
+  float radius = 0.25 * uResolution.y;
+
+  // vec4 layer1 = vec4(rgb(x/uResolution.x, uv.y/uResolution.y, sin(uTime)), 1.0);
+  //vec4 layer1 = vec4(rgb(60.0, 20.0, 60.0), 1.0);
+  // vec4 layer1 = vec4(uv.x / uResolution.x, uv.y / uResolution.y, 0.0, 1.0);
+  //vec4 layer1 =  vec4(vec3(floor(mod(sp.x * 10.0, 1.0) * 2.0)) + vec3(floor(mod(sp.y * 10.0, 1.0) * 2.0)) , 1.0);
+  vec2 grid = floor(GRID_SCALE * uv.xy * vec2(uResolution.x/uResolution.y, 1.0) / uResolution.x);
+  vec4 layer1 =  vec4(vec3(mod(grid.x + grid.y, 2.0)), 1.0);
+
+  vec3 red = rgb(255.0, 95.0, 60.0);
+  vec3 blue = rgb(60.0, 95.0, 255.0);
+  vec3 green = rgb(60.0, 255.0, 95.0);
+  vec3 white = rgb(255.0, 255.0, 255.0);
+
+  vec4 layer2 = circle(vec2(uv.x + sin(uTime) * 100.0, uv.y - cos(uTime) * 100.0), center, radius, green);
+  vec4 layer3 = circle(vec2(uv.x + sin(uTime * 1.1 + (0.01 * TAO)) * 100.0, uv.y - cos(uTime * 1.1 + (0.01 * TAO)) * 100.0), center, radius, blue);
+  vec4 layer4 = circle(vec2(uv.x + sin(uTime * 1.2 + (0.02 * TAO)) * 100.0, uv.y - cos(uTime * 1.2 + (0.02 * TAO)) * 100.0), center, radius, red);
+
+  // gl_FragColor = vec4(uv.x, uv.y, sin(uTime * 1.0), 1.0);
+  //gl_FragColor = vec4(0.0, 0.0, 1.0, 1.0);
+  gl_FragColor = mix(mix(mix(layer1, layer2, layer2.a), layer3, layer3.a), layer4, layer4.a);
 }