AirPlay

AirPlay support is implemented as a plugin, meaning it must be installed and enabled separately.

Setup

First, install the @castlabs/react-native-prestoplay-airplay package:

npm install @castlabs/react-native-prestoplay-airplay

Once the plugin is installed, enable it when initializing the SDK, by passing the AirPlayPlugin class. For example:

import {Sdk} from '@castlabs/react-native-prestoplay';
import {AirPlayPlugin} from '@castlabs/react-native-prestoplay-airplay';

Sdk.initialize({
  licenseKey: { /* Valid license here */ },
  plugins: [AirPlayPlugin],
});

Usage

Within a component wrapped by the PlayerProvider, the AirPlay extension can be accessed using the useAirPlay hook. Furthermore, the AirPlay state can be accessed through the useAirPlayState hook. For example:

import React from 'react';
import {Button} from 'react-native';
import {AirPlayState} from '@castlabs/react-native-prestoplay';
import {useAirPlay, useAirPlayState} from '@castlabs/react-native-prestoplay-airplay';

// Wrapped with the PlayerProvider
const MyComponent = () => {
  const airPlay = useAirPlay();
  const airPlayState = useAirPlayState();
  
  if (airPlayState === AirPlayState.Available) {
    return (<Button onPress={() => airPlay.showCastDialog()}>AirPlay</Button>);
  } else {
    return null;
  }
};

Alternatively, the AirPlay extension can be directly accessed through a Player instance. For instance:

import {AirPlayExtension} from '@castlabs/react-native-prestoplay-airplay';
const airPlay = player.getExtension<AirPlayExtension>(AirPlayExtension)
airPlay.showCastDialog();

...and the AirPlay state changes can be observed by registering an event listener on a Player instance. For example:

import {
  AirPlayStateChangedDetails,
  Event,
  EventType,
} from '@castlabs/react-native-prestoplay';
player.addEventListener(EventType.AirPlayStateChanged, (event: Event) => {
  const details = event.details as AirPlayStateChangedDetails;
  console.log("AirPlay state:", details.currentState);
});