Event Listeners

Estimated reading: 3 minutes

The webXR.tools SDK exposes event-listeners that allow you to add custom logic to 360 Virtual Experiences.

Events

onStateChange

This event is triggered when the state changes, allowing you to execute logic when a hotspot or iFrame updates the state variable.

window.arlene.onStateChange((arlene,state) => {
    if(state.done) {
        // do something
        state.myProperty = true;        // add a variable to the state
        arlene.setState(state);         // update the current state
    }
}

onPersistentStateChange

This event is triggered when the persistensState changes, allowing you to execute logic when a hotspot or iFrame updates the persistensState variable

window.arlene.onPersistentStateChange((arlene,persistensState) => {
    if(persistensState.done) {
        // do something
        if(!persistentState.myProperty) {
            persistentState.myProperty = true;             // update a property of the persistent state
            arlene.setPersistentState(persistentState);    // update the persistent state
        }
    }
}

Objects

The 360 Studio API will expose state and persistentState variables within the Event Listeners, that can enable dynamic interactive experiences.

state

This object keeps the current state and is initialized on page load. State can be set by a hotspot in the scene or using the iFrame SDK.

persistentState

This object keeps the state that needs to persist across sessions and is initialized on the first time the experience loads. persistentState can be set by a hotspot in the scene or using the iFrame SDK.