@afiniti/video-player/README.md

React component for Afiniti's Video Learning Environment

# @afiniti/video-player

### Description

React video player module built for vimeo and graph cms bases videos.

### Note

This is a work in progress, not ready for production yet. Your feedback would be
appreciated, custom features can also be requested. Only meant for within
organization private usage.

### Installation

npm i @afiniti/video-player

### Features

- Chapters
- Bookmarks
- Play/pause/mute full control over the player

### Props

| Name            | Type     | Description                                |
| --------------- | -------- | ------------------------------------------ |
| `data`          | `object` | video sources in specified format.         |
| `poster`        | `string` | graphcms full url.                         |
| `apiUrl`        | `string` | graphcms api url.                          |
| `autoplay`      | `bool`   | Autoplay slider or not. Defaults to `true` |
| `playerApi`     | `method` | Returns reference to player                |
| `closeCallback` | `method` | Action to perform on video close button    |

### Example Usage

The package can be integrated inside a react component as follows:

```jsx
import React from 'react';
import VideoPlayer from '@afiniti/video-player';

const myVideoPlayer = ({ autoplay }) => {
  return (
    <VideoPlayer
      apiUrl="https://api-euwest.graphcms.com/v1/sdkasndkasndknas/master"
      slug="welcome-home"
      closeCallback={() => {
        setShowVideo(false);
      }}
      autoplay={autoplay}
    />
  );
};

export default myVideoPlayer;
```