@luma.gl/engine 9.0.0-beta.4 → 9.0.0-beta.5

package/dist/model/model.js

@@ -1,440 +1,566 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
 import { Buffer, RenderPipeline, UniformStore, getTypedArrayFromDataType } from '@luma.gl/core';
 import { log, uid, deepEqual, splitUniformsAndBindings, isNumberArray } from '@luma.gl/core';
 import { getAttributeInfosFromLayouts } from '@luma.gl/core';
 import { ShaderAssembler, getShaderLayoutFromWGSL } from '@luma.gl/shadertools';
-import { ShaderInputs } from "../shader-inputs.js";
-import { makeGPUGeometry } from "../geometry/gpu-geometry.js";
-import { PipelineFactory } from "../lib/pipeline-factory.js";
-import { getDebugTableForShaderLayout } from "../debug/debug-shader-layout.js";
-import { debugFramebuffer } from "../debug/debug-framebuffer.js";
+import { ShaderInputs } from '../shader-inputs';
+import { makeGPUGeometry } from '../geometry/gpu-geometry';
+import { PipelineFactory } from '../lib/pipeline-factory';
+import { getDebugTableForShaderLayout } from '../debug/debug-shader-layout';
+import { debugFramebuffer } from '../debug/debug-framebuffer';
 const LOG_DRAW_PRIORITY = 2;
 const LOG_DRAW_TIMEOUT = 10000;
