@luma.gl/webgl 8.5.10 → 8.6.0-alpha.4

package/src/webgl-utils/{request-animation-frame.js → request-animation-frame.ts}

@@ -1,12 +1,13 @@
 // Node.js polyfills for requestAnimationFrame and cancelAnimationFrame
+// / <reference types="@types/node" />
 
-export function requestAnimationFrame(callback) {
+export function requestAnimationFrame(callback): number | NodeJS.Timeout {
   return typeof window !== 'undefined' && window.requestAnimationFrame
     ? window.requestAnimationFrame(callback)
     : setTimeout(callback, 1000 / 60);
 }
 
-export function cancelAnimationFrame(timerId) {
+export function cancelAnimationFrame(timerId): void {
   return typeof window !== 'undefined' && window.cancelAnimationFrame
     ? window.cancelAnimationFrame(timerId)
     : clearTimeout(timerId);

package/src/webgl-utils/{texture-utils.js → texture-utils.ts}

@@ -1,14 +1,16 @@
 // TODO: Two subdirectories must not depend on each other (classes vs utils)!
+import {assert} from '@luma.gl/api';
+import GL from '@luma.gl/constants';
+import Texture from '../classes/texture';
 import Texture2D from '../classes/texture-2d';
 import TextureCube from '../classes/texture-cube';
 import Texture3D from '../classes/texture-3d';
-import Framebuffer from '../classes/framebuffer';
-import GL from '@luma.gl/constants';
-import {assert} from '../utils/assert';
+import Framebuffer, {FramebufferProps} from '../classes/framebuffer';
+
+type TextureType = Texture2D | TextureCube | Texture3D;
 
-// Clone a new texture object from a reference texture object.
-/** @type {import('./texture-utils').cloneTextureFrom} */
-export function cloneTextureFrom(refTexture, overrides) {
+/** Clone a new texture object from a reference texture object. */
+export function cloneTextureFrom<T extends TextureType>(refTexture: T, overrides?: any): T {
   assert(
     refTexture instanceof Texture2D ||
       refTexture instanceof TextureCube ||
@@ -33,13 +35,15 @@ export function cloneTextureFrom(refTexture, overrides) {
   );
 
   // TODO: move this to `Texture` class as instance method and use this.constructor
+  // @ts-expect-error
   return new TextureType(gl, textureOptions);
 }
 
-// Wraps a given texture into a framebuffer object, that can be further used
-// to read data from the texture object.
-/** @type {import('./texture-utils').toFramebuffer} */
-export function toFramebuffer(texture, opts) {
+/**
+ * Wraps a given texture into a framebuffer object, that can be further used
+ * to read data from the texture object.
+ */ 
+export function toFramebuffer(texture: Texture, opts?: FramebufferProps): Framebuffer {
   const {gl, width, height, id} = texture;
   const framebuffer = new Framebuffer(
     gl,

package/src/webgl-utils/typed-array-utils.ts

@@ -0,0 +1,137 @@
+import GL from '@luma.gl/constants';
+
+const ERR_TYPE_DEDUCTION = 'Failed to deduce GL constant from typed array';
+
+type TypedArrayConstructor =
+  | Float32ArrayConstructor
+  | Uint16ArrayConstructor
+  | Uint32ArrayConstructor
+  | Uint8ArrayConstructor
+  | Uint8ClampedArrayConstructor
+  | Int8ArrayConstructor
+  | Int16ArrayConstructor
+  | Int32ArrayConstructor;
+
+/**
+ * Converts TYPED ARRAYS to corresponding GL constant
+ * Used to auto deduce gl parameter types
+ * @param {*} arrayOrType
+ * @returns
+ */
+export function getGLTypeFromTypedArray(arrayOrType) {
+  // If typed array, look up constructor
+  const type = ArrayBuffer.isView(arrayOrType) ? arrayOrType.constructor : arrayOrType;
+  switch (type) {
+    case Float32Array:
+      return GL.FLOAT;
+    case Uint16Array:
+      return GL.UNSIGNED_SHORT;
+    case Uint32Array:
+      return GL.UNSIGNED_INT;
+    case Uint8Array:
+      return GL.UNSIGNED_BYTE;
+    case Uint8ClampedArray:
+      return GL.UNSIGNED_BYTE;
+    case Int8Array:
+      return GL.BYTE;
+    case Int16Array:
+      return GL.SHORT;
+    case Int32Array:
+      return GL.INT;
+    default:
+      throw new Error(ERR_TYPE_DEDUCTION);
+  }
+}
+
+/**
+ * Converts GL constant to corresponding TYPED ARRAY
+ * Used to auto deduce gl parameter types
+ * @param {*} glType
+ * @param {*} param1
+ * @returns
+ */
+// eslint-disable-next-line complexity
+export function getTypedArrayFromGLType(
+  glType: any,
+  options?: {
+    clamped?: boolean;
+  }
+): TypedArrayConstructor {
+  const {clamped = true} = options || {};
+  // Sorted in some order of likelihood to reduce amount of comparisons
+  switch (glType) {
+    case GL.FLOAT:
+      return Float32Array;
+    case GL.UNSIGNED_SHORT:
+    case GL.UNSIGNED_SHORT_5_6_5:
+    case GL.UNSIGNED_SHORT_4_4_4_4:
+    case GL.UNSIGNED_SHORT_5_5_5_1:
+      return Uint16Array;
+    case GL.UNSIGNED_INT:
+      return Uint32Array;
+    case GL.UNSIGNED_BYTE:
+      return clamped ? Uint8ClampedArray : Uint8Array;
+    case GL.BYTE:
+      return Int8Array;
+    case GL.SHORT:
+      return Int16Array;
+    case GL.INT:
+      return Int32Array;
+    default:
+      throw new Error('Failed to deduce typed array type from GL constant');
+  }
+}
+
+/**
+ * Flip rows (can be used on arrays returned from `Framebuffer.readPixels`)
+ * https: *stackoverflow.com/questions/41969562/
+ * how-can-i-flip-the-result-of-webglrenderingcontext-readpixels
+ * @param {*} param0
+ */
+ export function flipRows(options: {
+  data: any;
+  width: any;
+  height: any;
+  bytesPerPixel?: number;
+  temp?: any;
+}): void {
+  const {data, width, height, bytesPerPixel = 4, temp} = options;
+  const bytesPerRow = width * bytesPerPixel;
+
+  // make a temp buffer to hold one row
+  const tempBuffer = temp || new Uint8Array(bytesPerRow);
+  for (let y = 0; y < height / 2; ++y) {
+    const topOffset = y * bytesPerRow;
+    const bottomOffset = (height - y - 1) * bytesPerRow;
+    // make copy of a row on the top half
+    tempBuffer.set(data.subarray(topOffset, topOffset + bytesPerRow));
+    // copy a row from the bottom half to the top
+    data.copyWithin(topOffset, bottomOffset, bottomOffset + bytesPerRow);
+    // copy the copy of the top half row to the bottom half
+    data.set(tempBuffer, bottomOffset);
+  }
+}
+
+
+export function scalePixels(options: {
+  data: any;
+  width: any;
+  height: any;
+}): {
+  data: Uint8Array;
+  width: number;
+  height: number;
+} {
+  const {data, width, height} = options;
+  const newWidth = Math.round(width / 2);
+  const newHeight = Math.round(height / 2);
+  const newData = new Uint8Array(newWidth * newHeight * 4);
+  for (let y = 0; y < newHeight; y++) {
+    for (let x = 0; x < newWidth; x++) {
+      for (let c = 0; c < 4; c++) {
+        newData[(y * newWidth + x) * 4 + c] = data[(y * 2 * width + x * 2) * 4 + c];
+      }
+    }
+  }
+  return {data: newData, width: newWidth, height: newHeight};
+}