luma v9.0.0 alpha.5 (#7451)

docs/upgrade-guide.md

@@ -1,5 +1,11 @@
 # Upgrade Guide
 
+## Upgrading to v9.0
+
+### Custom Layers
+
+- drawModes `GL.TRIANGLE_FAN` and `GL.LINE_LOOP` are no longer supported when creating geometries.
+
 ## Upgrading from deck.gl v8.7 to v8.8
 
 #### Breaking changes

examples/layer-browser/package.json

@@ -9,8 +9,8 @@
   "dependencies": {
     "@loaders.gl/ply": "^3.2.10",
     "@loaders.gl/gltf": "^3.2.10",
-    "@luma.gl/experimental": "^8.5.2",
-    "@luma.gl/debug": "^8.5.2",
+    "@luma.gl/experimental": "9.0.0-alpha.8",
+    "@luma.gl/debug": "9.0.0-alpha.8",
     "colorbrewer": "^1.0.0",
     "d3-request": "^1.0.6",
     "d3-scale": "^3.1.0",

examples/playground/package.json

@@ -14,7 +14,7 @@
     "@loaders.gl/csv": "^3.2.10",
     "@loaders.gl/draco": "^3.2.10",
     "@loaders.gl/gltf": "^3.2.10",
-    "@luma.gl/constants": "^8.5.12",
+    "@luma.gl/constants": "9.0.0-alpha.8",
     "brace": "^0.11.1",
     "deck.gl": "^8.8.0",
     "react": "~16.9.0",

modules/aggregation-layers/package.json

@@ -30,15 +30,15 @@
     "prepublishOnly": "npm run build-bundle && npm run build-bundle -- --env=dev"
   },
   "dependencies": {
-    "@luma.gl/constants": "^8.5.16",
-    "@luma.gl/shadertools": "^8.5.16",
+    "@luma.gl/constants": "9.0.0-alpha.8",
+    "@luma.gl/shadertools": "9.0.0-alpha.8",
     "@math.gl/web-mercator": "^3.6.2",
     "d3-hexbin": "^0.2.1"
   },
   "peerDependencies": {
     "@deck.gl/core": "^8.0.0",
     "@deck.gl/layers": "^8.0.0",
-    "@luma.gl/core": "^8.0.0"
+    "@luma.gl/core": "9.0.0-alpha.8"
   },
   "gitHead": "13ace64fc2cee08c133afc882fc307253489a4e4"
 }

modules/aggregation-layers/src/grid-aggregation-layer.ts

@@ -196,7 +196,7 @@ export default abstract class GridAggregationLayer<
   _uploadAggregationResults(): void {
     const {numCol, numRow} = this.state;
     const {data} = this.state.layerData;
-    const {aggregatedBins, minValue, maxValue, totalCount} = this.state.sortedBins!;
+    const {aggregatedBins, minValue, maxValue, totalCount} = this.state.sortedBins;
 
     const ELEMENTCOUNT = 4;
     const aggregationSize = numCol * numRow * ELEMENTCOUNT;

modules/aggregation-layers/src/heatmap-layer/heatmap-layer.ts

@@ -549,7 +549,7 @@ export default class HeatmapLayer<DataT = any, ExtraPropsT = {}> extends Aggrega
     triPositionBuffer.subData(packVertices(viewportCorners, 3));
 
     const textureBounds = viewportCorners.map(p =>
-      getTextureCoordinates(viewport.projectPosition(p), normalizedCommonBounds!)
+      getTextureCoordinates(viewport.projectPosition(p), normalizedCommonBounds)
     );
     triTexCoordBuffer.subData(packVertices(textureBounds, 2));
   }

modules/carto/package.json

@@ -36,7 +36,7 @@
     "@loaders.gl/loader-utils": "^3.2.10",
     "@loaders.gl/mvt": "^3.2.10",
     "@loaders.gl/tiles": "^3.2.10",
-    "@luma.gl/constants": "^8.5.16",
+    "@luma.gl/constants": "9.0.0-alpha.8",
     "@math.gl/web-mercator": "^3.6.2",
     "cartocolor": "^4.0.2",
     "d3-array": "^3.2.0",

modules/core/package.json

