Chromecast

Add the CLCastButton to your application, and start receiving the cast events.

Setup

Initialize the CLVideo with your receiver application ID:

CLVideo.initialize({
  // other properties
  chromecastAppId: 'my-receiver-app-id',
});

iOS

Add additional capabilities to your Info.plist, remember to replace my-receiver-app-id with your actual receiver application ID:

<plist>
    <!-- ... -->
    <dict>
        <!-- ... -->
        <key>NSLocalNetworkUsageDescription</key>
        <string>${PRODUCT_NAME} uses the local network to discover Cast-enabled devices on your WiFi network.</string>
        <key>NSLocationWhenInUseUsageDescription</key>
        <string></string>
        <key>NSAppTransportSecurity</key>
        <dict>
            <key>NSAllowsArbitraryLoads</key>
            <true/>
            <key>NSBonjourServices</key>
            <array>
                <string>_googlecast._tcp</string>
                <string>_my-receiver-app-id._googlecast._tcp</string>
            </array>
            <key>NSExceptionDomains</key>
            <dict>
                <key>localhost</key>
                <dict>
                    <key>localhost</key>
                    <dict>
                        <key>NSExceptionAllowsInsecureHTTPLoads</key>
                        <true/>
                    </dict>
                </dict>
            </dict>
        </dict>
    </dict>
</plist>

Android

Add the activity and metadata tag to the AndroidManiest.xml file:

<manifest>
    <!-- ... -->
    <application>
        <!-- ... -->
        <activity android:name="com.rnsdk.clvideo.cast.CLExpandedControllerActivity"/>

        <meta-data
                android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
                android:value="com.rnsdk.clvideo.cast.CastOptionsProvider" />
    </application>
</manifest>

Usage

Create a CLCastButton instance and link it with CLVideo:

import {CLVideo, CLCastButton} from '@castlabs/react-native-prestoplay';

function Controls(props: {video: CLVideo}) {
  const castButtonRef = useRef<CLCastButton>(null);
  return (
    <CLCastButton 
      ref={castButtonRef} 
      onViewCreated={() => props.video.setCastButton(castButtonRef.current)} 
    />
  );
}