Loading files

import { LoadCommand, Viewer } from '@stereograph/teiaviewer';
import { type FileSource } from '@stereograph/teiaviewer-engine';

const viewer = new Viewer();

/**
 * Loads files into the scene: `.gltf`, `.glb` or `.mgeom`, read in workers, the reader picked by
 * the extension of `name`, else of the url.
 */
export async function loadModels() {
  const sources: Array<FileSource> = [
    {
      url: 'https://example.com/models/building.glb',
    },
    {
      url: 'https://example.com/api/geometry?id=42',
      name: 'site.mgeom',
      headers: {
        Authorization: 'Bearer <token>',
      },
    },
  ];

  await new LoadCommand(viewer, sources, {
    // Sets each object's state before it is drawn: no flash of the default look.
    onMeshLoaded: (mesh, _input, proxy) => {
      if (proxy === null) {
        // The object is made, not in the scene yet: its state (visibility, x-ray, layer).
        mesh.visible = mesh.name !== 'Hidden';
      } else {
        // One of its geometries is linked: its material.
        mesh.diffuseColor = 0xcccccc;
      }
    },
  }).execute();
}

// The loading's progress and end.
viewer.signals.onLoadingFinished.connect((info) => {
  console.info(`Loaded in ${info.elapsedTime} s`);
});