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

package/src/adapter/resources/webgl-buffer.ts

@@ -1,46 +1,46 @@
-import type {BufferProps} from '@luma.gl/api';
-import {Buffer, assert} from '@luma.gl/api';
-import GL from '@luma.gl/constants';
-import WebGLDevice from '../webgl-device';
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
 
-const DEBUG_DATA_LENGTH = 10;
+import type {BufferProps} from '@luma.gl/core';
+import {Buffer, assert} from '@luma.gl/core';
+import {GL} from '@luma.gl/constants';
+import {WebGLDevice} from '../webgl-device';
 
 /** WebGL Buffer interface */
-export default class WEBGLBuffer extends Buffer {
+export class WEBGLBuffer extends Buffer {
   readonly device: WebGLDevice;
-  readonly gl: WebGLRenderingContext;
-  readonly gl2: WebGL2RenderingContext | null;
+  readonly gl: WebGL2RenderingContext;
   readonly handle: WebGLBuffer;
-  readonly target: number;
 
+  /** Target in OpenGL defines the type of buffer */
+  readonly glTarget: GL.ARRAY_BUFFER | GL.ELEMENT_ARRAY_BUFFER | GL.UNIFORM_BUFFER;
+  /** Usage is a hint on how frequently the buffer will be updates */
+  readonly glUsage: GL.STATIC_DRAW | GL.DYNAMIC_DRAW;
+  /** Index type is needed when issuing draw calls, so we pre-compute it */
+  readonly glIndexType: GL.UNSIGNED_SHORT | GL.UNSIGNED_INT = GL.UNSIGNED_SHORT;
+
+  /** Number of bytes allocated on the GPU for this buffer */
   byteLength: number;
+  /** Number of bytes used */
   bytesUsed: number;
-  debugData: ArrayBuffer | null = null;
-
-  webglUsage: number;
-
-  accessor: {};
 
   constructor(device: WebGLDevice, props: BufferProps = {}) {
     super(device, props);
 
     this.device = device;
     this.gl = this.device.gl;
-    this.gl2 = this.device.gl2;
 
-    const handle = typeof props === 'object' ? (props as BufferProps).handle : undefined;
+    const handle = typeof props === 'object' ? props.handle : undefined;
     this.handle = handle || this.gl.createBuffer();
-    // @ts-expect-error Add metadata for spector
-    this.handle.__SPECTOR_Metadata = {...this.props, data: typeof this.props.data}; // {name: this.props.id};
-
-    // In WebGL1, need to make sure we use GL.ELEMENT_ARRAY_BUFFER when initializing element buffers
-    // otherwise buffer type will lock to generic (non-element) buffer
-    // In WebGL2, we can use GL.COPY_READ_BUFFER which avoids locking the type here
-    // @ts-expect-error Hack - Checking for subclass prop
-    this.target = this.props.target || getWebGLTarget(this.props.usage);
-    // @ts-expect-error Hack - Checking for subclass prop
-    this.webglUsage = this.props.webglUsage || getWebGLUsage(this.props.usage);
-    this.debugData = null;
+    device.setSpectorMetadata(this.handle, {...this.props, data: typeof this.props.data});
+
+    // - In WebGL1, need to make sure we use GL.ELEMENT_ARRAY_BUFFER when initializing element buffers
+    //   otherwise buffer type will lock to generic (non-element) buffer
+    // - In WebGL2, we can use GL.COPY_READ_BUFFER which avoids locking the type here
+    this.glTarget = getWebGLTarget(this.props.usage);
+    this.glUsage = getWebGLUsage(this.props.usage);
+    this.glIndexType = this.props.indexType === 'uint32' ? GL.UNSIGNED_INT : GL.UNSIGNED_SHORT;
 
     // Set data: (re)initializes the buffer
     if (props.data) {
@@ -48,32 +48,28 @@ export default class WEBGLBuffer extends Buffer {
     } else {
       this._initWithByteLength(props.byteLength || 0);
     }
-
-    // Deprecated: Merge main props and accessor
-    // this.accessor = {...props.accessor};
-
-    // Object.seal(this);
   }
 
-   // PRIVATE METHODS
-
-  // Allocate a new buffer and initialize to contents of typed array
-  _initWithData(data, byteOffset: number = 0, byteLength: number = data.byteLength + byteOffset): this {
-    assert(ArrayBuffer.isView(data));
+  // PRIVATE METHODS
 
-    const target = this._getWriteTarget();
-
-    this.gl.bindBuffer(target, this.handle);
-    this.gl.bufferData(target, byteLength, this.webglUsage);
-    this.gl.bufferSubData(target, byteOffset, data);
-    this.gl.bindBuffer(target, null);
+  /** Allocate a new buffer and initialize to contents of typed array */
+  _initWithData(
+    data: ArrayBuffer | ArrayBufferView,
+    byteOffset: number = 0,
+    byteLength: number = data.byteLength + byteOffset
+  ): void {
+    // const glTarget = this.device.isWebGL2 ? GL.COPY_WRITE_BUFFER : this.glTarget;
+    const glTarget = this.glTarget;
+    this.gl.bindBuffer(glTarget, this.handle);
+    this.gl.bufferData(glTarget, byteLength, this.glUsage);
+    this.gl.bufferSubData(glTarget, byteOffset, data);
+    this.gl.bindBuffer(glTarget, null);
 
-    this.debugData = data.slice(0, DEBUG_DATA_LENGTH);
     this.bytesUsed = byteLength;
     this.byteLength = byteLength;
-    this.trackAllocatedMemory(byteLength);
 
-    return this;
+    this._setDebugData(data, byteOffset, byteLength);
+    this.trackAllocatedMemory(byteLength);
   }
 
   // Allocate a GPU buffer of specified size.
@@ -88,102 +84,102 @@ export default class WEBGLBuffer extends Buffer {
       data = new Float32Array(0);
     }
 
-    const target = this._getWriteTarget();
+    // const glTarget = this.device.isWebGL2 ? GL.COPY_WRITE_BUFFER : this.glTarget;
+    const glTarget = this.glTarget;
 
-    this.gl.bindBuffer(target, this.handle);
-    this.gl.bufferData(target, data, this.webglUsage);
-    this.gl.bindBuffer(target, null);
+    this.gl.bindBuffer(glTarget, this.handle);
+    this.gl.bufferData(glTarget, data, this.glUsage);
+    this.gl.bindBuffer(glTarget, null);
 
-    this.debugData = null;
     this.bytesUsed = byteLength;
     this.byteLength = byteLength;
 
+    this._setDebugData(null, 0, byteLength);
+    this.trackAllocatedMemory(byteLength);
+
     return this;
   }
 
-  destroy(): void {
-    if (this.handle) {
+  override destroy(): void {
+    if (!this.destroyed && this.handle) {
       this.removeStats();
       this.trackDeallocatedMemory();
       this.gl.deleteBuffer(this.handle);
-      // this.handle = null;
       this.destroyed = true;
+      // @ts-expect-error
+      this.handle = null;
     }
   }
 
-  write(data: ArrayBufferView, byteOffset: number = 0): void {
+  override write(data: ArrayBufferView, byteOffset: number = 0): void {
     const srcOffset = 0;
-    const byteLength = data.byteLength;
+    const byteLength = undefined; // data.byteLength;
 
     // Create the buffer - binding it here for the first time locks the type
     // In WebGL2, use GL.COPY_WRITE_BUFFER to avoid locking the type
-    const target = this.device.isWebGL2 ? GL.COPY_WRITE_BUFFER : this.target;
-    this.gl.bindBuffer(target, this.handle);
+    const glTarget = GL.COPY_WRITE_BUFFER;
+    this.gl.bindBuffer(glTarget, this.handle);
     // WebGL2: subData supports additional srcOffset and length parameters
     if (srcOffset !== 0 || byteLength !== undefined) {
-      this.device.assertWebGL2();
-
-      // @ts-expect-error
-      this.gl.bufferSubData(this.target, offset, data, srcOffset, byteLength);
+      this.gl.bufferSubData(glTarget, byteOffset, data, srcOffset, byteLength);
     } else {
-      this.gl.bufferSubData(target, byteOffset, data);
+      this.gl.bufferSubData(glTarget, byteOffset, data);
     }
-    this.gl.bindBuffer(target, null);
+    this.gl.bindBuffer(glTarget, null);
 
-    // TODO - update local `data` if offsets are right
-    // this.debugData = data.slice(byteOffset, 40);
+    this._setDebugData(data, byteOffset, data.byteLength);
   }
 
-  /** Read data from the buffer */
-  async readAsync(
-    byteOffset: number = 0,
-    byteLength?: number
-  ): Promise<ArrayBuffer> {
-    this.device.assertWebGL2();
+  /** Asynchronously read data from the buffer */
+  override async readAsync(byteOffset = 0, byteLength?: number): Promise<Uint8Array> {
+    return this.readSyncWebGL(byteOffset, byteLength);
+  }
 
+  /** Synchronously read data from the buffer. WebGL only. */
+  override readSyncWebGL(byteOffset = 0, byteLength?: number): Uint8Array {
+    byteLength = byteLength ?? this.byteLength - byteOffset;
     const data = new Uint8Array(byteLength);
     const dstOffset = 0;
 
     // Use GL.COPY_READ_BUFFER to avoid disturbing other targets and locking type
     this.gl.bindBuffer(GL.COPY_READ_BUFFER, this.handle);
-    this.gl2.getBufferSubData(GL.COPY_READ_BUFFER, byteOffset, data, dstOffset, byteLength);
+    this.gl.getBufferSubData(GL.COPY_READ_BUFFER, byteOffset, data, dstOffset, byteLength);
     this.gl.bindBuffer(GL.COPY_READ_BUFFER, null);
 
-    // TODO - update local `data` if offsets are 0
-    // this.debugData = null;
+    // Update local `data` if offsets are 0
+    this._setDebugData(data, byteOffset, byteLength);
 
     return data;
   }
-
-  // PROTECTED METHODS (INTENDED FOR USE BY OTHER FRAMEWORK CODE ONLY)
-
-  _invalidateDebugData() {
-    this.debugData = null;
-  }
-
-  _getWriteTarget() {
-    return this.target;
-    // return this.device.isWebGL2 ? GL.COPY_WRITE_BUFFER : this.target;
-  }
-
-  _getReadTarget() {
-    return this.target;
-    return this.device.isWebGL2 ? GL.COPY_READ_BUFFER : this.target;
-  }
 }
 
-// static MAP_READ = 0x01;
-// static MAP_WRITE = 0x02;
-// static COPY_SRC = 0x0004;
-// static COPY_DST = 0x0008;
-// static INDEX = 0x0010;
-// static VERTEX = 0x0020;
-// static UNIFORM = 0x0040;
-// static STORAGE = 0x0080;
-// static INDIRECT = 0x0100;
-// static QUERY_RESOLVE = 0x0200;
-
-function getWebGLTarget(usage: number): GL {
+/**
+ * Returns a WebGL buffer target
+ *
+ * @param usage
+ * static MAP_READ = 0x01;
+ * static MAP_WRITE = 0x02;
+ * static COPY_SRC = 0x0004;
+ * static COPY_DST = 0x0008;
+ * static INDEX = 0x0010;
+ * static VERTEX = 0x0020;
+ * static UNIFORM = 0x0040;
+ * static STORAGE = 0x0080;
+ * static INDIRECT = 0x0100;
+ * static QUERY_RESOLVE = 0x0200;
+ *
+ * @returns WebGL buffer targe
+ *
+ * Buffer bind points in WebGL2
+ * gl.COPY_READ_BUFFER: Buffer for copying from one buffer object to another.
+ * gl.COPY_WRITE_BUFFER: Buffer for copying from one buffer object to another.
+ * gl.TRANSFORM_FEEDBACK_BUFFER: Buffer for transform feedback operations.
+ * gl.PIXEL_PACK_BUFFER: Buffer used for pixel transfer operations.
+ * gl.PIXEL_UNPACK_BUFFER: Buffer used for pixel transfer operations.
+ */
+function getWebGLTarget(
+  usage: number
+): GL.ARRAY_BUFFER | GL.ELEMENT_ARRAY_BUFFER | GL.UNIFORM_BUFFER {
   if (usage & Buffer.INDEX) {
     return GL.ELEMENT_ARRAY_BUFFER;
   }
@@ -194,18 +190,13 @@ function getWebGLTarget(usage: number): GL {
     return GL.UNIFORM_BUFFER;
   }
 
-  // gl.COPY_READ_BUFFER: Buffer for copying from one buffer object to another.
-  // gl.COPY_WRITE_BUFFER: Buffer for copying from one buffer object to another.
-  // gl.TRANSFORM_FEEDBACK_BUFFER: Buffer for transform feedback operations.
-  // gl.PIXEL_PACK_BUFFER: Buffer used for pixel transfer operations.
-  // gl.PIXEL_UNPACK_BUFFER: Buffer used for pixel transfer operations.
-
   // Binding a buffer for the first time locks the type
-  // In WebGL2, use GL.COPY_WRITE_BUFFER to avoid locking the type
+  // In WebGL2, we can use GL.COPY_WRITE_BUFFER to avoid locking the type
   return GL.ARRAY_BUFFER;
 }
 
-function getWebGLUsage(usage: number): GL {
+/** @todo usage is not passed correctly */
+function getWebGLUsage(usage: number): GL.STATIC_DRAW | GL.DYNAMIC_DRAW {
   if (usage & Buffer.INDEX) {
     return GL.STATIC_DRAW;
   }
@@ -215,5 +206,5 @@ function getWebGLUsage(usage: number): GL {
   if (usage & Buffer.UNIFORM) {
     return GL.DYNAMIC_DRAW;
   }
-  return GL.DYNAMIC_DRAW;
+  return GL.STATIC_DRAW;
 }