@luma.gl/webgl 9.0.0-alpha.48 → 9.0.0-alpha.50

package/src/adapter/converters/sampler-parameters.ts

@@ -29,7 +29,10 @@ export function convertSamplerParametersToWebGL(props: SamplerParameters): GLSam
   }
   if (props.minFilter || props.mipmapFilter) {
     // TODO - arbitrary choice of linear?
-    params[GL.TEXTURE_MIN_FILTER] = convertMinFilterMode(props.minFilter || 'linear', props.mipmapFilter);
+    params[GL.TEXTURE_MIN_FILTER] = convertMinFilterMode(
+      props.minFilter || 'linear',
+      props.mipmapFilter
+    );
   }
   if (props.lodMinClamp !== undefined) {
     params[GL.TEXTURE_MIN_LOD] = props.lodMinClamp;
@@ -54,30 +57,40 @@ export function convertSamplerParametersToWebGL(props: SamplerParameters): GLSam
 /** Convert address more */
 function convertAddressMode(addressMode: 'clamp-to-edge' | 'repeat' | 'mirror-repeat'): GL {
   switch (addressMode) {
-    case 'clamp-to-edge': return GL.CLAMP_TO_EDGE;
-    case 'repeat': return GL.REPEAT;
-    case 'mirror-repeat': return GL.MIRRORED_REPEAT;
+    case 'clamp-to-edge':
+      return GL.CLAMP_TO_EDGE;
+    case 'repeat':
+      return GL.REPEAT;
+    case 'mirror-repeat':
+      return GL.MIRRORED_REPEAT;
   }
 }
 
 function convertMaxFilterMode(maxFilter: 'nearest' | 'linear'): GL {
   switch (maxFilter) {
-    case 'nearest': return GL.NEAREST;
-    case 'linear': return GL.LINEAR;
+    case 'nearest':
+      return GL.NEAREST;
+    case 'linear':
+      return GL.LINEAR;
   }
 }
 
-/** 
- * WebGPU has separate min filter and mipmap filter, 
+/**
+ * WebGPU has separate min filter and mipmap filter,
  * WebGL is combined and effectively offers 6 options
  */
-function convertMinFilterMode(minFilter: 'nearest' | 'linear', mipmapFilter?: 'nearest' | 'linear'): GL {
+function convertMinFilterMode(
+  minFilter: 'nearest' | 'linear',
+  mipmapFilter?: 'nearest' | 'linear'
+): GL {
   if (!mipmapFilter) {
     return convertMaxFilterMode(minFilter);
   }
   switch (minFilter) {
-    case 'nearest': return mipmapFilter === 'nearest' ? GL.NEAREST_MIPMAP_NEAREST : GL.NEAREST_MIPMAP_LINEAR;
-    case 'linear': return mipmapFilter === 'nearest' ? GL.LINEAR_MIPMAP_NEAREST : GL.LINEAR_MIPMAP_LINEAR;
+    case 'nearest':
+      return mipmapFilter === 'nearest' ? GL.NEAREST_MIPMAP_NEAREST : GL.NEAREST_MIPMAP_LINEAR;
+    case 'linear':
+      return mipmapFilter === 'nearest' ? GL.LINEAR_MIPMAP_NEAREST : GL.LINEAR_MIPMAP_LINEAR;
   }
 }
 
@@ -115,7 +128,10 @@ export function convertToSamplerParameters(params: GLSamplerParameters): Sampler
     props.lodMaxClamp = params[GL.TEXTURE_MAX_LOD];
   }
   if (params[GL.TEXTURE_COMPARE_MODE]) {
-    props.type = params[GL.TEXTURE_COMPARE_MODE]  === GL.COMPARE_REF_TO_TEXTURE ? 'comparison-sampler' : 'color-sampler';
+    props.type =
+      params[GL.TEXTURE_COMPARE_MODE] === GL.COMPARE_REF_TO_TEXTURE
+        ? 'comparison-sampler'
+        : 'color-sampler';
   }
   if (params[GL.TEXTURE_COMPARE_FUNC]) {
     props.compare = convertToCompareFunction('compare', params[GL.TEXTURE_COMPARE_FUNC]);
@@ -128,54 +144,87 @@ export function convertToSamplerParameters(params: GLSamplerParameters): Sampler
 }
 
 /** Convert address more */
-function convertToAddressMode(addressMode: number): 'clamp-to-edge' | 'repeat' | 'mirror-repeat' {
+function convertToAddressMode(
+  addressMode: GL.CLAMP_TO_EDGE | GL.REPEAT | GL.MIRRORED_REPEAT
+): 'clamp-to-edge' | 'repeat' | 'mirror-repeat' {
   switch (addressMode) {
-    case GL.CLAMP_TO_EDGE: return 'clamp-to-edge';
-    case GL.REPEAT: return 'repeat';
-    case GL.MIRRORED_REPEAT: return 'mirror-repeat';
-    default: throw new Error('address');
+    case GL.CLAMP_TO_EDGE:
+      return 'clamp-to-edge';
+    case GL.REPEAT:
+      return 'repeat';
+    case GL.MIRRORED_REPEAT:
+      return 'mirror-repeat';
+    default:
+      throw new Error('address');
   }
 }
 
-function convertToMaxFilterMode(filterMode: number): 'nearest' | 'linear' {
+function convertToMaxFilterMode(filterMode: GL.NEAREST | GL.LINEAR): 'nearest' | 'linear' {
   switch (filterMode) {
-    case GL.NEAREST: return 'nearest';
-    case GL.LINEAR: return 'linear';
-    default: throw new Error('maxfilter');
+    case GL.NEAREST:
+      return 'nearest';
+    case GL.LINEAR:
+      return 'linear';
+    default:
+      throw new Error('maxfilter');
   }
 }
 
+type GLMinFilter =
+  | GL.NEAREST
+  | GL.LINEAR
+  | GL.NEAREST_MIPMAP_NEAREST
+  | GL.LINEAR_MIPMAP_NEAREST
+  | GL.NEAREST_MIPMAP_LINEAR
+  | GL.LINEAR_MIPMAP_LINEAR;
+
 /** WebGPU has separate min filter and mipmap filter, WebGL is combined */
-function convertToMinFilterMode(filterMode: number): 'nearest' | 'linear' {
+function convertToMinFilterMode(filterMode: GLMinFilter): 'nearest' | 'linear' {
   switch (filterMode) {
     // TODO is this correct?
-    case GL.NEAREST: return 'nearest';
-    case GL.LINEAR: return 'linear';
-    case GL.NEAREST_MIPMAP_NEAREST: return 'nearest';
-    case GL.LINEAR_MIPMAP_NEAREST: return 'linear';
-    case GL.NEAREST_MIPMAP_LINEAR: return 'nearest';
-    case GL.LINEAR_MIPMAP_LINEAR: return 'linear';
-    default: throw new Error('minfilter');
+    case GL.NEAREST:
+      return 'nearest';
+    case GL.LINEAR:
+      return 'linear';
+    case GL.NEAREST_MIPMAP_NEAREST:
+      return 'nearest';
+    case GL.LINEAR_MIPMAP_NEAREST:
+      return 'linear';
+    case GL.NEAREST_MIPMAP_LINEAR:
+      return 'nearest';
+    case GL.LINEAR_MIPMAP_LINEAR:
+      return 'linear';
+    default:
+      throw new Error('minfilter');
   }
 }
 
-function convertToMipmapFilterMode(filterMode: number): 'nearest' | 'linear' {
+function convertToMipmapFilterMode(filterMode: GLMinFilter): 'nearest' | 'linear' {
   switch (filterMode) {
     // TODO is this correct?
-    case GL.NEAREST: return 'nearest';
-    case GL.LINEAR: return 'linear';
-    case GL.NEAREST_MIPMAP_NEAREST: return 'nearest';
-    case GL.LINEAR_MIPMAP_NEAREST: return 'nearest';
-    case GL.NEAREST_MIPMAP_LINEAR: return 'linear';
-    case GL.LINEAR_MIPMAP_LINEAR: return 'linear';
-    default: throw new Error('mipmap');
+    case GL.NEAREST:
+      return 'nearest';
+    case GL.LINEAR:
+      return 'linear';
+    case GL.NEAREST_MIPMAP_NEAREST:
+      return 'nearest';
+    case GL.LINEAR_MIPMAP_NEAREST:
+      return 'nearest';
+    case GL.NEAREST_MIPMAP_LINEAR:
+      return 'linear';
+    case GL.LINEAR_MIPMAP_LINEAR:
+      return 'linear';
+    default:
+      throw new Error('mipmap');
   }
 }
 
 /**
  * Override sampler settings that are not supported by Non-Power-of-Two textures in WebGL1.
-*/
-export function updateSamplerParametersForNPOT(parameters: GLSamplerParameters): GLSamplerParameters {
+ */
+export function updateSamplerParametersForNPOT(
+  parameters: GLSamplerParameters
+): GLSamplerParameters {
   const newParameters = {...parameters};
   if (parameters[GL.TEXTURE_MIN_FILTER] !== GL.NEAREST) {
     // log.warn(`texture: ${this} is Non-Power-Of-Two, forcing TEXTURE_MIN_FILTER to LINEAR`)();

package/src/adapter/converters/texture-formats.ts

@@ -660,7 +660,7 @@ export function _checkFloat32ColorAttachment(
     framebuffer = gl.createFramebuffer();
     gl.bindFramebuffer(GL.FRAMEBUFFER, framebuffer);
     gl.framebufferTexture2D(GL.FRAMEBUFFER, GL.COLOR_ATTACHMENT0, GL.TEXTURE_2D, texture, 0);
-    const status = gl.checkFramebufferStatus(GL.FRAMEBUFFER) === GL.FRAMEBUFFER_COMPLETE;
+    const status = gl.checkFramebufferStatus(GL.FRAMEBUFFER) as GL === GL.FRAMEBUFFER_COMPLETE;
 
     gl.bindTexture(GL.TEXTURE_2D, null);
     return status;

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

@@ -207,7 +207,7 @@ export class WEBGLFramebuffer extends Framebuffer {
 function mapIndexToCubeMapFace(layer: number | GL): GL {
   // TEXTURE_CUBE_MAP_POSITIVE_X is a big value (0x8515)
   // if smaller assume layer is index, otherwise assume it is already a cube map face constant
-  return layer < GL.TEXTURE_CUBE_MAP_POSITIVE_X ? layer + GL.TEXTURE_CUBE_MAP_POSITIVE_X : layer;
+  return layer < (GL.TEXTURE_CUBE_MAP_POSITIVE_X as number) ? layer + GL.TEXTURE_CUBE_MAP_POSITIVE_X : layer;
 }
 
 // Helper METHODS

package/src/adapter/resources/webgl-render-pipeline.ts

@@ -178,7 +178,7 @@ export class WEBGLRenderPipeline extends RenderPipeline {
     const {bindings} = splitUniformsAndBindings(uniforms);
     Object.keys(bindings).forEach(name => {
       log.warn(
-        `Unsupported value "${bindings[name]}" used in setUniforms() for key ${name}. Use setBindings() instead?`
+        `Unsupported value "${JSON.stringify(bindings[name])}" used in setUniforms() for key ${name}. Use setBindings() instead?`
       )();
     });
     // TODO - check against layout
@@ -403,7 +403,7 @@ export class WEBGLRenderPipeline extends RenderPipeline {
           // Set buffer
           const {name} = binding;
           const location = gl2.getUniformBlockIndex(this.handle, name);
-          if (location === GL.INVALID_INDEX) {
+          if (location as GL === GL.INVALID_INDEX) {
             throw new Error(`Invalid uniform block name ${name}`);
           }
           gl2.uniformBlockBinding(this.handle, uniformBufferIndex, location);

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

@@ -45,7 +45,7 @@ export class WEBGLSampler extends Sampler {
     for (const [pname, value] of Object.entries(parameters)) {
       // Apparently there are integer/float conversion issues requires two parameter setting functions in JavaScript.
       // For now, pick the float version for parameters specified as GLfloat.
-      const param = Number(pname);
+      const param = Number(pname) as GL.TEXTURE_MIN_LOD | GL.TEXTURE_MAX_LOD;
       switch (param) {
         case GL.TEXTURE_MIN_LOD:
         case GL.TEXTURE_MAX_LOD:

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

@@ -56,17 +56,16 @@ export const DEFAULT_WEBGL_TEXTURE_PROPS = {
   border: 0,
   dataFormat: undefined!,
   textureUnit: undefined!,
-  target: undefined!,
+  target: undefined!
 };
 
-export type TextureSourceData = 
-  TypedArray |
-  ImageData |
-  HTMLImageElement |
-  HTMLCanvasElement |
-  ImageBitmap |
-  HTMLVideoElement
-  ;
+export type TextureSourceData =
+  | TypedArray
+  | ImageData
+  | HTMLImageElement
+  | HTMLCanvasElement
+  | ImageBitmap
+  | HTMLVideoElement;
 
 type SetImageDataOptions = {
   target?: number;
@@ -83,7 +82,7 @@ type SetImageDataOptions = {
   parameters?: Record<GL, any>;
   /** @deprecated */
   pixels?: any;
-}
+};
 
 /**
  * @param {*} pixels, data -
@@ -139,7 +138,6 @@ type SetImageData3DOptions = {
   parameters?: Record<GL, any>;
 };
 
-
 // Polyfill
 export class WEBGLTexture extends Texture<WEBGLTextureProps> {
   // TODO - remove?
@@ -241,7 +239,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
     let data = props.data;
 
     if (data instanceof Promise) {
-      data.then((resolvedImageData) =>
+      data.then(resolvedImageData =>
         this.initialize(
           Object.assign({}, props, {
             pixels: resolvedImageData,
@@ -261,10 +259,9 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
       return this;
     }
 
-    const {parameters = {}  as Record<GL, any>} = props;
+    const {parameters = {} as Record<GL, any>} = props;
 
-    const {
-      pixels = null, pixelStore = {}, textureUnit = undefined} = props;
+    const {pixels = null, pixelStore = {}, textureUnit = undefined} = props;
 
     // pixels variable is for API compatibility purpose
     if (!data) {
@@ -319,7 +316,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
       format: glFormat,
       type,
       dataFormat,
-      // @ts-expect-error 
+      // @ts-expect-error
       parameters: pixelStore,
       compressed
     });
@@ -345,7 +342,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
   }
 
   initializeCube(props?: WEBGLTextureProps): this {
-    const {mipmaps = true, parameters = {}  as Record<GL, any>} = props;
+    const {mipmaps = true, parameters = {} as Record<GL, any>} = props;
 
     // Store props for accessors
     // this.props = props;
@@ -386,7 +383,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
    * If size has changed, reinitializes with current format
    * @note note clears image and mipmaps
    */
-  resize(options: {height: number, width: number, mipmaps?: boolean}): this {
+  resize(options: {height: number; width: number; mipmaps?: boolean}): this {
     const {height, width, mipmaps = false} = options;
     if (width !== this.width || height !== this.height) {
       return this.initialize({
@@ -471,7 +468,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
       level = 0,
       glFormat = this.glFormat,
       offset = 0,
-      parameters = {}  as Record<GL, any>
+      parameters = {} as Record<GL, any>
     } = options;
 
     let {
@@ -509,7 +506,17 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
     withGLParameters(this.gl, parameters, () => {
       switch (dataType) {
         case 'null':
-          gl.texImage2D(target, level, glFormat, width, height, 0 /* border*/, dataFormat, type, data);
+          gl.texImage2D(
+            target,
+            level,
+            glFormat,
+            width,
+            height,
+            0 /* border*/,
+            dataFormat,
+            type,
+            data
+          );
           break;
         case 'typed-array':
           // Looks like this assert is not necessary, as offset is ignored under WebGL1
@@ -821,7 +828,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
     // ... }
 
     const resolvedFaces = await Promise.all(
-      WEBGLTexture.FACES.map((face) => {
+      WEBGLTexture.FACES.map(face => {
         const facePixels = imageDataMap[face];
         return Promise.all(Array.isArray(facePixels) ? facePixels : [facePixels]);
       })
@@ -867,7 +874,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
 
     this.bind();
     if (imageData instanceof Promise) {
-      imageData.then((resolvedImageData) =>
+      imageData.then(resolvedImageData =>
         this.setImageDataForFace(
           Object.assign({}, options, {
             face,
@@ -974,7 +981,7 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
 
     this.gl.bindTexture(this.target, this.handle);
     for (const [pname, pvalue] of Object.entries(parameters)) {
-      const param = Number(pname);
+      const param = Number(pname) as GL.TEXTURE_MIN_LOD | GL.TEXTURE_MAX_LOD;
       const value = pvalue;
 
       // Apparently there are integer/float conversion issues requires two parameter setting functions in JavaScript.
@@ -995,7 +1002,10 @@ export class WEBGLTexture extends Texture<WEBGLTextureProps> {
   }
 
   /** @deprecated For LegacyTexture subclass */
-  protected _getWebGL1NPOTParameterOverride(pname: number, value: number): number {
+  protected _getWebGL1NPOTParameterOverride(
+    pname: GL.TEXTURE_MIN_FILTER | GL.TEXTURE_WRAP_S | GL.TEXTURE_WRAP_T,
+    value: GL.LINEAR | GL.NEAREST
+  ): number {
     // NOTE: Apply NPOT workaround
     const npot = this.device.isWebGL1 && isNPOT(this.width, this.height);
     if (npot) {

package/src/classic/accessor.ts

@@ -87,7 +87,7 @@ export class Accessor implements AccessorObject {
       this.type = props.type;
 
       // Auto-deduce integer type?
-      if (props.type === GL.INT || props.type === GL.UNSIGNED_INT) {
+      if ((props.type as GL) === GL.INT || (props.type as GL) === GL.UNSIGNED_INT) {
         this.integer = true;
       }
     }