npm package: @ngenux/ng-react-native-video-player
Description: React Native video player with controls
Author: Srinth Reddy Gujula
Latest version: 0.2.1

# NGVideoPlayer React Native Component

The `NGVideoPlayer` is a versatile React Native video player component that allows you to integrate video playback into your mobile applications. It comes with a wide range of customizable props to enhance your video viewing experience. This player uses
react-native-video for the video playback.

## Installation

To use the `NGVideoPlayer` component in your React Native project, follow these installation steps:

1. Install the package via npm or yarn:

   ```shell
   npm install ng-react-native-video-player react-native-video react-native-vector-icons --save
   # or
   yarn add ng-react-native-video-player react-native-video react-native-vector-icons
   ```

2. Import the `NGVideoPlayer` component into your project:

   ```javascript
   import NGVideoPlayer from 'ng-react-native-video-player';
   ```

3. Now, you're ready to use the `NGVideoPlayer` component in your application.

## Usage

Here's an example of how to use the `NGVideoPlayer` component with the available props:

```javascript
import React from 'react';
import { View } from 'react-native';
import NGVideoPlayer from 'ng-react-native-video-player';

const App = () => {
  return (
    <View style={{ flex: 1 }}>
      <NGVideoPlayer
        autoPlay={true}
        showFullScreenButton={true}
        videoRef={yourVideoRef}
        data={{hdPath: 'hd video path', mdPath: 'md video path', ldPath: 'md video path', drm:true, token: 'drm token'}}
        drmLicenceServer={yourDRMLicenceServer}
        drmLicenceType={yourDRMLicenceType}
        onBack={handleBackButtonClick}
        showVideoFullScreen={true}
        onSelectQuality={handleQualitySelection}
        src={'video source default path'}
        playTime={initialPlayTime}
        onComplete={handleVideoCompletion}
        onQualityChange={handleQualityChange}
        isShowPIP={true}
        onNext={handleNextVideo}
        onPrev={handlePreviousVideo}
        currentIndex={currentVideoIndex}
        totalVideoCount={totalVideoCount}
        setCurrentVideoDuration={handleSetVideoDuration}
        currentVideoDuration={currentVideoDuration}
        onPIPClose={handlePIPClose}
        isDownloaded={isVideoDownloaded}
        trackMarkers={yourTrackMarkers} // array of track markers in sec [10, 50, 195, 1084]
        videoName={yourVideoName}
        isPaused={isVideoPaused}
        setIsPaused={setVideoPausedState}
        onPIPFullScreen={handlePIPFullScreen}
        disablePreviousNext={disablePreviousAndNext}
        setIsVideoLoaded={setVideoLoadedState}
      />
    </View>
  );
};

export default App;
```

## Props

Here is a list of available props for the `NGVideoPlayer` component:

- `autoPlay` (boolean) - Automatically start playing the video.
- `showFullScreenButton` (boolean) - Show or hide the full-screen button.
- `videoRef` (object) - Reference to the video element.
- `data` (object) - Video data or configuration.
- `drmLicenceServer` (string) - DRM (Digital Rights Management) license server URL.
- `drmLicenceType` (string) - Type of DRM license.
- `onBack` (function) - Callback function when the back button is pressed.
- `showVideoFullScreen` (boolean) - Show the video in full-screen mode.
- `onSelectQuality` (function) - Callback function when the video quality is selected.
- `src` (string) - Video source URL.
- `playTime` (number) - Initial playtime of the video.
- `onComplete` (function) - Callback function when the video playback is completed.
- `onQualityChange` (function) - Callback function when the video quality changes.
- `isShowPIP` (boolean) - Show the Picture-in-Picture (PiP) mode.
- `onNext` (function) - Callback function for the next video.
- `onPrev` (function) - Callback function for the previous video.
- `currentIndex` (number) - Current video index.
- `totalVideoCount` (number) - Total number of videos in the playlist.
- `setCurrentVideoDuration` (function) - Callback function to set the current video duration.
- `currentVideoDuration` (number) - Current video duration.
- `onPIPClose` (function) - Callback function when Picture-in-Picture mode is closed.
- `isDownloaded` (boolean) - Indicates if the video is downloaded.
- `trackMarkers` (array) - Array of track markers for the video.
- `videoName` (string) - Name or title of the video.
- `isPaused` (boolean) - Indicates if the video is paused.
- `setIsPaused` (function) - Callback function to set the pause state of the video.
- `onPIPFullScreen` (function) - Callback function when PiP mode is switched to full-screen.
- `disablePreviousNext` (boolean) - Disable previous and next video navigation.
- `setIsVideoLoaded` (function) - Callback function to set the video loaded state.

Please refer to the documentation for detailed information on how to use each prop and customize the `NGVideoPlayer` component according to your needs.

## License

This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.

Feel free to contribute and make improvements to the `NGVideoPlayer` component. If you encounter any issues or have suggestions, please open an issue on the GitHub repository.