@luma.gl/engine 9.0.0-alpha.9 → 9.0.0-beta.10

package/src/geometry/gpu-geometry.ts

@@ -0,0 +1,132 @@
+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();
+    for (const attribute of Object.values(this.attributes)) {
+      attribute.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;
+      case 'COLOR_0':
+        name = 'colors';
+        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();
+}
+*/

package/src/index.ts

@@ -1,22 +1,44 @@
 // luma.gl Engine API
-export type {AnimationProps} from './lib/animation-props';
-export type {AnimationLoopProps} from './lib/animation-loop';
-export {AnimationLoop} from './lib/animation-loop';
-export {RenderLoop} from './lib/render-loop';
-export type {ModelProps} from './lib/model';
-export {default as Model} from './lib/model';
-
-export {PipelineFactory} from './lib/pipeline-factory';
 
 // 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/animation-loop-template';
+
+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';
+
+// Transforms
+export type {BufferTransformProps} from './transform/buffer-transform';
+export {BufferTransform} from './transform/buffer-transform';
+export type {TextureTransformProps} from './transform/texture-transform';
+export {TextureTransform} from './transform/texture-transform';
+
+export {PipelineFactory} from './lib/pipeline-factory';
+export {ShaderFactory} from './lib/shader-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 type {ModelNodeProps} from './scenegraph/model-node';
+export {ModelNode} from './scenegraph/model-node';
 
 // Geometries
-export {default as Geometry} from './geometry/geometry';
+export type {GeometryProps, GeometryAttribute} from './geometry/geometry';
+export {Geometry} from './geometry/geometry';
+export type {GPUGeometryProps} from './geometry/gpu-geometry';
+export {GPUGeometry} from './geometry/gpu-geometry';
 
 // Primitives
 export type {ConeGeometryProps} from './geometries/cone-geometry';
@@ -34,3 +56,8 @@ export {SphereGeometry} from './geometries/sphere-geometry';
 export type {TruncatedConeGeometryProps} from './geometries/truncated-cone-geometry';
 export {TruncatedConeGeometry} from './geometries/truncated-cone-geometry';
 
+// EXPERIMENTAL
+export type {ShaderModuleInputs} from './shader-inputs';
+export {ShaderInputs as _ShaderInputs} from './shader-inputs';
+export type {ComputationProps} from './computation';
+export {Computation} from './computation';

package/src/lib/clip-space.ts

@@ -1,18 +1,17 @@
-
 // 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 {Model, ModelProps} from '../model/model';
+import {Geometry} from '../geometry/geometry';
 
-const CLIPSPACE_VERTEX_SHADER = `\
-attribute vec2 aClipSpacePosition;
-attribute vec2 aTexCoord;
-attribute vec2 aCoordinate;
+const CLIPSPACE_VERTEX_SHADER = glsl`\
+#version 300 es
+in vec2 aClipSpacePosition;
+in vec2 aTexCoord;
+in vec2 aCoordinate;
 
