www/js/webgl-demo.js

@@ -3,8 +3,8 @@ import { drawScene } from "./draw-scene.js";
 
 main();
 
-/* XXX: TODO: Avoid using alerts! Check return values instead,
- * XXX: TODO: or create/use a Result like object.
+/* TODO: Avoid using alerts! Check return values instead,
+ * TODO: or create/use a Result like object.
  */
 
 // Initialize a shader program, so WebGL knows how to draw our data
@@ -37,7 +37,7 @@ function loadShader(gl, type, source) {
 
   // Send the source to the shader object
   gl.shaderSource(shader, source);
-
+  
   // Compile the shader program
   gl.compileShader(shader);
 
@@ -75,41 +75,31 @@ function main() {
       }
     `;
 
-  // const fsSource = `
-  //     // is highp wasteful for this shader?
-  //     #ifdef GL_FRAGMENT_PRECISION_HIGH
-  //       precision highp float;
-  //     #else
-  //       precision mediump float;
-  //     #endif
+  const fsSource = `
+      // is highp wasteful for this shader?
+      #ifdef GL_FRAGMENT_PRECISION_HIGH
+        precision highp float;
+      #else
+        precision mediump float;
+      #endif
 
-  //     // shadertoy-like parameters
-  //     // uniform vec2 uResolution; 
-  //     uniform float uTime;
+      // shadertoy-like parameters
+      // uniform vec2 uResolution; 
+      uniform float uTime;
+  
+      void main() {
+        vec2 uv = gl_FragCoord.xy/vec2(300, 300).xy;
 
-  //     void main() {
-  //       vec2 uv = gl_FragCoord.xy/vec2(300, 300).xy;
-
-  //       // Time varying pixel color
-  //       vec3 col = 0.5 + 0.5*cos(uTime+uv.xyx+vec3(0,2,4));
-
-  //       // Output to screen
-  //       gl_FragColor = vec4(col,1.0);
-
-  //       // gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
-  //     }
-  //   `;
-  const fsSource = (async () => {
-    const res = await fetch("../shaders/segfault.glsl");
-    if (!res.ok) {
-      const error = `Failed to load fragment shader source ${url}: ${res.status}`;
-      alert(error);
-      throw new Error(error);
-    }
-
-    return await res.text()
-  })();
+        // Time varying pixel color
+        vec3 col = 0.5 + 0.5*cos(uTime+uv.xyx+vec3(0,2,4));
 
+        // Output to screen
+        gl_FragColor = vec4(col,1.0);
+  
+        // gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
+      }
+    `;
+  
   const shaderProgram = initShaderProgram(gl, vsSource, fsSource);
 
   // Collect all the info needed to use the shader program.

www/shaders/segfault.glsl

@@ -3,8 +3,7 @@
  * But shouldn't return 0.0 or 17.0 (they're exclusive bounds).
  * View this shader on shadertoy: https://www.shadertoy.com/view/t3tSRj#
  */
-
-precision highp float;
+// TODO: go through all my TODO items
 
 /* ==== Text Colouring  ==== */
 #define PHOSPHOR_COL vec4(1, 1., 1., 1.)
@@ -23,23 +22,25 @@ const float noiseSwirlStepValue = noiseSwirlValue / float(noiseSwirlSteps);
 const float noiseScale = 1.0;
 const float noiseTimeScale = 0.1;
 
+precision highp float;
+
 // ===================================================================
 // Library Functions
 //
-float rand(vec2 co) {
+inline float rand(vec2 co) {
     return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);
 }
 
-float quantise(float val, float n) {
+inline float quantise(float val, float n) {
     return clamp(floor(val * n), 0.0, n) / n;
 }
 
-float roundSquare(vec2 p, vec2 b, float r) {
+inline float roundSquare(vec2 p, vec2 b, float r) {
     return length(max(abs(p)-b,0.0))-r;
 }
 
 // standard roundSquare
-float stdRS(vec2 uv, float r) {
+inline float stdRS(vec2 uv, float r) {
     return roundSquare(uv - 0.5, vec2(WIDTH, HEIGHT) + r, 0.05);
 }
 
@@ -53,19 +54,19 @@ float stdRS(vec2 uv, float r) {
 //               Distributed under the MIT License. See LICENSE file.
 //               https://github.com/ashima/webgl-noise
 //
-vec3 mod289(vec3 x) {
+inline vec3 mod289(vec3 x) {
     return x - floor(x * (1.0 / 289.0)) * 289.0;
 }
 
-vec4 mod289(vec4 x) {
+inline vec4 mod289(vec4 x) {
     return x - floor(x * (1.0 / 289.0)) * 289.0;
 }
 
-vec4 permute(vec4 x) {
+inline vec4 permute(vec4 x) {
     return mod289(((x*34.0)+1.0)*x);
 }
 
-vec4 taylorInvSqrt(vec4 r) {
+inline vec4 taylorInvSqrt(vec4 r) {
     return 1.79284291400159 - 0.85373472095314 * r;
 }
 
@@ -314,7 +315,7 @@ float textLines(vec2 uvG) {
     return rand(uvGt)*15. + 2.;
 }
 
-float fbm3(vec3 v) {
+inline float fbm3(vec3 v) {
     float result = simplex(v);
     result += simplex(v * 2.) / 2.;
     result += simplex(v * 4.) / 4.;
@@ -322,7 +323,7 @@ float fbm3(vec3 v) {
     return result;
 }
 
-float fbm5(vec3 v) {
+inline float fbm5(vec3 v) {
     float result = simplex(v);
     result += simplex(v * 2.) / 2.;
     result += simplex(v * 4.) / 4.;
@@ -344,7 +345,7 @@ float smokeNoise(vec3 v) {
 // ===================================================================
 // Graphical Styling / Effects
 // 
-float bloom(vec2 uv2) {
+inline float bloom(vec2 uv2) {
     // TODO
     c += (textureLod(iChannel0, uvC, 3.) + 
           textureLod(iChannel0, uvC, 4.) +