glTF Loading

/**
 * Main glTF/GLB file loader with comprehensive configuration and extension support
 */
class GLTFFileLoader implements IDisposable, ISceneLoaderPluginAsync, ISceneLoaderPluginFactory {
  // Static configuration
  static IncrementalLoading: boolean;
  static HomogeneousCoordinates: boolean;
  
  // Core properties
  readonly name: string; // "gltf"
  readonly extensions: { [key: string]: { isBinary: boolean } };
  readonly loaderState: Nullable<GLTFLoaderState>;
  
  // Loading configuration
  coordinateSystemMode: GLTFLoaderCoordinateSystemMode;
  animationStartMode: GLTFLoaderAnimationStartMode;
  compileMaterials: boolean;
  compileShadowGenerators: boolean;
  transparencyAsCoverage: boolean;
  normalizeAnimationSpeed: boolean;
  skipMaterials: boolean;
  skipTextures: boolean;
  skipAnimations: boolean;
  skipSkins: boolean;
  skipCameras: boolean;
  skipLights: boolean;
  skipNodes: boolean;
  skipMeshes: boolean;
  alwaysComputeBoundingBox: boolean;
  loadOnlyVisibleMeshes: boolean;
  loadAllMaterials: boolean;
  imageProcessingConfiguration: Nullable<ImageProcessingConfiguration>;
  useBabylonMaterials: boolean;
  useClipPlane: boolean;
  
  // Observables for lifecycle events
  onMeshLoadedObservable: Observable<AbstractMesh>;
  onTextureLoadedObservable: Observable<BaseTexture>;
  onMaterialLoadedObservable: Observable<Material>;
  onParsedObservable: Observable<IGLTFLoaderData>;
  onCompleteObservable: Observable<void>;
  onErrorObservable: Observable<any>;
  onCameraLoadedObservable: Observable<Camera>;
  onExtensionLoadedObservable: Observable<IGLTFLoaderExtension>;
  onDisposeObservable: Observable<IGLTFLoaderExtension>;
  onValidatedObservable: Observable<IGLTFValidationResults>;
  
  constructor(options?: Partial<Readonly<{
    coordinateSystemMode?: GLTFLoaderCoordinateSystemMode;
    animationStartMode?: GLTFLoaderAnimationStartMode;
    compileMaterials?: boolean;
    compileShadowGenerators?: boolean;
    transparencyAsCoverage?: boolean;
    normalizeAnimationSpeed?: boolean;
    skipMaterials?: boolean;
    skipTextures?: boolean;
    skipAnimations?: boolean;
    skipSkins?: boolean;
    skipCameras?: boolean;
    skipLights?: boolean;
    skipNodes?: boolean;
    skipMeshes?: boolean;
    alwaysComputeBoundingBox?: boolean;
    loadOnlyVisibleMeshes?: boolean;
    loadAllMaterials?: boolean;
    imageProcessingConfiguration?: Nullable<ImageProcessingConfiguration>;
    useBabylonMaterials?: boolean;
    useClipPlane?: boolean;
  }>>);
  dispose(): void;
  createPlugin(options: SceneLoaderPluginOptions): ISceneLoaderPluginAsync;
  canDirectLoad(data: string): boolean;
  directLoad(scene: Scene, data: string): Promise<any>;
  importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onProgress?: (event: ISceneLoaderProgressEvent) => void, fileName?: string): Promise<ISceneLoaderAsyncResult>;
  loadAsync(scene: Scene, data: any, rootUrl: string, onProgress?: (event: ISceneLoaderProgressEvent) => void, fileName?: string): Promise<void>;
  loadAssetContainerAsync(scene: Scene, data: any, rootUrl: string, onProgress?: (event: ISceneLoaderProgressEvent) => void, fileName?: string): Promise<AssetContainer>;
  whenCompleteAsync(): Promise<void>;
}

import { GLTFFileLoader, GLTFLoaderCoordinateSystemMode } from "@babylonjs/loaders";
import { SceneLoader } from "@babylonjs/core";

// Basic usage with automatic loader selection
const result = await SceneLoader.ImportMeshAsync("", "/models/", "robot.glb", scene);

