@luma.gl/webgl 9.0.0-alpha.9 → 9.0.0-beta.10

package/dist/adapter/resources/webgl-render-pipeline.js

@@ -1,428 +1,386 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { RenderPipeline, cast, log, decodeVertexFormat } from '@luma.gl/api';
-import GL from '@luma.gl/constants';
-import { getWebGLDataType } from '../converters/texture-formats';
-import { getShaderLayout } from '../helpers/get-shader-layout';
-import { withDeviceParameters, withGLParameters } from '../converters/device-parameters';
-import { setUniform } from '../helpers/set-uniform';
-import WEBGLBuffer from './webgl-buffer';
-import WEBGLTexture from './webgl-texture';
-import WEBGLVertexArrayObject from '../objects/webgl-vertex-array-object';
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import { RenderPipeline, cast, splitUniformsAndBindings, log } from '@luma.gl/core';
+import { mergeShaderLayout } from '@luma.gl/core';
+// import {mergeShaderLayout, getAttributeInfosFromLayouts} from '@luma.gl/core';
+import { GL } from '@luma.gl/constants';
+import { getShaderLayout } from "../helpers/get-shader-layout.js";
+import { withDeviceAndGLParameters } from "../converters/device-parameters.js";
+import { setUniform } from "../helpers/set-uniform.js";
+import { WEBGLBuffer } from "./webgl-buffer.js";
+import { WEBGLFramebuffer } from "./webgl-framebuffer.js";
+import { WEBGLTexture } from "./webgl-texture.js";
+import { WEBGLTextureView } from "./webgl-texture-view.js";
+import { getGLDrawMode } from "../helpers/webgl-topology-utils.js";
 const LOG_PROGRAM_PERF_PRIORITY = 4;
