fullscreen:set embed event

{
  "name": "fullscreen:set",
  "payload": {
    "isFullScreen": true
  }
}

<iframe id="omni" src="https://embed.example.omni.co/dashboards/abc123" allow="fullscreen" allowfullscreen></iframe>
<button id="fullscreen-btn">Full screen</button>

<script>
  const iframe = document.getElementById('omni')

  document.getElementById('fullscreen-btn').addEventListener('click', () => {
    // Native fullscreen needs the click's user activation, so the parent
    // requests it on the iframe element itself...
    iframe.requestFullscreen()
    // ...and tells Omni to apply its presentation styling.
    iframe.contentWindow.postMessage(
      { name: 'fullscreen:set', payload: { isFullScreen: true } },
      'https://embed.example.omni.co'
    )
  })

  // Keep the parent in sync however fullscreen was entered or exited
  // (Omni's own button, keyboard shortcut, Esc).
  window.addEventListener('message', ({ data }) => {
    if (data?.source === 'omni' && data.name === 'fullscreen:changed') {
      console.log('fullscreen:', data.payload.isFullScreen)
      if (!data.payload.isFullScreen && document.fullscreenElement) {
        document.exitFullscreen()
      }
    }
  })
</script>