styling fixes

generators/work.html.template

@@ -8,6 +8,13 @@
     padding: 0;
     overflow: hidden;
     background-color: black;
+    color: white;
+  }
+  main {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
   }
 </style>
 <link rel="stylesheet" href="index.css" />

html/001-platform-provenance.html

@@ -8,6 +8,13 @@
     padding: 0;
     overflow: hidden;
     background-color: black;
+    color: white;
+  }
+  main {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
   }
 </style>
 <link rel="stylesheet" href="index.css" />

html/001-platform-provenance.js

@@ -3,7 +3,7 @@ import { Shader } from "./lib/shader.js";
 import { BasicPlane } from "./lib/basic-plane.js";
 
 main((gl, core) => {
-  const shader = new Shader(gl)
+  const shader = new Shader(gl, core)
     .attach(
       gl.VERTEX_SHADER,
       `

html/lib/platform.js

@@ -11,9 +11,9 @@ export const main = (next) => {
 
   // Only continue if WebGL is available and working
   if (gl === null) {
-    alert(
+    document.querySelector(
-      "Unable to initialize WebGL. Your browser or machine may not support it."
+      "main"
-    );
+    ).innerHTML = `<div><i>your browser didn't let me set up webgl</i></div>`;
     return;
   }
 

html/lib/shader.js

@@ -1,6 +1,7 @@
 export class Shader {
-  constructor(gl) {
+  constructor(gl, core) {
     this.gl = gl;
+    this.core = core;
     this.program = gl.createProgram();
     this.startTime = Date.now();
   }