// Advanced configuration
const loader = new GLTFFileLoader({
  coordinateSystemMode: GLTFLoaderCoordinateSystemMode.FORCE_RIGHT_HANDED,
  animationStartMode: GLTFLoaderAnimationStartMode.ALL,
  compileMaterials: true,
  skipTextures: false
});

// Register and use configured loader
SceneLoader.RegisterPlugin(loader);
const result2 = await SceneLoader.ImportMeshAsync("", "/models/", "character.gltf", scene);

// Monitor loading progress
loader.onMeshLoadedObservable.add((mesh) => {
  console.log(`Loaded mesh: ${mesh.name}`);
});

loader.onCompleteObservable.add(() => {
  console.log("Loading complete");
});

enum GLTFLoaderCoordinateSystemMode {
  /** Automatically determine coordinate system based on gltf up vector */
  AUTO = 0,
  /** Force right-handed coordinate system */
  FORCE_RIGHT_HANDED = 1
}

enum GLTFLoaderAnimationStartMode {
  /** Don't start any animations */
  NONE = 0,
  /** Start only the first animation */
  FIRST = 1,
  /** Start all animations */
  ALL = 2
}

enum GLTFLoaderState {
  LOADING = 0,
  READY = 1,  
  COMPLETE = 2
}

/**
 * glTF validation utilities using the official Khronos validator
 */
class GLTFValidation {
  static Configuration: IGLTFValidationConfiguration;
  
  /**
   * Validate a glTF asset using the official validator
   * @param data - glTF data to validate
   * @param rootUrl - Root URL for resolving external resources
   * @param fileName - File name for validation reporting
   * @param getExternalResource - Function to load external resources
   * @returns Promise resolving to validation results
   */
  static ValidateAsync(
    data: ArrayBuffer | string,
    rootUrl: string,
    fileName: string,
    getExternalResource?: (uri: string) => Promise<ArrayBuffer>
  ): Promise<IGLTFValidationResults>;
}

interface IGLTFValidationConfiguration {
  /** URL of the glTF validator service */
  url: string;
}

interface IGLTFValidationResults {
  readonly issues: {
    numErrors: number;
    numWarnings: number;
    numInfos: number;
    numHints: number;
    messages: Array<{
      code: string;
      message: string;  
      severity: number;
      pointer?: string;
    }>;
  };
}

interface IGLTFLoaderData {
  /** Parsed glTF JSON data */
  json: any;
  /** Binary buffer data for GLB files */
  bin: Nullable<IDataBuffer>;
}

interface IGLTFLoaderExtension {
  /** Extension name */
  readonly name: string;
  /** Whether the extension is enabled */
  enabled: boolean;
  /** Loading order (lower numbers load first) */
  order?: number;
}

type GLTFLoaderExtensionOptions = {
  [name: string]: any;
};

interface IGLTFValidationResults {
  readonly issues: {
    numErrors: number;
    numWarnings: number;
    numInfos: number;
    numHints: number;
    messages: Array<{
      code: string;
      message: string;  
      severity: number;
      pointer?: string;
    }>;
  };
}

import { GLTFFileLoader } from "@babylonjs/loaders";

const loader = new GLTFFileLoader();

// Extensions are automatically enabled when present in glTF files
// Monitor extension loading
loader.onExtensionLoadedObservable.add((extension) => {
  console.log(`Loaded extension: ${extension.name}`);
});

// Load a glTF file with extensions
const result = await SceneLoader.ImportMeshAsync("", "/models/", "enhanced_model.gltf", scene);

import { GLTFFileLoader } from "@babylonjs/loaders";

const loader = new GLTFFileLoader();
const assetContainer = await loader.loadAssetContainerAsync(scene, data, rootUrl);

// Assets are loaded but not added to scene
console.log(assetContainer.meshes.length);
console.log(assetContainer.materials.length);

// Add to scene when ready
assetContainer.addAllToScene();

// Or selectively add assets
assetContainer.meshes[0].parent = scene.getRootNodes()[0];

GLTFFileLoader.IncrementalLoading = true;

const loader = new GLTFFileLoader();
loader.onMeshLoadedObservable.add((mesh) => {
  // Process meshes as they load
  mesh.setEnabled(true);
});