VdoPlayer

Newer version available

You are seeing documentation of an older player version. Check the embed code for newer player v2. The new player has shorter load-times, more customisable and has a lot of new features. There are many more API methods & events also supported. See how to connect API to v2 player. And the full list of HTML5-like APIs and more APIs.

An instance of this class is created for every video embedded into the page. This class initializes the playback. it also exposes a set of utility methods and properties to provide a common js api interface for all vdocipher videos.

This class creates an iframe inside the container element. The iframe loads an internal player based on device capabilities. This class maintains a sync between the internal player properties. It exposes a common set of properties, methods and events irrespective of underlying player or device.

The properties are updated based on underlying player events and relies on async postMessage actions. Hence, there can be delay (~200ms).

• All properties are read-only
• Directly created instances of this class will not be accessible from the vdo.getObjects() method.

Public Constructor Summary

Function	Definition
constructor (embedInfo: embedInfoType)	set up the properties and start loading

Public Member Summary

Member
bufferLength : number	the player position till which video will play if network connection breaks
currentTime : number	this is a read-only property currently
ended : boolean
errorMessage : string
fullscreen : boolean
hasError : boolean
idle : boolean
isBuffering : boolean
loop : Boolean
muted : boolean	if the volume is 0 or muted
playbackRate : number
status : *	Status can be [-1, 0, 1, 2, 3] -1: video is still loading 0: ready to play 1: playing 2: paused 3: ended
statusText : String	can be one of loading, loaded, playing, paused, ended
title : *
totalCovered : number
totalCoveredArray : number[]
totalPlayed : number
volume : number

Public Method Summary

Method
addEventListener (event: string, callback: function(eventName: string, payload: object): void): function	add an event listener Note that you can add multiple event listeners to the same event and they will all be called in the order they were added list of events load play pause seeking progress ended volumechange mpmlLoad
canPlayType(type: String): string	always false the player object like to emulate an actual HTML5 player but is not capable to directly play third-party videos.
chooseTrack (trackId: number)	selects a track to play Not implemented
injectThemeHtml(htmlStr: String, warn: boolean)	inject html as a string into the theme
mute()	mutes the video
pause()	pauses a playing video
play()	starts the video or resume a paused video
seek(position: number)	Seeks to a specified time in the video
selectQualityTrack(trackId: Number)	chooses quality by trackId
setAdaptive(isAdaptive: boolean)	enable auto-adaptive switching of bitrates
setPlaybackRate(rate: number)	changes the speed of player among the available possible speed
setVolume(volume: number)	sets the volume of video
togglePlayback()	this method was deprecated instead of using this method check status and use play and pause methods
unmute()	unmutes the video

Public Constructor

public constructor(embedInfo: embedInfoType)

set up the properties and start loading

1. set up default properties
2. set up the event listener properties
3. create a proxy messengar to listen to events from the other side.
4. load the meta data for the video
5. once meta is loaded, begin rest of the work

Params:

Name	Type	Attribute	Description
embedInfo	embedInfoType		embed information

Public Members

public bufferLength: number

the player position till which video will play if network connection breaks

public currentTime: number

this is a read-only property currently. Use the seek method to change currentTime.

public ended: boolean

public errorMessage: string

public fullscreen: boolean

public hasError: boolean

public idle: boolean

public isBuffering: boolean

public loop: Boolean

public muted: boolean

if the volume is 0 or muted Note that the volume can be non-zero when muted is true

public playbackRate: number

public status: \*

Status can be [-1, 0, 1, 2, 3]

1. video is still loading
2. ready to play
3. playing
4. paused
5. ended

public get statusText: String

can be one of loading, loaded, playing, paused, ended

public title: \*

public totalCovered: number

public totalCoveredArray: number[]

public totalPlayed: number

public volume: number

Public Methods

public addEventListener(event: string, callback: function(eventName: string, payload: object): void): function

add an event listener Note that you can add multiple event listeners to the same event and they will all be called in the order they were added list of events

• load
• play
• pause
• seeking
• progress
• ended
• volumechange
• mpmlLoad

Params

Name	Type	Attribute	Description
event	string		name of event
callback	function(eventName: string, payload: object): void		which will be called

Return:

function - unsubscribe method: call this closure to remove this event listener

public canPlayType(type: String): string

always false the player object like to emulate an actual HTML5 player but is not capable to directly play third-party videos. will always return false.

Params

Name	Type	Attribute	Description
type	String

Return

string

public chooseTrack(trackId: number)

selects a track to play Not implemented

Params

Name	Type	Attribute	Description
trackId	number		integer starting 0

public injectThemeHtml(htmlStr: String, warn: boolean)

inject html as a string into the theme.

Params

Name	Type	Attribute	Description
htmlStr	String
warn	boolean

public mute()

mutes the video

public pause()

pauses a playing video

public play()

starts the video or resume a paused video

public seek(position: number)

Seeks to a specified time in the video. If the player is paused when the function is called, it will remain paused. If the function is called from another state (playing, ended, etc.), the player will play the video.

Params:

Name	Type	Attribute	Description
position	number		in seconds

public selectQualityTrack(trackId: Number)

chooses quality by trackId

Params:

Name	Type	Attribute	Description
trackId	number

public setAdaptive(isAdaptive: boolean)

enable auto-adaptive switching of bitrates

Params:

Name	Type	Attribute	Description
isAdaptive	boolean

public setPlaybackRate(rate: number)

changes the speed of player among the available possible speed

Params:

Name	Type	Attribute	Description
rate	number		float between 0 and 5

public setVolume(volume: number)

sets the volume of video. Takes argument of float value between 0 and 1. 1 means maximum volume.

Params:

Name	Type	Attribute	Description
volume	number		float between 0 and 1

public togglePlayback()

this method was deprecated

instead of using this method check status and use play and pause methods

starts, resume the video if not playing, pauses if playing

public unmute()

unmutes the video