Plyr Ads

Preroll plugin for the awesome Plyr media player.

Checkout the demo

Installation

$ npm install plyr-ads --save

Run demo

$ gulp demo

Features

• Google IMA - works with the Google IMA SDK
• Responsive - works with any screen size
• SASS - to include in your build processes

Features currently being developed

• Youtube video as preroll

Planned features (in any order)

• VAST support
• Midroll and postroll
• Api
• Events to hook into like: 'started', 'midpoint', 'ended', etc... ...and whatever else has been raised in issues

If you have any cool ideas or features, please let me know by creating an issue or, of course, forking and sending a pull request.

Initialising

PlyrAds extends on one or many Plyr instance. Make sure to include the Google IMA SDK and ofcourse Plyr.

Html

<script type="text/javascript" src="https://imasdk.googleapis.com/js/sdkloader/ima3.js"></script>

Javascript

var player = plyr.setup();
plyrAds.setup(player, options);

Options

Options must be passed as an object to the setup() method as above or as JSON in data-plyr attribute on each of your target elements:

var player = plyr.setup();
plyrAds.setup(player, {
  adTagUrl: 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator='
});

Option	Type	Default	Description
adTagUrl	String	''	**required** A Google IMA compliant ad tag url.
skipButton	Object	{enabled: true, text: 'Skip ad', delay: 10}	To let the visitor skip the ad at a certain point. See below

Skip button options

Option	Type	Default	Description
enabled	Boolean	true	Toggles if the skip button should be enabled.
text	String	'Skip ad'	The text shown on the skip button.
delay	Integer (seconds)	10	Countdown timer for when the visitor is able to skip the ad.

Thanks

Thanks to Sam Potts and all his contributors who build the awesome Plyr video player.

Copyright and License

The MIT license.