Skip to content

Picture-in-Picture & Cast

<vega-player src="/video.mp4" enable-pip></vega-player>

The button only appears if the browser supports Picture-in-Picture (document.pictureInPictureEnabled). While the video floats:

  • the player shows a centred “Playing in Picture-in-Picture mode” message (translatable);
  • the fullscreen button is hidden;
  • the call-to-action modal is closed and doesn’t open on pause.

From JavaScript: await player.togglePictureInPicture().

Load Google’s Cast SDK before the player, then add enable-chromecast:

<script src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>
<vega-player src="https://example.com/video.mp4" enable-chromecast></vega-player>

The Cast button appears once the SDK is ready. When a session starts, the current source (including the selected quality or responsive file) is sent to the device with its type, the current time and the poster. The local video pauses, and play(), pause(), setTime() and setVolume() control the TV. When the session ends, playback continues locally from where the TV left off.

With several players on one page, only the one that started the session takes it.

Events: vega-player:chromecast-available, -connected, -disconnected and -error. See Events.