@luma.gl/webgl 9.0.0-beta.4 → 9.0.0-beta.6

package/dist/adapter/resources/webgl-vertex-array.js

@@ -1,167 +1,239 @@
-let _Symbol$toStringTag;
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
 import { VertexArray, getScratchArray, fillArray } from '@luma.gl/core';
+import { GL } from '@luma.gl/constants';
 import { getBrowser } from '@probe.gl/env';
 import { getGLFromVertexType } from "../converters/vertex-formats.js";
-_Symbol$toStringTag = Symbol.toStringTag;
+// import {AccessorObject} from '../..';
+// import {getGLFromVertexType} from '../converters/vertex-formats';
+/** VertexArrayObject wrapper */
 export class WEBGLVertexArray extends VertexArray {
-  get [_Symbol$toStringTag]() {
-    return 'VertexArray';
-  }
-  static isConstantAttributeZeroSupported(device) {
-    return device.info.type === 'webgl2' || getBrowser() === 'Chrome';
-  }
-  constructor(device, props) {
-    super(device, props);
-    this.device = void 0;
-    this.handle = void 0;
-    this.buffer = null;
-    this.bufferValue = null;
-    this.init = false;
-    this.device = device;
-    this.handle = this.device.gl2.createVertexArray();
-  }
-  destroy() {
-    super.destroy();
-    if (this.buffer) {
-      var _this$buffer;
-      (_this$buffer = this.buffer) === null || _this$buffer === void 0 ? void 0 : _this$buffer.destroy();
-    }
-    if (this.handle) {
-      this.device.gl2.deleteVertexArray(this.handle);
-      this.handle = undefined;
-    }
-  }
-  setIndexBuffer(indexBuffer) {
-    const buffer = indexBuffer;
-    if (buffer && buffer.glTarget !== 34963) {
-      throw new Error('Use .setBuffer()');
-    }
-    this.device.gl2.bindVertexArray(this.handle);
-    this.device.gl2.bindBuffer(34963, buffer ? buffer.handle : null);
-    this.indexBuffer = buffer;
-  }
-  setBuffer(location, attributeBuffer) {
-    const buffer = attributeBuffer;
-    if (buffer.glTarget === 34963) {
-      throw new Error('Use .setIndexBuffer()');
-    }
-    const {
-      size,
-      type,
-      stride,
-      offset,
-      normalized,
-      integer,
-      divisor
-    } = this._getAccessor(location);
-    this.device.gl2.bindVertexArray(this.handle);
-    this.device.gl.bindBuffer(34962, buffer.handle);
-    if (integer) {
-      this.device.assertWebGL2();
-      this.device.gl2.vertexAttribIPointer(location, size, type, stride, offset);
-    } else {
-      this.device.gl.vertexAttribPointer(location, size, type, normalized, stride, offset);
-    }
-    this.device.gl.enableVertexAttribArray(location);
-    this.device.gl2.vertexAttribDivisor(location, divisor || 0);
-    this.attributes[location] = buffer;
-  }
-  setConstant(location, value) {
-    this._enable(location, false);
-    this.attributes[location] = value;
-  }
-  bindBeforeRender() {
-    this.device.gl2.bindVertexArray(this.handle);
-    if (!this.init) {
-      const webglBuffer = this.indexBuffer;
-      this.device.gl2.bindBuffer(34963, (webglBuffer === null || webglBuffer === void 0 ? void 0 : webglBuffer.handle) || null);
-      this.init = true;
-    }
-    this._applyConstantAttributes();
-  }
-  unbindAfterRender() {
-    this.device.gl2.bindVertexArray(null);
-  }
-  _applyConstantAttributes() {
-    for (let location = 0; location < this.maxVertexAttributes; ++location) {
-      const constant = this.attributes[location];
-      if (ArrayBuffer.isView(constant)) {
-        this.device.setConstantAttribute(location, constant);
-      }
-    }
-  }
-  _getAccessor(location) {
-    const attributeInfo = this.attributeInfos[location];
-    if (!attributeInfo) {
-      throw new Error(`Unknown attribute location ${location}`);
-    }
-    const glType = getGLFromVertexType(attributeInfo.bufferDataType);
-    return {
-      size: attributeInfo.bufferComponents,
-      type: glType,
-      stride: attributeInfo.byteStride,
-      offset: attributeInfo.byteOffset,
-      normalized: attributeInfo.normalized,
-      integer: attributeInfo.integer,
-      divisor: attributeInfo.stepMode === 'instance' ? 1 : 0
-    };
-  }
-  _enable(location) {
-    let enable = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-    const canDisableAttributeZero = WEBGLVertexArray.isConstantAttributeZeroSupported(this.device);
-    const canDisableAttribute = canDisableAttributeZero || location !== 0;
-    if (enable || canDisableAttribute) {
-      location = Number(location);
-      this.device.gl2.bindVertexArray(this.handle);
-      if (enable) {
+    get [Symbol.toStringTag]() {
+        return 'VertexArray';
+    }
+    device;
+    handle;
+    /** Attribute 0 buffer constant */
+    buffer = null;
+    bufferValue = null;
+    /** * Attribute 0 can not be disable on most desktop OpenGL based browsers */
+    static isConstantAttributeZeroSupported(device) {
+        return getBrowser() === 'Chrome';
+    }
+    // Create a VertexArray
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        this.handle = this.device.gl.createVertexArray();
+    }
+    destroy() {
+        super.destroy();
+        if (this.buffer) {
+            this.buffer?.destroy();
+        }
+        if (this.handle) {
+            this.device.gl.deleteVertexArray(this.handle);
+            // @ts-expect-error read-only/undefined
+            this.handle = undefined;
+        }
+        // Auto-delete elements?
+        // return [this.elements];
+    }
+    /**
+    // Set (bind/unbind) an elements buffer, for indexed rendering.
+    // Must be a Buffer bound to GL.ELEMENT_ARRAY_BUFFER or null. Constants not supported
+     *
+     * @param elementBuffer
+     */
+    setIndexBuffer(indexBuffer) {
+        const buffer = indexBuffer;
+        // Explicitly allow `null` to support clearing the index buffer
+        if (buffer && buffer.glTarget !== GL.ELEMENT_ARRAY_BUFFER) {
+            throw new Error('Use .setBuffer()');
+        }
+        // In WebGL The GL.ELEMENT_ARRAY_BUFFER_BINDING is stored on the VertexArrayObject
+        this.device.gl.bindVertexArray(this.handle);
+        // TODO - this initial binding does not seem to take effect? see bindBeforeRender()
+        this.device.gl.bindBuffer(GL.ELEMENT_ARRAY_BUFFER, buffer ? buffer.handle : null);
+        // log.log(1, 'VertexArray.setIndexBuffer', indexBuffer)();
+        // log.log(1, `Binding vertex array ${this.id}`, buffer?.id)();
+        this.indexBuffer = buffer;
+    }
+    /** Set a location in vertex attributes array to a buffer, enables the location, sets divisor */
+    setBuffer(location, attributeBuffer) {
+        const buffer = attributeBuffer;
+        // Sanity check target
+        if (buffer.glTarget === GL.ELEMENT_ARRAY_BUFFER) {
+            throw new Error('Use .setIndexBuffer()');
+        }
+        const { size, type, stride, offset, normalized, integer, divisor } = this._getAccessor(location);
+        this.device.gl.bindVertexArray(this.handle);
+        // A non-zero buffer object must be bound to the GL_ARRAY_BUFFER target
+        this.device.gl.bindBuffer(GL.ARRAY_BUFFER, buffer.handle);
+        // WebGL2 supports *integer* data formats, i.e. GPU will see integer values
+        if (integer) {
+            this.device.gl.vertexAttribIPointer(location, size, type, stride, offset);
+        }
+        else {
+            // Attaches ARRAY_BUFFER with specified buffer format to location
+            this.device.gl.vertexAttribPointer(location, size, type, normalized, stride, offset);
+        }
+        // Mark as non-constant
         this.device.gl.enableVertexAttribArray(location);
-      } else {
-        this.device.gl.disableVertexAttribArray(location);
-      }
-      this.device.gl2.bindVertexArray(null);
-    }
-  }
-  getConstantBuffer(elementCount, value) {
-    const constantValue = normalizeConstantArrayValue(value);
-    const byteLength = constantValue.byteLength * elementCount;
-    const length = constantValue.length * elementCount;
-    if (this.buffer && byteLength !== this.buffer.byteLength) {
-      throw new Error(`Buffer size is immutable, byte length ${byteLength} !== ${this.buffer.byteLength}.`);
-    }
-    let updateNeeded = !this.buffer;
-    this.buffer = this.buffer || this.device.createBuffer({
-      byteLength
-    });
-    updateNeeded = updateNeeded || !compareConstantArrayValues(constantValue, this.bufferValue);
-    if (updateNeeded) {
-      const typedArray = getScratchArray(value.constructor, length);
-      fillArray({
-        target: typedArray,
-        source: constantValue,
-        start: 0,
-        count: length
-      });
-      this.buffer.write(typedArray);
-      this.bufferValue = value;
-    }
-    return this.buffer;
-  }
+        // Set the step mode 0=vertex, 1=instance
+        this.device.gl.vertexAttribDivisor(location, divisor || 0);
+        this.attributes[location] = buffer;
+    }
+    /** Set a location in vertex attributes array to a constant value, disables the location */
+    setConstantWebGL(location, value) {
+        this._enable(location, false);
+        this.attributes[location] = value;
+    }
+    init = false;
+    bindBeforeRender() {
+        this.device.gl.bindVertexArray(this.handle);
+        // TODO - the initial bind does not seem to take effect.
+        if (!this.init) {
+            // log.log(1, `Binding vertex array ${this.id}`, this.indexBuffer?.id)();
+            const webglBuffer = this.indexBuffer;
+            this.device.gl.bindBuffer(GL.ELEMENT_ARRAY_BUFFER, webglBuffer?.handle || null);
+            this.init = true;
+        }
+        this._applyConstantAttributes();
+    }
+    unbindAfterRender() {
+        // log.log(1, `Unbinding vertex array ${this.id}`)();
+        // TODO technically this is not necessary, but we might be interfacing
+        // with code that does not use vertex array objects
+        this.device.gl.bindVertexArray(null);
+        // this.device.gl.bindBuffer(GL.ELEMENT_ARRAY_BUFFER, null);
+    }
+    // Internal methods
+    /**
+     * Constant attributes need to be reset before every draw call
+     * Any attribute that is disabled in the current vertex array object
+     * is read from the context's global constant value for that attribute location.
+     * @note Constant attributes are only supported in WebGL, not in WebGPU
+     */
+    _applyConstantAttributes() {
+        for (let location = 0; location < this.maxVertexAttributes; ++location) {
+            const constant = this.attributes[location];
+            // A typed array means this is a constant
+            if (ArrayBuffer.isView(constant)) {
+                this.device.setConstantAttributeWebGL(location, constant);
+            }
+        }
+    }
+    /**
+     * Set a location in vertex attributes array to a buffer, enables the location, sets divisor
+     * @note requires vertex array to be bound
+     */
+    // protected _setAttributeLayout(location: number): void {
+    //   const {size, type, stride, offset, normalized, integer, divisor} = this._getAccessor(location);
+    //   // WebGL2 supports *integer* data formats, i.e. GPU will see integer values
+    //   if (integer) {
+    //     this.device.gl.vertexAttribIPointer(location, size, type, stride, offset);
+    //   } else {
+    //     // Attaches ARRAY_BUFFER with specified buffer format to location
+    //     this.device.gl.vertexAttribPointer(location, size, type, normalized, stride, offset);
+    //   }
+    //   this.device.gl.vertexAttribDivisor(location, divisor || 0);
+    // }
+    /** Get an accessor from the  */
+    _getAccessor(location) {
+        const attributeInfo = this.attributeInfos[location];
+        if (!attributeInfo) {
+            throw new Error(`Unknown attribute location ${location}`);
+        }
+        const glType = getGLFromVertexType(attributeInfo.bufferDataType);
+        return {
+            size: attributeInfo.bufferComponents,
+            type: glType,
+            stride: attributeInfo.byteStride,
+            offset: attributeInfo.byteOffset,
+            normalized: attributeInfo.normalized,
+            // it is the shader attribute declaration, not the vertex memory format,
+            // that determines if the data in the buffer will be treated as integers.
+            //
+            // Also note that WebGL supports assigning non-normalized integer data to floating point attributes,
+            // but as far as we can tell, WebGPU does not.
+            integer: attributeInfo.integer,
+            divisor: attributeInfo.stepMode === 'instance' ? 1 : 0
+        };
+    }
+    /**
+     * Enabling an attribute location makes it reference the currently bound buffer
+     * Disabling an attribute location makes it reference the global constant value
+     * TODO - handle single values for size 1 attributes?
+     * TODO - convert classic arrays based on known type?
+     */
+    _enable(location, enable = true) {
+        // Attribute 0 cannot be disabled in most desktop OpenGL based browsers...
+        const canDisableAttributeZero = WEBGLVertexArray.isConstantAttributeZeroSupported(this.device);
+        const canDisableAttribute = canDisableAttributeZero || location !== 0;
+        if (enable || canDisableAttribute) {
+            location = Number(location);
+            this.device.gl.bindVertexArray(this.handle);
+            if (enable) {
+                this.device.gl.enableVertexAttribArray(location);
+            }
+            else {
+                this.device.gl.disableVertexAttribArray(location);
+            }
+            this.device.gl.bindVertexArray(null);
+        }
+    }
+    /**
+     * Provide a means to create a buffer that is equivalent to a constant.
+     * NOTE: Desktop OpenGL cannot disable attribute 0.
+     * https://stackoverflow.com/questions/20305231/webgl-warning-attribute-0-is-disabled-
+     * this-has-significant-performance-penalty
+     */
+    getConstantBuffer(elementCount, value) {
+        // Create buffer only when needed, and reuse it (avoids inflating buffer creation statistics)
+        const constantValue = normalizeConstantArrayValue(value);
+        const byteLength = constantValue.byteLength * elementCount;
+        const length = constantValue.length * elementCount;
+        if (this.buffer && byteLength !== this.buffer.byteLength) {
+            throw new Error(`Buffer size is immutable, byte length ${byteLength} !== ${this.buffer.byteLength}.`);
+        }
+        let updateNeeded = !this.buffer;
+        this.buffer = this.buffer || this.device.createBuffer({ byteLength });
+        // Reallocate and update contents if needed
+        updateNeeded = updateNeeded || !compareConstantArrayValues(constantValue, this.bufferValue);
+        if (updateNeeded) {
+            // Create a typed array that is big enough, and fill it with the required data
+            const typedArray = getScratchArray(value.constructor, length);
+            fillArray({ target: typedArray, source: constantValue, start: 0, count: length });
+            this.buffer.write(typedArray);
+            this.bufferValue = value;
+        }
+        return this.buffer;
+    }
 }
