@luma.gl/webgl 8.5.9 → 8.6.0-alpha.3

package/src/classes/program-configuration.ts

@@ -0,0 +1,77 @@
+// Contains metadata describing attribute configurations for a program's shaders
+// Much of this is automatically extracted from shaders after program linking
+// import Accessor from './accessor';
+import type Program from './program';
+import type {AttributeBinding, VaryingBinding} from '../helpers/program-bindings';
+import {getProgramBindings} from '../helpers/get-program-bindings';
+
+/**
+ * is a mechanism for taking a program object and querying information
+ * about it, so as to be able to interface and interact with it.
+ * For example, if there is a uniform, you may need to query its
+ * location so that you can set its value.
+ */
+ export default class ProgramConfiguration {
+  id: string;
+  attributeInfos: AttributeBinding[] = [];
+  attributeInfosByName: Record<string, AttributeBinding> = {};
+  // Locations may not be contiguous the case of matrix attributes
+  // so keep a separate location->attribute map.
+  attributeInfosByLocation: AttributeBinding[] = [];
+  varyingInfos: VaryingBinding[] = [];
+  varyingInfosByName: Record<string, VaryingBinding> = {};
+
+  constructor(program: Program) {
+    this.id = program.id;
+    Object.seal(this);
+
+    const bindings = getProgramBindings(program.gl2, program.handle);
+
+    this.attributeInfos = bindings.attributes;
+    for (const attributeInfo of bindings.attributes) {
+      this.attributeInfosByName[attributeInfo.name] = attributeInfo;
+      this.attributeInfosByLocation[attributeInfo.location] = attributeInfo;
+    }
+
+    for (const varyingInfo of bindings.varyings) {
+      this.varyingInfosByName[varyingInfo.name] = varyingInfo;
+    }
+  }
+
+  getAttributeInfo(locationOrName: number | string): AttributeBinding {
+    const location = Number(locationOrName);
+    if (Number.isFinite(location)) {
+      return this.attributeInfosByLocation[location];
+    }
+    return this.attributeInfosByName[locationOrName] || null;
+  }
+
+  // Resolves an attribute name or index to an index
+  getAttributeLocation(locationOrName: number | string): number {
+    const attributeInfo = this.getAttributeInfo(locationOrName);
+    return attributeInfo ? attributeInfo.location : -1;
+  }
+
+  getAttributeAccessor(locationOrName: number | string) {
+    const attributeInfo = this.getAttributeInfo(locationOrName);
+    return attributeInfo ? attributeInfo.accessor : null;
+  }
+
+  getVaryingInfo(locationOrName: number | string): VaryingBinding {
+    const location = Number(locationOrName);
+    if (Number.isFinite(location)) {
+      return this.varyingInfos[location];
+    }
+    return this.varyingInfosByName[locationOrName] || null;
+  }
+
+  getVaryingIndex(locationOrName: number | string): number {
+    const varying = this.getVaryingInfo(locationOrName);
+    return varying ? varying.location : -1;
+  }
+
+  getVaryingAccessor(locationOrName: number | string) {
+    const varying = this.getVaryingInfo(locationOrName);
+    return varying ? varying.accessor : null;
+  }
+}

package/src/classes/{program.js → program.ts}

@@ -1,75 +1,106 @@
+import {log, assert, uid, cast, Shader} from '@luma.gl/api';
 import GL from '@luma.gl/constants';
-
-import Resource from './resource';
+import WebGLDevice from '../adapter/webgl-device';
+import WebGLResource, {ResourceProps} from './webgl-resource';
 import Texture from './texture';
 import Framebuffer from './framebuffer';
 import {parseUniformName, getUniformSetter} from './uniforms';
-import {VertexShader, FragmentShader} from './shader';
+import {WEBGLShader} from '../adapter/webgl-shader';
 import ProgramConfiguration from './program-configuration';
 import {copyUniform, checkUniformValues} from './uniforms';
 
-import {isWebGL2, assertWebGL2Context, withParameters, log} from '@luma.gl/gltools';
+import {isWebGL2, assertWebGL2Context} from '../context/context/webgl-checks';
+import {withParameters} from '../context/state-tracker/with-parameters';
 import {getKey} from '../webgl-utils/constants-to-keys';
 import {getPrimitiveDrawMode} from '../webgl-utils/attribute-utils';
-import {assert} from '../utils/assert';
-import {uid} from '../utils/utils';
 
 const LOG_PROGRAM_PERF_PRIORITY = 4;
 
 const GL_SEPARATE_ATTRIBS = 0x8c8d;
 