@@ -37,8 +37,8 @@
   "dependencies": {
     "@loaders.gl/core": "^3.2.10",
     "@loaders.gl/images": "^3.2.10",
-    "@luma.gl/constants": "^8.5.16",
-    "@luma.gl/core": "^8.5.16",
+    "@luma.gl/constants": "9.0.0-alpha.8",
+    "@luma.gl/core": "9.0.0-alpha.8",
     "@math.gl/core": "^3.6.2",
     "@math.gl/sun": "^3.6.2",
     "@math.gl/web-mercator": "^3.6.2",
@@ -47,7 +47,8 @@
     "@probe.gl/stats": "^3.5.0",
     "gl-matrix": "^3.0.0",
     "math.gl": "^3.6.2",
-    "mjolnir.js": "^2.7.0"
+    "mjolnir.js": "^2.7.0",
+    "@types/offscreencanvas": "^2019.6.4"
   },
   "gitHead": "13ace64fc2cee08c133afc882fc307253489a4e4"
 }

modules/core/src/controllers/controller.ts

@@ -126,7 +126,7 @@ export default abstract class Controller<ControllerState extends IViewState<Cont
   abstract get ControllerState(): ConstructorOf<ControllerState>;
   abstract get transition(): TransitionProps;
 
-  // @ts-expect-error (2564) - not assigned in the constructor
+  // ts-expect-error (2564) - not assigned in the constructor
   protected props: ControllerProps;
   protected state: Record<string, any> = {};
 

modules/core/src/controllers/map-controller.ts

@@ -293,7 +293,7 @@ export class MapState extends ViewState<MapState, MapStateProps, MapStateInterna
     }
 
     const {maxZoom, minZoom} = this.getViewportProps();
-    let zoom = (startZoom as number) + Math.log2(scale);
+    let zoom = startZoom + Math.log2(scale);
     zoom = clamp(zoom, minZoom, maxZoom);
 
     const zoomedViewport = this.makeViewport({...this.getViewportProps(), zoom});

modules/core/src/controllers/transition-manager.ts

@@ -152,10 +152,7 @@ export default class TransitionManager<ControllerState extends IViewState<Contro
     }
     if (this._isTransitionEnabled(nextProps)) {
       // Ignore if none of the viewport props changed.
-      return (nextProps.transitionInterpolator as TransitionInterpolator).arePropsEqual(
-        currentProps,
-        nextProps
-      );
+      return nextProps.transitionInterpolator.arePropsEqual(currentProps, nextProps);
     }
     return true;
   }
@@ -165,7 +162,7 @@ export default class TransitionManager<ControllerState extends IViewState<Contro
     const endViewStateProps = this.getControllerState(endProps).shortestPathFrom(startViewstate);
 
     // update transitionDuration for 'auto' mode
-    const transitionInterpolator = endProps.transitionInterpolator as TransitionInterpolator;
+    const transitionInterpolator = endProps.transitionInterpolator;
     const duration = transitionInterpolator.getDuration
       ? transitionInterpolator.getDuration(startProps, endProps)
       : (endProps.transitionDuration as number);
@@ -231,7 +228,7 @@ export default class TransitionManager<ControllerState extends IViewState<Contro
 
     this.onViewStateChange({
       viewState: this.propsInTransition,
-      oldViewState: this.props as TransitionProps
+      oldViewState: this.props
     });
   };
 }

modules/core/src/effects/lighting/lighting-effect.ts

@@ -1,4 +1,5 @@
-import {Texture2D, ProgramManager} from '@luma.gl/core';
+import {ProgramManager} from '@luma.gl/core';
+import {Texture2D} from '@luma.gl/gltools';
 import {AmbientLight} from './ambient-light';
 import {DirectionalLight} from './directional-light';
 import {PointLight} from './point-light';
