Rename shader

site/example-shader.js

@@ -0,0 +1,70 @@
+export default `#version 300 es
+precision highp float;
+
+uniform sampler2D u_texture;
+uniform vec2 u_resolution;
+uniform bool u_rotate;
+uniform bool u_greyscale;
+
+out vec4 colour;
+
+vec4 grey(float x, float y) {
+  vec3 color = texture(u_texture, vec2(x, y)).rgb;
+  if (!u_greyscale) {
+    return vec4(color, 1.0);
+  }
+  float grey = dot(color, vec3(0.299, 0.587, 0.114));
+  return vec4(vec3(grey), 1.0);
+}
+
+void main() {
+  ivec2 size = textureSize(u_texture, 0);
+  float ar_texture = float(size.x) / float(size.y);
+  if (u_rotate) {
+    float ar_resolution = u_resolution.y / u_resolution.x;
+    if (ar_resolution >= ar_texture) {
+      float height = float(u_resolution.x) * ar_texture;
+      float border_height = (u_resolution.y - height) / 2.0;
+      if ((gl_FragCoord.y < border_height) ||
+          (gl_FragCoord.y >= (border_height + height))) {
+        colour = vec4(0);
+      } else {
+        colour = grey(1.0 - (gl_FragCoord.y - border_height) / height,
+                      gl_FragCoord.x / u_resolution.x);
+      }
+    } else {
+      float width = float(u_resolution.y) / ar_texture;
+      float border_width = (u_resolution.x - width) / 2.0;
+      if ((gl_FragCoord.x < border_width) ||
+          (gl_FragCoord.x >= (border_width + width))) {
+        colour = vec4(0);
+      } else {
+        colour = grey(1.0 - gl_FragCoord.y / u_resolution.y,
+                      (gl_FragCoord.x - border_width) / width);
+      }
+    }
+  } else {
+    float ar_resolution = u_resolution.x / u_resolution.y;
+    if (ar_resolution >= ar_texture) {
+      float width = float(u_resolution.y) * ar_texture;
+      float border_width = (u_resolution.x - width) / 2.0;
+      if ((gl_FragCoord.x < border_width) ||
+          (gl_FragCoord.x >= (border_width + width))) {
+        colour = vec4(0);
+      } else {
+        colour = grey((gl_FragCoord.x - border_width) / width,
+                      gl_FragCoord.y / u_resolution.y);
+      }
+    } else {
+      float height = float(u_resolution.x) / ar_texture;
+      float border_height = (u_resolution.y - height) / 2.0;
+      if ((gl_FragCoord.y < border_height) ||
+          (gl_FragCoord.y >= (border_height + height))) {
+        colour = vec4(0);
+      } else {
+        colour = grey(gl_FragCoord.x / u_resolution.x,
+                      (gl_FragCoord.y - border_height) / height);
+      }
+    }
+  }
+}`;