Last reviewed 31 Jul 2026
Applies to
Banter VR JavaScript SDK Loading events Runtime utilities
Difficulty Intermediate

Banter Loading Events, File Selection, and Runtime Utilities

Several Banter components load content asynchronously. The SDK exposes loading, progress, and Unity-link events, while BanterScene provides utilities for frame timing, file selection, base64 CDN uploads, and YouTube information.

Wait for the Required Ready State

Register component listeners when the component is created and run dependent logic only after the matching loading or Unity-link event.

  1. Create the GameObject and add its loading component.
  2. Register loaded, progress, or unity-linked listeners immediately.
  3. Check isLoaded before using content that may already have completed.

Listen for Component Loading

const model = new BS.GameObject({
  name: "Model"
});

const gltf = model.AddComponent(
  new BS.BanterGLTF({
    url: "https://example.com/model.glb"
  })
);

gltf.On("loaded", () => {
  console.log("Model ready", gltf.isLoaded);
});

The official reference describes loaded for components that load assets, including GLTF, video, and audio.

Show Loading Progress

gltf.On("progress", (event) => {
  const percent = event.detail.progress * 100;
  console.log(percent + "%");
});

The documented progress value runs from 0 to 1.

Use the event to update a label or progress control rather than repeatedly guessing whether the asset has finished.

Wait for the Unity Link

gltf.On("unity-linked", (event) => {
  console.log(event.detail.unityId);
});

This event reports that the component or GameObject has linked to the Unity engine and exposes the Unity ID in the event detail.

Check isLoaded

if (gltf.isLoaded) {
  console.log("Asset is already ready");
}

Check isLoaded when the listener is registered after another operation may already have completed.

Watch GameObject Updates

model.On("object-update", (event) => {
  console.log(event.detail);
});

The official reference describes the event detail as an array of updated component IDs.

Wait for the End of a Frame

scene.WaitForEndOfFrame();

The documented purpose is to synchronize with the Unity render at the end of the frame.

Select an Image File

scene.SelectFile(
  BS.SelectFileType.Image
);

Use the enum value for the file type. File selection is a user-facing operation, so trigger it from a clear interaction rather than unexpectedly during scene load.

Upload Base64 Data

scene.Base64ToCDN(
  base64Data,
  "myfile.png"
);

The official utility accepts base64 data and a filename for CDN upload.

Keep filename extensions consistent with the encoded media type.

Request YouTube Information

scene.YtInfo("dQw4w9WgXcQ");

The official example passes a YouTube video ID, not a full watch URL.

Common Questions

Why does my code run before the Banter model is ready?

Move dependent logic into the component's loaded handler or check isLoaded before using the asset.

Why is my loading percentage between 0 and 1?

The documented progress value is normalized. Multiply it by 100 when displaying a percentage.

Should YtInfo receive the full YouTube URL?

The official example passes only the YouTube video ID.

Official References

Related Navigation