0005: hide alt3

src/005-thoughtform-hidenoe/main.ts

@@ -3,7 +3,7 @@ import { WebGLApp } from "../renderer/webgl";
 import { Renderable } from "../renderer/renderable";
 import { Transform, etoq, v3 } from "../renderer/transform";
 import plane from "../meshes/plane";
-import { outer } from "./shaders/outer";
+import { outer, outerFrags } from "./shaders/outer";
 import { frags, noe } from "./shaders/noe";
 import { createGizmo } from "../renderer/gizmo";
 
@@ -32,14 +32,8 @@ document.body.addEventListener("mousemove", (event) => {
 
 app.onUpdate((time, app) => {});
 
-new Renderable(
-  app,
-  transformPlane,
-  new MeshRenderer(app, plane, outer(app), camera).configure({})
-);
-
 let noeShader = frags.normal;
-
+let hShader = outerFrags.normal;
 if (location.search.includes("alt1")) {
   noeShader = frags.debug;
 }
@@ -48,6 +42,16 @@ if (location.search.includes("alt2")) {
   noeShader = frags.alt2;
 }
 
+if (location.search.includes("alt3")) {
+  hShader = outerFrags.alt3;
+}
+
+new Renderable(
+  app,
+  transformPlane,
+  new MeshRenderer(app, plane, outer(app, hShader), camera).configure({})
+);
+
 new Renderable(
   app,
   transformSphere,

src/005-thoughtform-hidenoe/shaders/outer-alt3.frag

@@ -0,0 +1,45 @@
+#version 300 es
+precision highp float;
+
+uniform float u_time;
+
+in vec2 uv0;
+
+out vec4 fragColor;
+
+vec2 squareImaginary(vec2 number, float mod){
+	return vec2(
+		pow(number.x * mod,2.0) - pow(number.y * mod, 2.0),
+		2.0 * number.x * number.y
+	);
+}
+
+float iterateMandelbrot(vec2 coord){
+	vec2 z = vec2(0,0);
+  float maxIterations = 69.0;
+
+	for (float i = 0.0; i < maxIterations; i++) {
+		// float factor = cos((1.3*6.0) * sin(u_time * 0.0005));
+		float mod = u_time * 0.0003;
+		// mod = 0.5;
+		z = squareImaginary(z, 1.0/mod) + coord;
+		if (length(z) > 100.0) return i / float(maxIterations);
+	}
+
+	return maxIterations;
+}
+
+void main() {
+  // uv0 is 0..1, we want to denormalize this to -1..1
+  vec2 uvMirror = abs(uv0 * 2.0 - 1.0);
+  fragColor = vec4(0.0);
+  float mandelbrot = iterateMandelbrot((uvMirror.yx - vec2(-1.075, 1.0)) * 0.9);
+  fragColor.r = mandelbrot;
+
+  vec2 outerNoise = (mandelbrot) * (1.0 - uvMirror * 0.5);
+  fragColor.gb += (1.0 - mandelbrot) * outerNoise;
+
+	// fragColor.r += pow(1.0 - length(uvMirror), 18.0);
+
+  fragColor.a = 1.0;
+}

src/005-thoughtform-hidenoe/shaders/outer.ts

@@ -2,6 +2,7 @@ import { Shader, ShaderConfig } from "../../renderer/shader";
 import { WebGLApp } from "../../renderer/webgl";
 import vert from "../../common-shaders/basic.vert";
 import frag from "./outer.frag";
+import fragAlt3 from "./outer-alt3.frag";
 
 export const basicShaderConfig: ShaderConfig = {
   attributes: {
@@ -26,5 +27,10 @@ export const basicShaderConfig: ShaderConfig = {
   },
 };
 
-export const outer = (app: WebGLApp) =>
-  new Shader(basicShaderConfig).vertex(vert).fragment(frag).app(app);
+export const outerFrags = {
+  normal: frag,
+  alt3: fragAlt3,
+};
+
+export const outer = (app: WebGLApp, fragShader: string = frag) =>
+  new Shader(basicShaderConfig).vertex(vert).fragment(fragShader).app(app);