+// HELPER FUNCTIONS
+/**
+ * TODO - convert Arrays based on known type? (read type from accessor, don't assume Float32Array)
+ * TODO - handle single values for size 1 attributes?
+ */
 function normalizeConstantArrayValue(arrayValue) {
-  if (Array.isArray(arrayValue)) {
-    return new Float32Array(arrayValue);
-  }
-  return arrayValue;
+    if (Array.isArray(arrayValue)) {
+        return new Float32Array(arrayValue);
+    }
+    return arrayValue;
 }
+/**
+ *
+ */
 function compareConstantArrayValues(v1, v2) {
-  if (!v1 || !v2 || v1.length !== v2.length || v1.constructor !== v2.constructor) {
-    return false;
-  }
-  for (let i = 0; i < v1.length; ++i) {
-    if (v1[i] !== v2[i]) {
-      return false;
-    }
-  }
-  return true;
+    if (!v1 || !v2 || v1.length !== v2.length || v1.constructor !== v2.constructor) {
+        return false;
+    }
+    for (let i = 0; i < v1.length; ++i) {
+        if (v1[i] !== v2[i]) {
+            return false;
+        }
+    }
+    return true;
 }
-//# sourceMappingURL=webgl-vertex-array.js.map

package/dist/adapter/webgl-canvas-context.d.ts

