Skip to main content
Using JavaScript events, you can trigger interactions in your application based on events in an Omni iframe.

​
Event shape

Events emitted by Omni use the postMessage protocol and will have the following shape: 
type EmbedEvent<Payload> = {
  payload: Payload
  description: string
  name: EmbedEventName
}

​
Listening for events

Subscribe to events in the parent frame with the following: 
const setFrameHeight = (height) => {
  // do the work to set the iframe element's height here
  // eg. `iframeElement.height = height`
}

const listener = (event) => {
  // Only accept messages from a known origin
  if (event.origin !== "https://example.embed-omniapp.co") return

  switch (event.data.name) {
    case 'size': {
      const { height } = event.data.payload
      height && setFrameHeight(height)
      break
    }
    case 'page:changed': {
      // Do something with the page:changed event, etc
    }
  }
}

// Must attach the event listener for messages.
window.addEventListener('message', listener)

​
Supported events

Omni currently emits the following events:
EventDescription
dashboard:downloadEmitted by Omni when a user downloads an embedded dashboard.
dashboard:filtersEmitted by Omni when a user applies a filter to an embedded document.
dashboard:tile-downloadEmitted by Omni when a user downloads a given tile on a dashboard.
errorEmitted by Omni when a detectable error occurs on an embedded page.
page:changedEmitted by Omni when the URL of a page changes.
sizeEmitted by Omni on dashboard load to give the size of the frame, allowing users to dynamically size the iframe.
statusEmitted by Omni to indicate the status of the dashboard to the parent frame.