Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Mobile OSVersion
Android-
iOS-
Windows PhoneIE Mobile 11+

Class Documentation

Player Class

...

 
Param
Type
Description
elementString or DOMNodeNode selector or DOMNode the player will be inserted into.
optionsObjectFrequency.Player.Options object 

Player Constructor

Code Block
languagejs
new Frequency.Player({
    config: {// optional
        basePath: '.'
    },
    session: {// mandatory
        'x-frequency-auth': '013ffaa2-a64e-4974-a9ee',
        'x-frequency-deviceid': '5680c4f2-e3fd'
    },
    adConfig: {// optional
        minBitrate: 100,// kbps
        maxBitrate: 5000,// kbps
        maxResolution: '720p',
        minResolution: '720p',
        deliveryFormat: 'progressive',// progressive / streaming
		deliveryProtocol: 'https',// http / https
		format: 'video/mp4'
    },
	controls: { // boolean or object [default: false]
    	player: { // boolean or object [default: true]
			// css: 'sample-link-to--player.css'
        },
		ads: { // boolean or object [default: true]
			// css: 'sample-link-to--adsplayer.css',
            strings: { // optional
	            VIDEO_WILL_START_SOON: 'Keep calm and watch the ad, video will start in [time_left]s...',
                SKIP_AD: 'Skip'
            }
        }
    },
	// Conviva configuration
	conviva: {
    	customer_key: "9e13c48fa88c05e31ab7488167c7bc9cb0d1413b",
	    gateway_url: "https://libertyglobal-test.testonly.conviva.com",
    	tags: {
        	tag1: "value 1",
	        tag2: "value 2"
    	}
	},
    video: "1234567",//optional
    autoplay: true, //optional default false
    events: {// optional
    	onStateChange(state) {
			...
		}  
    }
})

           

Constructs a Player object for video playback.

Constructor also accept element, which will be replaced by video player (* PlayerLite can only accept existing video element)

Code Block
languagejs
// element provided as string
new Frequency.Player('#player', {...});
 
// element provided directly as DOM node
new Frequency.Player(document.getElementById('player'), {...});
new Frequency.PlayerLite(document.getElementsByTagName('video')[0], {...});

Parameters:

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.

session - User session tokens required for activities.

api - Api configuration for activities.

config - player configuration.

Returns:

An initialized Player object.

Player Methods

play

Code Block
play()

Plays the currently loaded video.

Parameters:

None

Returns:

void

pause

Code Block
pause()

Pauses the currently playing video.

Parameters:

None

Returns:

void

seekTo

Code Block
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

Code Block
getDuration()

Returns the duration of the currently playing video in seconds.

Parameters:

None

Returns:

Number - The video duration in seconds.

getState

Code Block
getState()

Returns the video player's current play state.

Parameters:

None

Returns:

Number - The number representing the video playback state. (see video states).

getCurrentTime

Code Block
getCurrentTime()

Returns the lapsed time since the video start in seconds.

Parameters:

None

Returns:

Number - The lapsed video playback time in seconds.

loadVideo

Code Block
loadVideo(video_id[, autoplay:boolean])

Loads the video specified by the video_id string. The onMediaReady event would need to be monitored along with a subsequent video play() method call to cause the loaded video to play.

Parameters:

video_id - string with video_id that will be played

Returns:

void

 

loadChannel

 

Code Block
loadChannel(channel_id[, autoplay:boolean])

 

Loads video feed for specified channel_id. The onMediaReady event would need to be monitored along with a subsequent video play() method call to cause the loaded video to play.

 

Parameters:

 

channel_id - string with channel_id that will be played

 

Returns:

 

void

 

 

 

setVolume

Code Block
setVolume(volume:Number)

Sets player volume.

 Parameters:

 volume - New volume value for player. Value must be in range 0-100 

Returns:

void 

getVolume

Code Block
getVolume()

Returns current volume for the player.

Parameters:

 none

Returns:

 Number

 

isFullscreen 

Code Block
isFullscreen()

Returns true if player is in fullscreen mode.

Parameters:

 none

Returns:

 Boolean

requestFullScreen

Code Block
requestFullScreen()

Tries to put player in fullscreen mode.

Parameters:

 none

Returns:

 none

exitFullScreen

Code Block
exitFullScreen()

Tries to disable fullscreen mode for player.

Parameters:

 none

Returns:

 none

setSession

Code Block
setSession(session:Object)

Updates player session for activities.

Parameters:

session - Session object ({'X-Frequency-Auth': '...', 'X-Frequency-DeviceId': '...'})

Returns:

void

addEventListener

Code Block
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

Code Block
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

Player Video Class

Code Block
Frequency.Player.Options.Video

The Player Video class is a video data structure used for video player initialization along with video playback.

Player properties

version - current player version

Player Events Class

Code Block
Frequency.Player.Events

The Player Events class defines all the events that listeners can register on.

Event

Type

Description

 

onError

Function

An error occurred.

Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onError: (error) => {
				//Error occured
                console.log('onError', error)
            }
	});

onReady

Function

JS player ready for actions.

Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onReady: () => {
				/* Player is ready to take actions
				*  Do not call player before this event
				*/
            }
	});

onMediaReady

Function

Media player ready.

Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onMediaReady: () => {
				/* Player video is ready for playback
				*  if video had autoplay flag it will
				*  start playing after this event
				*/
            }
	});

onStateChange

Function

Player state has changed.

Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onStateChanged: (state) => {
				/* Player state did changed
				*  state is one of the states mentioned above 
				*/
				console.log('New player state: ', state)
            }
	});

onProgress

Function

Players progress changed.

Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onProgress: (currentPlaybackTime) => {
				console.log('Player playback time is: ', currentPlaybackTime)
            }
	});
onVastEventFunctionVast Ad Event occurred. 
onVolumeChangeFunctionPlayer volume has changed.
Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onVolumeChange: (volume) => {
				console.log('Player volume is: ', volume)
            }
	});
onActivityFunctionActivity call succeeded.
Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onActivity: (activity) => {
				console.log('Activity: ', activity, ' was send');
            }
	});
onActivityErrorFunction

Activity call failed.

 

 
onAdFunctionAd event occured
Code Block
languagejs
new Frequency.Player(
    '#player', {
        session: {...},
        video: {..},
        events: {
            onAd: (adMessage) => {
				switch (adMessage.action) {
					case 'start':
						console.log('ad just started to play', adMessage.ad);
						/* adMessage.ad = {
						*	title: ...,
						*	duration: ...,
						*	skipOffset: ...
						*}
						*/
						break;
					case 'end':
						console.log('ad just ended to play');
						break;
					case 'timeupdate':
						console.log('current ad progress is:', adMessage.progress); 
						console.log('current ad duration is:', adMessage.duration);
						break;
				}
            }
	});

Video Playback States

State

Value

Description

UNKNOWN

undefined

Player state is unknown, player setup process did not finished.

UNSTARTED

-1

Player media ready but pending play action.

ENDED

0

Player finished playback.

PLAYING

1

Player is currently playing a video.

PAUSED

2

Player paused.

BUFFERING

3

Player is buffering.

LOCKED

4

Player locked by internal action.

 

SEEKING5Played seeking.
ERROR6Player interface returned error.

 

Code Examples

iOS sample project of implementation of the frequency javascript player in a webview - frequency-ios-sdk-demo.zip.

Android sample project of implementation of the frequency javascript player in a webview - HelloFrequencyPlayer-android.zip.

Demo

Frequency Player Demo

...