Allow to delete and recreate a shader-doodle component

(via React for example, in my case to change the source image for sd-texture)

/!\ Probably includes a memory leak since GeneralTexture.dispose() doesn't seem to exist (yet?)

Author: nathanvogel

src/sd-texture.js

@@ -41,7 +41,8 @@ class TextureElement extends SDBaseElement {
 
   disconnectedCallback() {
     this.program.removeTexture(this.texture);
-    this.texture.dispose();
+    // Dispose doesn't seem to exist on this object. A TODO?
+    if (typeof this.texture.dispose === 'function') this.texture.dispose();
   }
 
   get forceUpdate() {

src/shader-doodle.js

@@ -4,6 +4,7 @@ import './sd-audio.js';
 import './sd-texture.js';
 
 import Surface from './webgl/Surface.js';
+import Renderer from './webgl/Renderer.js';
 
 class ShaderDoodleElement extends SDNodeElement {
   constructor() {
@@ -29,6 +30,7 @@ class ShaderDoodleElement extends SDNodeElement {
   }
 
   async init() {
+    Renderer.resetSingleton();
     this.shadow.innerHTML = Template.render();
     const canvas = Template.map(this.shadow).canvas;
 

src/webgl/Program.js

@@ -177,7 +177,9 @@ export default function Program(gl, vs, fs, vertices, shadertoy = false) {
   }
 
   function dispose() {
-    textures.forEach(t => t.dispose());
+    textures.forEach(t => {
+      if (typeof t.dispose === 'function') t.dispose();
+    });
     textures.clear();
     gl.deleteProgram(program);
   }

src/webgl/Renderer.js

@@ -142,7 +142,7 @@ Renderer.singleton = function() {
 };
 
 Renderer.resetSingleton = function() {
-  singletonRenderer.dispose();
+  if (singletonRenderer) singletonRenderer.dispose();
   singletonRenderer = Renderer();
 };