@@ -32,14 +33,14 @@ export default class LightingEffect implements Effect {
   props!: LightingEffectProps;
   shadowColor: number[] = DEFAULT_SHADOW_COLOR;
 
-  private shadow!: boolean;
-  private ambientLight!: AmbientLight | null;
-  private directionalLights!: DirectionalLight[];
-  private pointLights!: PointLight[];
+  private shadow: boolean = false;
+  private ambientLight?: AmbientLight | null = null;
+  private directionalLights: DirectionalLight[] = [];
+  private pointLights: PointLight[] = [];
   private shadowPasses: ShadowPass[] = [];
   private shadowMaps: Texture2D[] = [];
-  private dummyShadowMap: Texture2D | null = null;
-  private programManager?: ProgramManager;
+  private dummyShadowMap?: Texture2D;
+  private pipelineFactory?: ProgramManager;
   private shadowMatrices?: Matrix4[];
 
   constructor(props: LightingEffectProps = {}) {
@@ -79,6 +80,9 @@ export default class LightingEffect implements Effect {
     gl: WebGLRenderingContext,
     {layers, layerFilter, viewports, onViewportActive, views}: PreRenderOptions
   ) {
+    // @ts-expect-error
+    const device = gl.device;
+
     if (!this.shadow) return;
 
     // create light matrix every frame to make sure always updated from light source
@@ -87,11 +91,10 @@ export default class LightingEffect implements Effect {
     if (this.shadowPasses.length === 0) {
       this._createShadowPasses(gl);
     }
-    if (!this.programManager) {
-      // TODO - support multiple contexts
-      this.programManager = ProgramManager.getDefaultProgramManager(gl);
+    if (!this.pipelineFactory) {
+      this.pipelineFactory = ProgramManager.getDefaultProgramManager(device);
       if (shadow) {
-        this.programManager.addDefaultModule(shadow);
+        this.pipelineFactory.addDefaultModule(shadow);
       }
     }
 
@@ -122,7 +125,7 @@ export default class LightingEffect implements Effect {
   getModuleParameters(layer: Layer) {
     const parameters: {
       lightSources?: {
-        ambientLight: AmbientLight | null;
+        ambientLight?: AmbientLight;
         directionalLights: DirectionalLight[];
         pointLights: PointLight[];
       };
@@ -161,12 +164,12 @@ export default class LightingEffect implements Effect {
 
     if (this.dummyShadowMap) {
       this.dummyShadowMap.delete();
-      this.dummyShadowMap = null;
+      this.dummyShadowMap = undefined;
     }
 
-    if (this.shadow && this.programManager) {
-      this.programManager.removeDefaultModule(shadow);
-      this.programManager = null;
+    if (this.shadow && this.pipelineFactory) {
+      this.pipelineFactory.removeDefaultModule(shadow);
+      this.pipelineFactory = undefined;
     }
   }
 

modules/core/src/effects/post-process-effect.ts

@@ -2,7 +2,7 @@ import ScreenPass from '../passes/screen-pass';
 import {normalizeShaderModule} from '@luma.gl/core';
 
 import type {Effect, PostRenderOptions} from '../lib/effect';
-import type {Framebuffer} from '@luma.gl/webgl';
+import type {Framebuffer} from '@luma.gl/gltools';
 import type {ShaderModule} from '../types/types';
 
 export default class PostProcessEffect implements Effect {
@@ -116,7 +116,7 @@ void main() {
 }
 `;
 
-function getFragmentShaderForRenderPass(module, pass = module) {
+function getFragmentShaderForRenderPass(module, pass = module): string {
   if (pass.filter) {
     const func = typeof pass.filter === 'string' ? pass.filter : `${module.name}_filterColor`;
     return FILTER_FS_TEMPLATE(func);
@@ -128,5 +128,5 @@ function getFragmentShaderForRenderPass(module, pass = module) {
   }
 
   // console.error(`${module.name} no fragment shader generated`);
-  return null;
+  return undefined;
 }

modules/core/src/lib/attribute/attribute-manager.ts

@@ -27,7 +27,7 @@ import {NumericArray} from '../../types/types';
 
 import AttributeTransitionManager from './attribute-transition-manager';
 
-import type {Stat} from 'probe.gl';
+import type {Stats} from 'probe.gl';
 import type {Timeline} from '@luma.gl/engine';
 
 const TRACE_INVALIDATE = 'attributeManager.invalidate';
@@ -68,7 +68,7 @@ export default class AttributeManager {
   needsRedraw: string | boolean;
   userData: any;
 
-  private stats?: Stat;
+  private stats?: Stats;
   private attributeTransitionManager: AttributeTransitionManager;
 
   constructor(
@@ -79,7 +79,7 @@ export default class AttributeManager {
       timeline
     }: {
       id?: string;
-      stats?: Stat;
+      stats?: Stats;
       timeline?: Timeline;
     } = {}
   ) {
@@ -390,7 +390,7 @@ export default class AttributeManager {
     if (attribute.constant) {
       // The attribute is flagged as constant outside of an update cycle
       // Skip allocation and updater call
-      attribute.setConstantValue(attribute.value as NumericArray);
+      attribute.setConstantValue(attribute.value);
       return;
     }
 

modules/core/src/lib/attribute/attribute-transition-utils.ts

@@ -2,7 +2,7 @@ import {padArray} from '../../utils/array-utils';
 import {NumericArray} from '../../types/types';
 import Attribute from './attribute';
 import type {BufferAccessor} from './data-column';
-import type {Buffer} from '@luma.gl/webgl';
+import type {Buffer} from '@luma.gl/core';
 
 export interface TransitionSettings {
   type: string;
@@ -87,7 +87,7 @@ export function getSourceBufferAttribute(
   // constant
   // don't pass normalized here because the `value` from a normalized attribute is
   // already normalized
-  return attribute.value as NumericArray;
+  return attribute.value;
 }
 
 export function getAttributeTypeFromSize(size: number): string {
@@ -106,13 +106,13 @@ export function getAttributeTypeFromSize(size: number): string {
 }
 
 export function cycleBuffers(buffers: Buffer[]): void {
-  buffers.push(buffers.shift() as Buffer);
+  buffers.push(buffers.shift());
 }
 
 export function getAttributeBufferLength(attribute: Attribute, numInstances: number): number {
   const {doublePrecision, settings, value, size} = attribute;
   const multiplier = doublePrecision && value instanceof Float64Array ? 2 : 1;
-  return (settings.noAlloc ? (value as NumericArray).length : numInstances * size) * multiplier;
+  return (settings.noAlloc ? value.length : numInstances * size) * multiplier;
 }
 
 // This helper is used when transitioning attributes from a set of values in one buffer layout
@@ -155,7 +155,7 @@ export function padBuffer({
 
   const toData = isConstant
     ? attribute.value
-    : (attribute.getBuffer() as Buffer).getData({srcByteOffset: byteOffset});
+    : attribute.getBuffer().getData({srcByteOffset: byteOffset});
   if (attribute.settings.normalized && !isConstant) {
     const getter = getData;
     getData = (value, chunk) => attribute.normalizeConstant(getter(value, chunk));

modules/core/src/lib/attribute/attribute.ts

@@ -6,7 +6,7 @@ import {createIterable, getAccessorFromBuffer} from '../../utils/iterable-utils'
 import {fillArray} from '../../utils/flatten';
 import * as range from '../../utils/range';
 import {normalizeTransitionSettings, TransitionSettings} from './attribute-transition-utils';
-import type {Buffer} from '@luma.gl/webgl';
+import type {Buffer} from '@luma.gl/gltools';
 
 import type {NumericArray, TypedArray} from '../../types/types';
 
@@ -309,7 +309,7 @@ export default class Attribute extends DataColumn<AttributeOptions, AttributeInt
         size: binaryValue.size || this.size,
         stride: binaryValue.stride,
         offset: binaryValue.offset,
-        startIndices: startIndices as NumericArray,
+        startIndices,
         nested: needsNormalize
       });
       // Fall through to auto updater

modules/core/src/lib/attribute/data-column.ts

@@ -7,7 +7,7 @@ import typedArrayManager from '../../utils/typed-array-manager';
 import {toDoublePrecisionArray} from '../../utils/math-utils';
 import log from '../../utils/log';
 
-import type {Buffer as LumaBuffer} from '@luma.gl/webgl';
+import type {Buffer as LumaBuffer} from '@luma.gl/gltools';
 import type {TypedArray, NumericArray, TypedArrayConstructor} from '../../types/types';
 
 export type BufferAccessor = {
@@ -199,7 +199,7 @@ export default class DataColumn<Options, State> implements IShaderAttribute {
         id: this.id,
         target: isIndexed ? GL.ELEMENT_ARRAY_BUFFER : GL.ARRAY_BUFFER,
         accessor: {type}
-      }) as LumaBuffer;
+      });
     }
     return this._buffer;
   }
@@ -265,7 +265,7 @@ export default class DataColumn<Options, State> implements IShaderAttribute {
     if (this.state.constant) {
       return this.value;
     }
-    return [this.getBuffer() as LumaBuffer, this.getAccessor() as BufferAccessor];
+    return [this.getBuffer(), this.getAccessor() as BufferAccessor];
   }
 
   getAccessor(): DataColumnSettings<Options> {
@@ -324,7 +324,7 @@ export default class DataColumn<Options, State> implements IShaderAttribute {
     if (ArrayBuffer.isView(data)) {
       opts = {value: data};
     } else if (data instanceof Buffer) {
-      opts = {buffer: data as LumaBuffer};
+      opts = {buffer: data};
     } else {
       opts = data;
     }
@@ -335,7 +335,7 @@ export default class DataColumn<Options, State> implements IShaderAttribute {
 
     if (opts.constant) {
       // set constant
-      let value = opts.value as NumericArray;
+      let value = opts.value;
       value = this._normalizeValue(value, [], 0);
       if (this.settings.normalized) {
         value = this.normalizeConstant(value);