@luma.gl/engine 9.0.0-alpha.3 → 9.0.0-alpha.31

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,5 +1,5 @@
-import {uid} from '@luma.gl/api';
-import Geometry from '../geometry/geometry';
+import {uid} from '@luma.gl/core';
+import {Geometry} from '../geometry/geometry';
 import {GeometryTable} from '../geometry/geometry-table';
 
 const INDEX_OFFSETS = {
@@ -34,12 +34,13 @@ export function makeTruncatedConeGeometry(props?: TruncatedConeGeometryProps): G
 }
 
 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,112 +1,60 @@
 // 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 GeometryAttribute = {
+  size?: number;
+  value: TypedArray;
+  [key: string]: any;
+};
 
 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};
+  POSITION: GeometryAttribute;
+  NORMAL: GeometryAttribute;
+  TEXCOORD_0: GeometryAttribute;
+  COLOR_0?: GeometryAttribute;
+  indices?: {size?: number; 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 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?: Uint16Array | Uint32Array;
   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;
+  userData: Record<string, unknown> = {};
 
-    this.id = id;
-    this.drawMode = drawMode;
-    this.topology = props.topology || convertToTopology(drawMode);
+  constructor(props: GeometryProps) {
+    const {attributes = {}, indices = null, vertexCount = null} = props;
 
-    this._setAttributes(attributes, indices);
-
-    this.vertexCount = vertexCount || this._calculateVertexCount(this.attributes, this.indices);
-  }
-
-  get mode() {
-    return this.drawMode;
-  }
+    this.id = props.id || uid('geometry');
+    this.topology = props.topology;
 
-  getVertexCount(): number {
-    return this.vertexCount;
-  }
-
-  // Return an object with all attributes plus indices added as a field.
-  // getAttributes(): GeometryAttributes {
-  //   return this.indices ? {indices: this.indices, ...this.attributes} : this.attributes;
-  // }
-
-  // PRIVATE
-
-  _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;
@@ -115,11 +63,11 @@ export default class Geometry {
     // @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,25 +81,49 @@ export default class Geometry {
       // Move indices to separate field
       if (attributeName === 'indices') {
         assert(!this.indices);
-      // @ts-expect-error
-      this.indices = attribute;
+        // @ts-expect-error
+        this.indices = attribute;
       } else {
         this.attributes[attributeName] = attribute;
       }
     }
 
-      // @ts-expect-error
-      if (this.indices && this.indices.isIndexed !== undefined) {
-      // @ts-expect-error
+    // @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.
+  getAttributes(): GeometryAttributes {
+    // @ts-expect-error Geometry types are a mess
+    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)
+  _setAttributes(attributes: Record<string, GeometryAttribute>, indices: any): this {
     return this;
   }
 
-  _calculateVertexCount(attributes, indices): number {
+  _calculateVertexCount(attributes: any, indices: any): number {
     if (indices) {
       return indices.value.length;
     }
@@ -168,18 +140,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/index.ts

@@ -1,16 +1,36 @@
 // luma.gl Engine API
-export type {AnimationProps} from './lib/animation-props';
-export {RenderLoop} from './lib/render-loop';
-export type {ModelProps} from './lib/model';
-export {default as Model} from './lib/model';
-export type {AnimationLoopProps} from './lib/animation-loop';
-export {default as AnimationLoop} from './lib/animation-loop';
+
+// Animation
+export {Timeline} from './animation/timeline';
+export {KeyFrames} from './animation/key-frames';
+export type {AnimationProps} from './animation-loop/animation-props';
+
+export {AnimationLoopTemplate} from './animation-loop/render-loop';
+
+export type {AnimationLoopProps} from './animation-loop/animation-loop';
+export {AnimationLoop} from './animation-loop/animation-loop';
+
+export type {MakeAnimationLoopProps} from './animation-loop/make-animation-loop';
+export {makeAnimationLoop} from './animation-loop/make-animation-loop';
+
+export type {ModelProps} from './model/model';
+export {Model} from './model/model';
+
+export {Transform} from './transform/transform';
+
+export {PipelineFactory} from './lib/pipeline-factory';
 
 // Utils
-// export {default as ClipSpace} from './lib/clip-space';
+export {ClipSpace} from './lib/clip-space';
+
+// Scenegraph Core nodes
+export {ScenegraphNode} from './scenegraph/scenegraph-node';
+export {GroupNode} from './scenegraph/group-node';
+export {ModelNode} from './scenegraph/model-node';
 
 // Geometries
-export {default as Geometry} from './geometry/geometry';
+export type {GeometryProps} from './geometry/geometry';
+export {Geometry} from './geometry/geometry';
 
 // Primitives
 export type {ConeGeometryProps} from './geometries/cone-geometry';
@@ -28,7 +48,3 @@ export {SphereGeometry} from './geometries/sphere-geometry';
 export type {TruncatedConeGeometryProps} from './geometries/truncated-cone-geometry';
 export {TruncatedConeGeometry} from './geometries/truncated-cone-geometry';
 
-// Animation
-export {Timeline} from './animation/timeline';
-export {KeyFrames} from './animation/key-frames';
-

package/src/lib/clip-space.ts

@@ -1,11 +1,11 @@
 
 // ClipSpace
-/*
-import GL from '@luma.gl/constants';
-import Model, {ModelProps} from './model';
-import Geometry from '../geometry/geometry';
+import {Device, glsl} from '@luma.gl/core';
+import {WebGLDevice} from '@luma.gl/webgl';
+import {Model, ModelProps} from '../model/model';
+import {Geometry} from '../geometry/geometry';
 
-const CLIPSPACE_VERTEX_SHADER = `\
+const CLIPSPACE_VERTEX_SHADER = glsl`\
 attribute vec2 aClipSpacePosition;
 attribute vec2 aTexCoord;
 attribute vec2 aCoordinate;
@@ -22,20 +22,24 @@ void main(void) {
 }
 `;
 
-/* eslint-disable indent, no-multi-spaces *
+/* eslint-disable indent, no-multi-spaces */
 const POSITIONS = [-1, -1, 1, -1, -1, 1, 1, 1];
 
-
-export default class ClipSpace extends Model {
-  constructor(gl: WebGLRenderingContext, opts?: ModelProps) {
+/**
+ * A flat geometry that covers the "visible area" that the GPU renders.
+ */
+export class ClipSpace extends Model {
+  constructor(device: Device | WebGLRenderingContext, opts?: ModelProps) {
     const TEX_COORDS = POSITIONS.map((coord) => (coord === -1 ? 0 : coord));
 
     super(
-      gl,
-      Object.assign({}, opts, {
+      WebGLDevice.attach(device),
+      {
+        ...opts,
         vs: CLIPSPACE_VERTEX_SHADER,
+        vertexCount: 4,
         geometry: new Geometry({
-          drawMode: GL.TRIANGLE_STRIP,
+          topology: 'triangle-strip',
           vertexCount: 4,
           attributes: {
             aClipSpacePosition: {size: 2, value: new Float32Array(POSITIONS)},
@@ -43,9 +47,7 @@ export default class ClipSpace extends Model {
             aCoordinate: {size: 2, value: new Float32Array(TEX_COORDS)}
           }
         })
-      })
+      }
     );
-    this.setVertexCount(4);
   }
 }
-*/