diff --git a/docs/pages/component/drm.mdx b/docs/pages/component/drm.mdx index fe02ed33..ae0ceec3 100644 --- a/docs/pages/component/drm.mdx +++ b/docs/pages/component/drm.mdx @@ -77,6 +77,15 @@ getLicense: (spcString, contentId, licenseUrl, loadedLicenseUrl) => { }; ``` +### `contentId` + + + +Type: string\ +Default: undefined + +Specify the content id of the stream, otherwise it will take the host value from `loadingRequest.request.URL.host` (f.e: `skd://testAsset` -> will take `testAsset`) + ### `headers` @@ -121,15 +130,6 @@ You can specify the DRM type, either by string or using the exported DRMType enu Valid values are, for Android: DRMType.WIDEVINE / DRMType.PLAYREADY / DRMType.CLEARKEY. for iOS: DRMType.FAIRPLAY -### `contentId` - - - -Type: string\ -Default: undefined - -Specify the content id of the stream, otherwise it will take the host value from `loadingRequest.request.URL.host` (f.e: `skd://testAsset` -> will take `testAsset`) - ## Common Usage Scenarios ### Send cookies to license server diff --git a/docs/pages/component/events.mdx b/docs/pages/component/events.mdx index a9c418de..d0cc94a3 100644 --- a/docs/pages/component/events.mdx +++ b/docs/pages/component/events.mdx @@ -45,20 +45,22 @@ Callback function that is called when audio tracks change Payload: An **array** of -Property | Type | Description ---- | --- | --- -index | number | Index number of the track -title | string | Description of the track -language | string | 2 letter [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) or 3 letter [ISO 639-2](https://en.wikipedia.org/wiki/List_of_ISO_639-2_codes) language code -type | string | Mime type of track +| Property | Type | Description | +| -------- | ------- | ---------------------------------------------------------------------------------------------------------- | +| index | number | Internal track ID | +| title | string | Descriptive name for the track | +| language | string | 2 letter [ISO 639-1 code](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) representing the language | +| bitrate | number | bitrate of track | +| type | string | Mime type of track | +| selected | boolean | true if track is playing | Example: ```javascript { audioTracks: [ - {language: 'es', title: 'Spanish', type: 'audio/mpeg', index: 0}, - {language: 'en', title: 'English', type: 'audio/mpeg', index: 1}, + { language: 'es', title: 'Spanish', type: 'audio/mpeg', index: 0, selected: true }, + { language: 'en', title: 'English', type: 'audio/mpeg', index: 1 } ]; } ``` @@ -485,6 +487,28 @@ Example: } ``` +### `onTextTrackDataChanged` + + + +Callback function that is called when new subtitle data is available. It provides the actual subtitle content for the current selected text track, if available (mainly WebVTT). + +Payload: + +| Property | Type | Description | +| ---------------- | -------- | -------------------------------------------------- | +| `subtitleTracks` | `string` | The subtitles text content in a compatible format. | + +Example: + +```javascript +{ + subtitleTracks: "This blade has a dark past.", +} +``` + +For details on how to control the visibility of subtitles, see the [subtitleStyle](./props.mdx#subtitleStyle) section. + ### `onTextTracks` @@ -516,28 +540,6 @@ Example: } ``` -### `onTextTrackDataChanged` - - - -Callback function that is called when new subtitle data is available. It provides the actual subtitle content for the current selected text track, if available (mainly WebVTT). - -Payload: - -| Property | Type | Description | -| ---------------- | -------- | -------------------------------------------------- | -| `subtitleTracks` | `string` | The subtitles text content in a compatible format. | - -Example: - -```javascript -{ - subtitleTracks: "This blade has a dark past.", -} -``` - -For details on how to control the visibility of subtitles, see the [subtitleStyle](./props.mdx#subtitleStyle) section. - ### `onVideoTracks` diff --git a/docs/pages/component/methods.mdx b/docs/pages/component/methods.mdx index 3c1363b2..e68e0c5b 100644 --- a/docs/pages/component/methods.mdx +++ b/docs/pages/component/methods.mdx @@ -12,6 +12,14 @@ This page shows the list of available methods Take the player out of fullscreen mode. +### `pause` + + + +`pause(): Promise` + +Pause the video. + ### `presentFullscreenPlayer` @@ -24,14 +32,6 @@ On iOS, this displays the video in a fullscreen view controller with controls. On Android, this puts the navigation controls in fullscreen mode. It is not a complete fullscreen implementation, so you will still need to apply a style that makes the width and height match your screen dimensions to get a fullscreen video. -### `pause` - - - -`pause(): Promise` - -Pause the video. - ### `resume` @@ -40,6 +40,14 @@ Pause the video. Resume the video. +### `restoreUserInterfaceForPictureInPictureStopCompleted` + + + +`restoreUserInterfaceForPictureInPictureStopCompleted(restored)` + +This function corresponds to the completion handler in Apple's [restoreUserInterfaceForPictureInPictureStop](https://developer.apple.com/documentation/avkit/avpictureinpicturecontrollerdelegate/1614703-pictureinpicturecontroller?language=objc). IMPORTANT: This function must be called after `onRestoreUserInterfaceForPictureInPictureStop` is called. + ### `save` @@ -64,14 +72,6 @@ Future: - Will support more formats in the future through options - Will support custom directory and file name through options -### `restoreUserInterfaceForPictureInPictureStopCompleted` - - - -`restoreUserInterfaceForPictureInPictureStopCompleted(restored)` - -This function corresponds to the completion handler in Apple's [restoreUserInterfaceForPictureInPictureStop](https://developer.apple.com/documentation/avkit/avpictureinpicturecontrollerdelegate/1614703-pictureinpicturecontroller?language=objc). IMPORTANT: This function must be called after `onRestoreUserInterfaceForPictureInPictureStop` is called. - ### `seek` @@ -143,6 +143,8 @@ Possible values are: ### `isCodecSupported` + + Indicates whether the provided codec is supported level supported by device. parameters: @@ -156,14 +158,12 @@ Possible results: - `software` - codec is supported by software only - `unsupported` - codec is not supported - - ### `isHEVCSupported` -Helper which Indicates whether the provided HEVC/1920\*1080 is supported level supported by device. It uses isCodecSupported internally. - +Helper which Indicates whether the provided HEVC/1920\*1080 is supported level supported by device. It uses isCodecSupported internally. + ### Example Usage ```tsx diff --git a/docs/pages/component/props.mdx b/docs/pages/component/props.mdx index 0b116f8a..d8232ffa 100644 --- a/docs/pages/component/props.mdx +++ b/docs/pages/component/props.mdx @@ -161,7 +161,7 @@ Determines if the player needs to throw an error when connection is lost or not - **false (default)** - Player will throw an error when connection is lost - **true** - Player will keep trying to buffer when network connect is lost -### `DRM` +### `drm` @@ -209,7 +209,7 @@ Enable video filter. - **false (default)** - Don't enable filter - **true** - Enable filter -### `Focusable` +### `focusable` @@ -280,6 +280,20 @@ Controls the iOS silent switch behavior - **"ignore"** - Play audio even if the silent switch is set - **"obey"** - Don't play audio if the silent switch is set +### `localSourceEncryptionKeyScheme` + + + +Set the url scheme for stream encryption key for local assets + +Type: String + +Example: + +``` +localSourceEncryptionKeyScheme="my-offline-key" +``` + ### `maxBitRate` @@ -434,34 +448,6 @@ Determine whether to repeat the video when the end is reached - **false (default)** - Don't repeat the video - **true** - Repeat the video -### `onAudioTracks` - - - -Callback function that is called when audio tracks change - -Payload: - -| Property | Type | Description | -| -------- | ------- | ---------------------------------------------------------------------------------------------------------- | -| index | number | Internal track ID | -| title | string | Descriptive name for the track | -| language | string | 2 letter [ISO 639-1 code](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) representing the language | -| bitrate | number | bitrate of track | -| type | string | Mime type of track | -| selected | boolean | true if track is playing | - -Example: - -```javascript -{ - audioTracks: [ - { language: 'es', title: 'Spanish', type: 'audio/mpeg', index: 0, selected: true }, - { language: 'en', title: 'English', type: 'audio/mpeg', index: 1 } - ], -} -``` - ### `reportBandwidth` @@ -782,11 +768,18 @@ textTracks={[ ]} ``` -### `trackId` +### `useSecureView` -Configure an identifier for the video stream to link the playback context to the events emitted. +Force the output to a SurfaceView and enables the secure surface. + +This will override useTextureView flag. + +SurfaceView is is the only one that can be labeled as secure. + +- **true** - Use security +- **false (default)** - Do not use security ### `useTextureView` @@ -804,19 +797,6 @@ useTextureView can only be set at same time you're setting the source. - **true (default)** - Use a TextureView - **false** - Use a SurfaceView -### `useSecureView` - - - -Force the output to a SurfaceView and enables the secure surface. - -This will override useTextureView flag. - -SurfaceView is is the only one that can be labeled as secure. - -- **true** - Use security -- **false (default)** - Do not use security - ### `volume` @@ -826,17 +806,3 @@ Adjust the volume. - **1.0 (default)** - Play at full volume - **0.0** - Mute the audio - **Other values** - Reduce volume - -### `localSourceEncryptionKeyScheme` - - - -Set the url scheme for stream encryption key for local assets - -Type: String - -Example: - -``` -localSourceEncryptionKeyScheme="my-offline-key" -``` diff --git a/docs/pages/index.md b/docs/pages/index.md index 86528327..0959fc4b 100644 --- a/docs/pages/index.md +++ b/docs/pages/index.md @@ -3,8 +3,24 @@ ## About `react-native-video` is a React Native library that provides a Video component that renders media content such as videos and streams -## Beta Information -> ⚠️ **Version 6 Beta**: The following documentation may refer to features only available through the v6.0.0 alpha releases, [please see version 5.2.x](https://github.com/react-native-video/react-native-video/blob/v5.2.0/README.md) for the current documentation! +It allows to stream video files (m3u, mpd, mp4, ...) inside your react native application. + +- Exoplayer for android +- AVplayer for iOS, tvOS and visionOS +- Windows UWP for windows +- Trick mode support +- Subtitles (embeded or side loaded) +- DRM support +- Client side Ads insertion (via google IMA) +- Pip (ios) +- Embedded playback controls +- And much more + +The aim of this package is to have a thin and exhaustive control of player. + +## V6.0.0 Information +> ⚠️ **Version 6**: The following documentation refer to features only available through the v6.0.0 releases. +> As major rework has been done in case of doubt, you can still use [version 5.2.x, see documentation](https://github.com/react-native-video/react-native-video/blob/v5.2.0/README.md) Version 6.x requires **react-native >= 0.68.2** > ⚠️ from **6.0.0-beta.8** requires also **iOS >= 13.0** (default in react-native 0.73) @@ -52,27 +68,3 @@ var styles = StyleSheet.create({ }, }); ``` - -### Version 6.0.0 breaking changes - -Version 6.0.0 is introducing dozens of breaking changes, mostly through updated dependencies and significant refactoring. While the API remains compatible, the significant internal changes require full testing with your app to ensure all functionality remains operational. Please view the [Changelog](https://github.com/react-native-video/react-native-video/blob/master/CHANGELOG.md) for specific breaking changes. - -### Installing Version 6.0.0 Beta - -Whilst we finalise version 6.0.0 you can install the latest beta from npm - -Using npm: - -```bash - -npm install --save react-native-video@beta - -``` - -using yarn: - -```bash - -yarn add react-native-video@beta - -``` \ No newline at end of file diff --git a/docs/pages/installation.md b/docs/pages/installation.md index 9187aa94..8b463c26 100644 --- a/docs/pages/installation.md +++ b/docs/pages/installation.md @@ -173,23 +173,3 @@ Select RCTVideo-tvOS Run `pod install` in the `visionos` directory of your project - -## Examples - -Run `yarn xbasic install` in the root directory before running any of the examples. - -### iOS Example -```bash -yarn xbasic ios -``` - -### Android Example -```bash -yarn xbasic android -``` - -### Windows Example -```bash -yarn xbasic windows -``` - diff --git a/docs/pages/other/misc.md b/docs/pages/other/misc.md index 0d69fd76..a1fbd3e2 100644 --- a/docs/pages/other/misc.md +++ b/docs/pages/other/misc.md @@ -60,19 +60,3 @@ The asset system [introduced in RN `0.14`](http://www.reactnative.com/react-nati ## Play in background on iOS To enable audio to play in background on iOS the audio session needs to be set to `AVAudioSessionCategoryPlayback`. See [Apple documentation][3] for additional details. (NOTE: there is now a ticket to [expose this as a prop]( https://github.com/react-native-community/react-native-video/issues/310) ) - -## Examples - -- See an [Example integration][1] in `react-native-login` *note that this example uses an older version of this library, before we used `export default` -- if you use `require` you will need to do `require('react-native-video').default` as per instructions above.* -- Try the included [VideoPlayer example][2] yourself: - - ```sh - git clone git@github.com:react-native-community/react-native-video.git - cd react-native-video/example - npm install - open ios/VideoPlayer.xcodeproj - ``` - - Then `Cmd+R` to start the React Packager, build and run the project in the simulator. - -- [Lumpen Radio](https://github.com/jhabdas/lumpen-radio) contains another example integration using local files and full screen background video. \ No newline at end of file diff --git a/src/specs/VideoNativeComponent.ts b/src/specs/VideoNativeComponent.ts index d654ad78..7bfc43e7 100644 --- a/src/specs/VideoNativeComponent.ts +++ b/src/specs/VideoNativeComponent.ts @@ -310,7 +310,6 @@ export interface VideoNativeProps extends ViewProps { minLoadRetryCount?: Int32; // Android reportBandwidth?: boolean; //Android subtitleStyle?: SubtitleStyle; // android - trackId?: string; // Android useTextureView?: boolean; // Android useSecureView?: boolean; // Android onVideoLoad?: DirectEventHandler; diff --git a/src/types/video.ts b/src/types/video.ts index b32d8b62..55876d71 100644 --- a/src/types/video.ts +++ b/src/types/video.ts @@ -228,7 +228,6 @@ export interface ReactVideoProps extends ReactVideoEvents, ViewProps { shutterColor?: string; // Android textTracks?: TextTracks; testID?: string; - trackId?: string; // Android useTextureView?: boolean; // Android useSecureView?: boolean; // Android volume?: number;