# maestro-videojs-vast

> ### Usage ```jsx import videojs from 'maestro-videojs-vast';

Latest version **0.0.7-alpha** (published 2018-06-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install maestro-videojs-vast
pnpm add maestro-videojs-vast
yarn add maestro-videojs-vast
bun add maestro-videojs-vast
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.7-alpha |
| Published | 2018-06-13 |
| First published | 2018-06-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | 8.10.x |
| Dependencies | 0 |
| Unpacked size | 472.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | maestro_io |

## Links

- npm: https://www.npmjs.com/package/maestro-videojs-vast
- npm.io page: https://npm.io/package/maestro-videojs-vast

## Recent versions

- 0.0.7-alpha (latest) — 2018-06-13
- 0.0.6-alpha — 2018-06-13
- 0.0.5-alpha — 2018-06-12
- 0.0.4-alpha — 2018-06-12
- 0.0.3-alpha — 2018-06-12
- 0.0.2-alpha — 2018-06-12
- 0.0.1-alpha — 2018-06-12

## README

# maestro-videojs-vast 

### Usage
```jsx
import videojs from 'maestro-videojs-vast';

import React from 'react';
import videojs from 'maestro-videojs-vast/dist/maestroVideoJsVast.min.js'
import 'maestro-videojs-vast/dist/maestroVideoJsVast.css'

export default class VideoPlayer extends React.Component {
  componentDidMount() {
    // instantiate Video.js
    // make sure you pass in a fallback empty src URL for the video
    this.player = videojs(this.videoNode, this.props, function onPlayerReady() {
      console.log('onPlayerReady', this)
    });
    this.player.ads();
    this.player.vast({
      url: "<vast_url_here>"
    });
  }

  // destroy player on unmount
  componentWillUnmount() {
    if (this.player) {
      this.player.dispose()
    }
  }

  // wrap the player in a div with a `data-vjs-player` attribute
  // so videojs won't create additional wrapper in the DOM
  // see https://github.com/videojs/video.js/pull/3856
  render() {
    return (
      <div>    
        <div data-vjs-player>
          <video ref={ node => this.videoNode = node } className="video-js"></video>
        </div>
      </div>
    )
  }
}

```

### EVENTS

All HTML5 video events, plus videojs event and vast events

Event | Description
--- | ---
adcanplay | ad can play
adclick | ad link was clicked
vast-adended | ad ended
adpause | ad was paused
adtimeupdate | ad time update
vast-preoroll-removed | ad has ended
vast-preroll-skip | ad was skipped

### METHODS
All video.js methods plus...

Method | Description
--- | ---
player.trigger('vast-preroll-skip') | skips vast ad
 
### CREDIT
[video.js](https://github.com/videojs/video.js)  
[video-contrib-ads](https://github.com/videojs/videojs-contrib-ads)  
[videojsx-vast-plugin](https://github.com/philipwatson/videojsx-vast-plugin)

---
_Source: https://npm.io/package/maestro-videojs-vast · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._