API
Remote Playback
An overview on requesting and tracking remote playback.
Requesting
Section titled RequestingThe player supports playing on a remote device such as a TV when AirPlay or
Google Cast are available. You can request remote playback by using the
AirPlayButton
, GoogleCastButton
,
remote control or via methods on the player instance.
Process
Section titled ProcessThe entire remote playback request process is async and lazy loaded to avoid bloating the player library and your application:
- The Google Cast framework is lazy loaded only on request.
- Once the framework is loaded, the cast prompt is shown.
- When a cast receiver device is selected by the user, the
GoogleCastProvider
is lazy loaded and switched with current provider. The remote cast player is set to the correct state with respect to paused, time, muted, captions, etc. A provider change and setup event is fired in this process. - When the casting session ends, the
GoogleCastProvider
is destroyed. - The previous provider is created and set back to its original state. A provider change and setup event is fired in this process.
AirPlay does not require loading any framework as it’s supported directly on the <audio>
and
<video>
element via the Remote Playback API.
Remote Control
Section titled Remote ControlThe media remote provides methods for dispatching media-airplay-request
and media-google-cast-request
request events like so:
Methods
Section titled MethodsThe following requestAirPlay()
and requestGoogleCast()
methods are available on the player
component instance for requesting remote playback:
State
Section titled StateThe following remote playback properties are available on the media store:
canAirPlay
: Whether AirPlay is supported.canGoogleCast
: Whether Google Cast is supported.remotePlaybackState
: Current remote playback state:connecting
,connected
, ordisconnected
.remotePlaybackType
: Type of remote playback:airplay
orgoogle-cast
.remotePlaybackInfo
: Contains the device name when using Google Cast.isAirPlayConnected
: Whether the player is connected via AirPlay.isGoogleCastConnected
: Whether the player is connected via Google Cast.
Styling
Section titled StylingThe following media data attributes are available for styling based on the current remote playback state:
Events
Section titled EventsThe following events are available for detecting remote playback changes: