Micrio client Events API Client 4.x
WARNING
This page is about the Micrio client version 4. Use the links below to navigate to other versions.
Since the <micr-io> element is an instance of the generic HTMLElement class, this means that all HTMLElement APIs can also be used with <micr-io>.
Reading events
All Micrio-specific events (CustomEvent) fire on the <micr-io> HTML element itself. So for instance, if you want to listen to a marker-opened event, you can do this:
js
// Your HTML element reference
const image = document.querySelector('micr-io');
// Add the event listener
image.addEventListener('marker-opened', e => {
console.log('Marker was opened!', e.detail);
});List of event
| Event name | evt.detail value | Description | |
|---|---|---|---|
General | |||
show | HTMLMicrioElement | The main Micrio image is loaded and fully shown | |
load | MicrioImage | Individual image data is loaded and Micrio will start rendering | |
Camera events | |||
zoom | Float64Array | The camera has zoomed | |
move | View | The camera has moved | |
draw | - | A frame has been drawn | |
resize | DOMRect | A frame has been drawn | |
Markers | |||
marker-open | Marker JSON | A marker has been opened and the camera animation is starting | |
marker-opened | Marker JSON | A marker has been fully opened and the camera is done, and popup shown | |
marker-close | Marker JSON | A marker starts closing | |
marker-closed | Marker JSON | A marker has been succesfully closed | |
Marker Tours and Video Tours | |||
tour-start | Tour JSON | A tour has been succesfully started | |
tour-step | MarkerTour JSON | Fires for each marker step in a marker tour | |
tour-stop | Tour JSON | A tour has been succesfully stopped | |
tour-event | VideoTourEvent JSON | When a video tour has custom events, they will be fired like this | |
Main media (video, audio) | |||
audio-init | - | The audio controller has been succesfully initialized and can play audio | |
audio-mute | - | The audio has been muted | |
audio-unmute | - | The audio has been unmuted | |
autoplay-blocked | - | Fires when there is autoplay audio or video which was disallowed by the browser | |
media-play | - | Media has started playing | |
media-pause | - | Media has stopped playing | |
timeupdate | number | A media timeupdate tick | |
Splitscreen views | |||
splitscreen-start | - | Split screen mode has started | |
splitscreen-stop | - | Split screen mode has stopped | |
Special cases | |||
update | Array<event-types> | When there is any user action, this event fires. This event is deferred and will fire at a maximum rate of every 500ms. The evt.details is an array of event types fired within the interval. | |