@luma.gl/engine 9.0.0-alpha.5 → 9.0.0-alpha.51

package/src/animation-loop/render-loop.ts

@@ -0,0 +1,23 @@
+import type {AnimationProps} from './animation-props';
+
+/**
+ * Minimal class that represents a "componentized" rendering life cycle
+ * (resource construction, repeated rendering, resource destruction)
+ * 
+ * @note A motivation for this class compared to the raw animation loop is 
+ * that it simplifies TypeScript code by allowing resources to be typed unconditionally 
+ * since they are allocated in the constructor rather than in onInitialized
+ * 
+ * @note Introduced in luma.gl v9
+ * 
+ * @example AnimationLoopTemplate is intended to be subclassed, 
+ * but the subclass should not be instantiated directly. Instead the subclass
+ * (i.e. the constructor of the subclass) should be used 
+ * as an argument to create an AnimationLoop.
+ */
+export abstract class AnimationLoopTemplate {
+  constructor(animationProps?: AnimationProps) {}
+  async onInitialize(animationProps: AnimationProps): Promise<unknown> { return null; }
+  abstract onRender(animationProps: AnimationProps): unknown;
+  abstract onFinalize(animationProps: AnimationProps): void;
+}

package/src/geometries/cone-geometry.ts

@@ -1,4 +1,4 @@
-import {uid} from '@luma.gl/api';
+import {uid} from '@luma.gl/core';
 import {TruncatedConeGeometry} from './truncated-cone-geometry';
 
 export type ConeGeometryProps = {

package/src/geometries/cube-geometry.ts

@@ -1,11 +1,11 @@
-import {uid} from '@luma.gl/api';
-import Geometry from '../geometry/geometry';
+import {uid} from '@luma.gl/core';
+import {Geometry} from '../geometry/geometry';
 // import type {GeometryType} from '../geometry/geometry-type';
 
 export type CubeGeometryProps = {
   id?: string;
   indices?: boolean;
-  attributes?;
+  attributes?: any;
 };
 
 export class CubeGeometry extends Geometry {
@@ -14,11 +14,14 @@ export class CubeGeometry extends Geometry {
     super(indices ? {
       ...props,
       id,
+      topology: 'triangle-list',
       indices: {size: 1, value: CUBE_INDICES},
       attributes: {...ATTRIBUTES, ...props.attributes}
     } : {
       ...props,
       id,
+      topology: 'triangle-list',
+      indices: undefined,
       attributes: {...NON_INDEXED_ATTRIBUTES, ...props.attributes}
     });
   }

package/src/geometries/cylinder-geometry.ts

@@ -1,10 +1,10 @@
-import {uid} from '@luma.gl/api';
+import {uid} from '@luma.gl/core';
 import {TruncatedConeGeometry} from './truncated-cone-geometry';
 
 export type CylinderGeometryProps = {
   id?: string;
   radius?: number;
-  attributes?
+  attributes?: any;
 };
 
 export class CylinderGeometry extends TruncatedConeGeometry {

package/src/geometries/ico-sphere-geometry.ts

@@ -1,6 +1,6 @@
-import {uid} from '@luma.gl/api';
+import {uid} from '@luma.gl/core';
 import {Vector3} from '@math.gl/core';
-import Geometry from '../geometry/geometry';
+import {Geometry} from '../geometry/geometry';
 
 /* eslint-disable comma-spacing, max-statements, complexity */
 
@@ -11,7 +11,7 @@ export type IcoSphereGeometryProps = {
   id?: string;
   radius?: number;
   iterations?: number;
-  attributes?
+  attributes?: any
 };
 
 export class IcoSphereGeometry extends Geometry {
@@ -21,6 +21,7 @@ export class IcoSphereGeometry extends Geometry {
     super({
       ...props,
       id,
+      topology: 'triangle-list',
       indices,
       attributes: {...attributes, ...props.attributes}
     });
@@ -40,9 +41,9 @@ function tesselateIcosaHedron(props: IcoSphereGeometryProps) {
   indices.push();
 
   const getMiddlePoint = (() => {
-    const pointMemo = {};
+    const pointMemo: Record<string, number> = {};
 
-    return (i1, i2) => {
+    return (i1: number, i2: number) => {
       i1 *= 3;
       i2 *= 3;
       const mini = i1 < i2 ? i1 : i2;
@@ -75,7 +76,7 @@ function tesselateIcosaHedron(props: IcoSphereGeometryProps) {
   })();
 
   for (let i = 0; i < iterations; i++) {
-    const indices2 = [];
+    const indices2: number[] = [];
     for (let j = 0; j < indices.length; j += 3) {
       const a = getMiddlePoint(indices[j + 0], indices[j + 1]);
       const b = getMiddlePoint(indices[j + 1], indices[j + 2]);

package/src/geometries/plane-geometry.ts

@@ -1,11 +1,11 @@
-import {uid} from '@luma.gl/api';
-import Geometry from '../geometry/geometry';
+import {uid} from '@luma.gl/core';
+import {Geometry} from '../geometry/geometry';
 import {unpackIndexedGeometry} from '../geometry/geometry-utils';
 
 export type PlaneGeometryProps = {
   id?: string;
   radius?: number;
-  attributes?
+  attributes?: any
 };
 
 // Primitives inspired by TDL http://code.google.com/p/webglsamples/,
@@ -19,6 +19,7 @@ export class PlaneGeometry extends Geometry {
     super({
       ...props,
       id,
+      topology: 'triangle-list',
       indices,
       attributes: {...attributes, ...props.attributes}
     });
@@ -26,7 +27,7 @@ export class PlaneGeometry extends Geometry {
 }
 
 /* eslint-disable complexity, max-statements */
-function tesselatePlane(props) {
+function tesselatePlane(props: any) {
   const {type = 'x,y', offset = 0, flipCull = false, unpack = false} = props;
 
   const coords = type.split(',');

package/src/geometries/sphere-geometry.ts

@@ -1,12 +1,12 @@
-import {uid} from '@luma.gl/api';
-import Geometry from '../geometry/geometry';
+import {uid} from '@luma.gl/core';
+import {Geometry} from '../geometry/geometry';
 
 export type SphereGeometryProps = {
   id?: string;
   radius?: number;
   nlat?: number;
   nlong?: number;
-  attributes?
+  attributes?: any
 };
 
 // Primitives inspired by TDL http://code.google.com/p/webglsamples/,
@@ -19,6 +19,7 @@ export class SphereGeometry extends Geometry {
     super({
       ...props,
       id,
+      topology: 'triangle-list',
       indices,
       attributes: {...attributes, ...props.attributes}
     });

package/src/geometries/truncated-cone-geometry.ts

@@ -1,6 +1,5 @@
-import {uid} from '@luma.gl/api';
-import Geometry from '../geometry/geometry';
-import {GeometryTable} from '../geometry/geometry-table';
+import {uid} from '@luma.gl/core';
+import {Geometry} from '../geometry/geometry';
 
 const INDEX_OFFSETS = {
   x: [2, 0, 1],
@@ -24,22 +23,14 @@ export type TruncatedConeGeometryProps = {
  * copyright 2011 Google Inc. new BSD License
  * (http://www.opensource.org/licenses/bsd-license.php).
  */
-export function makeTruncatedConeGeometry(props?: TruncatedConeGeometryProps): GeometryTable {
-  const {indices, attributes} = tesselateTruncatedCone(props);
-  return {
-    length: indices.length,
-    indices,
-    attributes
-  };
-}
-
 export class TruncatedConeGeometry extends Geometry {
-  constructor(props: TruncatedConeGeometryProps & {id?: string; attributes?} = {}) {
+  constructor(props: TruncatedConeGeometryProps & {id?: string; attributes?: any} = {}) {
     const {id = uid('truncated-code-geometry')} = props;
     const {indices, attributes} = tesselateTruncatedCone(props);
     super({
       ...props,
       id,
+      topology: 'triangle-list',
       indices,
       attributes: {
         POSITION: {size: 3, value: attributes.POSITION},

package/src/geometry/geometry-table.ts

@@ -1,5 +1,5 @@
 // luma.gl, MIT license
-import type {TypedArray, VertexFormat} from '@luma.gl/api';
+import type {TypedArray, VertexFormat} from '@luma.gl/core';
 
 /** Holds one geometry */
 export type GeometryTable = {

package/src/geometry/geometry-utils.ts

@@ -1,13 +1,13 @@
-// import type Geometry from './geometry';
+// import type {Geometry} from './geometry';
 
-export function unpackIndexedGeometry(geometry) {
+export function unpackIndexedGeometry(geometry: any) {
   const {indices, attributes} = geometry;
   if (!indices) {
     return geometry;
   }
 
   const vertexCount = indices.value.length;
-  const unpackedAttributes = {};
+  const unpackedAttributes: Record<string, any> = {};
 
   for (const attributeName in attributes) {
     const attribute = attributes[attributeName];

package/src/geometry/geometry.ts

@@ -1,125 +1,72 @@
 // luma.gl, MIT license
-import type {TypedArray} from '@luma.gl/api';
-import {uid, assert} from '@luma.gl/api';
-import GL from '@luma.gl/constants';
-
-/**
- * Rendering primitives - "topology" specifies how to extract primitives from vertices.
- */
-export type Topology =
-  GL.POINTS |  // draw single points.
-  GL.LINES |  // draw lines. Each vertex connects to the one after it.
-  GL.LINE_LOOP |  // draw lines. Each set of two vertices is treated as a separate line segment.
-  GL.LINE_STRIP |  // draw a connected group of line segments from the first vertex to the last
-  GL.TRIANGLES |  // draw triangles. Each set of three vertices creates a separate triangle.
-  GL.TRIANGLE_STRIP |  // draw a connected group of triangles.
-  GL.TRIANGLE_FAN // draw a connected group of triangles.
-  ;
+import type {PrimitiveTopology, TypedArray} from '@luma.gl/core';
+import {uid, assert} from '@luma.gl/core';
 
 export type GeometryProps = {
   id?: string;
-  attributes?: {},
-  indices?;
-  vertexCount?: number;
   /** Determines how vertices are read from the 'vertex' attributes */
-  topology?: 'point-list' | 'line-list' | 'line-strip' | 'triangle-list' | 'triangle-strip';
-  /** @deprecated */
-  drawMode?: Topology;
+  topology:
+    | 'point-list'
+    | 'line-list'
+    | 'line-strip'
+    | 'line-loop-webgl'
+    | 'triangle-list'
+    | 'triangle-strip'
+    | 'triangle-fan-webgl';
+  /** Auto calculated from attributes if not provided */
+  vertexCount?: number;
+  attributes?: Record<string, GeometryAttribute | TypedArray>;
+  indices?: GeometryAttribute | TypedArray;
 };
 
-type GeometryAttributes = {
-  POSITION: {size: number, value: TypedArray, [key: string]: any},
-  NORMAL: {size: number, value: TypedArray, [key: string]: any},
-  TEXCOORD_0: {size: number, value: TypedArray, [key: string]: any},
-  COLOR_0?: {size: number, value: TypedArray, [key: string]: any},
-  indices?: {size?: number, value: Uint32Array | Uint16Array};
+export type GeometryAttributes = {
+  POSITION: GeometryAttribute;
+  NORMAL: GeometryAttribute;
+  TEXCOORD_0: GeometryAttribute;
+  COLOR_0?: GeometryAttribute;
+  indices?: GeometryAttribute & {size: 1; value: Uint32Array | Uint16Array};
 };
 
-export default class Geometry {
-  /** @deprecated */
-  static DRAW_MODE = {
-    POINTS: GL.POINTS,  // draw single points.
-    LINES: GL.LINES,  // draw lines. Each vertex connects to the one after it.
-    LINE_LOOP: GL.LINE_LOOP,  // draw lines. Each set of two vertices is treated as a separate line segment.
-    LINE_STRIP: GL.LINE_STRIP,  // draw a connected group of line segments from the first vertex to the last
-    TRIANGLES: GL.TRIANGLES,  // draw triangles. Each set of three vertices creates a separate triangle.
-    TRIANGLE_STRIP: GL.TRIANGLE_STRIP,  // draw a connected group of triangles.
-    TRIANGLE_FAN: GL.TRIANGLE_FAN // draw a connected group of triangles.
-  };
+export type GeometryAttribute = {
+  size?: number;
+  value: TypedArray;
+  [key: string]: any;
+};
 
+export class Geometry {
   readonly id: string;
-  userData: Record<string, any> = {};
-
   /** Determines how vertices are read from the 'vertex' attributes */
-  topology?: 'point-list' | 'line-list' | 'line-strip' | 'triangle-list' | 'triangle-strip';
-  /** @deprecated */
-  readonly drawMode: Topology = GL.TRIANGLES;
-
+  readonly topology?: PrimitiveTopology;
   readonly vertexCount: number;
+  readonly indices?: GeometryAttribute;
   readonly attributes: {
-    POSITION: {size: number, value: TypedArray, [key: string]: any},
-    NORMAL: {size: number, value: TypedArray, [key: string]: any},
-    TEXCOORD_0: {size: number, value: TypedArray, [key: string]: any},
-    COLOR_0?: {size: number, value: TypedArray, [key: string]: any},
+    POSITION: GeometryAttribute;
+    NORMAL: GeometryAttribute;
+    TEXCOORD_0: GeometryAttribute;
+    COLOR_0?: GeometryAttribute;
+    [key: string]: GeometryAttribute | undefined;
   };
-  readonly indices?: Uint16Array | Uint32Array;
-
-  constructor(props: GeometryProps = {}) {
-    const {
-      id = uid('geometry'),
-      drawMode = GL.TRIANGLES,
-      attributes = {},
-      indices = null,
-      vertexCount = null
-    } = props;
-
-    this.id = id;
-    this.drawMode = drawMode;
-    this.topology = props.topology || convertToTopology(drawMode);
-
-    this._setAttributes(attributes, indices);
-
-    this.vertexCount = vertexCount || this._calculateVertexCount(this.attributes, this.indices);
-  }
 
-  get mode() {
-    return this.drawMode;
-  }
-
-  getVertexCount(): number {
-    return this.vertexCount;
-  }
+  userData: Record<string, unknown> = {};
 
-  // Return an object with all attributes plus indices added as a field.
-  // getAttributes(): GeometryAttributes {
-  //   return this.indices ? {indices: this.indices, ...this.attributes} : this.attributes;
-  // }
+  constructor(props: GeometryProps) {
+    const {attributes = {}, indices = null, vertexCount = null} = props;
 
-  // PRIVATE
+    this.id = props.id || uid('geometry');
+    this.topology = props.topology;
 
-  _print(attributeName): string {
-    return `Geometry ${this.id} attribute ${attributeName}`;
-  }
-
-  // Attribute
-  // value: typed array
-  // type: indices, vertices, uvs
-  // size: elements per vertex
-  // target: WebGL buffer type (string or constant)
-  _setAttributes(attributes, indices): this {
     if (indices) {
-      // @ts-expect-error
       this.indices = ArrayBuffer.isView(indices) ? {value: indices, size: 1} : indices;
     }
 
     // @ts-expect-error
     this.attributes = {};
 
-    for (const attributeName in attributes) {
-      let attribute = attributes[attributeName];
-
+    for (const [attributeName, attributeValue] of Object.entries(attributes)) {
       // Wrap "unwrapped" arrays and try to autodetect their type
-      attribute = ArrayBuffer.isView(attribute) ? {value: attribute} : attribute;
+      const attribute: GeometryAttribute = ArrayBuffer.isView(attributeValue)
+        ? {value: attributeValue}
+        : attributeValue;
 
       assert(
         ArrayBuffer.isView(attribute.value),
@@ -133,31 +80,59 @@ export default class Geometry {
       // Move indices to separate field
       if (attributeName === 'indices') {
         assert(!this.indices);
-      // @ts-expect-error
-      this.indices = attribute;
+        this.indices = attribute;
       } else {
         this.attributes[attributeName] = attribute;
       }
     }
 
-      // @ts-expect-error
-      if (this.indices && this.indices.isIndexed !== undefined) {
-      // @ts-expect-error
+    if (this.indices && this.indices.isIndexed !== undefined) {
       this.indices = Object.assign({}, this.indices);
-      // @ts-expect-error
       delete this.indices.isIndexed;
     }
 
+    this.vertexCount = vertexCount || this._calculateVertexCount(this.attributes, this.indices);
+  }
+
+  getVertexCount(): number {
+    return this.vertexCount;
+  }
+
+  /** 
+   * Return an object with all attributes plus indices added as a field.
+   * TODO Geometry types are a mess
+   */
+  getAttributes(): GeometryAttributes {
+    return this.indices ? {indices: this.indices, ...this.attributes} : this.attributes;
+  }
+
+  // PRIVATE
+
+  _print(attributeName: string): string {
+    return `Geometry ${this.id} attribute ${attributeName}`;
+  }
+
+  /**
+   * GeometryAttribute
+   * value: typed array
+   * type: indices, vertices, uvs
+   * size: elements per vertex
+   * target: WebGL buffer type (string or constant)
+   * 
+   * @param attributes 
+   * @param indices 
+   * @returns 
+   */
+  _setAttributes(attributes: Record<string, GeometryAttribute>, indices: any): this {
     return this;
   }
 
-  _calculateVertexCount(attributes, indices): number {
+  _calculateVertexCount(attributes: GeometryAttributes, indices: GeometryAttribute): number {
     if (indices) {
       return indices.value.length;
     }
     let vertexCount = Infinity;
-    for (const attributeName in attributes) {
-      const attribute = attributes[attributeName];
+    for (const attribute of Object.values(attributes)) {
       const {value, size, constant} = attribute;
       if (!constant && value && size >= 1) {
         vertexCount = Math.min(vertexCount, value.length / size);
@@ -168,18 +143,3 @@ export default class Geometry {
     return vertexCount;
   }
 }
-
-function convertToTopology(drawMode: GL): 'point-list' | 'line-list' | 'line-strip' | 'triangle-list' | 'triangle-strip' {
-  switch (drawMode) {
-    case GL.POINTS: return 'point-list'; // draw single points.
-    case GL.LINES: return 'line-list'; // draw lines. Each vertex connects to the one after it.
-    case GL.LINE_STRIP: return 'line-strip';  // draw a connected group of line segments from the first vertex to the last
-    case GL.TRIANGLES: return 'triangle-list'; // draw triangles. Each set of three vertices creates a separate triangle.
-    case GL.TRIANGLE_STRIP: return 'triangle-strip'; // draw a connected group of triangles.
-
-    case GL.TRIANGLE_FAN: // draw a connected group of triangles.
-    case GL.LINE_LOOP:  // draw lines. Each set of two vertices is treated as a separate line segment.
-    default:
-      throw new Error(String(drawMode));
-  }
-}

package/src/geometry/gpu-geometry.ts

@@ -0,0 +1,124 @@
+import type {PrimitiveTopology, BufferLayout} from '@luma.gl/core';
+import {Device, Buffer, uid, assert, getVertexFormatFromAttribute} from '@luma.gl/core';
+import type {Geometry} from '../geometry/geometry';
+
+export type GPUGeometryProps = {
+  id?: string;
+  /** Determines how vertices are read from the 'vertex' attributes */
+  topology:
+    | 'point-list'
+    | 'line-list'
+    | 'line-strip'
+    | 'line-loop-webgl'
+    | 'triangle-list'
+    | 'triangle-strip'
+    | 'triangle-fan-webgl';
+  /** Auto calculated from attributes if not provided */
+  vertexCount: number;
+  bufferLayout: BufferLayout[];
+  indices?: Buffer | null;
+  attributes: Record<string, Buffer>;
+};
+
+export class GPUGeometry {
+  readonly id: string;
+  userData: Record<string, unknown> = {};
+
+  /** Determines how vertices are read from the 'vertex' attributes */
+  readonly topology?: PrimitiveTopology;
+  readonly bufferLayout: BufferLayout[] = [];
+
+  readonly vertexCount: number;
+  readonly indices?: Buffer | null;
+  readonly attributes: Record<string, Buffer>;
+
+  constructor(props: GPUGeometryProps) {
+    this.id = props.id || uid('geometry');
+    this.topology = props.topology;
+    this.indices = props.indices || null;
+    this.attributes = props.attributes;
+
+    this.vertexCount = props.vertexCount;
+
+    this.bufferLayout = props.bufferLayout || [];
+
+    if (this.indices) {
+      assert(this.indices.usage === Buffer.INDEX);
+    }
+  }
+
+  destroy(): void {
+    this.indices.destroy();
+    this.attributes.positions.destroy();
+    this.attributes.normals.destroy();
+    this.attributes.texCoords.destroy();
+    this.attributes.colors?.destroy();
+  }
+
+  getVertexCount(): number {
+    return this.vertexCount;
+  }
+
+  getAttributes(): Record<string, Buffer> {
+    return this.attributes;
+  }
+
+  getIndexes(): Buffer | null {
+    return this.indices;
+  }
+
+  _calculateVertexCount(positions: Buffer): number {
+    // Assume that positions is a fully packed float32x3 buffer
+    const vertexCount = positions.byteLength / 12;
+    return vertexCount;
+  }
+}
+
+export function makeGPUGeometry(device: Device, geometry: Geometry | GPUGeometry): GPUGeometry {
+  if (geometry instanceof GPUGeometry) {
+    return geometry;
+  }
+
+  const indices = getIndexBufferFromGeometry(device, geometry);
+  const {attributes, bufferLayout} = getAttributeBuffersFromGeometry(device, geometry);
+  return new GPUGeometry({
+    topology: geometry.topology || 'triangle-list',
+    bufferLayout,
+    vertexCount: geometry.vertexCount,
+    indices,
+    attributes
+  });
+}
+
+export function getIndexBufferFromGeometry(device: Device, geometry: Geometry): Buffer | undefined {
+  if (!geometry.indices) {
+    return undefined;
+  }
+  const data = geometry.indices.value;
+  return device.createBuffer({usage: Buffer.INDEX, data});
+}
+
+export function getAttributeBuffersFromGeometry(
+  device: Device,
+  geometry: Geometry
+): {attributes: Record<string, Buffer>, bufferLayout: BufferLayout[], vertexCount: number} {
+  const bufferLayout: BufferLayout[] = [];
+
+  const attributes: Record<string, Buffer> = {};
+  for (const [attributeName, attribute] of Object.entries(geometry.attributes)) {
+    let name: string = attributeName;
+    // TODO Map some GLTF attribute names (is this still needed?)
+    switch (attributeName) {
+      case 'POSITION': name = 'positions'; break;
+      case 'NORMAL': name = 'normals'; break;
+      case 'TEXCOORD_0': name = 'texCoords'; break;
+    }
+    attributes[name] = device.createBuffer({data: attribute.value, id: `${attributeName}-buffer`});
+    const {value, size, normalized} = attribute;
+    bufferLayout.push({name, format: getVertexFormatFromAttribute(value, size, normalized)});
+  }
+
+  const vertexCount = geometry._calculateVertexCount(geometry.attributes, geometry.indices)
+
+  return {attributes, bufferLayout, vertexCount};
+}

package/src/geometry/gpu-table.ts

@@ -0,0 +1,41 @@
+/*
+export function getAttributeLayoutsFromGeometry(geometry: Geometry) {
+  const layouts: Record<string, {}> = {};
+  let indices = geometry.indices;
+
+  for (const [name, attribute] of Object.entries(geometry.attributes)) {
+    const remappedName = mapAttributeName(name);
+
+    if (attribute.constant) {
+      throw new Error('constant attributes not supported');
+    } else {
+      const typedArray = attribute.value;
+      // Create accessor by copying the attribute and removing `value``
+      const accessor = {...attribute};
+      delete accessor.value;
+      buffers[remappedName] = [device.createBuffer(typedArray), accessor];
+
+      inferAttributeAccessor(name, accessor);
+    }
+  }
+}
+
+export class Table {
+  length: number;
+  // columns: Record<string, TypedArray> = {};
+}
+
+export class GPUTable {
+  length: number;
+  columns: Record<string, Buffer> = {};
+}
+
+export function convertTableToGPUTable(table: Table) {
+  // for (const ) {}
+}
+
+export function renameTableColumns(table: Table, map: (name: string) => string) {
+  const newColumns = table.columns.reduce()
+  table.clone();
+}
+*/