Adapter Setup and references

Enable perfect synergy and other advanced settings

It is assumed that you are already familiar with Player Layer Core Concepts and have already read the QuickStart guide.

Provided Adapters

We have a number of adapters you can use out of the box for different players. If your desired player is not already supported, you must create a Custom Adapter using the steps in our guide.

Player	Adapter string to be passed in the initialiser
Brightcove Player	brightcove
Standard HTML 5 player	html5
JW Player	jw
Vimeo Player	vimeo
Youtube Player	youtube

Video Events

Event List

Event	Description
loadedmetadata	Fires when the browser has loaded meta data for the audio
play	Fires when the video has been started or is no longer paused
pause	Fires when the video has been paused
ended	Fires when the current video is ended
setMode	Can be manually called to set/change which UI mode is in use

Example Usage

// notify player layer that player is ready and 
// metadata has been preloaded
player.addEventListener('loadedmetadata', playerLayer.playerReady);

// resume/start player layer playback
player.addEventListener('play', playerLayer.play);

// pause player layer playback
player.addEventListener('pause', playerLayer.pause);

// notifies player layer that video playback ended
player.addEventListener('ended', playerLayer.ended);

// set over mode (mode can be: `over`, `out`)
player.setMode('over')

Player Layer listens to these automatically within the SDK as long as your video player is using the standard HTML DOM events. If it does not, you will need to create a custom adapter.

Player Methods/Properties

Within the Player Layer SDK we can control your video player in response to the MIC Element parameters set by you. We do this automatically as long as your video player is using the standard HTML DOM methods and properties.

Method/Prop List

Method/Prop	Description
play()	Starts playing the video
pause()	Pauses the currently playing video
currentTime	Returns the current playback position in the video (in seconds)
duration	Returns the name of the video and the duration

Example Usage

// resume/start video playback
player.play()

// pause video playback
player.pause()

// get current timecode
player.currentTime

// get duration
player.duration

For more detailed information on all the Events, Methods and Properties we use please read out reference guide.

Serving Ads

Players that manage advertising using VAST or VPAID are able to inject prerolls, interstitials and post-rolls into the video player. During these ads, Player Layer will automatically hide and then show by using a Google IMA3 plugin to listen to the following events.

Advert Events

Event	Description
advStarted()	An ad has started playing.
advEnded()	An ad has finished playing.

Example Usage

  // notifies player layer that advert playback started
  playerLayer.advStarted()
  
  // notifies player layer that advert playback ended
  playerLayer.advEnded()

Moving Player Layer out of the way

From time to time you may need Player Layer to temporarily move out of the way to ensure it is not covering any custom player controls that may be activated by the user. This is common if you have a pop up player timeline with a pause button at the bottom or if you have volume controls in an upper corner.

When these controls you can temporarily stop Player Layer and then start it up again.

Methods you can use

Method	What you use it for
.hibernate	Pauses and removes Player Layer. Can be used to prevent Elements overlaying and to stop any outgoing connections.
.wakeUp	Resumes Player Layer after it has been hibernated.

Example Usage

// Stops Player Layer
playerLayer.hibernate();

// Resumes Player Layer
playerLayer.wakeUp();