« For Developers: Embedding, JS, APIs

Micrio JS Events: Instance lifecycle

The Micrio client lifecycle JS events

The order of events to know when a Micrio element is initialized, has its required data to start, has drawn its first frame, or is being destroyed is as follows.

All events below fire on the Micrio HTML element, unless specified otherwise.

  1. micrio-created (fires on window)

    A new Micrio JS has been created. This is before any initialization or loading is done.

  2. pre-info

    This fires for any loaded or pre-loaded image data JSON (resolution, base settings), including linked images that are preloaded for tours. The event.detail is the individual image JSON, that can be manipulated at this point.

  3. settings

    The main image data (resolution, low-level settings) has been downloaded and will be processed next. The event.detail is the settings JSON, allowing for any preprocessing manipulation.

  4. preset

    The image info has been loaded and the Camera has been initialized. Nothing else is initialized or loaded yet.

  5. placed

    The Micrio <canvas> HTML element has been placed in the Micrio HTML container.

  6. pre-metadata

    Fires when image content data has been loaded, but not yet initialized. The event.detail is the data JSON. This allows you to change any data (markers, tours, ...) before it gets processed by Micrio.

  7. metadata

    All required data, such as tours and markers, has been succesfully loaded and initialized.

  8. ready & micrio-ready (fires on window).

    Comes directly after metadata and signifies that the image is fully ready to start being drawn. An alternative is the micrio-ready event which fires on the window instead of the Micrio HTML element.

  9. load & show

    The image is fully loaded and the first frame has been succesfully drawn, but the image is still fading in. The event load fires for any Micrio image, even embedded inside another <micr-io> element. The show event only fires on a main <micr-io> element.

  10. drawn

    The first fully opaque (100% opacity) has been drawn! From here on, the Micrio element will be opaque and can be for instance faded in.

  11. load-start and load-end

    These fire when texture downloading starts, or finishes. This event can be used to show or hide a custom loader element.

  12. error

    This event fires for any fatal Micrio errors that might arise. The event.detail is the error detail object. When this event is fired, a fatal Exception will also be thrown.

  13. hide

    The Micrio element is removed.

✉ Can't find what you're looking for? Contact us!