wooo

code.js

@@ -70,7 +70,7 @@ let startGL = function() {
 	];
 	gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(tex), gl.STATIC_DRAW);
 
-	const dim = 1024;
+	const dim = 512;
 	const tex0 = createTexture(gl, dim);
 	const tex1 = createTexture(gl, dim);
 

gl.js

@@ -27,6 +27,38 @@ const fsSource = `
 	uniform sampler2D sampler;
 	uniform bool enabled;
 
+
+	highp vec3 rgb2hsv(highp vec3 c)
+	{
+	    highp vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);
+	    highp vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));
+	    highp vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));
+
+	    highp float d = q.x - min(q.w, q.y);
+	    highp float e = 1.0e-10;
+	    return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);
+	}
+
+	highp vec3 hsv2rgb(highp vec3 c)
+	{
+	    highp vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);
+	    highp vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);
+	    return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);
+	}
+
+
+	highp vec3 interpolate(highp vec4 from, highp vec4 to, highp float amt) {
+		highp vec3 from_hsv = rgb2hsv(from.xyz);
+		highp vec3 to_hsv = rgb2hsv(to.xyz);
+		
+		highp vec3 final;
+		final.x = mix(from_hsv.x, to_hsv.x, amt);
+		final.y = mix(from_hsv.y, to_hsv.y, amt);
+		final.z = mix(from_hsv.z, to_hsv.z, amt);
+		
+		return hsv2rgb(final);
+	}
+
 	highp float rand(vec2 co)
 	{
 		co = co * rseed * dim * 10.;
@@ -39,7 +71,7 @@ const fsSource = `
 	}
 
 
-	highp vec4 decideOutcome(ivec2 texel) {
+	ivec2 decideOutcome(ivec2 texel, highp float dim) {
 
 		highp vec4 outcome = vec4(0., 0., 0., 0.);
 
@@ -48,47 +80,59 @@ const fsSource = `
 
 		int which = int(r * 5.0);
 
+		ivec2 t = texel;
+
 		if(which == 0) {
 			// center
-			outcome = texture2D(sampler, texcoord_f);
+			t = texel;
 		}
 		else if(which == 1) {
 			// up
 			if(texel.y < 1) {
 				// down instead
+				t = ivec2(texel.x, texel.y + 1);
+			} else {
+				t = ivec2(texel.x, texel.y - 1);
 			}
-			outcome = texture2D(sampler, vec2(texcoord_f.x, texcoord_f.y));
 		}
 		else if(which == 2) {
-
+			// right
+			if(texel.x > int(dim)-2) {
+				// left instead
+				t = ivec2(texel.x - 1, texel.y);
+			} else {
+				t = ivec2(texel.x + 1, texel.y);
+			}
 		}
 		else if(which == 3) {
-
+			// down
+			if(texel.y > int(dim)-2) {
+				// up instead
+				t = ivec2(texel.x, texel.y - 1);
+			} else {
+				t = ivec2(texel.x, texel.y + 1);
+			}
 		}
 		else if(which == 4) {
-
-		}
-
-
-
-		if(texel.x < 1) {
-		}
-		else if(texel.x > int(dim)-2) {
-		}
-		
-		if(texel.y < 1) {
-		}
-		else if(texel.y > int(dim)-2) {
+			// left
+			if(texel.x < 1) {
+				// right instead
+				t = ivec2(texel.x + 1, texel.y);
+			} else {
+				t = ivec2(texel.x - 1, texel.y);
+			}
 		}
 
-
-		return outcome;
+		return t;
 	}
 
 	void main() {
 		if (enabled) {
 			ivec2 texel = ivec2(texcoord_f * dim);
-			gl_FragColor = decideOutcome(texel);
+			ivec2 outcome = decideOutcome(texel, dim);
+
+
+			gl_FragColor = vec4(interpolate(texture2D(sampler, texcoord_f), texture2D(sampler, (vec2(outcome)+0.5)/dim), 0.99), 1.0);
 		}
 		else {
 			gl_FragColor = texture2D(sampler, texcoord_f);
@@ -173,8 +217,8 @@ function createTexture(gl, dim) {
 	const texture = gl.createTexture();
 	gl.bindTexture(gl.TEXTURE_2D, texture);
 
-	const blue = [0, 0, 255, 255];
-	const red = [255, 0, 0, 255]
+	const blue = [2, 2, 255, 255];
+	const red = [255, 2, 2, 255]
 	var sq = []
 	for(var i = 0; i < dim*dim; i++) {
 		if(i % dim < dim/2) {
@@ -193,4 +237,4 @@ function createTexture(gl, dim) {
        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
 
 	return texture;
-}
+}