split huge image into tiles, load tiles as grayscale images

frontend/shader/sobel.frag

@@ -0,0 +1,34 @@
+precision highp float;
+
+// x,y coordinates, given from the vertex shader
+varying vec2 vTexCoord;
+
+// the canvas contents, given from filter()
+uniform sampler2D tex0;
+// other useful information from the canvas
+uniform vec2 texelSize;
+uniform vec2 canvasSize;
+// a custom variable from this sketch
+uniform float pulse;
+
+void main() {
+    // Sample neighboring pixels
+    float tl = texture2D(tex0, vTexCoord + vec2(-texelSize.x, -texelSize.y)).r;
+    float l = texture2D(tex0, vTexCoord + vec2(-texelSize.x, 0.0)).r;
+    float bl = texture2D(tex0, vTexCoord + vec2(-texelSize.x, texelSize.y)).r;
+
+    float t = texture2D(tex0, vTexCoord + vec2(0.0, -texelSize.y)).r;
+    float b = texture2D(tex0, vTexCoord + vec2(0.0, texelSize.y)).r;
+
+    float tr = texture2D(tex0, vTexCoord + vec2(texelSize.x, -texelSize.y)).r;
+    float r = texture2D(tex0, vTexCoord + vec2(texelSize.x, 0.0)).r;
+    float br = texture2D(tex0, vTexCoord + vec2(texelSize.x, texelSize.y)).r;
+
+    // Sobel kernels
+    float gx = -tl - 2.0 * l - bl + tr + 2.0 * r + br;
+    float gy = -tl - 2.0 * t - tr + bl + 2.0 * b + br;
+
+    float edge = length(vec2(gx, gy));
+
+    gl_FragColor = vec4(vec3(edge), 1.0);
+}