Frequency's player is supported on the following devices and platforms.
| Browser | Engine | Version |
|---|---|---|
The Frequency Javascript video player provides a Javascript class and a set of constructs that makes short form video playback with advertisement a simple task. The supported video formats are:
The Player class plays videos from HTML5 web apps. The Player supports advertisement playback and beaconing along with standalone video playback transparently.
Param | Type | Description |
|---|---|---|
element | String or DOMNode | Node selector or DOMNode the player will be inserted into. |
options | Object | Frequency.Player.Options object |
Param | Type | Description | Default |
|---|---|---|---|
| url | String | The video file url. | - |
| startPosition | Number | The video start position | 0 |
| autoplay | Boolean | Autoplay the video after it is loaded. | false
|
| hls | Boolean | Enables MP4 HLS player | false |
| adConfig | Object | Frequency.Player.AdsConfig object |
Frequency.Player();
Frequency.Player(
undefined, {
video: {
},
events: {
},
(...)
}
); |
Constructs a Player object for video playback.
video - The Frequency.Player.Video object containing the video url, playback start position along with whether to auto play the video once loaded.
events - The Frequency.Player.Events object to bind playback event listeners.
An initialized Player object.
Player Methods
play
play() |
Plays the currently loaded video.
Parameters:
None
Returns:
void
pause() |
Pauses the currently playing video.
Parameters:
None
Returns:
void
seekTo(time:Number) |
Seeks to a specified time in the video.
Parameters:
time - The time position (in seconds) in the video to jump to.
Returns:
void
getDuration() |
Returns the duration of the currently playing video in seconds.
Parameters:
None
Returns:
Number - The video duration in seconds.
getState() |
Returns the video player's current play state.
Parameters:
None
Returns:
Number - The number representing the video playback state. (see video states).
getCurrentTime() |
Returns the lapsed time since the video start in seconds.
Parameters:
None
Returns:
Number - The lapsed video playback time in seconds.
loadVideo(url:String [, options]) |
Loads the video url specified by the url string. This does not auto play the video. The onMediaReady event would need to be monitored along with a subsequent video play() method call to cause the loaded video to play.
Parameters:
url - The url of the video to load.
options - additional options (optional) eg. adsConfig (Frequency.Player.AdsConfig)
Returns:
void
addEventListener(event:String, callback:String) |
Adds a listener function for the specified event.
Parameters:
event - The event to register for listening. (See Player events)
callback - The event handler method of code block.
Returns:
void
removeEventListener(event:String, callback:String) |
Removes a listener function for the specified event.
Parameters:
event - The listening event. (See Player events)
callback - The event handler method or code block.
Returns:
void
Frequency.Player.Options.Video |
The Player Video class is a video data structure used for video player initialization along with video playback.
Frequency.Player.AdsConfig |
Param | Type | Description |
|---|---|---|
adTagUrl | String | VAST document URL |
adCuePoints | Number[] | array of cue points (seconds or "preroll", "postroll") |
Frequency.Player.Events |
The Player Events class defines all the events that listeners can register on.
Event | Type | Description |
|---|---|---|
| Function | An error occurred. |
| Function | JS player ready for actions. |
| Function | Media player ready. |
| Function | Player state has changed. |
| Function | Players progress changed. |
| onVastEvent | Function | Vast Ad Event occurred. |
State | Value | Description |
|---|---|---|
| undefined | Player state is unknown, player setup process did not finished. |
| -1 | Player media ready but pending play action. |
| 0 | Player finished playback. |
| 1 | Player is currently playing a video. |
| 2 | Player paused. |
| 3 | Player is buffering. |
| 4 | Player locked by internal action. |
The sequence to using the Frequency Javascript Player is as follows:
Initialize the Player.
var player = new Frequency.Player(); |
The player can be initialized with video and listener bindings so that it is one-shot ready to play or the player object can be constructed and setting the video to play and event listeners in subsequent method calls.
var player = new Frequency.Player(
undefined, {
video: {
url: 'clips.vorwaerts-gmbh.de/big_buck_bunny.mp4',
startPosition: 50,
autoplay: true,
adsConfig: {
adTagUrl: '/some/url/to/vast.xml',
adCuePoints: [12345, 23456, 34567]
}
},
events: {
onStateChange: function(state) {
},
onProgress: function(currentTime) {
}, (...)
}
}
);
|
Add player event listeners.
player.addEventListener(Frequency.Player.Events.onError, errorHandler); player.addEventListener(Frequency.Player.Events.onProgress, progressHandler); |
Play the video.
player.loadVideo('http://videoURL.mp4);
player.play(); |
Here is a demonstration of the video playback and event handling in a typical HTML5 playback scenario:
Frequency Player Demo