bugfix: don't cache textures bound to a specific GLContext

2 files changed, 31 insertions, 26 deletions

diff --git a/web/pw-visualizer/src/index.ts b/web/pw-visualizer/src/index.ts
index bee1bab..4231707 100644
--- a/web/pw-visualizer/src/index.ts
+++ b/web/pw-visualizer/src/index.ts
@@ -24,7 +24,7 @@ import { VertexBufferLayout, VertexArray } from "./webgl/vertexBufferLayout";
 import { defaultLabelFactory, LabelFactory, Align, Label } from "./webgl/text";
 import { VoronoiBuilder } from "./voronoi/voronoi";
 import * as assets from "./assets";
-import { Texture } from "./webgl/texture";
+import { loadImage, Texture } from "./webgl/texture";
 
 
 function to_bbox(box: number[]): BBox {
@@ -585,16 +585,16 @@ export class GameInstance {
 }
 
 var game_instance: GameInstance;
-var textures: Texture[];
+var texture_images: HTMLImageElement[];
 var shaders: Dictionary<ShaderFactory>;
 
 export async function set_instance(source: string): Promise<GameInstance> {
-  // TODO: embed shader programs
-  if (!textures || !shaders) {
-    const texture_promises = [
-      Texture.fromImage(GL, assets.fontPng, "font"),
-      Texture.fromImage(GL, assets.shipPng, "ship"),
-      Texture.fromImage(GL, assets.earthPng, "earth")
+  // TODO: this loading code is a mess. Please clean me up!
+  if (!texture_images || !shaders) {
+    const image_promises = [
+      loadImage(assets.fontPng),
+      loadImage(assets.shipPng),
+      loadImage(assets.earthPng),
     ];
 
     const shader_promies = [
@@ -633,8 +633,8 @@ export async function set_instance(source: string): Promise<GameInstance> {
 
     ];
     let shaders_array: [string, ShaderFactory][];
-    [textures, shaders_array] = await Promise.all([
-      Promise.all(texture_promises),
+    [texture_images, shaders_array] = await Promise.all([
+      Promise.all(image_promises),
       Promise.all(shader_promies),
     ]);
 
@@ -643,12 +643,15 @@ export async function set_instance(source: string): Promise<GameInstance> {
   }
 
   resizeCanvasToDisplaySize(CANVAS);
+  const fontTexture = Texture.fromImage(GL, texture_images[0], "font");
+  const shipTexture = Texture.fromImage(GL, texture_images[1], "ship");
+  const earthTexture = Texture.fromImage(GL, texture_images[2], "earth");
 
   game_instance = new GameInstance(
     Game.new(source),
-    textures.slice(2),
-    textures[1],
-    textures[0],
+    [earthTexture],
+    shipTexture,
+    fontTexture,
     shaders
   );
 
diff --git a/web/pw-visualizer/src/webgl/texture.ts b/web/pw-visualizer/src/webgl/texture.ts
index faafe76..9624489 100644
--- a/web/pw-visualizer/src/webgl/texture.ts
+++ b/web/pw-visualizer/src/webgl/texture.ts
@@ -1,5 +1,15 @@
 import type { Renderer } from "./renderer";
 
+
+export function loadImage(image_url: string): Promise<HTMLImageElement> {
+    return new Promise((resolve, reject) => {
+        const image = new Image();
+        image.onload = () => { resolve(image) }
+        image.onerror = reject;
+        image.src = image_url;
+    })
+}
+  
 export class Texture {
     texture: WebGLTexture;
     width: number;
@@ -9,20 +19,12 @@ export class Texture {
 
     static fromImage(
         gl: WebGLRenderingContext,
-        path: string,
+        image: HTMLImageElement,
         name: string,
-    ): Promise<Texture> {
-        return new Promise((resolve, reject) => {
-            const out = new Texture(gl, name);
-
-            const image = new Image();
-            image.onload = () => {
-                out.setImage(gl, image);
-                resolve(out);
-            }
-            image.onerror = reject;
-            image.src = path;
-        })
+    ): Texture {
+        const tx = new Texture(gl, name);
+        tx.setImage(gl, image);
+        return tx;
     }
 
     static fromRenderer(