-const V6_DEPRECATED_METHODS = [
-  'setVertexArray',
-  'setAttributes',
-  'setBuffers',
-  'unsetBuffers',
-
-  'use',
-  'getUniformCount',
-  'getUniformInfo',
-  'getUniformLocation',
-  'getUniformValue',
-
-  'getVarying',
-  'getFragDataLocation',
-  'getAttachedShaders',
-  'getAttributeCount',
-  'getAttributeLocation',
-  'getAttributeInfo'
-];
-
-export default class Program extends Resource {
-  constructor(gl, props = {}) {
-    super(gl, props);
-
-    this.stubRemovedMethods('Program', 'v6.0', V6_DEPRECATED_METHODS);
-
-    // Experimental flag to avoid deleting Program object while it is cached
-    this._isCached = false;
-
+export type ProgramProps = ResourceProps & {
+  hash?: string;
+  vs?: string | Shader;
+  fs?: string | Shader;
+  varyings?: string[];
+  bufferMode?: number;
+};
+
+export type ProgramDrawOptions = {
+  logPriority?: number;
+  drawMode?: number;
+  vertexCount: any;
+  offset?: number;
+  start?: number;
+  end?: number;
+  isIndexed?: boolean;
+  indexType?: any;
+  instanceCount?: number;
+  isInstanced?: boolean;
+  vertexArray?: any;
+  transformFeedback?: any; // TransformFeedback;
+  framebuffer?: Framebuffer;
+  parameters?: {};
+  uniforms?: Record<string, any>;
+  samplers?: any;
+};
+
+export default class Program extends WebGLResource<ProgramProps> {
+  configuration: ProgramConfiguration;
+  // Experimental flag to avoid deleting Program object while it is cached
+  hash: string; // Used by ProgramManager
+  vs: WEBGLShader;
+  fs: WEBGLShader;
+  uniforms: Record<string, any>;
+  varyings: Record<string, any>;
+  _textureUniforms: Record<string, any>;
+  _isCached: boolean = false;
+  _textureIndexCounter: number = 0;
+  _uniformCount: number = 0;
+  _uniformSetters: Record<string, Function>;
+
+  constructor(device: WebGLDevice | WebGLRenderingContext, props: ProgramProps = {}) {
+    super(WebGLDevice.attach(device), props, {} as any);
     this.initialize(props);
-
     Object.seal(this);
-
     this._setId(props.id);
   }
 
-  initialize(props = {}) {
+  destroy(options = {}) {
+    if (this._isCached) {
+      // This object is cached, do not delete
+      return this;
+    }
+    return super.delete(options);
+  }
+
+  delete(options = {}) {
+    if (this._isCached) {
+      // This object is cached, do not delete
+      return this;
+    }
+    return super.delete(options);
+  }
+
+  initialize(props: ProgramProps = {}) {
     const {hash, vs, fs, varyings, bufferMode = GL_SEPARATE_ATTRIBS} = props;
 
     this.hash = hash || ''; // Used by ProgramManager
 
     // Create shaders if needed
     this.vs =
-      typeof vs === 'string' ? new VertexShader(this.gl, {id: `${props.id}-vs`, source: vs}) : vs;
+      typeof vs === 'string'
+        ? this.device.createShader({id: `${props.id}-vs`, source: vs, stage: 'vertex'})
+        : cast<WEBGLShader>(vs);
     this.fs =
-      typeof fs === 'string' ? new FragmentShader(this.gl, {id: `${props.id}-fs`, source: fs}) : fs;
-    assert(this.vs instanceof VertexShader);
-    assert(this.fs instanceof FragmentShader);
+      typeof fs === 'string'
+        ? this.device.createShader({id: `${props.id}-fs`, source: fs, stage: 'fragment'})
+        : cast<WEBGLShader>(fs);
+    assert(this.vs.stage === 'vertex');
+    assert(this.fs.stage === 'fragment');
 
     // uniforms
     this.uniforms = {};
-
     this._textureUniforms = {};
 
     // Setup varyings if supplied
@@ -86,14 +117,6 @@ export default class Program extends Resource {
     return this.setProps(props);
   }
 
-  delete(options = {}) {
-    if (this._isCached) {
-      // This object is cached, do not delete
-      return this;
-    }
-    return super.delete(options);
-  }
-
   setProps(props) {
     if ('uniforms' in props) {
       this.setUniforms(props.uniforms);
@@ -103,28 +126,31 @@ export default class Program extends Resource {
 
   // A good thing about the WebGL API is that there are so many ways to draw things ;)
   // This function unifies those ways into a single call using common parameters with sane defaults
-  draw({
-    logPriority, // Probe log priority, enables Model to do more integrated logging
-
-    drawMode = GL.TRIANGLES,
-    vertexCount,
-    offset = 0,
-    start,
-    end,
-    isIndexed = false,
-    indexType = GL.UNSIGNED_SHORT,
-    instanceCount = 0,
-    isInstanced = instanceCount > 0,
-
-    vertexArray = null,
-    transformFeedback,
-    framebuffer,
-    parameters = {},
-
-    // Deprecated
-    uniforms,
-    samplers
-  }) {
+  draw(options: ProgramDrawOptions): boolean {
+    const {
+      logPriority, // Probe log priority, enables Model to do more integrated logging
+
+      drawMode = GL.TRIANGLES,
+      vertexCount,
+      offset = 0,
+      start,
+      end,
+      isIndexed = false,
+      indexType = GL.UNSIGNED_SHORT,
+      instanceCount = 0,
+      isInstanced = instanceCount > 0,
+
+      vertexArray = null,
+      transformFeedback,
+      framebuffer,
+
+      // Deprecated
+      uniforms,
+      samplers
+    } = options;
+
+    let {parameters = {}} = options;
+
     if (uniforms || samplers) {
       // DEPRECATED: v7.0 (deprecated earlier but warning not properly implemented)
       log.deprecated('Program.draw({uniforms})', 'Program.setUniforms(uniforms)')();
@@ -216,12 +242,15 @@ export default class Program extends Resource {
 
           if (textureUpdate) {
             // eslint-disable-next-line max-depth
+            // @ts-expect-error
             if (uniformSetter.textureIndex === undefined) {
+              // @ts-expect-error
               uniformSetter.textureIndex = this._textureIndexCounter++;
             }
 
             // Bind texture to index
             const texture = value;
+            // @ts-expect-error
             const {textureIndex} = uniformSetter;
 
             texture.bind(textureIndex);
@@ -229,6 +258,7 @@ export default class Program extends Resource {
 
             this._textureUniforms[uniformName] = texture;
           } else {
+            // @ts-expect-error
             value = uniformSetter.textureIndex;
           }
         } else if (this._textureUniforms[uniformName]) {
@@ -267,6 +297,7 @@ export default class Program extends Resource {
   // Note: This is currently done before every draw call
   _bindTextures() {
     for (const uniformName in this._textureUniforms) {
+      // @ts-expect-error
       const textureIndex = this._uniformSetters[uniformName].textureIndex;
       this._textureUniforms[uniformName].bind(textureIndex);
     }
@@ -290,11 +321,11 @@ export default class Program extends Resource {
       const type = this.gl.getShaderParameter(this.handle, GL.SHADER_TYPE);
       switch (type) {
         case GL.VERTEX_SHADER:
-          // @ts-ignore
+          // @ts-expect-error
           opts.vs = new VertexShader({handle: shaderHandle});
           break;
         case GL.FRAGMENT_SHADER:
-          // @ts-ignore
+          // @ts-expect-error
           opts.fs = new FragmentShader({handle: shaderHandle});
           break;
         default:
@@ -318,7 +349,8 @@ export default class Program extends Resource {
 
   // Generate a default name for the program based on names of the shaders
   _getName() {
-    let programName = this.vs.getName() || this.fs.getName();
+    // let programName = this.vs.getName() || this.fs.getName();
+    let programName = this.vs.id || this.fs.id;
     programName = programName.replace(/shader/i, '');
     programName = programName ? `${programName}-program` : 'program';
     return programName;
@@ -333,7 +365,7 @@ export default class Program extends Resource {
     log.timeEnd(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this._getName()}`)();
 
     // Avoid checking program linking error in production
-    // @ts-ignore
+    // @ts-expect-error
     if (gl.debug || log.level > 0) {
       const linked = gl.getProgramParameter(this.handle, gl.LINK_STATUS);
       if (!linked) {
@@ -358,10 +390,12 @@ export default class Program extends Resource {
       const info = this.gl.getActiveUniform(this.handle, i);
       const {name} = parseUniformName(info.name);
       let location = gl.getUniformLocation(this.handle, name);
+      // @ts-expect-error
       this._uniformSetters[name] = getUniformSetter(gl, location, info);
       if (info.size > 1) {
         for (let l = 0; l < info.size; l++) {
           location = gl.getUniformLocation(this.handle, `${name}[${l}]`);
+          // @ts-expect-error
           this._uniformSetters[`${name}[${l}]`] = getUniformSetter(gl, location, info);
         }
       }

package/src/classes/{query.js → query.ts}

@@ -1,8 +1,8 @@
 // WebGL2 Query (also handles disjoint timer extensions)
-import Resource from './resource';
-import {FEATURES, hasFeatures} from '../features';
-import {isWebGL2} from '@luma.gl/gltools';
-import {assert} from '../utils/assert';
+import {assert} from '@luma.gl/api';
+import WebGLDevice from '../adapter/webgl-device';
+import {isWebGL2} from '../context/context/webgl-checks';
+import WebGLResource, {ResourceProps} from './webgl-resource';
 
 const GL_QUERY_RESULT = 0x8866; // Returns a GLuint containing the query result.
 const GL_QUERY_RESULT_AVAILABLE = 0x8867; // whether query result is available.
@@ -14,17 +14,24 @@ const GL_TRANSFORM_FEEDBACK_PRIMITIVES_WRITTEN = 0x8c88; // #primitives written
 const GL_ANY_SAMPLES_PASSED = 0x8c2f; // Occlusion query (if drawing passed depth test)
 const GL_ANY_SAMPLES_PASSED_CONSERVATIVE = 0x8d6a; // Occlusion query less accurate/faster version
 
-export default class Query extends Resource {
+export type QueryProps = ResourceProps & {
+};
+
+/**
+ * Asynchronous queries for different kinds of information
+ */
+export default class Query extends WebGLResource<QueryProps> {
   // Returns true if Query is supported by the WebGL implementation
   // Can also check whether timestamp queries are available.
-  static isSupported(gl, opts = []) {
+  static isSupported(gl: WebGLRenderingContext, options: string[] = []): boolean {
     const webgl2 = isWebGL2(gl);
 
     // Initial value
-    const hasTimerQuery = hasFeatures(gl, FEATURES.TIMER_QUERY);
+    const webglDevice = WebGLDevice.fromContext(gl);
+    const hasTimerQuery = webglDevice.features.has('webgl-timer-query');
     let supported = webgl2 || hasTimerQuery;
 
-    for (const key of opts) {
+    for (const key of options) {
       switch (key) {
         case 'queries':
           supported = supported && webgl2;
@@ -40,31 +47,30 @@ export default class Query extends Resource {
     return supported;
   }
 
-  // Create a query class
-  constructor(gl, opts = {}) {
-    super(gl, opts);
-
-    this.target = null;
-    this._queryPending = false;
-    this._pollingPromise = null;
+  target = null;
+  _queryPending = false;
+  _pollingPromise = null;
 
+  // Create a query class
+  constructor(gl: WebGLRenderingContext, opts: QueryProps = {}) {
+    super(WebGLDevice.attach(gl), opts, {} as any);
     Object.seal(this);
   }
 
   // Shortcut for timer query (dependent on extension in both WebGL1 and 2)
   // Measures GPU time delta between this call and a matching `end` call in the
   // GPU instruction stream.
-  beginTimeElapsedQuery() {
+  beginTimeElapsedQuery(): this {
     return this.begin(GL_TIME_ELAPSED_EXT);
   }
 
   // Shortcut for occlusion queries
-  beginOcclusionQuery({conservative = false} = {}) {
-    return this.begin(conservative ? GL_ANY_SAMPLES_PASSED_CONSERVATIVE : GL_ANY_SAMPLES_PASSED);
+  beginOcclusionQuery(options?: {conservative?: boolean}): this {
+    return this.begin(options?.conservative ? GL_ANY_SAMPLES_PASSED_CONSERVATIVE : GL_ANY_SAMPLES_PASSED);
   }
 
   // Shortcut for transformFeedbackQuery
-  beginTransformFeedbackQuery() {
+  beginTransformFeedbackQuery(): this {
     return this.begin(GL_TRANSFORM_FEEDBACK_PRIMITIVES_WRITTEN);
   }
 
@@ -73,7 +79,7 @@ export default class Query extends Resource {
   // calling `begin()` on another query. While there can be multiple
   // outstanding queries representing disjoint `begin()`/`end()` intervals.
   // It is not possible to interleave or overlap `begin` and `end` calls.
-  begin(target) {
+  begin(target: number): this {
     // Don't start a new query if one is already active.
     if (this._queryPending) {
       return this;
@@ -86,7 +92,7 @@ export default class Query extends Resource {
   }
 
   // ends the current query
-  end() {
+  end(): this {
     // Can't end a new query if the last one hasn't been resolved.
     if (this._queryPending) {
       return this;
@@ -101,7 +107,7 @@ export default class Query extends Resource {
   }
 
   // Returns true if the query result is available
-  isResultAvailable() {
+  isResultAvailable(): boolean {
     if (!this._queryPending) {
       return false;
     }
@@ -114,12 +120,12 @@ export default class Query extends Resource {
   }
 
   // Timing query is disjoint, i.e. results are invalid
-  isTimerDisjoint() {
+  isTimerDisjoint(): boolean {
     return this.gl2.getParameter(GL_GPU_DISJOINT_EXT);
   }
 
   // Returns query result.
-  getResult() {
+  getResult(): any {
     return this.gl2.getQueryParameter(this.handle, GL_QUERY_RESULT);
   }
 
@@ -129,7 +135,7 @@ export default class Query extends Resource {
   }
 
   // Polls the query
-  createPoll(limit = Number.POSITIVE_INFINITY) {
+  createPoll(limit: number = Number.POSITIVE_INFINITY): Promise<any> {
     if (this._pollingPromise) {
       return this._pollingPromise;
     }

package/src/classes/{renderbuffer-formats.js → renderbuffer-formats.ts}

@@ -1,14 +1,40 @@
 import GL from '@luma.gl/constants';
+import {isWebGL2} from '../context/context/webgl-checks';
+
+export function isRenderbufferFormatSupported(gl: WebGLRenderingContext, format: GL): boolean {
+  const info = RENDERBUFFER_FORMATS[format];
+  // Unknown format
+  if (!info) {
+    return false;
+  }
+  if (info.ext) {
+    return Boolean(gl.getExtension(info.ext));
+  }
+  if (info.gl2) {
+    return isWebGL2(gl);
+  }
+  return true;
+}
+
+export function getRenderbufferFormatBytesPerPixel(format: GL): number {
+  return RENDERBUFFER_FORMATS[format].bpp;
+}
 
 // Define local extension strings to optimize minification
-// const SRGB = 'EXT_sRGB';
-// const EXT_FLOAT_WEBGL1 = 'WEBGL_color_buffer_float';
 const EXT_FLOAT_WEBGL2 = 'EXT_color_buffer_float';
-// const EXT_HALF_FLOAT_WEBGL1 = 'EXT_color_buffer_half_float';
 
-// NOTE(Tarek): bpp === "bytes per pixel", used for
-// memory usage calculations.
-export default {
+/**
+ * @param bpp "bytes per pixel", used for memory usage calculations.
+ * @param gl2 requires WebGL2
+ * @param ext requires extension
+ */
+type RenderbufferFormat = {
+  bpp: number;
+  gl2?: boolean;
+  ext?: string;
+};
+
+const RENDERBUFFER_FORMATS: Record<string, RenderbufferFormat> = {
   [GL.DEPTH_COMPONENT16]: {bpp: 2}, // 16 depth bits.
   [GL.DEPTH_COMPONENT24]: {gl2: true, bpp: 3},
   [GL.DEPTH_COMPONENT32F]: {gl2: true, bpp: 4},
@@ -52,13 +78,15 @@ export default {
   [GL.RGBA32UI]: {gl2: true, bpp: 16},
 
   // When using a WebGL 2 context and the EXT_color_buffer_float WebGL2 extension
-  [GL.R16F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 2},
-  [GL.RG16F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 4},
-  [GL.RGBA16F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 8},
-  [GL.R32F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 4},
-  [GL.RG32F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 8},
+  [GL.R16F]: {ext: EXT_FLOAT_WEBGL2, bpp: 2},
+  [GL.RG16F]: {ext: EXT_FLOAT_WEBGL2, bpp: 4},
+  [GL.RGBA16F]: {ext: EXT_FLOAT_WEBGL2, bpp: 8},
+  [GL.R32F]: {ext: EXT_FLOAT_WEBGL2, bpp: 4},
+  [GL.RG32F]: {ext: EXT_FLOAT_WEBGL2, bpp: 8},
   // TODO - can't get WEBGL_color_buffer_float to work on renderbuffers
-  [GL.RGBA32F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 16},
-  // [GL.RGBA32F]: {gl2: EXT_FLOAT_WEBGL2, gl1: EXT_FLOAT_WEBGL1},
-  [GL.R11F_G11F_B10F]: {gl2: EXT_FLOAT_WEBGL2, bpp: 4}
+  [GL.RGBA32F]: {ext: EXT_FLOAT_WEBGL2, bpp: 16},
+  // [GL.RGBA32F]: {ext: EXT_FLOAT_WEBGL2, gl1: EXT_FLOAT_WEBGL1},
+  [GL.R11F_G11F_B10F]: {ext: EXT_FLOAT_WEBGL2, bpp: 4}
 };
+
+export default RENDERBUFFER_FORMATS;