{"id":19633270,"url":"https://github.com/quipper/react-native-brightcove-player","last_synced_at":"2025-04-28T07:30:46.516Z","repository":{"id":38960810,"uuid":"133482873","full_name":"quipper/react-native-brightcove-player","owner":"quipper","description":" A React Native implementation of Brightcove Player SDK.","archived":false,"fork":false,"pushed_at":"2023-01-04T21:41:44.000Z","size":942,"stargazers_count":42,"open_issues_count":53,"forks_count":68,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-24T19:01:53.161Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/quipper.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-05-15T08:11:53.000Z","updated_at":"2024-02-15T01:24:51.000Z","dependencies_parsed_at":"2023-02-02T21:01:20.652Z","dependency_job_id":null,"html_url":"https://github.com/quipper/react-native-brightcove-player","commit_stats":null,"previous_names":["manse/react-native-brightcove-player"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quipper%2Freact-native-brightcove-player","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quipper%2Freact-native-brightcove-player/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quipper%2Freact-native-brightcove-player/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quipper%2Freact-native-brightcove-player/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/quipper","download_url":"https://codeload.github.com/quipper/react-native-brightcove-player/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251271082,"owners_count":21562487,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-11T12:16:51.417Z","updated_at":"2025-04-28T07:30:45.877Z","avatar_url":"https://github.com/quipper.png","language":"Java","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Native Brightcove Player\n\n\u003cimg src=\"https://user-images.githubusercontent.com/443965/58468251-2e0a5b00-8178-11e9-87b7-0acd15b750ba.jpg\" width=\"500\"\u003e\n\n- A React Native implementation of Brightcove Player SDK.\n- Supported Features\n  - Brightcove player component\n  - Poster image component\n  - Retrieving playlist\n  - Managing offline playback with Dynamic Delivery\n\n## Supported Version\n\n- iOS 10 \u003e=\n- Android 5.0 \u003e=\n- Brightcove SDK 6.x\n\n## Installation\n\n```console\nyarn add react-native-brightcove-player\n```\n\n### iOS\n\n- Add source to `Podfile` and `pod install \u0026\u0026 pod update`\n- Specify platform version to `10.0`\n- [Example](https://github.com/manse/react-native-brightcove-player/commit/d4d15dbff828c19fd110fe5764c2c72279e50d6a)\n\n```rb\nsource 'https://github.com/brightcove/BrightcoveSpecs.git'\n\nplatform :ios, '10.0'\n```\n\n### Android\n\n- Add maven source to repositories in `android/build.gradle`\n- [Enables multiDex](https://developer.android.com/studio/build/multidex).\n- [Example](https://github.com/manse/react-native-brightcove-player/commit/337450274a0c7ed3b8de890837e60949e6df1db0)\n\n```gradle\nallprojects {\n  repositories {\n      maven {\n          url 'http://repo.brightcove.com/releases'\n      }\n  }\n}\n```\n\n## API\n\n### BrightcovePlayer\n\n```jsx\nimport { BrightcovePlayer } from 'react-native-brightcove-player';\n\nexport default class App extends Component {\n  render() {\n    return (\n      \u003cView style={styles.container}\u003e\n        \u003cBrightcovePlayer\n          style={styles.player}\n          accountId=\"3636334163001\"\n          videoId=\"3666678807001\"\n          policyKey=\"BCpkADawqM1W-vUOMe6RSA3pA6Vw-VWUNn5rL0lzQabvrI63-VjS93gVUugDlmBpHIxP16X8TSe5LSKM415UHeMBmxl7pqcwVY_AZ4yKFwIpZPvXE34TpXEYYcmulxJQAOvHbv2dpfq-S_cm\"\n        /\u003e\n      \u003c/View\u003e\n    );\n  }\n}\n```\n\n- Video player component of Brightcove.\n- It may not work on Android simulator.\n- For a more detailed example, please see [example](https://github.com/manse/react-native-brightcove-player/blob/master/example/).\n\n| Prop                   | Type     | Description                                                                                                                                                                                                                       | Event Object                 |\n| ---------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------- |\n| accountId              | string   | Brightcove AccountId. Required                                                                                                                                                                                                    |                              |\n| policyKey              | string   | Brightcove PolicyKey. Required                                                                                                                                                                                                    |                              |\n| videoId                | string   | Brightcove VideoId to playback.                                                                                                                                                                                                   |                              |\n| referenceId            | string   | Brightcove ReferenceId to playback.                                                                                                                                                                                               |                              |\n| videoToken             | string   | Offline video token that generated by [BrightcovePlayerUtil](#BrightcovePlayerUtil). Video download session must be completed before setting prop and playback. If set `videoToken`, `videoId` and `referenceId` will be ignored. |                              |\n| autoPlay               | boolean  | Set `true` to play automatically                                                                                                                                                                                                  |                              |\n| play                   | boolean  | Control playback and pause                                                                                                                                                                                                        |                              |\n| fullscreen             | boolean  | Control full screen state                                                                                                                                                                                                         |                              |\n| volume                 | number   | Set audio volume (`0.0 ~ 1.0`)                                                                                                                                                                                                    |                              |\n| bitRate                | number   | Set maximum buffering bitrate. Set `0` to automatic quality                                                                                                                                                                       |                              |\n| playbackRate           | number   | Set playback speed scale. Default is `1`                                                                                                                                                                                          |                              |\n| disableDefaultControl  | boolean  | Disable default player control. Set `true` when you implement own video controller.                                                                                                                                               |                              |\n| onReady                | Function | Indicates the video can be played back                                                                                                                                                                                            |                              |\n| onPlay                 | Function | Indicates the video playback starts                                                                                                                                                                                               |                              |\n| onPause                | Function | Indicates the video is paused                                                                                                                                                                                                     |                              |\n| onEnd                  | Function | Indicates the video is played to the end                                                                                                                                                                                          |                              |\n| onProgress             | Function | Indicates the playback head of the video advances.                                                                                                                                                                                | `{ currentTime: number }`    |\n| onChangeDuration       | Function | Indicates the video length is changed                                                                                                                                                                                             | `{ duration: number }`       |\n| onUpdateBufferProgress | Function | Indicates the video loading buffer is updated                                                                                                                                                                                     | `{ bufferProgress: number }` |\n| onEnterFullscreen      | Function | Indicates the player enters full screen                                                                                                                                                                                           |                              |\n| onExitFullscreen       | Function | Indicates the player exit full screen                                                                                                                                                                                             |                              |\n\n| Method                                | Description                       |\n| ------------------------------------- | --------------------------------- |\n| seekTo(timeInSeconds: number) =\u003e void | Change playhead to arbitrary time |\n\n### BrightcovePlayerPoster\n\n```jsx\nimport { BrightcovePlayerPoster } from 'react-native-brightcove-player';\n\nexport default class App extends Component {\n  render() {\n    return (\n      \u003cView style={styles.container}\u003e\n        \u003cBrightcovePlayerPoster\n          style={styles.player}\n          accountId=\"3636334163001\"\n          videoId=\"3666678807001\"\n          policyKey=\"BCpkADawqM1W-vUOMe6RSA3pA6Vw-VWUNn5rL0lzQabvrI63-VjS93gVUugDlmBpHIxP16X8TSe5LSKM415UHeMBmxl7pqcwVY_AZ4yKFwIpZPvXE34TpXEYYcmulxJQAOvHbv2dpfq-S_cm\"\n          resizeMode=\"contain\"\n        /\u003e\n      \u003c/View\u003e\n    );\n  }\n}\n```\n\n- Displays a poster specified by `videoId`, `referenceId` or `videoToken`.\n- Prop is about the same as `BrightcovePlayer`.\n\n| Prop        | Type   | Description                                                                                                                                                                                                                          |\n| ----------- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| accountId   | string | Required                                                                                                                                                                                                                             |\n| policyKey   | string | Required                                                                                                                                                                                                                             |\n| videoId     | string |                                                                                                                                                                                                                                      |\n| referenceId | string |                                                                                                                                                                                                                                      |\n| videoToken  | string |                                                                                                                                                                                                                                      |\n| resizeMode  | string | Set the image resize method. Specifying `cover` or `contain` works the same as CSS keywords of `background-size`. Specifying `fit`, scales to fit the component size without considering aspect ratio of the image. Default value is `cover`. |\n\n### BrightcovePlayerUtil\n\n- Promise for all methods may be invoke `reject`. Be sure to catch the exception.\n\n#### requestDownloadVideoWithVideoId, requestDownloadVideoWithReferenceId\n\n```ts\nBrightcovePlayerUtil.requestDownloadVideoWithVideoId(accountId: string, policyKey: string, videoId: string, bitRate?: number): Promise\u003cstring\u003e\nBrightcovePlayerUtil.requestDownloadVideoWithReferenceId(accountId: string, policyKey: string, referenceId: string, bitRate?: number): Promise\u003cstring\u003e\n```\n\n- Starts downloading the specified video with `videoId` or `referenceId` for offline playback.\n- Returns `VideoToken` in string wrapped with `Promise`. This value will be used for offline playback with `BrightcovePlayer`, acquisition for download status or deletion of offline videos.\n  - Note that this promise resolves the download start, not the download complete.\n  - In case that specified video has already been downloaded `Promise` will be rejected.\n  - If the download is in progress, the download is retried on iOS and rejected on Android.\n- Does not work properly on simulator.\n- `bitrate` controls the quality of the downloading video in `bps`.\n  - Downloads a rendition with the largest bitrate less than or equal to this value.\n  - If no rendition can be found with a bitrate that is smaller than or equal to this bitrate, the lowest rendition will be downloaded.\n  - If this value is `0` or not specified, the lowest rendition with video will be downloaded.\n\n#### getOfflineVideoStatuses\n\n```ts\nBrightcovePlayerUtil.getOfflineVideoStatuses(accountId: string, policyKey: string): Promise\u003c{\n  accountId: string;\n  videoId: string;\n  videoToken: string;\n  downloadProgress: number;\n}[]\u003e\n```\n\n- Lists downloaded offline videos and downloading progresses.\n- `downloadProgress` equals `1` indicates that offline playback available.\n  - Otherwise the download is in progress and the value shows the progress ratio in `0.0 ~ 1.0`.\n- Note that iOS returns offline videos for all accounts but Android only returns for the specified account. In other words iOS does not consider `accountId` and `policyKey`.\n\n#### deleteOfflineVideo\n\n```ts\nBrightcovePlayerUtil.deleteOfflineVideo(accountId: string, policyKey: string, videoToken: string): Promise\u003cvoid\u003e\n```\n\n- Deletes offline videos or abort the ongoing download session.\n\n#### addOfflineNotificationListener\n\n```ts\nBrightcovePlayerUtil.addOfflineNotificationListener(callback: (statuses: {\n  accountId: string;\n  videoId: string;\n  videoToken: string;\n  downloadProgress: number;\n}[]) =\u003e void): Function\n```\n\n- Register a callback to notify storage changes such as video download progress or deletion of offline video.\n- Make sure call disposer function when callback is no longer needed.\n\n```ts\nclass Example extends Component {\n  componentDidMount() {\n    this.disposer = BrightcovePlayerUtil.addOfflineNotificationListener(console.log);\n  }\n\n  componentWillUnmount() {\n    this.disposer();\n  }\n\n  render() {\n    ...\n  }\n}\n```\n\n#### getPlaylistWithPlaylistId, getPlaylistWithReferenceId\n\n```ts\nBrightcovePlayerUtil.getPlaylistWithPlaylistId(accountId: string, policyKey: string, playlistId: string): Promise\u003c{\n  accountId: String;\n  videoId: String;\n  referenceId: String;\n  name: String;\n  description: String;\n  duration: number;\n}[]\u003e;\nBrightcovePlayerUtil.getPlaylistWithReferenceId(accountId: string, policyKey: string, referenceId: string): Promise\u003c{\n  accountId: String;\n  videoId: String;\n  referenceId: String;\n  name: String;\n  description: String;\n  duration: number;\n}[]\u003e;\n```\n\n- Retrieves a playlist specified by `playlistId` or `referenceId`.\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fquipper%2Freact-native-brightcove-player","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fquipper%2Freact-native-brightcove-player","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fquipper%2Freact-native-brightcove-player/lists"}