# Showfer player

Player built on the basis of React Player for full support and work with Showfer streams.

### Usage

```bash
  npm install showfer-player # or yarn add showfer-player
```

```jsx
    import React from 'react';
    import ShowferPlayer from 'showfer-player';
    
    // Render a video player
    <ShowferPlayer url='https://hls.showfer.com/stream/639cdaceeccd07addb877b4e/airy.m3u8' />
```

### Props

| Prop       | Description                             | Default |
|------------|-----------------------------------------|---------|
| `url`      | The url of a video or song to play      |         |
| `width`    | Set the width of the player             | `100%`  |
| `height`   | Set the height of the player            | `100%`  |
| `controls` | Show controls with sound and fullscreen | `true`  |
| `volume`   | Video player volume                     | `0`     |

#### Callback props

Callback props take a function that gets fired on various player events:

| Prop      | Description                                                            |
|-----------|------------------------------------------------------------------------|
| `onReady` | Called when media is loaded and ready to play                          |
| `onStart` | Called when media starts playing                                       |
| `onPlay`  | Called when media starts or resumes playing after pausing or buffering |

### Standalone player
If you aren’t using React, you can still render a player using the standalone library:
```html
<script src="https://cdn.jsdelivr.net/npm/showfer-player@latest/dist/showfer-player.standalone.min.js"></script>
<script>
    const container = document.getElementById('container');
    const url = 'https://hls.showfer.com/stream/62c63bb3d090f36fc5aa4bf1/airy.m3u8';

    renderShowferPlayer(container, {
      url,
      width: '640px',
      height: '360px',
    });
</script>
```