+/**
+ * v9 Model API
+ * A model
+ * - automatically reuses pipelines (programs) when possible
+ * - automatically rebuilds pipelines if necessary to accommodate changed settings
+ * shadertools integration
+ * - accepts modules and performs shader transpilation
+ */
 export class Model {
-  constructor(device, props) {
-    var _this$props$modules, _this$props$modules2, _this$shaderInputs;
-    this.device = void 0;
-    this.id = void 0;
-    this.vs = void 0;
-    this.fs = void 0;
-    this.pipelineFactory = void 0;
-    this.userData = {};
-    this.parameters = void 0;
-    this.topology = void 0;
-    this.bufferLayout = void 0;
-    this.vertexCount = void 0;
-    this.instanceCount = 0;
-    this.indexBuffer = null;
-    this.bufferAttributes = {};
-    this.constantAttributes = {};
-    this.bindings = {};
-    this.uniforms = {};
-    this.vertexArray = void 0;
-    this.transformFeedback = null;
-    this.pipeline = void 0;
-    this.shaderInputs = void 0;
-    this._uniformStore = void 0;
-    this._pipelineNeedsUpdate = 'newly created';
-    this._attributeInfos = {};
-    this._gpuGeometry = null;
-    this._getModuleUniforms = void 0;
-    this.props = void 0;
-    this._lastLogTime = 0;
-    this._logOpen = false;
-    this._drawCount = 0;
-    this.props = {
-      ...Model.defaultProps,
-      ...props
+    static defaultProps = {
+        ...RenderPipeline.defaultProps,
+        source: null,
+        vs: null,
+        fs: null,
+        id: 'unnamed',
+        handle: undefined,
+        userData: {},
+        defines: {},
+        modules: [],
+        moduleSettings: undefined,
+        geometry: null,
+        indexBuffer: null,
+        attributes: {},
+        constantAttributes: {},
+        varyings: [],
+        shaderInputs: undefined,
+        pipelineFactory: undefined,
+        transformFeedback: undefined,
+        shaderAssembler: ShaderAssembler.getDefaultShaderAssembler()
     };
-    props = this.props;
-    this.id = props.id || uid('model');
-    this.device = device;
-    Object.assign(this.userData, props.userData);
-    const moduleMap = Object.fromEntries(((_this$props$modules = this.props.modules) === null || _this$props$modules === void 0 ? void 0 : _this$props$modules.map(module => [module.name, module])) || []);
-    this.setShaderInputs(props.shaderInputs || new ShaderInputs(moduleMap));
-    const isWebGPU = this.device.info.type === 'webgpu';
-    if (this.props.source) {
-      if (isWebGPU) {
-        var _this$props;
-        (_this$props = this.props).shaderLayout || (_this$props.shaderLayout = getShaderLayoutFromWGSL(this.props.source));
-      }
-      this.props.fs = this.props.source;
-      this.props.vs = this.props.source;
-    }
-    if (isWebGPU && typeof this.props.vs !== 'string') {
-      var _this$props2;
-      (_this$props2 = this.props).shaderLayout || (_this$props2.shaderLayout = getShaderLayoutFromWGSL(this.props.vs.wgsl));
-    }
-    const platformInfo = getPlatformInfo(device);
-    const modules = (((_this$props$modules2 = this.props.modules) === null || _this$props$modules2 === void 0 ? void 0 : _this$props$modules2.length) > 0 ? this.props.modules : (_this$shaderInputs = this.shaderInputs) === null || _this$shaderInputs === void 0 ? void 0 : _this$shaderInputs.getModules()) || [];
-    const {
-      vs,
-      fs,
-      getUniforms
-    } = this.props.shaderAssembler.assembleShaders({
-      platformInfo,
-      ...this.props,
-      modules
-    });
-    this.vs = vs;
-    this.fs = fs;
-    this._getModuleUniforms = getUniforms;
-    this.vertexCount = this.props.vertexCount;
-    this.instanceCount = this.props.instanceCount;
-    this.topology = this.props.topology;
-    this.bufferLayout = this.props.bufferLayout;
-    this.parameters = this.props.parameters;
-    if (props.geometry) {
-      this._gpuGeometry = this.setGeometry(props.geometry);
-    }
-    this.pipelineFactory = props.pipelineFactory || PipelineFactory.getDefaultPipelineFactory(this.device);
-    this.pipeline = this._updatePipeline();
-    this.vertexArray = device.createVertexArray({
-      renderPipeline: this.pipeline
-    });
-    if (this._gpuGeometry) {
-      this._setGeometryAttributes(this._gpuGeometry);
-    }
-    if (props.vertexCount) {
-      this.setVertexCount(props.vertexCount);
-    }
-    if (props.instanceCount) {
-      this.setInstanceCount(props.instanceCount);
-    }
-    if (props.indices) {
-      throw new Error('Model.props.indices removed. Use props.indexBuffer');
-    }
-    if (props.indexBuffer) {
-      this.setIndexBuffer(props.indexBuffer);
-    }
-    if (props.attributes) {
-      this.setAttributes(props.attributes);
-    }
-    if (props.constantAttributes) {
-      this.setConstantAttributes(props.constantAttributes);
-    }
-    if (props.bindings) {
-      this.setBindings(props.bindings);
-    }
-    if (props.uniforms) {
-      this.setUniforms(props.uniforms);
-    }
-    if (props.moduleSettings) {
-      log.warn('Model.props.moduleSettings is deprecated. Use Model.shaderInputs.setProps()')();
-      this.updateModuleSettings(props.moduleSettings);
-    }
-    if (props.transformFeedback) {
-      this.transformFeedback = props.transformFeedback;
-    }
-    Object.seal(this);
-  }
-  destroy() {
-    this.pipelineFactory.release(this.pipeline);
-    this._uniformStore.destroy();
-  }
-  predraw() {
-    this.updateShaderInputs();
-  }
-  draw(renderPass) {
-    this.predraw();
-    try {
-      this._logDrawCallStart();
-      this.pipeline = this._updatePipeline();
-      this.pipeline.setBindings(this.bindings);
-      this.pipeline.setUniforms(this.uniforms);
-      const {
-        indexBuffer
-      } = this.vertexArray;
-      const indexCount = indexBuffer ? indexBuffer.byteLength / (indexBuffer.indexType === 'uint32' ? 4 : 2) : undefined;
-      this.pipeline.draw({
-        renderPass,
-        vertexArray: this.vertexArray,
-        vertexCount: this.vertexCount,
-        instanceCount: this.instanceCount,
-        indexCount,
-        transformFeedback: this.transformFeedback
-      });
-    } finally {
-      this._logDrawCallEnd();
-    }
-    this._logFramebuffer(renderPass);
-  }
-  setGeometry(geometry) {
-    const gpuGeometry = geometry && makeGPUGeometry(this.device, geometry);
-    this.setTopology(gpuGeometry.topology || 'triangle-list');
-    this.bufferLayout = mergeBufferLayouts(gpuGeometry.bufferLayout, this.bufferLayout);
-    if (this.vertexArray) {
-      this._setGeometryAttributes(gpuGeometry);
-    }
-    return gpuGeometry;
-  }
-  _setGeometryAttributes(gpuGeometry) {
-    const attributes = {
-      ...gpuGeometry.attributes
-    };
-    for (const [attributeName] of Object.entries(attributes)) {
-      if (!this.pipeline.shaderLayout.attributes.find(layout => layout.name === attributeName) && attributeName !== 'positions') {
-        delete attributes[attributeName];
-      }
-    }
-    this.vertexCount = gpuGeometry.vertexCount;
-    this.setIndexBuffer(gpuGeometry.indices);
-    this.setAttributes(gpuGeometry.attributes, 'ignore-unknown');
-    this.setAttributes(attributes);
-  }
-  setTopology(topology) {
-    if (topology !== this.topology) {
-      this.topology = topology;
-      this._setPipelineNeedsUpdate('topology');
-    }
-  }
-  setBufferLayout(bufferLayout) {
-    this.bufferLayout = this._gpuGeometry ? mergeBufferLayouts(bufferLayout, this._gpuGeometry.bufferLayout) : bufferLayout;
-    this._setPipelineNeedsUpdate('bufferLayout');
-    this.pipeline = this._updatePipeline();
-    this.vertexArray = this.device.createVertexArray({
-      renderPipeline: this.pipeline
-    });
-    if (this._gpuGeometry) {
-      this._setGeometryAttributes(this._gpuGeometry);
-    }
-  }
-  setParameters(parameters) {
-    if (!deepEqual(parameters, this.parameters, 2)) {
-      this.parameters = parameters;
-      this._setPipelineNeedsUpdate('parameters');
-    }
-  }
-  setVertexCount(vertexCount) {
-    this.vertexCount = vertexCount;
-  }
-  setInstanceCount(instanceCount) {
-    this.instanceCount = instanceCount;
-  }
-  setShaderInputs(shaderInputs) {
-    this.shaderInputs = shaderInputs;
-    this._uniformStore = new UniformStore(this.shaderInputs.modules);
-    for (const moduleName of Object.keys(this.shaderInputs.modules)) {
-      const uniformBuffer = this._uniformStore.getManagedUniformBuffer(this.device, moduleName);
-      this.bindings[`${moduleName}Uniforms`] = uniformBuffer;
-    }
-  }
-  setShaderModuleProps(props) {
-    const uniforms = this._getModuleUniforms(props);
-    const keys = Object.keys(uniforms).filter(k => {
-      const uniform = uniforms[k];
-      return !isNumberArray(uniform) && typeof uniform !== 'number' && typeof uniform !== 'boolean';
-    });
-    const bindings = {};
-    for (const k of keys) {
-      bindings[k] = uniforms[k];
-      delete uniforms[k];
+    device;
+    id;
+    vs;
+    fs;
+    pipelineFactory;
+    userData = {};
+    // Fixed properties (change can trigger pipeline rebuild)
+    /** The render pipeline GPU parameters, depth testing etc */
+    parameters;
+    /** The primitive topology */
+    topology;
+    /** Buffer layout */
+    bufferLayout;
+    // Dynamic properties
+    /** Vertex count */
+    vertexCount;
+    /** instance count */
+    instanceCount = 0;
+    /** Index buffer */
+    indexBuffer = null;
+    /** Buffer-valued attributes */
+    bufferAttributes = {};
+    /** Constant-valued attributes */
+    constantAttributes = {};
+    /** Bindings (textures, samplers, uniform buffers) */
+    bindings = {};
+    /** Sets uniforms @deprecated Use uniform buffers and setBindings() for portability*/
+    uniforms = {};
+    /**
+     * VertexArray
+     * @note not implemented: if bufferLayout is updated, vertex array has to be rebuilt!
+     * @todo - allow application to define multiple vertex arrays?
+     * */
+    vertexArray;
+    /** TransformFeedback, WebGL 2 only. */
+    transformFeedback = null;
+    /** The underlying GPU "program". @note May be recreated if parameters change */
+    pipeline;
+    /** ShaderInputs instance */
+    shaderInputs;
+    _uniformStore;
+    _pipelineNeedsUpdate = 'newly created';
+    _attributeInfos = {};
+    _gpuGeometry = null;
+    _getModuleUniforms;
+    props;
+    constructor(device, props) {
+        this.props = { ...Model.defaultProps, ...props };
+        props = this.props;
+        this.id = props.id || uid('model');
+        this.device = device;
+        Object.assign(this.userData, props.userData);
+        // Setup shader module inputs
+        const moduleMap = Object.fromEntries(this.props.modules?.map(module => [module.name, module]) || []);
+        this.setShaderInputs(props.shaderInputs || new ShaderInputs(moduleMap));
+        const isWebGPU = this.device.info.type === 'webgpu';
+        // TODO - hack to support unified WGSL shader
+        // TODO - this is wrong, compile a single shader
+        if (this.props.source) {
+            if (isWebGPU) {
+                this.props.shaderLayout ||= getShaderLayoutFromWGSL(this.props.source);
+            }
+            this.props.fs = this.props.source;
+            this.props.vs = this.props.source;
+        }
+        // Support WGSL shader layout introspection
+        if (isWebGPU && typeof this.props.vs !== 'string') {
+            this.props.shaderLayout ||= getShaderLayoutFromWGSL(this.props.vs.wgsl);
+        }
+        // Setup shader assembler
+        const platformInfo = getPlatformInfo(device);
+        // Extract modules from shader inputs if not supplied
+        const modules = (this.props.modules?.length > 0 ? this.props.modules : this.shaderInputs?.getModules()) || [];
+        const { vs, fs, getUniforms } = this.props.shaderAssembler.assembleShaders({
+            platformInfo,
+            ...this.props,
+            modules
+        });
+        this.vs = vs;
+        this.fs = fs;
+        this._getModuleUniforms = getUniforms;
+        this.vertexCount = this.props.vertexCount;
+        this.instanceCount = this.props.instanceCount;
+        this.topology = this.props.topology;
+        this.bufferLayout = this.props.bufferLayout;
+        this.parameters = this.props.parameters;
+        // Geometry, if provided, sets topology and vertex cound
+        if (props.geometry) {
+            this._gpuGeometry = this.setGeometry(props.geometry);
+        }
+        this.pipelineFactory =
+            props.pipelineFactory || PipelineFactory.getDefaultPipelineFactory(this.device);
+        // Create the pipeline
+        // @note order is important
+        this.pipeline = this._updatePipeline();
+        this.vertexArray = device.createVertexArray({
+            renderPipeline: this.pipeline
+        });
+        // Now we can apply geometry attributes
+        if (this._gpuGeometry) {
+            this._setGeometryAttributes(this._gpuGeometry);
+        }
+        // Apply any dynamic settings that will not trigger pipeline change
+        if (props.vertexCount) {
+            this.setVertexCount(props.vertexCount);
+        }
+        if (props.instanceCount) {
+            this.setInstanceCount(props.instanceCount);
+        }
+        // @ts-expect-error
+        if (props.indices) {
+            throw new Error('Model.props.indices removed. Use props.indexBuffer');
+        }
+        if (props.indexBuffer) {
+            this.setIndexBuffer(props.indexBuffer);
+        }
+        if (props.attributes) {
+            this.setAttributes(props.attributes);
+        }
+        if (props.constantAttributes) {
+            this.setConstantAttributes(props.constantAttributes);
+        }
+        if (props.bindings) {
+            this.setBindings(props.bindings);
+        }
+        if (props.uniforms) {
+            this.setUniforms(props.uniforms);
+        }
+        if (props.moduleSettings) {
+            log.warn('Model.props.moduleSettings is deprecated. Use Model.shaderInputs.setProps()')();
+            this.updateModuleSettings(props.moduleSettings);
+        }
+        if (props.transformFeedback) {
+            this.transformFeedback = props.transformFeedback;
+        }
+        // TODO - restore?
+        // this.setUniforms(this._getModuleUniforms()); // Get all default module uniforms
+        // Catch any access to non-standard props
+        Object.seal(this);
+    }
+    destroy() {
+        this.pipelineFactory.release(this.pipeline);
+        this._uniformStore.destroy();
+    }
+    // Draw call
+    predraw() {
+        // Update uniform buffers if needed
+        this.updateShaderInputs();
+    }
+    draw(renderPass) {
+        this.predraw();
+        try {
+            this._logDrawCallStart();
+            // Check if the pipeline is invalidated
+            // TODO - this is likely the worst place to do this from performance perspective. Perhaps add a predraw()?
+            this.pipeline = this._updatePipeline();
+            // Set pipeline state, we may be sharing a pipeline so we need to set all state on every draw
+            // Any caching needs to be done inside the pipeline functions
+            this.pipeline.setBindings(this.bindings);
+            this.pipeline.setUniforms(this.uniforms);
+            const { indexBuffer } = this.vertexArray;
+            const indexCount = indexBuffer ? indexBuffer.byteLength / (indexBuffer.indexType === 'uint32' ? 4 : 2) : undefined;
+            this.pipeline.draw({
+                renderPass,
+                vertexArray: this.vertexArray,
+                vertexCount: this.vertexCount,
+                instanceCount: this.instanceCount,
+                indexCount,
+                transformFeedback: this.transformFeedback
+            });
+        }
+        finally {
+            this._logDrawCallEnd();
+        }
+        this._logFramebuffer(renderPass);
+    }
+    // Update fixed fields (can trigger pipeline rebuild)
+    /**
+     * Updates the optional geometry
+     * Geometry, set topology and bufferLayout
+     * @note Can trigger a pipeline rebuild / pipeline cache fetch on WebGPU
+     */
+    setGeometry(geometry) {
+        const gpuGeometry = geometry && makeGPUGeometry(this.device, geometry);
+        this.setTopology(gpuGeometry.topology || 'triangle-list');
+        this.bufferLayout = mergeBufferLayouts(gpuGeometry.bufferLayout, this.bufferLayout);
+        if (this.vertexArray) {
+            this._setGeometryAttributes(gpuGeometry);
+        }
+        return gpuGeometry;
+    }
+    /**
+     * Updates the optional geometry attributes
+     * Geometry, sets several attributes, indexBuffer, and also vertex count
+     * @note Can trigger a pipeline rebuild / pipeline cache fetch on WebGPU
+     */
+    _setGeometryAttributes(gpuGeometry) {
+        // Filter geometry attribute so that we don't issue warnings for unused attributes
+        const attributes = { ...gpuGeometry.attributes };
+        for (const [attributeName] of Object.entries(attributes)) {
+            if (!this.pipeline.shaderLayout.attributes.find(layout => layout.name === attributeName) &&
+                attributeName !== 'positions') {
+                delete attributes[attributeName];
+            }
+        }
+        // TODO - delete previous geometry?
+        this.vertexCount = gpuGeometry.vertexCount;
+        this.setIndexBuffer(gpuGeometry.indices);
+        this.setAttributes(gpuGeometry.attributes, 'ignore-unknown');
+        this.setAttributes(attributes);
+    }
+    /**
+     * Updates the primitive topology ('triangle-list', 'triangle-strip' etc).
+     * @note Triggers a pipeline rebuild / pipeline cache fetch on WebGPU
+     */
+    setTopology(topology) {
+        if (topology !== this.topology) {
+            this.topology = topology;
+            this._setPipelineNeedsUpdate('topology');
+        }
     }
-  }
-  updateShaderInputs() {
-    this._uniformStore.setUniforms(this.shaderInputs.getUniformValues());
-  }
-  updateModuleSettings(props) {
-    log.warn('Model.updateModuleSettings is deprecated. Use Model.shaderInputs.setProps()')();
-    const {
-      bindings,
-      uniforms
-    } = splitUniformsAndBindings(this._getModuleUniforms(props));
-    Object.assign(this.bindings, bindings);
-    Object.assign(this.uniforms, uniforms);
-  }
-  setBindings(bindings) {
-    Object.assign(this.bindings, bindings);
-  }
-  setUniforms(uniforms) {
-    this.pipeline.setUniforms(uniforms);
-    Object.assign(this.uniforms, uniforms);
-  }
-  setIndexBuffer(indexBuffer) {
-    this.vertexArray.setIndexBuffer(indexBuffer);
-  }
-  setTransformFeedback(transformFeedback) {
-    this.transformFeedback = transformFeedback;
-  }
-  setAttributes(buffers, _option) {
-    if (buffers.indices) {
-      log.warn(`Model:${this.id} setAttributes() - indexBuffer should be set using setIndexBuffer()`)();
+    /**
+     * Updates the buffer layout.
+     * @note Triggers a pipeline rebuild / pipeline cache fetch on WebGPU
+     */
+    setBufferLayout(bufferLayout) {
+        this.bufferLayout = this._gpuGeometry
+            ? mergeBufferLayouts(bufferLayout, this._gpuGeometry.bufferLayout)
+            : bufferLayout;
+        this._setPipelineNeedsUpdate('bufferLayout');
+        // Recreate the pipeline
+        this.pipeline = this._updatePipeline();
+        // vertex array needs to be updated if we update buffer layout,
+        // but not if we update parameters
+        this.vertexArray = this.device.createVertexArray({
+            renderPipeline: this.pipeline
+        });
+        // Reapply geometry attributes to the new vertex array
+        if (this._gpuGeometry) {
+            this._setGeometryAttributes(this._gpuGeometry);
+        }
     }
-    for (const [bufferName, buffer] of Object.entries(buffers)) {
-      const bufferLayout = this.bufferLayout.find(layout => getAttributeNames(layout).includes(bufferName));
-      if (!bufferLayout) {
-        log.warn(`Model(${this.id}): Missing layout for buffer "${bufferName}".`)();
-        continue;
-      }
-      const attributeNames = getAttributeNames(bufferLayout);
-      let set = false;
-      for (const attributeName of attributeNames) {
-        const attributeInfo = this._attributeInfos[attributeName];
-        if (attributeInfo) {
-          this.vertexArray.setBuffer(attributeInfo.location, buffer);
-          set = true;
-        }
-      }
-      if (!set && _option !== 'ignore-unknown') {
-        log.warn(`Model(${this.id}): Ignoring buffer "${buffer.id}" for unknown attribute "${bufferName}"`)();
-      }
+    /**
+     * Set GPU parameters.
+     * @note Can trigger a pipeline rebuild / pipeline cache fetch.
+     * @param parameters
+     */
+    setParameters(parameters) {
+        if (!deepEqual(parameters, this.parameters, 2)) {
+            this.parameters = parameters;
+            this._setPipelineNeedsUpdate('parameters');
+        }
     }
-  }
-  setConstantAttributes(attributes) {
-    for (const [attributeName, value] of Object.entries(attributes)) {
-      const attributeInfo = this._attributeInfos[attributeName];
-      if (attributeInfo) {
-        this.vertexArray.setConstant(attributeInfo.location, value);
-      } else {
-        log.warn(`Model "${this.id}: Ignoring constant supplied for unknown attribute "${attributeName}"`)();
-      }
+    // Update dynamic fields
+    /**
+     * Updates the vertex count (used in draw calls)
+     * @note Any attributes with stepMode=vertex need to be at least this big
+     */
+    setVertexCount(vertexCount) {
+        this.vertexCount = vertexCount;
+    }
+    /**
+     * Updates the instance count (used in draw calls)
+     * @note Any attributes with stepMode=instance need to be at least this big
+     */
+    setInstanceCount(instanceCount) {
+        this.instanceCount = instanceCount;
+    }
+    setShaderInputs(shaderInputs) {
+        this.shaderInputs = shaderInputs;
+        this._uniformStore = new UniformStore(this.shaderInputs.modules);
+        // Create uniform buffer bindings for all modules
+        for (const moduleName of Object.keys(this.shaderInputs.modules)) {
+            const uniformBuffer = this._uniformStore.getManagedUniformBuffer(this.device, moduleName);
+            this.bindings[`${moduleName}Uniforms`] = uniformBuffer;
+        }
     }
-  }
-  _setPipelineNeedsUpdate(reason) {
-    this._pipelineNeedsUpdate = this._pipelineNeedsUpdate || reason;
-  }
-  _updatePipeline() {
-    if (this._pipelineNeedsUpdate) {
-      if (this.pipeline) {
-        log.log(1, `Model ${this.id}: Recreating pipeline because "${this._pipelineNeedsUpdate}".`)();
-      }
-      this._pipelineNeedsUpdate = false;
-      const vs = this.device.createShader({
-        id: `${this.id}-vertex`,
-        stage: 'vertex',
-        source: this.vs
-      });
-      const fs = this.fs ? this.device.createShader({
-        id: `${this.id}-fragment`,
-        stage: 'fragment',
-        source: this.fs
-      }) : null;
-      this.pipeline = this.device.createRenderPipeline({
-        ...this.props,
-        bufferLayout: this.bufferLayout,
-        topology: this.topology,
-        parameters: this.parameters,
-        vs,
-        fs
-      });
-      this._attributeInfos = getAttributeInfosFromLayouts(this.pipeline.shaderLayout, this.bufferLayout);
+    /**
+     * Updates shader module settings (which results in uniforms being set)
+     */
+    setShaderModuleProps(props) {
+        const uniforms = this._getModuleUniforms(props);
+        // Extract textures & framebuffers set by the modules
+        // TODO better way to extract bindings
+        const keys = Object.keys(uniforms).filter(k => {
+            const uniform = uniforms[k];
+            return !isNumberArray(uniform) && typeof uniform !== 'number' && typeof uniform !== 'boolean';
+        });
+        const bindings = {};
+        for (const k of keys) {
+            bindings[k] = uniforms[k];
+            delete uniforms[k];
+        }
     }
-    return this.pipeline;
-  }
-  _logDrawCallStart() {
-    const logDrawTimeout = log.level > 3 ? 0 : LOG_DRAW_TIMEOUT;
-    if (log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
-      return;
+    updateShaderInputs() {
+        this._uniformStore.setUniforms(this.shaderInputs.getUniformValues());
+    }
+    /**
+     * @deprecated Updates shader module settings (which results in uniforms being set)
+     */
+    updateModuleSettings(props) {
+        log.warn('Model.updateModuleSettings is deprecated. Use Model.shaderInputs.setProps()')();
+        const { bindings, uniforms } = splitUniformsAndBindings(this._getModuleUniforms(props));
+        Object.assign(this.bindings, bindings);
+        Object.assign(this.uniforms, uniforms);
+    }
+    /**
+     * Sets bindings (textures, samplers, uniform buffers)
+     */
+    setBindings(bindings) {
+        Object.assign(this.bindings, bindings);
+    }
+    /**
+     * Sets individual uniforms
+     * @deprecated WebGL only, use uniform buffers for portability
+     * @param uniforms
+     * @returns self for chaining
+     */
+    setUniforms(uniforms) {
+        this.pipeline.setUniforms(uniforms);
+        Object.assign(this.uniforms, uniforms);
+    }
+    /**
+     * Sets the index buffer
+     * @todo - how to unset it if we change geometry?
+     */
+    setIndexBuffer(indexBuffer) {
+        this.vertexArray.setIndexBuffer(indexBuffer);
+    }
+    /**
+     * Updates optional transform feedback. WebGL only.
+     */
+    setTransformFeedback(transformFeedback) {
+        this.transformFeedback = transformFeedback;
+    }
+    /**
+     * Sets attributes (buffers)
+     * @note Overrides any attributes previously set with the same name
+     */
+    setAttributes(buffers, _option) {
+        if (buffers.indices) {
+            log.warn(`Model:${this.id} setAttributes() - indexBuffer should be set using setIndexBuffer()`)();
+        }
+        for (const [bufferName, buffer] of Object.entries(buffers)) {
+            const bufferLayout = this.bufferLayout.find(layout => getAttributeNames(layout).includes(bufferName));
+            if (!bufferLayout) {
+                log.warn(`Model(${this.id}): Missing layout for buffer "${bufferName}".`)();
+                continue; // eslint-disable-line no-continue
+            }
+            // For an interleaved attribute we may need to set multiple attributes
+            const attributeNames = getAttributeNames(bufferLayout);
+            let set = false;
+            for (const attributeName of attributeNames) {
+                const attributeInfo = this._attributeInfos[attributeName];
+                if (attributeInfo) {
+                    this.vertexArray.setBuffer(attributeInfo.location, buffer);
+                    set = true;
+                }
+            }
+            if (!set && _option !== 'ignore-unknown') {
+                log.warn(`Model(${this.id}): Ignoring buffer "${buffer.id}" for unknown attribute "${bufferName}"`)();
+            }
+        }
     }
-    this._lastLogTime = Date.now();
-    this._logOpen = true;
-    log.group(LOG_DRAW_PRIORITY, `>>> DRAWING MODEL ${this.id}`, {
-      collapsed: log.level <= 2
-    })();
-  }
-  _logDrawCallEnd() {
-    if (this._logOpen) {
-      const shaderLayoutTable = getDebugTableForShaderLayout(this.pipeline.shaderLayout, this.id);
-      log.table(LOG_DRAW_PRIORITY, shaderLayoutTable)();
-      const uniformTable = this.shaderInputs.getDebugTable();
-      for (const [name, value] of Object.entries(this.uniforms)) {
-        uniformTable[name] = {
-          value
-        };
-      }
-      log.table(LOG_DRAW_PRIORITY, uniformTable)();
-      const attributeTable = this._getAttributeDebugTable();
-      log.table(LOG_DRAW_PRIORITY, this._attributeInfos)();
-      log.table(LOG_DRAW_PRIORITY, attributeTable)();
-      log.groupEnd(LOG_DRAW_PRIORITY)();
-      this._logOpen = false;
+    /**
+     * Sets constant attributes
+     * @note Overrides any attributes previously set with the same name
+     * Constant attributes are only supported in WebGL, not in WebGPU
+     * Any attribute that is disabled in the current vertex array object
+     * is read from the context's global constant value for that attribute location.
+     * @param constantAttributes
+     */
+    setConstantAttributes(attributes) {
+        for (const [attributeName, value] of Object.entries(attributes)) {
+            const attributeInfo = this._attributeInfos[attributeName];
+            if (attributeInfo) {
+                this.vertexArray.setConstant(attributeInfo.location, value);
+            }
+            else {
+                log.warn(`Model "${this.id}: Ignoring constant supplied for unknown attribute "${attributeName}"`)();
+            }
+        }
     }
-  }
-  _logFramebuffer(renderPass) {
-    const debugFramebuffers = log.get('framebuffer');
-    this._drawCount++;
-    if (!debugFramebuffers || this._drawCount++ > 3 && this._drawCount % 60) {
-      return;
+    _setPipelineNeedsUpdate(reason) {
+        this._pipelineNeedsUpdate = this._pipelineNeedsUpdate || reason;
+    }
+    _updatePipeline() {
+        if (this._pipelineNeedsUpdate) {
+            if (this.pipeline) {
+                log.log(1, `Model ${this.id}: Recreating pipeline because "${this._pipelineNeedsUpdate}".`)();
+            }
+            this._pipelineNeedsUpdate = false;
+            const vs = this.device.createShader({
+                id: `${this.id}-vertex`,
+                stage: 'vertex',
+                source: this.vs
+            });
+            const fs = this.fs
+                ? this.device.createShader({
+                    id: `${this.id}-fragment`,
+                    stage: 'fragment',
+                    source: this.fs
+                })
+                : null;
+            this.pipeline = this.pipelineFactory.createRenderPipeline({
+                ...this.props,
+                bufferLayout: this.bufferLayout,
+                topology: this.topology,
+                parameters: this.parameters,
+                vs,
+                fs
+            });
+            this._attributeInfos = getAttributeInfosFromLayouts(this.pipeline.shaderLayout, this.bufferLayout);
+        }
+        return this.pipeline;
+    }
+    /** Throttle draw call logging */
+    _lastLogTime = 0;
+    _logOpen = false;
+    _logDrawCallStart() {
+        // IF level is 4 or higher, log every frame.
+        const logDrawTimeout = log.level > 3 ? 0 : LOG_DRAW_TIMEOUT;
+        if (log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
+            return;
+        }
+        this._lastLogTime = Date.now();
+        this._logOpen = true;
+        log.group(LOG_DRAW_PRIORITY, `>>> DRAWING MODEL ${this.id}`, { collapsed: log.level <= 2 })();
+    }
+    _logDrawCallEnd() {
+        if (this._logOpen) {
+            const shaderLayoutTable = getDebugTableForShaderLayout(this.pipeline.shaderLayout, this.id);
+            // log.table(logLevel, attributeTable)();
+            // log.table(logLevel, uniformTable)();
+            log.table(LOG_DRAW_PRIORITY, shaderLayoutTable)();
+            const uniformTable = this.shaderInputs.getDebugTable();
+            // Add any global uniforms
+            for (const [name, value] of Object.entries(this.uniforms)) {
+                uniformTable[name] = { value };
+            }
+            log.table(LOG_DRAW_PRIORITY, uniformTable)();
+            const attributeTable = this._getAttributeDebugTable();
+            log.table(LOG_DRAW_PRIORITY, this._attributeInfos)();
+            log.table(LOG_DRAW_PRIORITY, attributeTable)();
+            log.groupEnd(LOG_DRAW_PRIORITY)();
+            this._logOpen = false;
+        }
     }
-    const framebuffer = renderPass.props.framebuffer;
-    if (framebuffer) {
-      debugFramebuffer(framebuffer, {
-        id: framebuffer.id,
-        minimap: true
-      });
+    _drawCount = 0;
+    _logFramebuffer(renderPass) {
+        const debugFramebuffers = log.get('framebuffer');
+        this._drawCount++;
+        // Update first 3 frames and then every 60 frames
+        if (!debugFramebuffers || ((this._drawCount++ > 3) && (this._drawCount % 60))) {
+            return;
+        }
+        // TODO - display framebuffer output in debug window
+        const framebuffer = renderPass.props.framebuffer;
+        if (framebuffer) {
+            debugFramebuffer(framebuffer, { id: framebuffer.id, minimap: true });
+            // log.image({logLevel: LOG_DRAW_PRIORITY, message: `${framebuffer.id} %c sup?`, image})();
+        }
     }
-  }
-  _getAttributeDebugTable() {
-    const table = {};
-    for (const [name, attributeInfo] of Object.entries(this._attributeInfos)) {
-      table[attributeInfo.location] = {
-        name,
-        type: attributeInfo.shaderType,
-        values: this._getBufferOrConstantValues(this.vertexArray.attributes[attributeInfo.location], attributeInfo.bufferDataType)
-      };
+    _getAttributeDebugTable() {
+        const table = {};
+        for (const [name, attributeInfo] of Object.entries(this._attributeInfos)) {
+            table[attributeInfo.location] = {
+                name,
+                type: attributeInfo.shaderType,
+                values: this._getBufferOrConstantValues(this.vertexArray.attributes[attributeInfo.location], attributeInfo.bufferDataType)
+            };
+        }
+        if (this.vertexArray.indexBuffer) {
+            const { indexBuffer } = this.vertexArray;
+            const values = indexBuffer.indexType === 'uint32'
+                ? new Uint32Array(indexBuffer.debugData)
+                : new Uint16Array(indexBuffer.debugData);
+            table.indices = {
+                name: 'indices',
+                type: indexBuffer.indexType,
+                values: values.toString()
+            };
+        }
+        return table;
     }
-    if (this.vertexArray.indexBuffer) {
-      const {
-        indexBuffer
-      } = this.vertexArray;
-      const values = indexBuffer.indexType === 'uint32' ? new Uint32Array(indexBuffer.debugData) : new Uint16Array(indexBuffer.debugData);
-      table.indices = {
-        name: 'indices',
-        type: indexBuffer.indexType,
-        values: values.toString()
-      };
+    // TODO - fix typing of luma data types
+    _getBufferOrConstantValues(attribute, dataType) {
+        const TypedArrayConstructor = getTypedArrayFromDataType(dataType);
+        const typedArray = attribute instanceof Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
+        return typedArray.toString();
     }
-    return table;
-  }
-  _getBufferOrConstantValues(attribute, dataType) {
-    const TypedArrayConstructor = getTypedArrayFromDataType(dataType);
-    const typedArray = attribute instanceof Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
-    return typedArray.toString();
-  }
 }
-Model.defaultProps = {
-  ...RenderPipeline.defaultProps,
-  source: null,
-  vs: null,
-  fs: null,
-  id: 'unnamed',
-  handle: undefined,
-  userData: {},
-  defines: {},
-  modules: [],
-  moduleSettings: undefined,
-  geometry: null,
-  indexBuffer: null,
-  attributes: {},
-  constantAttributes: {},
-  varyings: [],
-  shaderInputs: undefined,
-  pipelineFactory: undefined,
-  transformFeedback: undefined,
-  shaderAssembler: ShaderAssembler.getDefaultShaderAssembler()
-};
+// HELPERS
+/** TODO - move to core, document add tests */
 function mergeBufferLayouts(layouts1, layouts2) {
-  const layouts = [...layouts1];
-  for (const attribute of layouts2) {
-    const index = layouts.findIndex(attribute2 => attribute2.name === attribute.name);
-    if (index < 0) {
-      layouts.push(attribute);
-    } else {
-      layouts[index] = attribute;
+    const layouts = [...layouts1];
+    for (const attribute of layouts2) {
+        const index = layouts.findIndex(attribute2 => attribute2.name === attribute.name);
+        if (index < 0) {
+            layouts.push(attribute);
+        }
+        else {
+            layouts[index] = attribute;
+        }
     }
-  }
-  return layouts;
+    return layouts;
 }
+/** Create a shadertools platform info from the Device */
 export function getPlatformInfo(device) {
-  return {
-    type: device.info.type,
-    shaderLanguage: device.info.shadingLanguage,
-    shaderLanguageVersion: device.info.shadingLanguageVersion,
-    gpu: device.info.gpu,
-    features: device.features
-  };
+    return {
+        type: device.info.type,
+        shaderLanguage: device.info.shadingLanguage,
+        shaderLanguageVersion: device.info.shadingLanguageVersion,
+        gpu: device.info.gpu,
+        features: device.features
+    };
 }
+/** Get attribute names from a BufferLayout */
 function getAttributeNames(bufferLayout) {
-  var _bufferLayout$attribu;
-  return bufferLayout.attributes ? (_bufferLayout$attribu = bufferLayout.attributes) === null || _bufferLayout$attribu === void 0 ? void 0 : _bufferLayout$attribu.map(layout => layout.attribute) : [bufferLayout.name];
+    return bufferLayout.attributes
+        ? bufferLayout.attributes?.map(layout => layout.attribute)
+        : [bufferLayout.name];
 }
-//# sourceMappingURL=model.js.map