-export default class WEBGLRenderPipeline extends RenderPipeline {
-  constructor(device, props) {
-    super(device, props);
-
-    _defineProperty(this, "device", void 0);
-
-    _defineProperty(this, "handle", void 0);
-
-    _defineProperty(this, "vs", void 0);
-
-    _defineProperty(this, "fs", void 0);
-
-    _defineProperty(this, "layout", void 0);
-
-    _defineProperty(this, "varyings", null);
-
-    _defineProperty(this, "vertexArrayObject", void 0);
-
-    _defineProperty(this, "_indexBuffer", void 0);
-
-    _defineProperty(this, "uniforms", {});
-
-    _defineProperty(this, "bindings", {});
-
-    _defineProperty(this, "_textureUniforms", {});
-
-    _defineProperty(this, "_textureIndexCounter", 0);
-
-    _defineProperty(this, "_uniformCount", 0);
-
-    _defineProperty(this, "_uniformSetters", {});
-
-    this.device = device;
-    this.handle = this.props.handle || this.device.gl.createProgram();
-    this.handle.__SPECTOR_Metadata = {
-      id: this.props.id
-    };
-    this.vs = cast(props.vs);
-    this.fs = cast(props.fs);
-    const {
-      varyings,
-      bufferMode = GL.SEPARATE_ATTRIBS
-    } = props;
-
-    if (varyings && varyings.length > 0) {
-      var _this$device$gl;
-
-      this.device.assertWebGL2();
-      this.varyings = varyings;
-      (_this$device$gl = this.device.gl2) === null || _this$device$gl === void 0 ? void 0 : _this$device$gl.transformFeedbackVaryings(this.handle, varyings, bufferMode);
-    }
-
-    this._compileAndLink();
-
-    this.layout = props.layout || getShaderLayout(this.device.gl, this.handle);
-    this.vertexArrayObject = new WEBGLVertexArrayObject(this.device);
-  }
-
-  destroy() {
-    if (this.handle) {
-      this.device.gl.deleteProgram(this.handle);
-      this.destroyed = true;
+/** Creates a new render pipeline */
+export class WEBGLRenderPipeline extends RenderPipeline {
+    /** The WebGL device that created this render pipeline */
+    device;
+    /** Handle to underlying WebGL program */
+    handle;
+    /** vertex shader */
+    vs;
+    /** fragment shader */
+    fs;
+    /** The layout extracted from shader by WebGL introspection APIs */
+    introspectedLayout;
+    /** Uniforms set on this model */
+    uniforms = {};
+    /** Bindings set on this model */
+    bindings = {};
+    /** WebGL varyings */
+    varyings = null;
+    _uniformCount = 0;
+    _uniformSetters = {}; // TODO are these used?
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        this.handle = this.props.handle || this.device.gl.createProgram();
+        this.device.setSpectorMetadata(this.handle, { id: this.props.id });
+        // Create shaders if needed
+        this.vs = cast(props.vs);
+        this.fs = cast(props.fs);
+        // assert(this.vs.stage === 'vertex');
+        // assert(this.fs.stage === 'fragment');
+        // Setup varyings if supplied
+        // @ts-expect-error WebGL only
+        const { varyings, bufferMode = 35981 } = props;
+        if (varyings && varyings.length > 0) {
+            this.varyings = varyings;
+            this.device.gl.transformFeedbackVaryings(this.handle, varyings, bufferMode);
+        }
+        this._linkShaders();
+        log.time(0, `RenderPipeline ${this.id} - shaderLayout introspection`)();
+        this.introspectedLayout = getShaderLayout(this.device.gl, this.handle);
+        log.timeEnd(0, `RenderPipeline ${this.id} - shaderLayout introspection`)();
+        // Merge provided layout with introspected layout
+        this.shaderLayout = mergeShaderLayout(this.introspectedLayout, props.shaderLayout);
+        // WebGPU has more restrictive topology support than WebGL
+        switch (this.props.topology) {
+            case 'triangle-fan-webgl':
+            case 'line-loop-webgl':
+                log.warn(`Primitive topology ${this.props.topology} is deprecated and will be removed in v9.1`);
+                break;
+            default:
+        }
     }
-  }
-
-  setIndexBuffer(indexBuffer) {
-    const webglBuffer = cast(indexBuffer);
-    this.vertexArrayObject.setElementBuffer(webglBuffer);
-    this._indexBuffer = indexBuffer;
-  }
-
-  setAttributes(attributes) {
-    for (const [name, buffer] of Object.entries(attributes)) {
-      const webglBuffer = cast(buffer);
-      const attribute = getAttributeLayout(this.layout, name);
-
-      if (!attribute) {
-        log.warn("Ignoring buffer supplied for unknown attribute \"".concat(name, "\" in pipeline \"").concat(this.id, "\" (buffer \"").concat(buffer.id, "\")"))();
-        continue;
-      }
-
-      const decoded = decodeVertexFormat(attribute.format);
-      const {
-        type: typeString,
-        components: size,
-        byteLength: stride,
-        normalized,
-        integer
-      } = decoded;
-      const divisor = attribute.stepMode === 'instance' ? 1 : 0;
-      const type = getWebGLDataType(typeString);
-      this.vertexArrayObject.setBuffer(attribute.location, webglBuffer, {
-        size,
-        type,
-        stride,
-        offset: 0,
-        normalized,
-        integer,
-        divisor: attribute.stepMode === 'instance' ? 1 : 0
-      });
+    destroy() {
+        if (this.handle) {
+            this.device.gl.deleteProgram(this.handle);
+            // this.handle = null;
+            this.destroyed = true;
+        }
     }
-  }
-
-  setBindings(bindings) {
-    for (const [name, value] of Object.entries(bindings)) {
-      const binding = this.layout.bindings.find(binding => binding.name === name);
-
-      if (!binding) {
-        log.warn("Unknown binding ".concat(name, " in render pipeline ").concat(this.id))();
-        continue;
-      }
-
-      if (!value) {
-        log.warn("Unsetting binding ".concat(name, " in render pipeline ").concat(this.id))();
-      }
-
-      switch (binding.type) {
-        case 'uniform':
-          if (!(value instanceof WEBGLBuffer) && !(value.buffer instanceof WEBGLBuffer)) {
-            throw new Error('buffer value');
-          }
-
-          break;
-
-        case 'texture':
-          if (!(value instanceof WEBGLTexture)) {
-            throw new Error('texture value');
-          }
-
-          break;
-
-        case 'sampler':
-          log.warn("Ignoring sampler ".concat(name))();
-          break;
-
-        default:
-          throw new Error(binding.type);
-      }
-
-      this.bindings[name] = value;
+    /**
+     * Bindings include: textures, samplers and uniform buffers
+     * @todo needed for portable model
+     */
+    setBindings(bindings) {
+        // if (log.priority >= 2) {
+        //   checkUniformValues(uniforms, this.id, this._uniformSetters);
+        // }
+        for (const [name, value] of Object.entries(bindings)) {
+            // Accept both `xyz` and `xyzUniforms` as valid names for `xyzUniforms` uniform block
+            // This convention allows shaders to name uniform blocks as `uniform appUniforms {} app;`
+            // and reference them as `app` from both GLSL and JS.
+            // TODO - this is rather hacky - we could also remap the name directly in the shader layout.
+            const binding = this.shaderLayout.bindings.find(binding => binding.name === name) ||
+                this.shaderLayout.bindings.find(binding => binding.name === `${name}Uniforms`);
+            if (!binding) {
+                const validBindings = this.shaderLayout.bindings
+                    .map(binding => `"${binding.name}"`)
+                    .join(', ');
+                log.warn(`Unknown binding "${name}" in render pipeline "${this.id}", expected one of ${validBindings}`)();
+                continue; // eslint-disable-line no-continue
+            }
+            if (!value) {
+                log.warn(`Unsetting binding "${name}" in render pipeline "${this.id}"`)();
+            }
+            switch (binding.type) {
+                case 'uniform':
+                    // @ts-expect-error
+                    if (!(value instanceof WEBGLBuffer) && !(value.buffer instanceof WEBGLBuffer)) {
+                        throw new Error('buffer value');
+                    }
+                    break;
+                case 'texture':
+                    if (!(value instanceof WEBGLTextureView ||
+                        value instanceof WEBGLTexture ||
+                        value instanceof WEBGLFramebuffer)) {
+                        throw new Error('texture value');
+                    }
+                    break;
+                case 'sampler':
+                    log.warn(`Ignoring sampler ${name}`)();
+                    break;
+                default:
+                    throw new Error(binding.type);
+            }
+            this.bindings[name] = value;
+        }
     }
-  }
-
-  setUniforms(uniforms) {
-    Object.assign(this.uniforms, uniforms);
-  }
-
-  draw(options) {
-    var _this$_indexBuffer;
-
-    const {
-      renderPass = this.device.getDefaultRenderPass(),
-      vertexCount,
-      indexCount,
-      instanceCount,
-      firstVertex = 0,
-      firstIndex,
-      firstInstance,
-      baseVertex
-    } = options;
-    const drawMode = getDrawMode(this.props.topology);
-    const isIndexed = Boolean(this._indexBuffer);
-    const indexType = ((_this$_indexBuffer = this._indexBuffer) === null || _this$_indexBuffer === void 0 ? void 0 : _this$_indexBuffer.props.indexType) === 'uint16' ? GL.UNSIGNED_SHORT : GL.UNSIGNED_INT;
-    const isInstanced = Number(options.instanceCount) > 0;
-
-    if (!this._areTexturesRenderable() || options.vertexCount === 0) {
-      return false;
+    /** @todo needed for portable model
+     * @note The WebGL API is offers many ways to draw things
+     * This function unifies those ways into a single call using common parameters with sane defaults
+     */
+    draw(options) {
+        const { renderPass, vertexArray, vertexCount, 
+        // indexCount,
+        instanceCount, firstVertex = 0, 
+        // firstIndex,
+        // firstInstance,
+        // baseVertex,
+        transformFeedback } = options;
+        const glDrawMode = getGLDrawMode(this.props.topology);
+        const isIndexed = Boolean(vertexArray.indexBuffer);
+        const glIndexType = vertexArray.indexBuffer?.glIndexType;
+        const isInstanced = Number(instanceCount) > 0;
+        // If we are using async linking, we need to wait until linking completes
+        if (this.linkStatus !== 'success') {
+            log.info(2, `RenderPipeline:${this.id}.draw() aborted - waiting for shader linking`)();
+            return false;
+        }
+        // Avoid WebGL draw call when not rendering any data or values are incomplete
+        // Note: async textures set as uniforms might still be loading.
+        // Now that all uniforms have been updated, check if any texture
+        // in the uniforms is not yet initialized, then we don't draw
+        if (!this._areTexturesRenderable() || vertexCount === 0) {
+            log.info(2, `RenderPipeline:${this.id}.draw() aborted - textures not yet loaded`)();
+            return false;
+        }
+        // (isInstanced && instanceCount === 0)
+        if (vertexCount === 0) {
+            log.info(2, `RenderPipeline:${this.id}.draw() aborted - no vertices to draw`)();
+            return true;
+        }
+        this.device.gl.useProgram(this.handle);
+        // Note: Rebinds constant attributes before each draw call
+        vertexArray.bindBeforeRender(renderPass);
+        if (transformFeedback) {
+            transformFeedback.begin(this.props.topology);
+        }
+        // We have to apply bindings before every draw call since other draw calls will overwrite
+        this._applyBindings();
+        this._applyUniforms();
+        const webglRenderPass = renderPass;
+        withDeviceAndGLParameters(this.device, this.props.parameters, webglRenderPass.glParameters, () => {
+            if (isIndexed && isInstanced) {
+                this.device.gl.drawElementsInstanced(glDrawMode, vertexCount || 0, // indexCount?
+                glIndexType, firstVertex, instanceCount || 0);
+                // } else if (isIndexed && this.device.isWebGL2 && !isNaN(start) && !isNaN(end)) {
+                //   this.device.gldrawRangeElements(glDrawMode, start, end, vertexCount, glIndexType, offset);
+            }
+            else if (isIndexed) {
+                this.device.gl.drawElements(glDrawMode, vertexCount || 0, glIndexType, firstVertex); // indexCount?
+            }
+            else if (isInstanced) {
+                this.device.gl.drawArraysInstanced(glDrawMode, firstVertex, vertexCount || 0, instanceCount || 0);
+            }
+            else {
+                this.device.gl.drawArrays(glDrawMode, firstVertex, vertexCount || 0);
+            }
+            if (transformFeedback) {
+                transformFeedback.end();
+            }
+        });
+        vertexArray.unbindAfterRender(renderPass);
+        return true;
     }
-
-    this.device.gl.useProgram(this.handle);
-    this.vertexArrayObject.bind(() => {
-      const primitiveMode = getGLPrimitive(this.props.topology);
-      const transformFeedback = null;
-
-      if (transformFeedback) {
-        transformFeedback.begin(primitiveMode);
-      }
-
-      this._applyBindings();
-
-      this._applyUniforms();
-
-      withDeviceParameters(this.device, this.props.parameters, () => {
-        withGLParameters(this.device, {
-          framebuffer: renderPass.props.framebuffer
-        }, () => {
-          if (isIndexed && isInstanced) {
-            var _this$device$gl2;
-
-            (_this$device$gl2 = this.device.gl2) === null || _this$device$gl2 === void 0 ? void 0 : _this$device$gl2.drawElementsInstanced(drawMode, vertexCount || 0, indexType, firstVertex, instanceCount || 0);
-          } else if (isIndexed) {
-            this.device.gl.drawElements(drawMode, vertexCount || 0, indexType, firstVertex);
-          } else if (isInstanced) {
-            var _this$device$gl3;
-
-            (_this$device$gl3 = this.device.gl2) === null || _this$device$gl3 === void 0 ? void 0 : _this$device$gl3.drawArraysInstanced(drawMode, firstVertex, vertexCount || 0, instanceCount || 0);
-          } else {
-            this.device.gl.drawArrays(drawMode, firstVertex, vertexCount || 0);
-          }
+    // DEPRECATED METHODS
+    setUniformsWebGL(uniforms) {
+        const { bindings } = splitUniformsAndBindings(uniforms);
+        Object.keys(bindings).forEach(name => {
+            log.warn(`Unsupported value "${JSON.stringify(bindings[name])}" used in setUniforms() for key ${name}. Use setBindings() instead?`)();
         });
-
-        if (transformFeedback) {
-          transformFeedback.end();
+        // TODO - check against layout
+        Object.assign(this.uniforms, uniforms);
+    }
+    // PRIVATE METHODS
+    // setAttributes(attributes: Record<string, Buffer>): void {}
+    // setBindings(bindings: Record<string, Binding>): void {}
+    async _linkShaders() {
+        const { gl } = this.device;
+        gl.attachShader(this.handle, this.vs.handle);
+        gl.attachShader(this.handle, this.fs.handle);
+        log.time(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this.id}`)();
+        gl.linkProgram(this.handle);
+        log.timeEnd(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this.id}`)();
+        // TODO Avoid checking program linking error in production
+        if (log.level === 0) {
+            // return;
+        }
+        if (!this.device.features.has('compilation-status-async-webgl')) {
+            const status = this._getLinkStatus();
+            this._reportLinkStatus(status);
+            return;
         }
-      });
-    });
-    return true;
-  }
-
-  _compileAndLink() {
-    const {
-      gl
-    } = this.device;
-    gl.attachShader(this.handle, this.vs.handle);
-    gl.attachShader(this.handle, this.fs.handle);
-    log.time(LOG_PROGRAM_PERF_PRIORITY, "linkProgram for ".concat(this.id))();
-    gl.linkProgram(this.handle);
-    log.timeEnd(LOG_PROGRAM_PERF_PRIORITY, "linkProgram for ".concat(this.id))();
-
-    if (gl.debug || log.level > 0) {
-      const linked = gl.getProgramParameter(this.handle, gl.LINK_STATUS);
-
-      if (!linked) {
-        throw new Error("Error linking: ".concat(gl.getProgramInfoLog(this.handle)));
-      }
-
-      gl.validateProgram(this.handle);
-      const validated = gl.getProgramParameter(this.handle, gl.VALIDATE_STATUS);
-
-      if (!validated) {
-        throw new Error("Error validating: ".concat(gl.getProgramInfoLog(this.handle)));
-      }
+        // async case
+        log.once(1, 'RenderPipeline linking is asynchronous')();
+        await this._waitForLinkComplete();
+        log.info(2, `RenderPipeline ${this.id} - async linking complete: ${this.linkStatus}`)();
+        const status = this._getLinkStatus();
+        this._reportLinkStatus(status);
     }
-  }
-
-  _areTexturesRenderable() {
-    let texturesRenderable = true;
-
-    for (const [name, texture] of Object.entries(this._textureUniforms)) {
-      texture.update();
-      texturesRenderable = texturesRenderable && texture.loaded;
+    /** Report link status. First, check for shader compilation failures if linking fails */
+    _reportLinkStatus(status) {
+        switch (status) {
+            case 'success':
+                return;
+            default:
+                // First check for shader compilation failures if linking fails
+                if (this.vs.compilationStatus === 'error') {
+                    this.vs.debugShader();
+                    throw new Error(`Error during compilation of shader ${this.vs.id}`);
+                }
+                if (this.fs?.compilationStatus === 'error') {
+                    this.vs.debugShader();
+                    throw new Error(`Error during compilation of shader ${this.fs.id}`);
+                }
+                throw new Error(`Error during ${status}: ${this.device.gl.getProgramInfoLog(this.handle)}`);
+        }
     }
-
-    for (const [name, texture] of Object.entries(this.bindings)) {
-      if (texture.loaded !== undefined) {
-        texturesRenderable = texturesRenderable && texture.loaded;
-      }
+    /**
+     * Get the shader compilation status
+     * TODO - Load log even when no error reported, to catch warnings?
+     * https://gamedev.stackexchange.com/questions/30429/how-to-detect-glsl-warnings
+     */
+    _getLinkStatus() {
+        const { gl } = this.device;
+        const linked = gl.getProgramParameter(this.handle, 35714);
+        if (!linked) {
+            this.linkStatus = 'error';
+            return 'linking';
+        }
+        gl.validateProgram(this.handle);
+        const validated = gl.getProgramParameter(this.handle, 35715);
+        if (!validated) {
+            this.linkStatus = 'error';
+            return 'validation';
+        }
+        this.linkStatus = 'success';
+        return 'success';
     }
-
-    return texturesRenderable;
-  }
-
-  _applyBindings() {
-    this.device.gl.useProgram(this.handle);
-    const {
-      gl2
-    } = this.device;
-
-    if (!gl2) {
-      throw new Error('bindings');
+    /** Use KHR_parallel_shader_compile extension if available */
+    async _waitForLinkComplete() {
+        const waitMs = async (ms) => await new Promise(resolve => setTimeout(resolve, ms));
+        const DELAY_MS = 10; // Shader compilation is typically quite fast (with some exceptions)
+        // If status polling is not available, we can't wait for completion. Just wait a little to minimize blocking
+        if (!this.device.features.has('compilation-status-async-webgl')) {
+            await waitMs(DELAY_MS);
+            return;
+        }
+        const { gl } = this.device;
+        for (;;) {
+            const complete = gl.getProgramParameter(this.handle, 37297);
+            if (complete) {
+                return;
+            }
+            await waitMs(DELAY_MS);
+        }
     }
-
-    let textureUnit = 0;
-    let uniformBufferIndex = 0;
-
-    for (const binding of this.layout.bindings) {
-      const value = this.bindings[binding.name];
-
-      if (!value) {
-        throw new Error("No value for binding ".concat(binding.name, " in ").concat(this.id));
-      }
-
-      switch (binding.type) {
-        case 'uniform':
-          const {
-            name
-          } = binding;
-          const location = gl2.getUniformBlockIndex(this.handle, name);
-
-          if (location === GL.INVALID_INDEX) {
-            throw new Error("Invalid uniform block name ".concat(name));
-          }
-
-          gl2.uniformBlockBinding(this.handle, uniformBufferIndex, location);
-
-          if (value instanceof WEBGLBuffer) {
-            gl2.bindBufferBase(GL.UNIFORM_BUFFER, uniformBufferIndex, value.handle);
-          } else {
-            gl2.bindBufferRange(GL.UNIFORM_BUFFER, uniformBufferIndex, value.buffer.handle, value.offset || 0, value.size || value.buffer.byteLength - value.offset);
-          }
-
-          uniformBufferIndex += 1;
-          break;
-
-        case 'texture':
-          if (!(value instanceof WEBGLTexture)) {
-            throw new Error('texture');
-          }
-
-          const texture = value;
-          gl2.activeTexture(GL.TEXTURE0 + textureUnit);
-          gl2.bindTexture(texture.target, texture.handle);
-          textureUnit += 1;
-          break;
-
-        case 'sampler':
-          break;
-
-        case 'storage':
-        case 'read-only-storage':
-          throw new Error("binding type '".concat(binding.type, "' not supported in WebGL"));
-      }
+    /**
+     * Checks if all texture-values uniforms are renderable (i.e. loaded)
+     * Update a texture if needed (e.g. from video)
+     * Note: This is currently done before every draw call
+     */
+    _areTexturesRenderable() {
+        let texturesRenderable = true;
+        for (const [, texture] of Object.entries(this.bindings)) {
+            if (texture instanceof WEBGLTexture) {
+                texture.update();
+                texturesRenderable = texturesRenderable && texture.loaded;
+            }
+        }
+        return texturesRenderable;
     }
-  }
-
-  _applyUniforms() {
-    for (const uniformLayout of this.layout.uniforms || []) {
-      const {
-        name,
-        location,
-        type,
-        textureUnit
-      } = uniformLayout;
-      const value = this.uniforms[name] || textureUnit;
-
-      if (value !== undefined) {
-        setUniform(this.device.gl, location, type, value);
-      }
+    /** Apply any bindings (before each draw call) */
+    _applyBindings() {
+        // If we are using async linking, we need to wait until linking completes
+        if (this.linkStatus !== 'success') {
+            return;
+        }
+        const { gl } = this.device;
+        gl.useProgram(this.handle);
+        let textureUnit = 0;
+        let uniformBufferIndex = 0;
+        for (const binding of this.shaderLayout.bindings) {
+            // Accept both `xyz` and `xyzUniforms` as valid names for `xyzUniforms` uniform block
+            const value = this.bindings[binding.name] || this.bindings[binding.name.replace(/Uniforms$/, '')];
+            if (!value) {
+                throw new Error(`No value for binding ${binding.name} in ${this.id}`);
+            }
+            switch (binding.type) {
+                case 'uniform':
+                    // Set buffer
+                    const { name } = binding;
+                    const location = gl.getUniformBlockIndex(this.handle, name);
+                    if (location === 4294967295) {
+                        throw new Error(`Invalid uniform block name ${name}`);
+                    }
+                    gl.uniformBlockBinding(this.handle, uniformBufferIndex, location);
+                    // console.debug(binding, location);
+                    if (value instanceof WEBGLBuffer) {
+                        gl.bindBufferBase(35345, uniformBufferIndex, value.handle);
+                    }
+                    else {
+                        gl.bindBufferRange(35345, uniformBufferIndex, 
+                        // @ts-expect-error
+                        value.buffer.handle, 
+                        // @ts-expect-error
+                        value.offset || 0, 
+                        // @ts-expect-error
+                        value.size || value.buffer.byteLength - value.offset);
+                    }
+                    uniformBufferIndex += 1;
+                    break;
+                case 'texture':
+                    if (!(value instanceof WEBGLTextureView ||
+                        value instanceof WEBGLTexture ||
+                        value instanceof WEBGLFramebuffer)) {
+                        throw new Error('texture');
+                    }
+                    let texture;
+                    if (value instanceof WEBGLTextureView) {
+                        texture = value.texture;
+                    }
+                    else if (value instanceof WEBGLTexture) {
+                        texture = value;
+                    }
+                    else if (value instanceof WEBGLFramebuffer &&
+                        value.colorAttachments[0] instanceof WEBGLTextureView) {
+                        log.warn('Passing framebuffer in texture binding may be deprecated. Use fbo.colorAttachments[0] instead')();
+                        texture = value.colorAttachments[0].texture;
+                    }
+                    else {
+                        throw new Error('No texture');
+                    }
+                    gl.activeTexture(33984 + textureUnit);
+                    gl.bindTexture(texture.target, texture.handle);
+                    // gl.bindSampler(textureUnit, sampler.handle);
+                    textureUnit += 1;
+                    break;
+                case 'sampler':
+                    // ignore
+                    break;
+                case 'storage':
+                case 'read-only-storage':
+                    throw new Error(`binding type '${binding.type}' not supported in WebGL`);
+            }
+        }
     }
-  }
-
-}
-
-function getDrawMode(topology) {
-  switch (topology) {
-    case 'point-list':
-      return GL.POINTS;
-
-    case 'line-list':
-      return GL.LINES;
-
-    case 'line-strip':
-      return GL.LINE_STRIP;
-
-    case 'line-loop':
-      return GL.LINE_LOOP;
-
-    case 'triangle-list':
-      return GL.TRIANGLES;
-
-    case 'triangle-strip':
-      return GL.TRIANGLE_STRIP;
-
-    case 'triangle-fan':
-      return GL.TRIANGLE_FAN;
-
-    default:
-      throw new Error(topology);
-  }
-}
-
-function getGLPrimitive(topology) {
-  switch (topology) {
-    case 'point-list':
-      return GL.POINTS;
-
-    case 'line-list':
-      return GL.LINES;
-
-    case 'line-strip':
-      return GL.LINES;
-
-    case 'line-loop':
-      return GL.LINES;
-
-    case 'triangle-list':
-      return GL.TRIANGLES;
-
-    case 'triangle-strip':
-      return GL.TRIANGLES;
-
-    case 'triangle-fan':
-      return GL.TRIANGLES;
-
-    default:
-      throw new Error(topology);
-  }
-}
-
-function getAttributesByLocation(attributes, layout) {
-  const byLocation = {};
-
-  for (const [name, buffer] of Object.entries(attributes)) {
-    const attribute = getAttributeLayout(layout, name);
-
-    if (attribute) {
-      byLocation[attribute.location] = buffer;
+    /**
+     * Due to program sharing, uniforms need to be reset before every draw call
+     * (though caching will avoid redundant WebGL calls)
+     */
+    _applyUniforms() {
+        for (const uniformLayout of this.shaderLayout.uniforms || []) {
+            const { name, location, type, textureUnit } = uniformLayout;
+            const value = this.uniforms[name] ?? textureUnit;
+            if (value !== undefined) {
+                setUniform(this.device.gl, location, type, value);
+            }
+        }
     }
-  }
-
-  return byLocation;
-}
-
-function getAttributeLayout(layout, name) {
-  return layout.attributes.find(binding => binding.name === name) || null;
-}
-
-function getBindingLayout(layout, name) {
-  const binding = layout.bindings.find(binding => binding.name === name);
-
-  if (!binding) {
-    throw new Error("Unknown binding ".concat(name));
-  }
-
-  return binding;
 }
-//# sourceMappingURL=webgl-render-pipeline.js.map