-varying vec2 position;
-varying vec2 coordinate;
-varying vec2 uv;
+out vec2 position;
+out vec2 coordinate;
+out vec2 uv;
 
 void main(void) {
   gl_Position = vec4(aClipSpacePosition, 0., 1.);
@@ -22,30 +21,29 @@ 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) {
-    const TEX_COORDS = POSITIONS.map((coord) => (coord === -1 ? 0 : coord));
-
-    super(
-      gl,
-      Object.assign({}, opts, {
-        vs: CLIPSPACE_VERTEX_SHADER,
-        geometry: new Geometry({
-          drawMode: GL.TRIANGLE_STRIP,
-          vertexCount: 4,
-          attributes: {
-            aClipSpacePosition: {size: 2, value: new Float32Array(POSITIONS)},
-            aTexCoord: {size: 2, value: new Float32Array(TEX_COORDS)},
-            aCoordinate: {size: 2, value: new Float32Array(TEX_COORDS)}
-          }
-        })
+/**
+ * A flat geometry that covers the "visible area" that the GPU renders.
+ */
+export class ClipSpace extends Model {
+  constructor(device: Device, opts: Omit<ModelProps, 'vs' | 'vertexCount' | 'geometry'>) {
+    const TEX_COORDS = POSITIONS.map(coord => (coord === -1 ? 0 : coord));
+
+    super(device, {
+      ...opts,
+      vs: CLIPSPACE_VERTEX_SHADER,
+      vertexCount: 4,
+      geometry: new Geometry({
+        topology: 'triangle-strip',
+        vertexCount: 4,
+        attributes: {
+          aClipSpacePosition: {size: 2, value: new Float32Array(POSITIONS)},
+          aTexCoord: {size: 2, value: new Float32Array(TEX_COORDS)},
+          aCoordinate: {size: 2, value: new Float32Array(TEX_COORDS)}
+        }
       })
-    );
-    this.setVertexCount(4);
+    });
   }
 }
-*/

package/src/lib/pipeline-factory.ts

@@ -1,234 +1,124 @@
-import type {RenderPipelineProps, RenderPipelineParameters, PrimitiveTopology, ShaderLayout} from '@luma.gl/api';
-import {Device, RenderPipeline, ComputePipeline} from '@luma.gl/api/';
-import type { ShaderModule } from '@luma.gl/shadertools';
-import {assembleShaders} from '@luma.gl/shadertools';
-
-export type GetRenderPipelineOptions = {
-  vs: string;
-  fs: string | null;
-  topology: PrimitiveTopology;
-  layout?: ShaderLayout | null;
-  parameters?: RenderPipelineParameters;
-
-  modules?: ShaderModule[];
-  defines?: Record<string, string | number | boolean>;
-  inject?: Record<string, string>;
-  transpileToGLSL100?: boolean;
-
-  varyings?: string[];
-  bufferMode?: number,  
-};
-
-export type GetComputePipelineOptions = {
-  cs: string;
-    parameters?: RenderPipelineParameters;
-
-  modules?: ShaderModule[];
-  defines?: Record<string, string>;
-  inject?: Record<string, string>;
-  transpileToGLSL100?: boolean;
-
-  varyings?: string[];
-  bufferMode?: number;
-};
-
-const DEFAULT_RENDER_PIPELINE_OPTIONS: Required<GetRenderPipelineOptions> = {
-  vs: '',
-  fs: '',
-  modules: [],
-  defines: {},
-  inject: {},
-  transpileToGLSL100: false,
-  layout: null,
-
-  varyings: [],
-  bufferMode: 0x8c8d, // // varyings/bufferMode for xform feedback, 0x8c8d: SEPARATE_ATTRIBS
-  topology: 'triangle-list',
-  parameters: {} 
-};
-
-type GetUniformsFunc = (props?: Record<string, any>) => Record<string, any>;
-
-/** Efficiently create shared pipelines with varying parameters */
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import type {RenderPipelineProps, ComputePipelineProps} from '@luma.gl/core';
+import {Device, RenderPipeline, ComputePipeline} from '@luma.gl/core';
+
+export type PipelineFactoryProps = RenderPipelineProps;
+
+/**
+ * Efficiently creates / caches pipelines
+ */
 export class PipelineFactory {
+  static defaultProps: Required<PipelineFactoryProps> = {...RenderPipeline.defaultProps};
+
   readonly device: Device;
 
-  stateHash: number = 0; // Used to change hashing if hooks are modified
   private _hashCounter: number = 0;
   private readonly _hashes: Record<string, number> = {};
-  private readonly _useCounts: Record<string, number> = {};
-
-  private readonly _pipelineCache: Record<string, RenderPipeline> = {};
-
-  private readonly _getUniforms: Record<string, GetUniformsFunc> = {};
-  private readonly _hookFunctions: any[] = [];
-  private _defaultModules: any[] = [];
-  // private readonly _registeredModules = {}; // TODO: Remove? This isn't used anywhere in luma.gl
-
+  private readonly _renderPipelineCache: Record<
+    string,
+    {pipeline: RenderPipeline; useCount: number}
+  > = {};
+  private readonly _computePipelineCache: Record<
+    string,
+    {pipeline: ComputePipeline; useCount: number}
+  > = {};
+
+  /** Get the singleton default pipeline factory for the specified device */
   static getDefaultPipelineFactory(device: Device): PipelineFactory {
-    // @ts-expect-error Add to device
-    device.defaultPipelineFactory = device.defaultPipelineFactory || new PipelineFactory(device);
-    // @ts-expect-error Add to device
-    return device.defaultPipelineFactory;
+    device._lumaData.defaultPipelineFactory =
+      device._lumaData.defaultPipelineFactory || new PipelineFactory(device);
+    return device._lumaData.defaultPipelineFactory as PipelineFactory;
   }
 
   constructor(device: Device) {
     this.device = device;
   }
 
-  addDefaultModule(module: ShaderModule): void {
-    if (!this._defaultModules.find((m) => m.name === (typeof module === 'string' ? module : module.name))) {
-      this._defaultModules.push(module);
-    }
-    this.stateHash++;
-  }
+  /** Return a RenderPipeline matching props. Reuses a similar pipeline if already created. */
+  createRenderPipeline(props: RenderPipelineProps): RenderPipeline {
+    const allProps: Required<RenderPipelineProps> = {...RenderPipeline.defaultProps, ...props};
 
-  removeDefaultModule(module: ShaderModule): void {
-    const moduleName = typeof module === 'string' ? module : module.name;
-    this._defaultModules = this._defaultModules.filter((m) => m.name !== moduleName);
-    this.stateHash++;
-  }
+    const hash = this._hashRenderPipeline(allProps);
 
-  addShaderHook(hook, opts?): void {
-    if (opts) {
-      hook = Object.assign(opts, {hook});
+    if (!this._renderPipelineCache[hash]) {
+      const pipeline = this.device.createRenderPipeline({
+        ...allProps,
+        id: allProps.id ? `${allProps.id}-cached` : undefined
+      });
+      pipeline.hash = hash;
+      this._renderPipelineCache[hash] = {pipeline, useCount: 0};
     }
-    this._hookFunctions.push(hook);
-    this.stateHash++;
-  }
 
-  createRenderPipeline(options: GetRenderPipelineOptions): {
-    pipeline: RenderPipeline;
-    getUniforms: GetUniformsFunc;
-  } {
-    const props: Required<GetRenderPipelineOptions> = {...DEFAULT_RENDER_PIPELINE_OPTIONS, ...options};
+    this._renderPipelineCache[hash].useCount++;
+    return this._renderPipelineCache[hash].pipeline;
+  }
 
-    const modules = this._getModuleList(props.modules); // Combine with default modules
+  createComputePipeline(props: ComputePipelineProps): ComputePipeline {
+    const allProps: Required<ComputePipelineProps> = {...ComputePipeline.defaultProps, ...props};
 
-    const hash = this._hashRenderPipeline({...props, modules});
+    const hash = this._hashComputePipeline(allProps);
 
-    if (!this._pipelineCache[hash]) {
-      const {pipeline, getUniforms} = this._createRenderPipeline({...props, modules});
+    if (!this._computePipelineCache[hash]) {
+      const pipeline = this.device.createComputePipeline({
+        ...allProps,
+        id: allProps.id ? `${allProps.id}-cached` : undefined
+      });
       pipeline.hash = hash;
-      this._pipelineCache[hash] = pipeline;
-      this._getUniforms[hash] = getUniforms || ((x?: unknown) => ({}));
-      this._useCounts[hash] = 0;
+      this._computePipelineCache[hash] = {pipeline, useCount: 0};
     }
 
-    this._useCounts[hash]++;
-
-    return {
-      pipeline: this._pipelineCache[hash],
-      getUniforms: this._getUniforms[hash]
-    };
+    this._computePipelineCache[hash].useCount++;
+    return this._computePipelineCache[hash].pipeline;
   }
 
-  release(pipeline: RenderPipeline): void {
+  release(pipeline: RenderPipeline | ComputePipeline): void {
     const hash = pipeline.hash;
-    this._useCounts[hash]--;
-    if (this._useCounts[hash] === 0) {
-      this._pipelineCache[hash].destroy();
-      delete this._pipelineCache[hash];
-      delete this._getUniforms[hash];
-      delete this._useCounts[hash];
+    const cache =
+      pipeline instanceof ComputePipeline ? this._computePipelineCache : this._renderPipelineCache;
+    cache[hash].useCount--;
+    if (cache[hash].useCount === 0) {
+      cache[hash].pipeline.destroy();
+      delete cache[hash];
     }
   }
 
-  getUniforms(pipeline: RenderPipeline) {
-    return this._getUniforms[pipeline.hash] || null;
-  }
-
   // PRIVATE
-
-  _createRenderPipeline(props: GetRenderPipelineOptions): {
-    pipeline: RenderPipeline,
-    getUniforms: GetUniformsFunc
-  } {
-    const platformInfo = {
-      gpu: this.device.info.gpu,
-      features: this.device.features
-    };
-
-    if (!props.fs) {
-      throw new Error('fs');
-    }
-
-    const assembled = assembleShaders(platformInfo, {...props, fs: props.fs, hookFunctions: this._hookFunctions});
-
-    const pipeline = this.device.createRenderPipeline({
-      ...props,
-      vs: this.device.createShader({stage: 'vertex', source: assembled.vs}),
-      fs: assembled.fs ? this.device.createShader({stage: 'fragment', source: assembled.fs}) : null,
-    });
-
-    return {pipeline, getUniforms: assembled.getUniforms};
+  private _hashComputePipeline(props: ComputePipelineProps): string {
+    const shaderHash = this._getHash(props.shader.source);
+    return `${shaderHash}`;
   }
 
   /** Calculate a hash based on all the inputs for a render pipeline */
-  _hashRenderPipeline(props: GetRenderPipelineOptions): string {
-    const {modules = [], varyings = [], defines = [], inject = [], parameters = []} = props;
-     const vsHash = this._getHash(props.vs);
-    const fsHash = props.fs ? this._getHash(props.fs) : 0;
-
-    const moduleHashes = modules.map((m) => this._getHash(typeof m === 'string' ? m : m.name)).sort();
-    const varyingHashes = varyings.map((v) => this._getHash(v));
-
-    const defineKeys = Object.keys(defines).sort();
-    const injectKeys = Object.keys(inject).sort();
-    const defineHashes: number[] = [];
-    const injectHashes: number[] = [];
-
-    for (const key of defineKeys) {
-      defineHashes.push(this._getHash(key));
-      defineHashes.push(this._getHash(defines[key]));
-    }
-
-    for (const key of injectKeys) {
-      injectHashes.push(this._getHash(key));
-      injectHashes.push(this._getHash(inject[key]));
+  private _hashRenderPipeline(props: RenderPipelineProps): string {
+    const vsHash = this._getHash(props.vs.source);
+    const fsHash = props.fs ? this._getHash(props.fs.source) : 0;
+
+    // WebGL specific
+    // const {varyings = [], bufferMode = {}} = props;
+    // const varyingHashes = varyings.map((v) => this._getHash(v));
+    const varyingHash = '-'; // `${varyingHashes.join('/')}B${bufferMode}`
+    const bufferLayoutHash = this._getHash(JSON.stringify(props.bufferLayout));
+
+    switch (this.device.type) {
+      // case 'webgl':
+      // WebGL is more dynamic
+      // return `${vsHash}/${fsHash}V${varyingHash}BL${bufferLayoutHash}`;
+      default:
+        // On WebGPU we need to rebuild the pipeline if topology, parameters or bufferLayout change
+        const parameterHash = this._getHash(JSON.stringify(props.parameters));
+        // TODO - Can json.stringify() generate different strings for equivalent objects if order of params is different?
+        // create a deepHash() to deduplicate?
+        return `${vsHash}/${fsHash}V${varyingHash}T${props.topology}P${parameterHash}BL${bufferLayoutHash}`;
     }
-
-    // TODO - hash parameters!
-    const parameterHash = JSON.stringify(parameters);
-
-    return `${vsHash}/${fsHash}D${defineHashes.join('/')}M${moduleHashes.join(
-      '/'
-    )}I${injectHashes.join('/')}V${varyingHashes.join('/')}H${this.stateHash}B${props.bufferMode}${
-      props.transpileToGLSL100 ? 'T' : ''
-    }P${parameterHash}`;
   }
 
-  _getHash(key: string): number {
+  private _getHash(key: string): number {
     if (this._hashes[key] === undefined) {
       this._hashes[key] = this._hashCounter++;
     }
     return this._hashes[key];
   }
-
-  // Dedupe and combine with default modules
-  _getModuleList(appModules: ShaderModule[] = []): ShaderModule[] {
-    const modules = new Array(this._defaultModules.length + appModules.length);
-    const seen: Record<string, boolean> = {};
-    let count = 0;
-
-    for (let i = 0, len = this._defaultModules.length; i < len; ++i) {
-      const module = this._defaultModules[i];
-      const name = module.name;
-      modules[count++] = module;
-      seen[name] = true;
-    }
-
-    for (let i = 0, len = appModules.length; i < len; ++i) {
-      const module = appModules[i];
-      const name = module.name;
-      if (!seen[name]) {
-        modules[count++] = module;
-        seen[name] = true;
-      }
-    }
-
-    modules.length = count;
-
-    return modules;
-  }
 }