forked from TheWidlarzGroup/react-native-video-player
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request TheWidlarzGroup#199 from moskalakamil/feat/docs
- Loading branch information
Showing
38 changed files
with
15,631 additions
and
6,663 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| name: Deploy Documentation | ||
|
|
||
| on: | ||
| workflow_dispatch: | ||
| branches: | ||
| - master | ||
| paths: | ||
| - '.github/workflows/deploy-docs.yml' | ||
| - 'docs/**' | ||
| jobs: | ||
| build_and_deploy_docs: | ||
| runs-on: ubuntu-latest | ||
| steps: | ||
| - name: Checkout repository | ||
| uses: actions/checkout@v3 | ||
| with: | ||
| submodules: recursive | ||
|
|
||
| - name: Setup | ||
| uses: ./.github/actions/setup | ||
| with: | ||
| github_token: ${{ secrets.GITHUB_TOKEN }} | ||
|
|
||
| - name: Build Documentation | ||
| run: | | ||
| cd docs | ||
| yarn install | ||
| yarn build | ||
| - name: Deploy to GitHub Pages | ||
| uses: peaceiris/actions-gh-pages@v3 | ||
| with: | ||
| github_token: ${{ secrets.GITHUB_TOKEN }} | ||
| publish_dir: ./docs/build | ||
| user_name: github-actions[bot] | ||
| user_email: 41898282+github-actions[bot]@users.noreply.github.com | ||
| permissions: | ||
| contents: write |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| # Dependencies | ||
| /node_modules | ||
|
|
||
| # Production | ||
| /build | ||
|
|
||
| # Generated files | ||
| .docusaurus | ||
| .cache-loader | ||
|
|
||
| # Misc | ||
| .DS_Store | ||
| .env.local | ||
| .env.development.local | ||
| .env.test.local | ||
| .env.production.local | ||
|
|
||
| npm-debug.log* | ||
| yarn-debug.log* | ||
| yarn-error.log* |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| # Website | ||
|
|
||
| This website is built using [Docusaurus](https://docusaurus.io/), a modern static website generator. | ||
|
|
||
| ### Installation | ||
|
|
||
| ``` | ||
| $ yarn | ||
| ``` | ||
|
|
||
| ### Local Development | ||
|
|
||
| ``` | ||
| $ yarn start | ||
| ``` | ||
|
|
||
| This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server. | ||
|
|
||
| ### Build | ||
|
|
||
| ``` | ||
| $ yarn build | ||
| ``` | ||
|
|
||
| This command generates static content into the `build` directory and can be served using any static contents hosting service. | ||
|
|
||
| ### Deployment | ||
|
|
||
| Using SSH: | ||
|
|
||
| ``` | ||
| $ USE_SSH=true yarn deploy | ||
| ``` | ||
|
|
||
| Not using SSH: | ||
|
|
||
| ``` | ||
| $ GIT_USER=<Your GitHub username> yarn deploy | ||
| ``` | ||
|
|
||
| If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
| # API - Events | ||
|
|
||
| The `react-native-video-player` component exposes a set of events that allow you to interact with and control the video playback. Below, you’ll find a detailed list of these events, their descriptions, and how to use them. These events give you full flexibility to customize the behavior of the video player. | ||
|
|
||
| --- | ||
|
|
||
| ## Component Events | ||
|
|
||
| ### `onStart` | ||
| - **Type**: `function` | ||
| - **Description**: Callback function triggered when the start button is pressed. | ||
| - **Example**: | ||
| ``` | ||
| onStart={() => { | ||
| console.log('Video started!'); | ||
| }} | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ### `onPlayPress` | ||
| - **Type**: `function` | ||
| - **Description**: Callback function triggered when the play button is pressed. | ||
| - **Example**: | ||
| ``` | ||
| onPlayPress={() => { | ||
| console.log('Play button pressed!'); | ||
| }} | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ### `onHideControls` | ||
| - **Type**: `function` | ||
| - **Description**: Callback function triggered when the video controls are hidden. | ||
| - **Example**: | ||
| ``` | ||
| onHideControls={() => { | ||
| console.log('Controls are hidden.'); | ||
| }} | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ### `onShowControls` | ||
| - **Type**: `function` | ||
| - **Description**: Callback function triggered when the video controls are shown. | ||
| - **Example**: | ||
| ``` | ||
| onShowControls={() => { | ||
| console.log('Controls are shown.'); | ||
| }} | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ## Additional Events from `react-native-video` | ||
|
|
||
| The `react-native-video-player` component also supports all events from the underlying [react-native-video](https://github.com/TheWidlarzGroup.com/react-native-video) library. These include events like `onLoad`, `onError`, `onEnd`, and more. | ||
|
|
||
| For a full list of events and how to use them, refer to the [react-native-video events documentation](https://docs.thewidlarzgroup.com/react-native-video/component/events). |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,75 @@ | ||
| # API - Methods | ||
|
|
||
| The `react-native-video-player` component exposes some methods through a ref. These methods provide direct control over video playback, allowing you to customize and manage the player programmatically. | ||
|
|
||
| --- | ||
|
|
||
| ## Using Ref Methods | ||
|
|
||
| To access the methods, you need to create a ref for the `VideoPlayer` component. Here's an example of how to set up a ref and use the available methods: | ||
|
|
||
| ```tsx | ||
| import React, {useRef} from 'react'; | ||
| import VideoPlayer, {type VideoPlayerRef} from 'react-native-video-player'; | ||
|
|
||
| const App = () => { | ||
| const playerRef = useRef<VideoPlayerRef>(null); | ||
|
|
||
| const handlePause = () => { | ||
| playerRef.current?.pause(); | ||
| }; | ||
|
|
||
| return ( | ||
| <VideoPlayer | ||
| ref={playerRef} | ||
| source={{ uri: 'https://example.com/video.mp4' }} | ||
| /> | ||
| ); | ||
| }; | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ## Available Methods | ||
|
|
||
| ### `seek(time)` | ||
| - **Description**: Moves the video playback to the specified `time` (in seconds). | ||
| - **Parameters**: | ||
| - `time` (number): The time in seconds to which the player should seek. | ||
| - **Example**: | ||
| ```ts | ||
| playerRef.current?.seek(30); // Seeks to the 30th second | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ### `pause()` | ||
| - **Description**: Pauses the video playback. | ||
| - **Example**: | ||
| ```ts | ||
| playerRef.current?.pause(); | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ### `resume()` | ||
| - **Description**: Resumes video playback from the current position. | ||
| - **Example**: | ||
| ```ts | ||
| playerRef.current?.resume(); | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| ### `stop()` | ||
| - **Description**: Stops the video playback and resets it to the beginning. | ||
| - **Example**: | ||
| ```ts | ||
| playerRef.current?.stop(); | ||
| ``` | ||
|
|
||
| --- | ||
|
|
||
| The `react-native-video-player` component also supports all methods from the underlying [react-native-video](https://github.com/TheWidlarzGroup.com/react-native-video) library. These include methods like `save`, `setFullScreen`, and more. | ||
|
|
||
| For a full list of methods and how to use them, refer to the [react-native-video methods documentation](https://docs.thewidlarzgroup.com/react-native-video/component/methods). |
Oops, something went wrong.