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

package/src/lib/pipeline-factory.ts

@@ -1,34 +1,36 @@
-import type {RenderPipelineProps, RenderPipelineParameters} from '@luma.gl/api';
-import {Device, RenderPipeline, ComputePipeline} from '@luma.gl/api/';
+import type {RenderPipelineParameters, PrimitiveTopology, ShaderLayout} from '@luma.gl/core';
+import {Device, RenderPipeline} from '@luma.gl/core';
 import type { ShaderModule } from '@luma.gl/shadertools';
 import {assembleShaders} from '@luma.gl/shadertools';
 
 export type GetRenderPipelineOptions = {
-  vs: string,
-  fs: string,
-  topology;
+  vs: string;
+  fs: string | null;
+  topology: PrimitiveTopology;
+  shaderLayout?: ShaderLayout | null;
   parameters?: RenderPipelineParameters;
 
   modules?: ShaderModule[];
-  defines?: Record<string, string>,
-  inject?: Record<string, string>,
+  defines?: Record<string, string | number | boolean>;
+  inject?: Record<string, string>;
   transpileToGLSL100?: boolean;
 
-  varyings?: string[],
+  varyings?: string[];
   bufferMode?: number,  
 };
 
 export type GetComputePipelineOptions = {
-  cs: string,
+  cs: string;
+
   parameters?: RenderPipelineParameters;
 
   modules?: ShaderModule[];
-  defines?: Record<string, string>,
-  inject?: Record<string, string>,
+  defines?: Record<string, string>;
+  inject?: Record<string, string>;
   transpileToGLSL100?: boolean;
 
-  varyings?: string[],
-  bufferMode?: number,
+  varyings?: string[];
+  bufferMode?: number;
 };
 
 const DEFAULT_RENDER_PIPELINE_OPTIONS: Required<GetRenderPipelineOptions> = {
@@ -38,6 +40,7 @@ const DEFAULT_RENDER_PIPELINE_OPTIONS: Required<GetRenderPipelineOptions> = {
   defines: {},
   inject: {},
   transpileToGLSL100: false,
+  shaderLayout: null,
 
   varyings: [],
   bufferMode: 0x8c8d, // // varyings/bufferMode for xform feedback, 0x8c8d: SEPARATE_ATTRIBS
@@ -45,8 +48,10 @@ const DEFAULT_RENDER_PIPELINE_OPTIONS: Required<GetRenderPipelineOptions> = {
   parameters: {} 
 };
 
+type GetUniformsFunc = (props?: Record<string, any>) => Record<string, any>;
+
 /** Efficiently create shared pipelines with varying parameters */
-export default class PipelineFactory {
+export class PipelineFactory {
   readonly device: Device;
 
   stateHash: number = 0; // Used to change hashing if hooks are modified
@@ -56,7 +61,7 @@ export default class PipelineFactory {
 
   private readonly _pipelineCache: Record<string, RenderPipeline> = {};
 
-  private readonly _getUniforms: Record<string, any> = {};
+  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
@@ -72,20 +77,20 @@ export default class PipelineFactory {
     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++;
-  // }
+  addDefaultModule(module: ShaderModule): void {
+    if (!this._defaultModules.find((m) => m.name === (typeof module === 'string' ? module : module.name))) {
+      this._defaultModules.push(module);
+    }
+    this.stateHash++;
+  }
 
-  // removeDefaultModule(module: ShaderModule): void {
-  //   const moduleName = typeof module === 'string' ? module : module.name;
-  //   this._defaultModules = this._defaultModules.filter((m) => m.name !== moduleName);
-  //   this.stateHash++;
-  // }
+  removeDefaultModule(module: ShaderModule): void {
+    const moduleName = typeof module === 'string' ? module : module.name;
+    this._defaultModules = this._defaultModules.filter((m) => m.name !== moduleName);
+    this.stateHash++;
+  }
 
-  addShaderHook(hook, opts?): void {
+  addShaderHook(hook: string, opts?: any): void {
     if (opts) {
       hook = Object.assign(opts, {hook});
     }
@@ -94,8 +99,8 @@ export default class PipelineFactory {
   }
 
   createRenderPipeline(options: GetRenderPipelineOptions): {
-    renderPipeline: RenderPipeline;
-    getUniforms: (props: Record<string, Record<string, any>>) => Record<string, any>;
+    pipeline: RenderPipeline;
+    getUniforms: GetUniformsFunc;
   } {
     const props: Required<GetRenderPipelineOptions> = {...DEFAULT_RENDER_PIPELINE_OPTIONS, ...options};
 
@@ -104,17 +109,17 @@ export default class PipelineFactory {
     const hash = this._hashRenderPipeline({...props, modules});
 
     if (!this._pipelineCache[hash]) {
-      const {renderPipeline, getUniforms} = this._createRenderPipeline({...props, modules});
-      renderPipeline.hash = hash;
-      this._pipelineCache[hash] = renderPipeline;
-      this._getUniforms[hash] = getUniforms || ((x: Record<string, Record<string, any>>) => {});
+      const {pipeline, getUniforms} = this._createRenderPipeline({...props, modules});
+      pipeline.hash = hash;
+      this._pipelineCache[hash] = pipeline;
+      this._getUniforms[hash] = getUniforms || ((x?: unknown) => ({}));
       this._useCounts[hash] = 0;
     }
 
     this._useCounts[hash]++;
 
     return {
-      renderPipeline: this._pipelineCache[hash],
+      pipeline: this._pipelineCache[hash],
       getUniforms: this._getUniforms[hash]
     };
   }
@@ -137,50 +142,55 @@ export default class PipelineFactory {
   // PRIVATE
 
   _createRenderPipeline(props: GetRenderPipelineOptions): {
-    renderPipeline: RenderPipeline,
-    getUniforms: (props: Record<string, Record<string, any>>) => Record<string, any>
+    pipeline: RenderPipeline,
+    getUniforms: GetUniformsFunc
   } {
     const platformInfo = {
       gpu: this.device.info.gpu,
       features: this.device.features
     };
 
-    const assembled = assembleShaders(platformInfo, {...props, hookFunctions: this._hookFunctions});
+    if (!props.fs) {
+      throw new Error('fs');
+    }
+
+    const assembled = assembleShaders(platformInfo, {...props, fs: props.fs, hookFunctions: this._hookFunctions});
 
-    const renderPipeline = this.device.createRenderPipeline({
+    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}),
+      fs: assembled.fs ? this.device.createShader({stage: 'fragment', source: assembled.fs}) : null,
     });
 
-    return {renderPipeline, getUniforms: assembled.getUniforms};
+    return {pipeline, getUniforms: assembled.getUniforms};
   }
 
   /** 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 = this._getHash(props.fs);
+    const fsHash = props.fs ? this._getHash(props.fs) : 0;
 
-    const moduleHashes = props.modules.map((m) => this._getHash(typeof m === 'string' ? m : m.name)).sort();
-    const varyingHashes = props.varyings.map((v) => this._getHash(v));
+    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(props.defines).sort();
-    const injectKeys = Object.keys(props.inject).sort();
-    const defineHashes = [];
-    const injectHashes = [];
+    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(props.defines[key]));
+      defineHashes.push(this._getHash(String(defines[key])));
     }
 
     for (const key of injectKeys) {
       injectHashes.push(this._getHash(key));
-      injectHashes.push(this._getHash(props.inject[key]));
+      injectHashes.push(this._getHash(inject[key]));
     }
 
     // TODO - hash parameters!
-    const parameterHash = JSON.stringify(props.parameters);
+    const parameterHash = JSON.stringify(parameters);
 
     return `${vsHash}/${fsHash}D${defineHashes.join('/')}M${moduleHashes.join(
       '/'

package/src/{lib → model}/model-utils.ts

@@ -1,5 +1,5 @@
-import {Device, Buffer, assert} from '@luma.gl/api';
-import type Geometry from '../geometry/geometry';
+import {Device, Buffer, assert} from '@luma.gl/core';
+import type {Geometry} from '../geometry/geometry';
 
 // Support for mapping new geometries with glTF attribute names to "classic" luma.gl shader names
 const GLTF_TO_LUMA_ATTRIBUTE_MAP = {
@@ -72,10 +72,10 @@ export function getAttributeBuffersFromGeometry(device: Device, geometry: Geomet
 
   for (const [name, attribute] of Object.entries(geometry.attributes)) {
     const remappedName = mapAttributeName(name);
-    if (attribute.constant) {
+    if (attribute?.constant) {
       throw new Error('constant attributes not supported');
     } else {
-      const typedArray = attribute.value;
+      const typedArray = attribute?.value;
       buffers[remappedName] = device.createBuffer({data: typedArray, id: `${remappedName}-buffer`});
     }
   }
@@ -84,6 +84,7 @@ export function getAttributeBuffersFromGeometry(device: Device, geometry: Geomet
 }
 
 function mapAttributeName(name: string): string {
+  // @ts-ignore-error
   return GLTF_TO_LUMA_ATTRIBUTE_MAP[name] || name;
 }
 

package/src/model/model.ts

@@ -0,0 +1,230 @@
+// luma.gl, MIT license
+
+import {
+  Device,
+  Buffer,
+  RenderPipelineProps,
+  RenderPass,
+  Binding,
+  PrimitiveTopology,
+  log
+} from '@luma.gl/core';
+import {RenderPipeline} from '@luma.gl/core';
+import type {ShaderModule} from '@luma.gl/shadertools';
+import type {Geometry} from '../geometry/geometry';
+import {getAttributeBuffersFromGeometry, getIndexBufferFromGeometry} from './model-utils';
+import {PipelineFactory} from '../lib/pipeline-factory';
+import {TypedArray} from '@math.gl/core';
+
+/** @todo import type */
+type UniformValue = unknown;
+
+export type ModelProps = Omit<RenderPipelineProps, 'vs' | 'fs'> & {
+  // Model also accepts a string
+  vs?: {glsl?: string; wgsl?: string} | string | null;
+  fs?: {glsl?: string; wgsl?: string} | string | null;
+  defines?: Record<string, string | number | boolean>;
+  modules?: ShaderModule[];
+  moduleSettings?: Record<string, Record<string, any>>;
+  geometry?: Geometry | null;
+  /** deprecated pipeline factory to use to create renderpipelines */
+  pipelineFactory?: PipelineFactory;
+  vertexCount?: number;
+  instanceCount?: number;
+};
+
+const DEFAULT_MODEL_PROPS: Required<ModelProps> = {
+  ...RenderPipeline.defaultProps,
+  vs: null,
+  fs: null,
+  id: 'unnamed',
+  handle: undefined,
+  userData: {},
+  defines: {},
+  modules: [],
+  moduleSettings: {},
+  geometry: null,
+  pipelineFactory: undefined,
+  vertexCount: 0,
+  instanceCount: 0
+};
+
+/** v9 API */
+export class Model {
+  readonly device: Device;
+  readonly id: string;
+  readonly vs: string;
+  readonly fs: string | null = null;
+  readonly topology: PrimitiveTopology;
+  readonly pipelineFactory: PipelineFactory;
+  /** The underlying GPU "program". @note May be recreated if parameters change */
+  pipeline: RenderPipeline;
+  userData: {[key: string]: any} = {};
+
+  // readonly props: Required<ModelProps>;
+
+  /** Vertex count */
+  vertexCount: number;
+  /** instance count */
+  instanceCount: number = 0;
+  /** Buffer-valued attributes */
+  bufferAttributes: Record<string, Buffer> = {};
+  /** Constant-valued attributes */
+  constantAttributes: Record<string, TypedArray> = {};
+  /** Bindings (textures, samplers, uniform buffers) */
+  bindings: Record<string, Binding> = {};
+  /** Uniforms */
+  uniforms: Record<string, UniformValue> = {};
+
+  private _getModuleUniforms: (props?: Record<string, Record<string, any>>) => Record<string, any>;
+
+  constructor(device: Device, props: ModelProps) {
+    props = {...DEFAULT_MODEL_PROPS, ...props};
+    this.id = props.id;
+    this.device = device;
+
+    Object.assign(this.userData, props.userData);
+
+    // Create the pipeline
+    if (!props.vs) {
+      throw new Error('no vertex shader');
+    }
+    this.vs = getShaderSource(this.device, props.vs);
+    if (props.fs) {
+      this.fs = getShaderSource(this.device, props.fs);
+    }
+
+    this.vertexCount = props.vertexCount;
+    this.instanceCount = props.instanceCount;
+    this.topology = props.topology;
+
+    if (props.geometry) {
+      this.vertexCount = props.geometry.vertexCount;
+      this.topology = props.geometry.topology || 'triangle-list';
+    }
+
+    this.pipelineFactory =
+      props.pipelineFactory || PipelineFactory.getDefaultPipelineFactory(this.device);
+    const {pipeline, getUniforms} = this.pipelineFactory.createRenderPipeline({
+      ...props,
+      vs: this.vs,
+      fs: this.fs,
+      topology: this.topology,
+      defines: props.defines,
+      parameters: props.parameters,
+      shaderLayout: props.shaderLayout
+    });
+
+    this.pipeline = pipeline;
+    this._getModuleUniforms = getUniforms;
+
+    if (props.geometry) {
+      this._setGeometry(props.geometry);
+    }
+
+    this.setUniforms(this._getModuleUniforms()); // Get all default module uniforms
+
+    // Props can update any of the above, so call setProps last.
+    this.setProps(props);
+  }
+
+  destroy(): void {
+    this.pipelineFactory.release(this.pipeline);
+  }
+
+  draw(renderPass: RenderPass): void {
+    this.pipeline.draw({
+      renderPass,
+      vertexCount: this.vertexCount,
+      instanceCount: this.instanceCount
+    });
+  }
+
+  setProps(props: ModelProps): void {
+    if (props.indices) {
+      this.setIndexBuffer(props.indices);
+    }
+    if (props.attributes) {
+      this.setAttributes(props.attributes);
+    }
+    if (props.bindings) {
+      this.setBindings(props.bindings);
+    }
+    if (props.uniforms) {
+      this.setUniforms(props.uniforms);
+    }
+    if (props.moduleSettings) {
+      this.updateModuleSettings(props.moduleSettings);
+    }
+  }
+
+  updateModuleSettings(props: Record<string, any>): void {
+    const uniforms = this._getModuleUniforms(props);
+    this.setUniforms(uniforms);
+  }
+
+  setIndexBuffer(indices: Buffer | null): void {
+    this.pipeline.setIndexBuffer(indices);
+    // this._indices = indices;
+  }
+
+  setAttributes(bufferAttributes: Record<string, Buffer>): void {
+    if (bufferAttributes.indices) {
+      log.warn(`Model:${this.id} setAttributes() - indices should be set using setIndexBuffer()`);
+    }
+
+    this.pipeline.setAttributes(bufferAttributes);
+    Object.assign(this.bufferAttributes, bufferAttributes);
+  }
+
+  setConstantAttributes(constantAttributes: Record<string, TypedArray>): void {
+    // TODO - this doesn't work under WebGPU, we'll need to create buffers or inject uniforms
+    this.pipeline.setConstantAttributes(constantAttributes);
+    Object.assign(this.constantAttributes, constantAttributes);
+  }
+
+  /** Set the bindings */
+  setBindings(bindings: Record<string, Binding>): void {
+    this.pipeline.setBindings(bindings);
+    Object.assign(this.bindings, bindings);
+  }
+
+  setUniforms(uniforms: Record<string, any>): void {
+    this.pipeline.setUniforms(uniforms);
+    Object.assign(this.uniforms, uniforms);
+  }
+
+  _setGeometry(geometry: Geometry): void {
+    // this._deleteGeometryBuffers();
+
+    const geometryBuffers = getAttributeBuffersFromGeometry(this.device, geometry);
+    this.setAttributes(geometryBuffers);
+
+    const indexBuffer = getIndexBufferFromGeometry(this.device, geometry);
+    if (indexBuffer) {
+      this.setIndexBuffer(indexBuffer);
+    }
+  }
+}
+
+/** Create a shader from the different overloads */
+function getShaderSource(device: Device, shader: string | {glsl?: string; wgsl?: string}): string {
+  // TODO - detect WGSL/GLSL and throw an error if not supported
+  if (typeof shader === 'string') {
+    return shader;
+  }
+
+  switch (device.info.type) {
+    case 'webgpu':
+      if (shader?.wgsl) {
+        return shader.wgsl;
+      }
+      throw new Error('WebGPU does not support GLSL shaders');
+
+    default:
+      if (shader?.glsl) {
+        return shader.glsl;
+      }
+      throw new Error('WebGL does not support WGSL shaders');
+  }
+}

package/src/scenegraph/group-node.ts

@@ -0,0 +1,103 @@
+import {Matrix4, Vector3} from '@math.gl/core';
+import {log} from '@luma.gl/core';
+import {ScenegraphNode, ScenegraphNodeProps} from './scenegraph-node';
+
+export type GroupNodeProps = ScenegraphNodeProps & {
+  children?: ScenegraphNode[];
+}
+
+export class GroupNode extends ScenegraphNode {
+  children: ScenegraphNode[];
+
+  constructor(children: ScenegraphNode[]);
+  constructor(props?: GroupNodeProps);
+
+  constructor(props: ScenegraphNode[] | GroupNodeProps = {}) {
+    props = Array.isArray(props) ? {children: props} : props;
+    const {children = []} = props;
+    log.assert(
+      children.every((child) => child instanceof ScenegraphNode),
+      'every child must an instance of ScenegraphNode'
+    );
+    super(props);
+    this.children = children;
+  }
+
+  override getBounds(): [number[], number[]] | null {
+    const result: [number[], number[]] = [[Infinity, Infinity, Infinity], [-Infinity, -Infinity, -Infinity]];
+
+    this.traverse((node, {worldMatrix}) => {
+      const bounds = node.getBounds();
+      if (!bounds) {
+        return;
+      }
+      const [min, max] = bounds;
+      const center = new Vector3(min).add(max).divide([2, 2, 2]);
+      worldMatrix.transformAsPoint(center, center);
+      const halfSize = new Vector3(max).subtract(min).divide([2, 2, 2]);
+      worldMatrix.transformAsVector(halfSize, halfSize);
+
+      for (let v = 0; v < 8; v++) {
+        // Test all 8 corners of the box
+        const position = new Vector3(
+          v & 0b001 ? -1 : 1,
+          v & 0b010 ? -1 : 1,
+          v & 0b100 ? -1 : 1
+        ).multiply(halfSize).add(center);
+
+        for (let i = 0; i < 3; i++) {
+          result[0][i] = Math.min(result[0][i], position[i]);
+          result[1][i] = Math.max(result[1][i], position[i]);
+        }
+      }
+    });
+    if (!Number.isFinite(result[0][0])) {
+      return null;
+    }
+    return result;
+  }
+
+  override destroy(): void {
+    this.children.forEach((child) => child.destroy());
+    this.removeAll();
+    super.destroy();
+  }
+
+  // Unpacks arrays and nested arrays of children
+  add(...children: (ScenegraphNode | ScenegraphNode[])[]): this {
+    for (const child of children) {
+      if (Array.isArray(child)) {
+        this.add(...child);
+      } else {
+        this.children.push(child);
+      }
+    }
+    return this;
+  }
+
+  remove(child: ScenegraphNode): this {
+    const children = this.children;
+    const indexOf = children.indexOf(child);
+    if (indexOf > -1) {
+      children.splice(indexOf, 1);
+    }
+    return this;
+  }
+
+  removeAll(): this {
+    this.children = [];
+    return this;
+  }
+
+  traverse(visitor: (node: ScenegraphNode, context: {worldMatrix: Matrix4}) => void, {worldMatrix = new Matrix4()} = {}) {
+    const modelMatrix = new Matrix4(worldMatrix).multiplyRight(this.matrix);
+
+    for (const child of this.children) {
+      if (child instanceof GroupNode) {
+        child.traverse(visitor, {worldMatrix: modelMatrix});
+      } else {
+        visitor(child, {worldMatrix: modelMatrix});
+      }
+    }
+  }
+}

package/src/scenegraph/model-node.ts

@@ -0,0 +1,50 @@
+import {RenderPass} from '@luma.gl/core';
+import {ScenegraphNode, ScenegraphNodeProps} from './scenegraph-node';
+import {Model} from '../model/model';
+
+export type ModelNodeProps = ScenegraphNodeProps & {
+  model: Model;
+  managedResources?: any[];
+  bounds?: [number[], number[]];
+}
+
+export class ModelNode extends ScenegraphNode {
+  readonly model: Model;
+  bounds: [number[], number[]] | null = null;
+  managedResources: any[];
+
+  // TODO - is this used? override callbacks to make sure we call them with this
+  // onBeforeRender = null;
+  // onAfterRender = null;
+  // AfterRender = null;
+
+  constructor(props: ModelNodeProps) {
+    super(props);
+
+    // Create new Model or used supplied Model
+    this.model = props.model;
+    this.managedResources = props.managedResources || [];
+    this.bounds = props.bounds || null;
+    this.setProps(props);
+  }
+
+  override getBounds(): [number[], number[]] | null {
+    return this.bounds;
+  }
+
+  override destroy(): void {
+    if (this.model) {
+      this.model.destroy();
+      // @ts-expect-error
+      this.model = null;
+    }
+    this.managedResources.forEach((resource) => resource.destroy());
+    this.managedResources = [];
+  }
+
+  // Expose model methods
+  draw(renderPass?: RenderPass) {
+    // Return value indicates if something was actually drawn
+    return this.model.draw(renderPass);
+  }
+}