@@ -1,7 +1,7 @@
 import type { CanvasContextProps } from '@luma.gl/core';
 import { CanvasContext } from '@luma.gl/core';
-import { WebGLDevice } from './webgl-device';
-import { WEBGLFramebuffer } from './resources/webgl-framebuffer';
+import { WebGLDevice } from "./webgl-device.js";
+import { WEBGLFramebuffer } from "./resources/webgl-framebuffer.js";
 /**
  * A WebGL Canvas Context which manages the canvas and handles drawing buffer resizing etc
  */

package/dist/adapter/webgl-canvas-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"webgl-canvas-context.d.ts","sourceRoot":"","sources":["../../src/adapter/webgl-canvas-context.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACtD,OAAO,EAAC,aAAa,EAAC,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAC,gBAAgB,EAAC,MAAM,+BAA+B,CAAC;AAE/D;;GAEG;AACH,qBAAa,kBAAmB,SAAQ,aAAa;IACnD,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC;IAC7B,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,OAAO,CAAC,YAAY,CAAiC;gBAEzC,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,kBAAkB;IAS1D,qBAAqB,IAAI,gBAAgB;IAOzC,sDAAsD;IACtD,MAAM;IASN;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,OAAO,CAAC,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;KAAC,GAAG,IAAI;IAiB7F,MAAM;CAOP"}
+{"version":3,"file":"webgl-canvas-context.d.ts","sourceRoot":"","sources":["../../src/adapter/webgl-canvas-context.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACtD,OAAO,EAAC,aAAa,EAAC,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAC,WAAW,EAAC,0BAAuB;AAC3C,OAAO,EAAC,gBAAgB,EAAC,yCAAsC;AAE/D;;GAEG;AACH,qBAAa,kBAAmB,SAAQ,aAAa;IACnD,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC;IAC7B,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,OAAO,CAAC,YAAY,CAAiC;gBAEzC,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,kBAAkB;IAS1D,qBAAqB,IAAI,gBAAgB;IAOzC,sDAAsD;IACtD,MAAM;IAUN;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,OAAO,CAAC,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;KAAC,GAAG,IAAI;IAW7F,MAAM;CAOP"}

package/dist/adapter/webgl-canvas-context.js

@@ -1,43 +1,65 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
 import { CanvasContext } from '@luma.gl/core';
 import { WEBGLFramebuffer } from "./resources/webgl-framebuffer.js";
+/**
+ * A WebGL Canvas Context which manages the canvas and handles drawing buffer resizing etc
+ */
 export class WebGLCanvasContext extends CanvasContext {
-  constructor(device, props) {
-    super(props);
-    this.device = void 0;
-    this.presentationSize = void 0;
-    this._framebuffer = null;
-    this.device = device;
-    this.presentationSize = [-1, -1];
-    this._setAutoCreatedCanvasId(`${this.device.id}-canvas`);
-    this.update();
-  }
-  getCurrentFramebuffer() {
-    this.update();
-    this._framebuffer = this._framebuffer || new WEBGLFramebuffer(this.device, {
-      handle: null
-    });
-    return this._framebuffer;
-  }
-  update() {
-    const size = this.getPixelSize();
-    const sizeChanged = size[0] !== this.presentationSize[0] || size[1] !== this.presentationSize[1];
-    if (sizeChanged) {
-      this.presentationSize = size;
-      this.resize();
+    device;
+    presentationSize;
+    _framebuffer = null;
+    constructor(device, props) {
+        // Note: Base class creates / looks up the canvas (unless under Node.js)
+        super(props);
+        this.device = device;
+        this.presentationSize = [-1, -1];
+        this._setAutoCreatedCanvasId(`${this.device.id}-canvas`);
+        this.update();
     }
-  }
-  resize(options) {
-    if (!this.device.gl) return;
-    if (this.canvas) {
-      const devicePixelRatio = this.getDevicePixelRatio(options === null || options === void 0 ? void 0 : options.useDevicePixels);
-      this.setDevicePixelRatio(devicePixelRatio, options);
-      return;
+    getCurrentFramebuffer() {
+        this.update();
+        // Setting handle to null returns a reference to the default framebuffer
+        this._framebuffer = this._framebuffer || new WEBGLFramebuffer(this.device, { handle: null });
+        return this._framebuffer;
     }
-    const ext = this.device.gl.getExtension('STACKGL_resize_drawingbuffer');
-    if (ext && options && 'width' in options && 'height' in options) {
-      ext.resize(options.width, options.height);
+    /** Resizes and updates render targets if necessary */
+    update() {
+        const size = this.getPixelSize();
+        const sizeChanged = size[0] !== this.presentationSize[0] || size[1] !== this.presentationSize[1];
+        if (sizeChanged) {
+            this.presentationSize = size;
+            this.resize();
+        }
+    }
+    /**
+     * Resize the canvas' drawing buffer.
+     *
+     * Can match the canvas CSS size, and optionally also consider devicePixelRatio
+     * Can be called every frame
+     *
+     * Regardless of size, the drawing buffer will always be scaled to the viewport, but
+     * for best visual results, usually set to either:
+     *  canvas CSS width x canvas CSS height
+     *  canvas CSS width * devicePixelRatio x canvas CSS height * devicePixelRatio
+     * See http://webgl2fundamentals.org/webgl/lessons/webgl-resizing-the-canvas.html
+     */
+    resize(options) {
+        if (!this.device.gl)
+            return;
+        // Resize browser context .
+        if (this.canvas) {
+            const devicePixelRatio = this.getDevicePixelRatio(options?.useDevicePixels);
+            this.setDevicePixelRatio(devicePixelRatio, options);
+            return;
+        }
+    }
+    commit() {
+        // gl.commit was ultimately removed from the WebGL standard??
+        // if (this.offScreen && this.gl.commit) {
+        //   // @ts-expect-error gl.commit is not officially part of WebGL2RenderingContext
+        //   this.gl.commit();
+        // }
     }
-  }
-  commit() {}
 }
-//# sourceMappingURL=webgl-canvas-context.js.map