Universal Web Player SDK Version 3

Introduction

Welcome to the Anvato Web Player documentation. If you are a new user, start coding at Quick Start section with examples that will get you embedding in no time.

Embed options and configuration are discussed at Configuration Options. Common integration questions are answered at Integration section. Finally checkout the Plugins section for advanced use cases.

Quick Start

Embedding a video

1. Add the script tag ​<script src='//w3.cdn.anvato.net/player/prod/v3/scripts/anvload.js'></script>

2. Provide a player placeholder ​<div id="player"></div>

3. Call the init method with player configuration as shown below AnvatoPlayer("player").init({     url: "//mcp-download.storage.googleapis.com/anv-videos/variant/3697036.m3u8",     title: "Sintel" });

The following is a live example:

<script src="//w3.cdn.anvato.net/player/prod/v3/scripts/anvload.js"></script>
<div id="player"></div>
<script> 
    AnvatoPlayer("player").init({
        url: "https://mcp-download.storage.googleapis.com/anv-videos/variant/3697036.m3u8", 
        width: "100%", 
        poster: "https://mcp-media.storage.googleapis.com/anv-iupl/5FA/ACA/5FAACA8FB2F3459C81F2CEF515615DAF", 
        title: "Sintel", 
        description: "Third Open Movie by Blender Foundation"
    });
</script> 

Playing a playlist

If you have multiple videos, you can play them as a playlist. Providing an array of objects populated with video URLs in the playlist parameter is sufficient. ​AnvatoPlayer("player").init({     "playlist": [      {      url: "url1"      title: "title1",      poster: "poster1"      },      {      url: "url2"      title: "title2",      poster: "poster2"      },      {      url: "url3"      title: "title3",      poster: "poster3"      },     ] });

<script src='//w3.cdn.anvato.net/player/prod/v3/scripts/anvload.js'></script>
<div id="player"></div>
<script> 
    AnvatoPlayer("player").init({ 
        playlist: [
            {
                url: "https://mcp-download.storage.googleapis.com/anv-videos/variant/3697596.m3u8",
                title: "Elephant`s Dream",
                poster: "https://mcp-media.storage.googleapis.com/anv-pvw/AF6/ABE/AF6ABE1D34FE42F3AAD5C72216AC41C7_7.jpg"
            },
            {
                url: "https://mcp-download.storage.googleapis.com/anv-videos/variant/3697658.m3u8",
                title: "Cosmos Laundromat",
                poster: "https://mcp-media.storage.googleapis.com/anv-pvw/F34/4C3/F344C330F8A147E4AA776B26550AD2EA_8.jpg"
            },
            {
                url: "https://mcp-download.storage.googleapis.com/anv-videos/variant/3697661.m3u8",
                title: "Caminandes 2",
                poster: "https://mcp-media.storage.googleapis.com/anv-pvw/B98/C0D/B98C0DBDD0404D56AD70119379477993_6.jpg"
            }
        ], 
        width: "100%"
    });
</script>

Configuration Options

Parameter	Type	Definition
url	String	External video url.
poster	String	Poster image URL (used in the absence of a default poster image or for overriding the one coming with the metadata)
live	Boolean	Live mode flag; needed while using external video url.
title	String	Used for overriding the existing title from metadata/specifying the title for external video url (applies to VOD only)
description	String	Used for overriding the existing description from metadata/specifying the description for external video url (applies to VOD only)
width	String	Player width in pixels or percent
height	String	Player height in pixels or percent
playlist	Array	Array of media info objects composed of url and additional parameters
volume	Number	Volume betwen 0 and 1
autoplay	Boolean	Autoplay mode
disableMutedAutoplay	Boolean	Used for disabling muted autoplay. When set to true while autoplay is enabled, the player will either autoplay with sound or not autoplay at all depending on what the browser allows. Default is false.
plugins	JSON	Contains the plugin parameters. Details are provided in Plugins section.
companions	Array of Objects	Used for registering companion containers with their width and height. Companion object format is given below.
logo	Object	Used for setting a logo overlay. Logo can be set using the API method: setLogo(). Logo object format is provided below.
share	Boolean	Used for disabling the share feature. Default is true.
shareLink	String	Used for overriding the share link detected by the player
clientSideAdTracking	Boolean	Used for pinging the tracking URL specified in VAST to demonstrate ad progress. Default value is true.
trackTimePeriod	Integer	Used for setting the TIME_UPDATED event period. This value must be to at least 1 (in second). TIME_UPDATED event will not be dispatched if this value is not set to a valid value.
control	Boolean	This flag is used for removing the player controls.
info	Boolean	This flag is used for removing the components providing info about the content such as title, description, poster image, etc.
360	Boolean	Used for enabling 360 view feature
recommendations	Boolean or Object	Used for enabling recommendation window. Providing true will use recommendations from MCP. Providing false will disable recommendations. To use custom recommendations, provide an object of the form { items: [...] } where the items array has the same format as the vList argument in the Player.setRecommendations(vList) API function. Default is false.
maxRecomPages	Number	Used to determine the maximum number of recommendation pages to show at the end of a playlist. Default is 3.
token	String	Used for activating the remote config and TVE services such as metadata lookup, schedule, geo station check and parental control.
styleNativeCaptions	Boolean	For videos that would normally use the browser's native caption settings and styling, setting this flag to true will cause the captions to use the Anvato player's caption settings and styles instead.
nativeHlsOnSafari	Boolean	Used for forcing native HTML5 video playback for HLS on Safari instead of Anvato's MSE player. Note that when this is true, the player is no longer able to track server-side ads. Default is false.
nativeHlsOnSafariForVod	Boolean	Similar to nativeHlsOnSafari, but only applies to VOD and not live streams. Default is false.
nativeHlsOnSafariForLive	Boolean	Similar to nativeHlsOnSafari, but only applies to live streams and not VOD. Default is false.
learnMore	Object	Used for styling the Learn More button displayed during DFP client-side ads on mobile devices. Learn More object format is provided below.
disableAutoBitrateSwitchCap	Boolean	By default, the player caps the maximum bitrate that it will select for automatic bitrate switches based on the player size. Setting this parameter to true will disable this cap. Default is false.
autoBitrateSwitchCapScale	Number	A value used to scale the automatic bitrate switch cap that is based on the player size. For example, 0 will force the player to automatically use the lowest bitrate rendition, 1 will use the default bitrate switch cap, 2 will double the bitrate switch cap, etc.

Companion Object

AnvatoPlayer("p0").init({
    //...,
    companions: [
        {
            width: 160,
            height: 600,
            containers: [
                "companion-holder-1"
            ]
        }
    ]
});

Parameter	Type	Definiton
width	Number	The width of the companion placeholder
height	Number	The height of the companion placeholder
containers	Array	List of placeholder ids matching the width and height provided

Logo Object

AnvatoPlayer("p0").init({
    //...,
    logo: {
        url: "LOGO_URL",
        targetURL: "YOUR_TARGET_URL",
        location: "BR",
        margin: "3%",
        sizeFactor: 0.8
    }
});

Parameter	Type	Definiton
url	String	The logo URL
targetUrl	String	The target URL to be opened when the logo is clicked/tapped
location	String	"BR" for bottom right, "TR" for top right, "BL" for bottom left and "TL" for top left
margin	String	Margin to be calculated from the anchor point specified by location. Must be given in "px" or "%".
sizeFactor	Number	Used for resizing the logo. Default is 1 which sets the logo height to player height devided by 6.

Learn More Object

AnvatoPlayer("p0").init({
    //...,
    learnMore: {
        text: 'LEARN MORE',
        sizeFactor: 0.8,
        border: '0px solid #000',
        fontWeight: 600,
        //...,
    }
});

Parameter	Type	Definition
text	String	The text to display on the button.
sizeFactor	Number	Used for scaling the button font size. Default is 1.

You may also provide additional parameters that correspond to CSS styles.

API Methods and Events

Accessing Player Instances

Each player instance can be accessed using the ready callback function. This callback will be called once the instance is ready to accept API calls.

Using API Methods on Player Instances

AnvatoPlayer('p0').on('ready', function(playerInstance) {
    // Access API methods here
    // Either playerInstance or AnvatoPlayer('p0') can be used as a reference
    AnvatoPlayer('p0').play();
    AnvatoPlayer('p0').seekTo(90);
    AnvatoPlayer('p0').setVolume(.5);
    AnvatoPlayer('p0').getTitle(response);
    AnvatoPlayer('p0').getDuration(response);
});

function response(result) {
    console.log('@response result:', result);
}

API methods for which we do not need return values are called using the namespace, player instance name and method name.

API methods from which we are planning to retrieve a return value must be called using a callback function as the first argument. The referenced arguments of the API method must be given in an array if there are more than one arguments. One argument can be entered without array brackets.

Using API Events fired by Player Instances

A specific event can be listened using the on method. on method accepts both camel case form of the API events documented and uppercase form of them (for backwards compatibility).

Binding an event listener

AnvatoPlayer('p0').on('metadataLoaded', function(eventId, secondaryId, metadata, rawMetadata) {
    // use the arguments here
});

It is also possible to use the listener callback for listening to all events. All events are directed to the callback method provided by the SDK user by setting the listener callback of AnvatoPlayer singleton.

Unbinding a named event listener

A specific event listener can be turned off as long as it is not an anonymous function.

AnvatoPlayer('p0').on('userPause', onUserPaused);
AnvatoPlayer('p0').off('userPause', onUserPaused);

function onUserPaused(){
    console.log('this will not be called since its listener is turned off.');
}

Unbinding all event listeners for an event

In order to remove all listeners for a specific event unbindAll method can be used. This will even remove the anonymous listeners.

AnvatoPlayer('p0').unbindAll('userPause');

Event Sequence Live Demo

You can view the event progression as well as the common following use cases with this interactive tool

• Loading the player behind an overlay/placeholder and displaying when the playback starts
• Evaluating the proper player load and playback; replacing the player with an alternate content if some events are not received in a timely manner
• Evaluating player load performance
• Page level video analytics based on player events

API Functions

getTitle()

AnvatoPlayer('p0').getTitle(YOUR_CALLBACK_FUNCTION);

Provides the title of current item

Returns	Type
Video title	String

getDescription()

AnvatoPlayer('p0').getDescription(YOUR_CALLBACK_FUNCTION);

Provides the description of current item

Returns	Type
Video description	String

getDuration()

AnvatoPlayer('p0').getDuration(YOUR_CALLBACK_FUNCTION);

Provides the duration of current item

Returns	Type
Video duration	Number

getState()

AnvatoPlayer('p0').getState(YOUR_CALLBACK_FUNCTION);

Returns the player state

Returns	Type
Player state	(States provided in state diagram)

getEmbedCode()

AnvatoPlayer('p0').getEmbedCode(YOUR_CALLBACK_FUNCTION);

Provides the embed code (described in iframed embed option) for the current video item

Returns	Type
Embed code	String

getShareLink()

AnvatoPlayer('p0').getShareLink(YOUR_CALLBACK_FUNCTION);

Provides the share link for the current video item

Returns	Type
Share link	String

getBitrates()

AnvatoPlayer('p0').getBitrates(YOUR_CALLBACK_FUNCTION);

Provides available bitrates in kbps

Returns	Type
Array of available bitrates in kbps	Array

getCaptionLanguages()

AnvatoPlayer('p0').getCaptionLanguages(YOUR_CALLBACK_FUNCTION);

Provides available caption languages

Returns	Type
Array of available languages	Array

getCurrentTime()

AnvatoPlayer('p0').getCurrentTime(YOUR_CALLBACK_FUNCTION);

Provides the current time/playhead time

Returns	Type
Current time in milliseconds	Number

getPlayerLanguages()

AnvatoPlayer('p0').getPlayerLanguages(YOUR_CALLBACK_FUNCTION);

Provides available player languages (for labels and notifications)

Returns	Type
Array of available languages	Array

getVolume()

AnvatoPlayer('p0').getVolume(YOUR_CALLBACK_FUNCTION);

Provides the player volume level

Returns	Type
Volume level between 0 and 1	Number

isFullscreen()

AnvatoPlayer('p0').isFullscreen(YOUR_CALLBACK_FUNCTION);

Gives player fullscreen mode

Returns	Type
True indicates fullscreen	Boolean

getPreviewState()

AnvatoPlayer('p0').getPreviewState(YOUR_CALLBACK_FUNCTION);

Provides preview state (available when Temp Pass is activated)

Returns	Type
Preview state either PASSIVE, LONG, SHORT or ENTITLEMENT	String

getViewStatus()

AnvatoPlayer('p0').getViewStatus(YOUR_CALLBACK_FUNCTION);

Used for getting the player’s viewability in the active window/tab (available for private beta clients)

Returns	Type
True for viewable, false for non-viewable	Boolean

getPlaylistIndex()

AnvatoPlayer('p0').getPlaylistIndex(YOUR_CALLBACK_FUNCTION);

Returns the index of the current playlist item

Returns	Type
Playlist item index	Number

setBitrate(bitrate)

AnvatoPlayer('p0').setBitrate(864);

Sets the video bitrate

Parameters:

Name	Type	Description
bitrate	number	Bitrate in kbps

setCaption(language)

AnvatoPlayer('p0').setCaption('en');

Sets the caption language

Parameters:

Name	Type	Description
language	string	Caption language abbreviation - available with getCaptionLanguages() -

setCaptionStyle(style)

Sets caption style

Name	Type
style	CaptionStyleSettings

setPlayerLanguage(language)

AnvatoPlayer('p0').setPlayerLanguage('en');

Sets the player language (labels and notifications)

Parameters:

Name	Type	Description
language	String	Player language

setFullscreen(flag)

//This function must be called after a user interaction.
YOUR_BUTTON.onclick = function() {
    AnvatoPlayer('p0').setFullscreen(true);
};

Toggles on/off fullscreen mode. This method should be called based on a user interaction.

Parameters:

Name	Type	Description
flag	Boolean	True indicates fullscreen request, false indicates cancel fullscreen request

mute()

AnvatoPlayer('p0').mute();

Mutes the player

unmute()

AnvatoPlayer('p0').unmute();

Unmutes the player

setLogo(config)

Sets the player logo that will be displayed as an overlay

AnvatoPlayer('p0').setLogo({
  url: 'LOGO_URL_HERE',
  location: 'BR',
  margin: '5%',
  sizeFactor: .8
});

Name	Type	Description
config	Object	Object with keys: url, targetURL, location, margin, sizeFactor

showLogo()

Displays the player logo

AnvatoPlayer('p0').showLogo();

hideLogo()

Hides the player logo

AnvatoPlayer('p0').hideLogo();

setVolume(volume)

Sets the player volume

AnvatoPlayer('p0').setVolume(.5);

Parameters:

Name	Type	Description
volume	Number	Decimal number between 0 and 1

triggerUserInteraction()

AnvatoPlayer('p0').triggerUserInteraction();

Triggers user interaction which may be needed in preview flows.

setSelectedProvider()

AnvatoPlayer('p0').setSelectedProvider('Cablevision');

Sets selected provider for entitlement with Adobe Pass

Parameters:

Name	Type	Description
providerId	String	A valid MVPD ID registered with Adobe Pass (Case sensitive)

play()

AnvatoPlayer('p0').play();

Plays the video content. Note that some browsers block programmatic play attempts for videos until the user manually initiates playback. As a result, this API method should not be used to autoplay videos. Instead pass in the autoplay embed parameter with the value true when initializing the player.

play(mediaInfo)

AnvatoPlayer('p0').play({id: VIDEO_ID});

Plays another video content associated with the accessKey. This API method is the recommended way for playing another video as opposed to reloading the player SDK.

Parameters:

Name	Type	Description
mediaInfo	Object	An object with id entry set to video id to be played

pause()

AnvatoPlayer('p0').pause();

Pauses the video content

destroy()

AnvatoPlayer('p0').destroy();

Destroys the player instance

seekTo(timeIndex)

Seeks to a given time index

AnvatoPlayer('p0').seekTo(9);

Parameters:

Name	Type	Description
timeIndex	Number	Seek position in seconds

setRecommendations(vList)

Sets the list of video recommendations for the current video

var recommendations = [
  {
    url: 'https://mcp-download.storage.googleapis.com/anv-videos/variant/3697661.m3u8',
    format: 'm3u8',
    title: 'Caminandes 2',
    description: 'Gran Dillama - Blender Animated Short',
    image: 'https://mcp-media.storage.googleapis.com/anv-pvw/B98/C0D/B98C0DBDD0404D56AD70119379477993_6.jpg'
    duration: 146
  },
  {
    url: 'https://mcp-download.storage.googleapis.com/anv-videos/variant/3697658.m3u8',
    format: 'm3u8',
    title: 'Cosmos Laundromat',
    description: 'An in-development film project by the Blender Foundation',
    image: 'https://mcp-media.storage.googleapis.com/anv-pvw/B98/C0D/B98C0DBDD0404D56AD70119379477993_6.jpg'
    duration: 730,
  }
];
AnvatoPlayer('p0').setRecommendations(recommendations);

Parameters:

Name	Type	Description
vList	Array	A list of objects describing the metadata for each video recommendation. Each object must contain either a video url and format ('m3u8', 'mp4', etc.) or a video id for the current MCP. The objects should also contain a title, description, poster image URL, and video duration in seconds. Optionally, the objects may contain a live property stating whether the video is a live stream or not

changeProgram(eventId, eventMetadata)

Signals an event or program change for live programs

var eventMetadata = {
  title: 'NEW_EVENT_TITLE',
  description: 'NEW_EVENT_DESCRIPTION',
  rating: 'NEW_EVENT_RATING',
  derivedMetadata: {
    yourKey: 'YOUR_VALUE',
    anotherKey: 'ANOTHER_VALUE',
    // ...
  },
  // ...
}
AnvatoPlayer('p0').changeProgram('NEW_EVENT_ID', eventMetadata);

Parameters:

Name	Type	Description
eventId	String	The id of the new event
eventMetadata	Object	Metadata object with the program info as shown in the sample code. For more information about derived metadata, see the derived metadata section.

updateDerivedMetadata(derivedMetadata)

Updates the current derived metadata

AnvatoPlayer('p0').updateDerivedMetadata({
  yourKey: '',
  anotherKey: '',
  // ...
});

Parameters:

Name	Type	Description
derivedMetadata	Object	An object containing derived metadata key-value pairs

API Events

Event Format

{     sender: {player instance ID},     name: {event name},     time: {event time},     info: {event definition},     args: {array of arguments} }

Events are dispatched by the player instance using the following format. Sender value is available when IFRAMED JS embed option is utilized since this option supports multiple player instances.

Event List

Event Name	Event definition	Arguments
STATE_CHANGE	Player state has changed	Player state
CLIENT_BANDWIDTH	Client bandwidth estimated	Bandwidth in kbps
FIRST_FRAME_READY	First frame is ready	None
PLAYING_START	Player started playing for the first time	Playback origin
TIME_UPDATED	Playhead updated while playing the video content (Only fired if trackTimePeriod is set in embed parameters)	video time (VOD) / time stamp (Live) in seconds live flag video id video title
VIDEO_STARTED	Video item started	video ID video title
VIDEO_FIRST_QUARTILE	Video playhead passed the first quartile	video ID video title
VIDEO_MID_POINT	Video playhead passed the midpoint	video ID video title
VIDEO_THIRD_QUARTILE	Video playhead passes the third quartile	video ID video title
VIDEO_COMPLETED	Video item completed	video ID video title
PLAYLIST_COMPLETED	All videos in playlist are completed	playlist ID
AD_STARTED	Ad content started	ad ID ad title ad provider
AD_FIRST_QUARTILE	Ad content passed the first quartile	ad ID ad title ad provider
AD_MID_POINT	Ad content passed the mid point	ad ID ad title ad provider
AD_THIRD_QUARTILE	Ad content passed the third quartile	ad ID ad title ad provider
AD_COMPLETED	Ad content completed	ad ID ad title ad provider
ALL_ADS_COMPLETED	All ad videos completed	ad provider
AD_CLICKED	User clicked on the ad content	ad ID ad title ad provider
COMPANION_AVAILABLE	A companion is available for injection	payload type creative type width height payload
MUTED	Player muted	None
UNMUTED	Player unmuted	None
USER_INTERACTION	User has interacted with the player	interaction type Content type (“video” or “ad”) id (video id or ad id)
PREVIEW_STATUS	Preview state has changed	preview state preview/provider ID expiration time
PREVIEW_EXPIRED	Live preview has finished	preview state
PROGRAM_CHANGED	Live program has changed	event Id upid (another identifier used as a key for metadata lookup) metadata object with properties: title description rating mvpdAuthenticationNeeded tveCheckNeeded
NEXT_PROGRAM	Next program information has arrived	event Id upid (another identifier used as a key for metadata lookup) metadata object with properties: title description rating mvpdAuthenticationNeeded tveCheckNeeded
METADATA_LOADED	Program metadata has changed	event Id upid (another identifier used as a key for metadata lookup) metadata object with properties: title description rating ownerId tags categories
AUTHENTICATION_STATUS	Authentication status has changed	isAuthenticated authenticator
AUTHORIZATION_STATUS	Authorization status has changed	isAuthorized authorizer token error code (if failed)
HOMEZIP_DETECTED	User’s home zip detected	home zip
ENCRYPTED_HOMEZIP_DETECTED	User’s home zip detected	encrypted home zip
MAX_RATING_DETECTED	User’s allowed max rating detected	max rating
PROVIDER_LIST_SET	Provider list is available	Provider look-up table
PROVIDER_SELECTED	User selected a provider/previously selected provider has been set	provider ID
PICKER_REQUESTED	MVPD picker has been requested. (This event can be used as an opportunity to display custom MVPD picker dialogs if the default picker is disabled.)	None
PICKER_DISPLAYED	MVPD picker has been displayed	None
POPUP_BLOCKED	Browser has blocked the popup	None
POPUP_DISPLAYED	Browser has allowed the popup	None
GEOLOCATION_STATUS	User’s geolocation information updated	longitude latitude error code (if failed)
AD_IMMINENT	There will be an ad break in given seconds	startsIn (seconds)
SEGMENT_TYPE_CHANGED	Stream segment type has changed (applies to the ad stitched streams)	Segment type (“master”, “ad” or “slate”)
PROVIDER_IFRAME_INJECTED	Provider IFrame has been injected	Provider Id IFramed Login Placeholder Id
PROVIDER_IFRAME_REMOVED	Provider IFrame has been removed	IFramed Login Placeholder Id
VIEW_STATUS	The player is viewable in active window/tab (available for private beta clients)	isViewable (Boolean)
LOADER_READY	Loader is ready
SUBSCRIBER_AUTHORIZATION_STATUS	Subscriber authorization status has changed	authZ status
PLAYLIST_CHUNK_AVAILABLE	Playlist chunk is available	Array of playlist items
TIME_DELTA	Time difference between client and server detected	Difference between server time and browser time
CHROMECAST_STATUS	Chromecast status has changed	chromecast status
VERIFICATION_STATUS	Chromecast verification status has changed	verification satatus
CLIENT_BANDWIDTH	Client bandwidth estimated	Bandwidth in kbps
PLAYER_ERROR	Player has thrown an error	Error information (Explained in Error Messages section)
USER_PLAY	User has started the playback	None
USER_RESUME	User has resumed the content	None
USER_GOLIVE	User has selected golive	None
USER_PAUSE	User has paused the playback	None
USER_MUTE	User has muted the audio	None
USER_UNMUTE	User has unmuted the audio	None
USER_SHARE	User has shared a content	None
USER_FORWARD_SEEK	User has seeked forwards	Current time target time
USER_BACKWARD_SEEK	User has seeked backwards	Current time target time
USER_FULLSCREEN	User has toggled on Fullscreen mode	None
USER_CANCEL_FULLSCREEN	User has toggled off Fullscreen mode	None
AD_BREAKS	Ad breaks detected in the content	Array of ad breaks
AD_BREAK_STARTED	Ad break has started	Ad break index Ad index
AD_BREAK_COMPLETED	Ad break has completed	Ad break index ad index
BUFFER_LIMIT_UPDATED	Buffer limit has been updated	Buffer limit
PRESENTATION_UPDATED	Current time, total time or content type has changed. For ads, time index and duration correspond to the ad break with the exception of client-side DFP ads where time index and duration correspond to the current ad.	time index duration presentation content type adIndex total ads in the ad break
BUFFER_START	Buffering has started	None
BUFFER_END	Buffering has completed	None
ID3	ID3 tag detected	Timed metadata payload publisher
POSTER_LOADED	Poster image has been loaded	None
COMPONENTS_INITIALIZED	Player UI components have been initialized	None
BITRATE_CHANGED	Bitrate value has been updated	Current bitrate
BITRATE_CHANGE_IN_PROGRESS	There is a pending birate change	Target bitrate
TIME_DELTA	Time difference between client and server detected	time delta (msec)
MEDIA_URLS_SET	Published media URLs are available	Media URL objects array
BEFORE_VIDEO_LOAD	Player has notified the check point before video load	Video information object Embed configuration
PLAYLIST_ITEM_CHANGED	Playlist item index has been updated	playlist item index media Id
CAPTION_DETECTED	The player has detected closed captions	Array of available languages
AUTOPLAY_STATUS	The player's autoplay capability for the current video based on the browser's autoplay policy. The status value is NONE if there is no intent of autoplay, BLOCKED if the browser completely blocks autoplay, MUTED if muted autoplay is allowed, or UNMUTED if unmuted autoplay is allowed.	autoplay status

Playback Origins

Enum for playback origins exposed with PLAYING_START event

Properties

Name	Type	Default
INITIAL	number	0
PLAYLIST_MANUAL	number	1
PLAYLIST_AUTO_ADVANCE	number	2
RECOMMENDATION_MANUAL	number	3
RECOMMENDATION_AUTO_ADVANCE	number	4
PLAY_API_METHOD	number	5

API Hooks

onBeforeVideoLoad

SDK calls this hook before loading the media and ads. Application layer can modify the initConfig inside this hook and return modified initConfig (typically client-side ad settings are modified).

onBeforeVideoLoad

AnvatoPlayer('p0').on('beforeVideoLoad', function(mediaInfo, initConfig) {
  // mediaInfo.id can be used for identifying the asset
  // config can be modified based on mediaInfo.id
  return initConfig; // finally modified config is returned
};

Parameters:

Name	Type	Description
mediaInfo	Object	Media info object in which media is identified with id entry. For external URLs id is populated with the md5 of the media url
initConfig	Object	Init configuration that is generated by merging application side and remote configuration. Plugins entry is often the point of interest for this hook

Type Definitions

CaptionStyleSettings

Name	Type
fontType	AnvatoPlayer.CaptionStyle.FontType
fontSize	Number
textColor	AnvatoPlayer.CaptionStyle.Color
textAlpha	AnvatoPlayer.CaptionStyle.PresetLevel
bgColor	AnvatoPlayer.CaptionStyle.Color
bgAlpha	AnvatoPlayer.CaptionStyle.PresetLevel
textEdge	AnvatoPlayer.CaptionStyle.TextEdgeStyle
highlightColor	AnvatoPlayer.CaptionStyle.Color
highlightAlpha	AnvatoPlayer.CaptionStyle.PresetLevel
scale	Boolean
capitalize	Boolean
override	Boolean

AnvatoPlayer.CaptionStyle

• .CaptionStyle : object
  • .Color : enum
  • .FontType : enum
  • .TextEdgeStyle : enum
  • .PresetLevel : enum

CaptionStyle.Color : enum

Kind: static enum of CaptionStyle
Properties

Name	Type	Description
WHITE	number	White color
TURQUOISE	number	turquoise color
BLUE	number	Blue color
GREEN	number	Green color
YELLOW	number	Yellow color
MAGENTA	number	Magenta color
RED	number	Red color
BLACK	number	Black color

CaptionStyle.FontType : enum

Kind: static enum of CaptionStyle
Properties

Name	Type	Description
ARIAL	number	Arial font
COURIER	number	Courier font
GEORGIA	number	Gerogia font
LUCIDA_SANS	number	Lucida Sans font
TAHOMA	number	Tahoma font
TIMES_NEW_ROMAN	number	Times New Roman font
VERDANA	number	Verdana font

CaptionStyle.TextEdgeStyle : enum

Kind: static enum of CaptionStyle
Properties

Name	Type	Description
NONE	number	No style
DROP_SHADOW	number	Drop shadow style
RAISED	number	Raised style
DEPRESSED	number	Depressed style
UNIFORM	number	Uniform style

CaptionStyle.PresetLevel : enum

Kind: static enum of CaptionStyle
Properties

Name	Type	Description
NONE	number	None - 0% -
PERCENT_25	number	25%
PERCENT_50	number	50%
PERCENT_75	number	75%
PERCENT_100	number	100%

Error Messages

The player errors are thrown using the events channel using the event format.

Error Format

{
  sender: {player instance ID},
  name: 'PLAYER_ERROR',
  time: {error time},
  info: 'The player has thrown an error',
  args: [errorCode, errorDefinition, isCritical]
}

Error payload is passed with the args property as shown below. isCritical flag is used for providing the SDK user with the information about whether the playback will stop/not start at all or the error is recoverable.

Error List

Error Code	Error definition	isCritical
ACTRL001	Failed to retrieve the metadata	false
ACTRL002	Failed to retrieve the video metadata	false
ACTRL010	Failed to retrieve the TVE rights	false
ACTRL020	The user’s maximum allowed rating is smaller than program’s rating	true
ACTRL021	Provided rating string does not have the standard format	false
ACTRL030	Adobe Pass authentication failed	true
ACTRL031	Adobe Pass authorization failed	true
ACTRL040	The user’s geo-station doesn’t match the streaming station	true
ACTRL041	The user doesn’t have home station rights.	true
ACTRL042	The user doesn’t have geo station rights.	true
ACTRL043	The user doesn't have TVE rights.	true
ACTRL050	Adobe Pass failed to respond within the specified time out limit.	true
ACTRL051	Adobe Pass failed to check authentication within the specified time out limit.	true
ACTRL052	Adobe Pass failed to check authorization within the specified time out limit.	true
ACTRL060	Adobe Pass did not return any valid service zip	false
ACTRL070	Failed to generate security token. Possible reason: accessKey is not recognized	true
ACTRL071	Failed to retrieve the content. Possible reason: the content is either invalid or not provisioned for the accessKey	true
ACTRL072	Cannot access this video or channel.	true
ACTRL079	Generic backend error (detail provided by the backend service )	true
ADST001	Failed to get ad breaks	false
CCSND010	Failed to encrypt the chromecast load config	false
DFP010	DFP plugin encountered an error	false
HRTBT001	Failed to get a valid account ID (RSID)	false
LOAD010	Browser is blocking the 3rd Party Cookies.	true
LOAD020	Missing/outdated Adobe Flash Player plugin	true
LOAD021	Blacklisted Adobe Flash Player plugin version detected	false
NIEL001	Nielsen tracking parameters are not given	false
NIEL002	Nielsen could not be initialized	false
PLAY010	Video load error	true
PLAY301	HLS Plugin load error	true
PLAY302	Media is not valid	true
PLAY303	Media url is not valid	true
PLAY304	Security error when loading media (crossdomain.xml exception)	true
PLAY305	Media failed to load due to an I/O error	true
PLAY306	Connection timeout	true
PLAY307	Http error (4xx)	true
PLAY308	Media load failed	true
PLAY309	Stream not found	true
PLAY310	Playback failed	true
PLAY311	Connection failed	true
PLAY400	Media error	true
PLAY410	The content has expired	false
PLAY450	Failed to download master	false
PLAY457	The browser encountered a media decode error	false
PLAY460	Failed to download all renditions	false
PLAY470	All segment download attempts within FAILED_SEQ_LIMIT failed	false
PLAY500	The browser does not support the available formats in the media source	true
PLAY510	The browser does not support playback without a user gesture	false
PLAY900	Schedule service returned an expired event	false
PLAY920	No next item in the playlist	false
PLAY921	No previous item in the playlist	false
PLGNL001	Failed to initialize the plugin	false
SCOR001	Failed to get a valid Comscore clientId (c2)	false

Integration FAQs

Embed Options

• Embedding with the SCRIPT tag

This is the embed option we will be covering in this development guide. Publishers are supposed to use this option to use entitlement services, companion ads, dynamic resizing (keeping the aspect ratio) and get the maximum performance in terms of page load time.

The SDK embeds the player inside a dynamically generated IFRAME. The SDK accesses the player instance using API methods and events from the parent page in which the player is embedded.

• Embedding with the IFRAME tag

This embed option is available for the viewers of your content as an IFRAME embed code from the social share view of the player. Additionally, the publishers making use of AMP pages can use this option to embed a player on their AMP compliant pages.

Configuration

Player Init Configuration

AnvatoPlayer("player1").init({
    url: "VIDEO_URL",
    plugins: {
        // Please refer to the PLUGIN PARAMETERS section provided in IFRAMED JS Embed Option
    }
});

Each player needs to have an instance name passed to the AnvatoPlayer singleton. Plugin information can be entered in plugins entry using the format on the right.

Remote Configuration

Instead of entering comprehensive parameters for common work flows, the SDK user may prefer using the remote configuration. This remote configuration is activated using the embed parameter accessKey. While using the remote config, the parameters in remote configuration can be overridden using the player init configuration.

While using player init configuration, it is sufficient to remove an entry of a feature to disable it. However while using the setting from remote config associated with the accessKey, the features such as preview must be explicitly set to false in order to disable it.

Embedding Player

1. Add the player script tag to your page
2. You can determine the location of player optionally by creating a div element and making its id match the player instance id passed to the AnvatoPlayer singleton.
3. Pass the player instance name that matches the player placeholder div id in the previous step to AnvatoPlayer singleton. And finally call init method populated with the init configuration to load the player.

<div id="player1"></div>
AnvatoPlayer("player1").init({
    url: "YOUR_STREAM.M3U8",
}); 

Setting the player size

The width and height of the player can be set using the embed parameters width and height. The values must be in pixel and specified with "px" suffix, e.g. "width": "720px". If not specified, the player will use 640 x 360 default size.

Dynamic Resizing

Dynamic resizing is available by setting the width with a value in percent. For instance; "width":"80%" will automatically adjust the height using the aspect ratio on window resize/orientation change events.

A comprehensive list of parameters are provided in IFRAMED JS Embed Option section.

Configuration Priority

• Higher priority: Settings inside AnvatoPlayer(PLAYER_INSTANCE).init(INIT_CONFIG)
• Lower priority: Settings coming from remote config activated by accessKey

Embedding Multiple Players

<div id="player2"></div>
<script>
    AnvatoPlayer("player2").init({
        url: "YOUR VIDEO URL"
    });
</script>

<div id="player3"></div>
<script>
    AnvatoPlayer("player3").init({
        url: "YOUR VIDEO URL"
    });
</script>

You can repeat the last two steps for adding other player instances.

Processing the Companions

Anvato Universal Player provides two options for processing the companions.

• The companion placeholders are populated by player,
• The programmer handles the companions.

The companion placeholders are populated by player

AnvatoPlayer("p0").init({
    ... // video parameters
    plugins: {
        // ad plugin information here
    },
    companions:[
        {width:160, height:600, containers:["companion-holder-1"]},
        {width:300, height:250, containers:["companion-holder-2"]},
        {width:468, height:60, containers:["companion-holder-3"]}
    ]
});

This option is the suggested and easiest option for placing the companions on your page. The programmer is only supposed to register the companion placeholders with their ids and dimensions. The player will populate the companions in an appropriate placeholder.

The programmer handles the companions

AnvatoPlayer("p0").on("companionAvailable", processCompanion);

function processCompanion(payloadType, creativeType, width, height, payload) {
    var data = decodeURIComponent(payload.data),
        clickTarget = payload.clickTarget,
        creativeView = payload.creativeView;
    // Process the companion data based on the provided information      
}  

When the player detects a server side-stitched or client-side companion ad, it fires the event COMPANION_AVAILABLE. This event contains all data needed for processing the companion payload and finally placing in the placeholder:

• payload type: This value is either static, html or iframe.
• creative type: This only applies to the static payload. Possible values are image/jpeg, application/x-shockwave-flash, etc. When this value is populated the payload will have an url as data for the creative. Additionally, the clickTarget and creativeView urls in the payload must be used appropriately by the programmer to make the companion fully functional.
• width: companion width
• height: companion height
• payload: This attribute is populated with an object with the following attributes:
  • data: URI encoded payload to be injected into the appropriate placeholder or a url to a static/iframe typed resource.
  • clickTarget: Only applies to static payloads with an image resource.
  • creativeView: This is only available when the companion requires view tracking; mostly used with static payload and image creative types.

In this option placeholders should not be registered using the companions embed parameter.

Anvato Video Player Plugin for WordPress

Introduction

Anvato WordPress plugin enables Anvato Media Content Platform (MCP) customers to embed a video player into their posts with a single click.

Installation

To get the Anvato WordPress plugin working with your WordPress account, please follow the steps below:

Step 1

Download the plugin folder here.

Step 2a

Go to your WordPress admin panel. Click on Plugin > Add New. Then click on the Upload Tab.

Upload the zip file that you downloaded from step 1 in the plugins folder of your WordPress install.

You will be taken to the activate a plugin page. Please make sure that you click on Activate the plugin link on the page. This step completes your installation.

Step 2b

If you like to use installation via FTP, please follow these steps. Access your host through the FTP manager. Access the path /wp-content/plugins/ and upload files there.

Once you have uploaded, then you would need to click on the Plugins tag in your WordPress admin panel.You will see the plugin you just uploaded. Click on the Activate button and you are done.

Step 3

Get the below configuration parameters from your Anvato support contact

• MCP URL
• MCP ID
• Station ID
• Public Key
• Private Key

Step 4

Set default video player size & autoplay state

• Player URL
• width
• height

Step 5 (Optional)

Set tracking parameters for analytics, leave it empty if you use default

• Tracker ID
• Profile
• Account
• Tracking Server

Step 6

Set monetization parameters if you want to display preroll and midroll ads.

If you are using DFP Ad server, please use the below parameter to insert your VAST Tag.

• DFP Premium Ad Tag

Usage (by Web Editor)

While editing a WordPress post, click the “Add Media“ tool, and choose “Insert Anvato Video” from left hand side bar.

Most recent videos in Anvato Media Content Platform are displayed in a pop-up overlay. You can narrow down the search by entering titles, descriptions or keywords.

Select the videos you wish to insert into your posts, and click “insert into Post” button. You are done.

Please note that when you select more than 1 video, you will create a playlist on a single player.

How it Works

On the background, we have inserted a WordPress short code into your post. This shortcode will display a video player when your users visit this page.

Advanced Settings

Parameters and Shortcodes

// Creates a player
[anvplayer video="282411"]

// Creates a player of 300×125 pixels that auto plays video id 282411.
[anvplayer video="282411" width=”300” height=”125” autoplay=”true” ] 

When you use Anvato WordPress Plugin, you can customize your player using shortcode attribute at page level. You can add the following attributes to your shortcode

• video [Video ID]
• width [in px]
• height [in px]
• autoplay [true if autoplay is requested]

Plugins

Plugins are activated only if their configurations are entered correctly.

While most parameters in plugins are static that can be entered by the developer integrating the player SDK into their page, some others may require dynamic information that changes with each content. To support this use case the following macros are available when used under keyValues entry for ad plugins and under comscore for Comscore Analytics plugin. These macros must be wrapped with double square brackets and passed as string.

YOUR_KEY_1: "[[VIDEO_ID]]"

Available macros:

• MCP_ID,
• VIDEO_ID,
• OWNER_ID,
• CATEGORIES,
• TITLE,
• DESCRIPTION,
• DURATION,
• PROGRAM_NAME,
• IS_OFFSITE

DFP Parameters (Client-side)

While the DFP configuration can be provided to the player SDK during initialization, the player SDK also allows using the onBeforeVideoLoad hook to modify the existing ad configuration before each video.

plugins: {
  dfp: {
    clientSide: {
      adTagUrl: "YOUR AD TAG URL",
      keyValues: {
        YOUR_KEY_1 : "YOUR VALUE #1",
        YOUR_KEY_2 : "YOUR VALUE #2"
      }
    }
  }
}

Plugin Name	Namespace	Parameters	Definition
dfp	clientSide	adTagUrl	Ad tag URL provided by DFP ad server
		keyValues	Key-value pairs sent to the DFP (Optional)
		fullAdClickableOnMobile	If true, the entire ad will be clickable on mobile instead of just the "Learn More" button (Optional, default false)
		iosCustomPlayback	If true, then custom playback will be used for DFP ads on Safari for iOS 10+. This means prerolls can be viewed in fullscreen mode with the caveat that users cannot clickthrough to visit advertisers' sites in fullscreen mode. Skippable ads are also not supported using custom playback (Optional, default false)
		disableCustomClickTracking	If true, then the player will not use its own "Learn More" button for client-side DFP ads on mobile web. Instead, the IMA SDK will handle the click tracking and clickthroughs (Optional, default false)

Moat for DFP Parameters (Client-side)

Moat configuration for client-side DFP Moat ad tracking.

plugins: {
  moat: {
    clientSide: {
      partnerCode: "YOUR PARTNER CODE"
    }
  }
}

Plugin Name	Namespace	Parameters	Definition
moat	clientSide	partnerCode	Partner code provided by Moat

Moat Parameters (Server-side)

Moat configuration for server-side Moat ad tracking.

plugins: {
  moat: {
    serverSide: {
      partnerCode: "YOUR PARTNER CODE"
    }
  }
}

Plugin Name	Namespace	Parameters	Definition
moat	serverSide	partnerCode	Partner code provided by Moat

FreeWheel Parameters (Client-side)

plugins: {
  freewheel: {
    clientSide: {
      networkId: "YOUR NETWORK ID",
      serverURL: "FREEWHEEL SERVER URL",
      profileId: "YOUR PROFILE ID",
      siteSectionId: "YOUR SECTION ID",
      videoAssetId: "YOUR VIDEO ASSET ID",
      maxDuration: 30,
      minDuration: 15,
      keyValues: {
        YOUR_KEY_1 : "YOUR VALUE #1",
        YOUR_KEY_2 : "YOUR VALUE #2"
      }
    }
  }
}

FreeWheel prefers providing different renditions with specific configurations. In accordance with that, flash configuration must be written under flash namespace while html5 configuration is written under html5 namespace as shown below and in the sample code. Similar to the DFP client-side plugin, the onBeforeVideoLoad hook can be used to modify the existing ad configuration before each video.

Plugin Name	Namespace	Parameters	Definition
freewheel	clientSide	networkId	Network ID provided by FreeWheel
		serverURL	FreeWheel ad server URL provided by FreeWheel
		profileId	Profile ID provided by FreeWheel
		videoAssetId	Video Asset ID provided by FreeWheel
		keyValues	Key-value pairs sent to the FreeWheel (Optional)
		siteSectionId	Site Section ID provided by FreeWheel
		source	Url location of the Freewheel library (AdManager.js). The source cannot be overriden using the onBeforeVideoLoad hook. (Optional)
		maxDuration	Maximum duration of the ad slots allowed in seconds (Optional)
		minDuration	Minimum duration of the ad slots allowed in seconds (Optional)

FreeWheel Parameters (Server-side)

plugins: {
  freewheel: {
    serverSide: {
      networkId: "FREEWHEEL_NETWORK_ID",
      serverURL: "FREEWHEEL SERVER URL",
      profileId: "FREEWHEEL_PROFILE_ID",
      siteSectionId: "FREEWHEEL_SITE_SECTION_ID",
      videoAssetId: "VIDEO_ASSET_ID",
      companion: "COMPANION_PARAMETERS",
      custom: {
        "MACRO_LABEL": "MACRO_VALUE",
        ...
      }
    }
  }
}

These parameters are used for activating the server-side ad-stitching.

Plugin Name	Namespace	Parameters	Definition
freewheel	serverSide	networkId	Network ID provided by FreeWheel
		serverURL	FreeWheel ad server URL provided by FreeWheel
		profileId	Profile ID provided by FreeWheel
		siteSectionId	Site Section ID provided by FreeWheel
		videoAssetId	Video Asset ID provided by FreeWheel
		companion	Companion configuration string must be entered here in order to activate companions (Optional)
		eventType	The type of event (Optional)
		mvpd	MVPD Id (Optional)
		custom	Mapping for macro replacement in the freewheel URL (Optional)

Google Analytics

The following configuration must be used for enabling Google Analytics service including custom metadata tracking.

plugins : {
  googleAnalytics : {
    trackingId : "YOUR GOOGLE ANALYTICS TRACKING ID",
    events : {
      "WEB_SDK_EVENT_NAME":{
        alias : "YOUR GOOGLE ANALYTICS EVENT NAME FOR THIS EVENT",
        category : "YOUR GOOGLE ANALYTICS CATEGORY NAME",
        label : "YOUR GOOGLE ANALYTICS LABEL",
        metric : "YOUR METRIC IN FORMAT OF metric_X"
      }
    },
    dimensions : {
      "YOUR DIMENSION IN FORMAT OF DIMENSION_X":"CUSTOM VALUE/MACRO",
      //...
    }
  }
}

plugins : {
  googleAnalytics : {
    trackingId : "YOUR GOOGLE ANALYTICS TRACKING ID",
    events: {
      "WEB_SDK_EVENT_NAME" : "YOUR GOOGLE ANALYTICS EVENT NAME FOR THIS EVENT"
    },
    dimensions : {
      "YOUR DIMENSION IN FORMAT OF DIMENSION_X":"CUSTOM VALUE/MACRO",
      //...
    }
  }
}

Plugin Name	Parameters	Required/Optional	Definition
googleAnalytics	trackingId	Required	Tracking ID provided by Google Analytics
	events	Optional	Object/String specifying the details of the Google Analytics event. When the value is a string type, the string will be used as the value of eventAction in the Google Analytics request along with default values "Videos" in eventCategory and Title of the current video in the eventLabel. Users can overwrite those values by providing an object to specify the event alias, category and label as well as adding metric to the request. When this field is not specified, all SDK events will be sent.
	dimensions	Optional	Object specifying the list of custom dimensions. If this parameter is set, Web Player SDK will attach the custom dimensions with their values to each event request sends to Google Analytics.

Anvato Analytics Parameters

plugins: {
  analytics: {
    pdb: "YOUR PUBLISHER ID"
  }
}

Plugin Name	Parameters	Definition
analytics	pdb	Publisher ID provided by Anvato

Adobe Analytics

Omniture (AppMeasurement) Parameters

AnvatoPlayer("p0").init({
  ...,
  profile: "YOUR_PROFILE_ID", // if you are provided with one (typically used for multiple omniture profiles per client)
  plugins: {
    omniture: {
      account: "YOUR ACCOUNT ID",
      trackingServer: "TRACKING SERVER URL"
    }
  }
});

The following configuration must be used after specifying a coordinated profile id under common or player specific configuration. Sample code demonstrates setting the profile and omniture parameters.

Plugin Name	Parameters	Definition
omniture	account	Account ID provided by Omniture
trackingServer	Tracking server provided by Omniture. Multiple tracking servers separated by comma can be entered.

Heartbeat Parameters

The following configuration must be used for enabling Heartbeat Analytics service including custom metadata tracking.

AnvatoPlayer("p0").init({
  ...,
  profile: "YOUR_PROFILE_ID", // if you are provided with one (typically used for multiple heartbeat profiles per client)
  plugins: {
    heartbeat: {
      marketingCloudId: "YOUR_MARKETING_CLOUD_ID",
      customTrackingServer: "YOUR_CUSTOM_TRACKING_SERVER",
      trackingServer: "YOUR_TRACKING_SERVER",
      jobId: "YOUR_JOB_ID",
      account: "YOUR_ACCOUNT_ID",
      publisherId: "YOUR_PUBLISHER_ID",
      version: "1.5"
    }
  }
});

Plugin Name	Parameters	Definition
heartbeat	marketingCloudId	Marketing Cloud ID provided by Adobe
	customTrackingServer	This parameter is used for specifying the servers processing the custom metadata (Typically Adobe Visitor and AppMeasurement servers). Multiple tracking servers seperated by comma can be entered.
	trackingServer	Tracking server for Heartbeat provided by Adobe.
	jobId	Job ID provided by Adobe.
	account	account ID provided by Adobe.
	publisherId	publisher ID provided by Adobe.
	version	must be set to "1.5" to use the current latest stable Adobe Heartbeat Library or a later version for an early adoption (availability is subject to the coordination with Anvato).
	chapterTracking	Used for toggling chapter tracking. When chapterTracking is not set to false (default is true), the chapter boundaries are VIDEO_STARTED and AD_STARTED/VIDEO_COMPLETED events for VOD, and PROGRAM_CHANGED event for Live. Also for live stream, the chapter tracking causes name and friendlyName to be based on static metadata since the schedule based dynamic metadata is passed to the each chapterInfo.

plugins: {
  heartbeat: {
    marketingCloudId: "YOUR_MARKETING_CLOUD_ID",
    customTrackingServer: "YOUR_CUSTOM_TRACKING_SERVER",
    trackingServer: "YOUR_TRACKING_SERVER",
    jobId: "YOUR_JOB_ID",
    account: "YOUR_ACCOUNT_ID",
    publisherId: "YOUR_PUBLISHER_ID",
    version: "1.5"
    customMetadata: {
      video: {
        yourLabel: "YOUR_VALUE",
        anotherLabel: "YOUR_VALUE",
        //...
      },
      chapter: {
        // for sending metadata with chapterMetadata - applies to the chapter tracking usecase
      },
      ad: {
        // for sending metadata with adMetadata
      }
    }
  }
}

Heartbeat integrations relying on page level metadata not available to the SDK can use the config parameter customMetadata to provide metadata mapping as shown in the sample code. The plugin macros listed at the beginning of this section can be used to populate the custom metadata values.

{
  derivedMetadata: {
    yourKey: 'YOUR_VALUE',
  },
  plugins: {
    heartbeat: {
      marketingCloudId: "YOUR_MARKETING_CLOUD_ID",
      customTrackingServer: "YOUR_CUSTOM_TRACKING_SERVER",
      trackingServer: "YOUR_TRACKING_SERVER",
      jobId: "YOUR_JOB_ID",
      account: "YOUR_ACCOUNT_ID",
      publisherId: "YOUR_PUBLISHER_ID",
      version: "1.5",
      useDerivedMetadata: true,
      mapping: {
        video: {
          enabled: true,
          playerName: 'YOUR_PLAYER_NAME',
          id: 'YOUR_VIDEO_ID',
          name: 'YOUR_VIDEO_NAME',
          streamType: 'YOUR_VIDEO_STREAM_TYPE',
          context: {
            yourLabel: 'yourKey',
            anotherLabel: 'ANOTHER_VALUE'
          }
        },
        chapter: {
          // for sending metadata with chapterMetadata - applies to the chapter tracking usecase
        },
        ad: {
          // for sending metadata with adMetadata
        }
      }
    }
  },
  //...
}

Alternatively, the Heartbeat plugin configuration may use derived metadata to populate the custom metadata values. In this case, provide the useDerivedMetadata flag and the mapping section. The mapping section includes mandatory Heartbeat fields on the top level, and custom metadata within the context object. The enabled flag is used to enable derived metadata within the mapping section. Whenever a value in the mapping section matches a key in the derived metadata, the value is replaced with the corresponding derived metadata value. In the second example to the right, the custom yourLabel field will be sent with the value 'YOUR_VALUE' since 'yourKey' is a key in the derived metadata. The custom 'anotherLabel' field will be sent with the value 'ANOTHER_VALUE' since 'ANOTHER_VALUE' is not a key in the derived metadata.

Comscore Parameters

plugins: {
  comscore: {
    clientId: "YOUR CLIENT ID"
  }
}

Plugin Name	Parameters	Definition
comscore	clientId	Client ID provided by comscore

Nielsen Parameters

plugins: {
  nielsen: {
    environment: "production",
    sfcode : "YOUR_SFCODE",
    apid : "YOUR_APP_ID",
    apn: "YOUR_APP_NAME",
    type: "dtvr",
    optOut: {location: "TL", sizeFactor:.3, margin: "20px", period: -1}
  }
}

Plugin Name	Parameters	Definition
nielsen	environment	Nielsen has 2 environments: cert and production (default)
	sfcode	provided by Nielsen
	apid	app ID provided by Nielsen
	apn	app name used optionaly for specifying the player
	type	tracking type of Nielsen plugin: dtvr, dcr
	optOut	Object specifying the location of the button displaying the opt-out notification and the period of making this button visible again after toggling on the notification (default is Infinity, and setting -1 will make it always show up)

Offsite Plugin Configurations

{
  ...
  plugins: {
    dfp: {
      clientSide: {
        adTagUrl: "YOUR AD TAG URL"
      }
    }
  },
  offsitePlugins: {
    dfp: false
  }
}

A plugin configuration provided to the offsitePlugins parameter will override the plugins configuration if the player is one of the following:

• An iframe embed instance from a share link.
• An iframe embed on an AMP page.

In combination with the IS_OFFSITE macro, the offsitePlugins configuration enables you to change or toggle on/off plugin configurations depending on where the player is embedded.

Derived Metadata

Certain plugins that require video metadata may also take advantage of derived metadata. Derived metadata consists of key-value pairs that can be used as custom metadata for some plugins, such as Adobe Heartbeat.

var anvp = {};

// Setting derived metadata as an embed parameter
anvp.p0 = {};
anvp.p0.config = {
  derivedMetadata: {
    yourKey: 'YOUR_VALUE',
    anotherKey: 'ANOTHER_VALUE',
    //...
  },
  //...
};

// Seting derived metadata using the play() call
anvp.p0.play({
  derivedMetadata: {
    yourKey: 'YOUR_VALUE',
    anotherKey: 'ANOTHER_VALUE',
    //...
  },
  url: 'YOUR_VIDEO_URL',
  format: 'YOUR_VIDEO_FORMAT',
});

// Setting derived metadata in a dynamic playlist
anvp.p1 = {};
anvp.p1.config = {
  playlist: [
    {
      derivedMetadata: {
        yourKey: 'YOUR_VALUE',
        anotherKey: 'ANOTHER_VALUE',
        //...
      },
      url: 'YOUR_VIDEO_URL',
      format: 'YOUR_VIDEO_FORMAT'
    }
  ],
  //...
};

Derived metadata may also be set at the application level as an embed parameter, in the play() API call, or in each item of a dynamic playlist. Derived metadata provided during the play() call or with a dynamic playlist item will take priority over derived metadata provided as an embed parameter.

Customization

Player SDK allows customization by disabling the default UI components and providing a view, stylesheet and controller script.

Customization involves the following steps:

1. Enabling the customization via init configuration
2. Preparing the custom UI view
3. Implementing the controller
4. Styling the view

Customization config

customUIController embed parameter must be populated as shown in the sample code pane.

• The default UI components for which we are going to provide implementation must be turned off under showUIComponents
• View must be provided as a partial html under loadAssets.
• Controller script must be provided with type script under loadAssets.
• Stylesheet must be provided with type stylesheet under loadAssets

Init Configuration with Customization

  AnvatoPlayer('custom').init({
    url: "https://mcp-download.storage.googleapis.com/anv-videos/variant/3697661.m3u8",
    width: "100%",
    poster: "https://mcp-media.storage.googleapis.com/anv-pvw/B98/C0D/B98C0DBDD0404D56AD70119379477993_6.jpg",
    title: "Caminandes 2",
    description: "Gran Dillama - Blender Foundation",
    customUIController: {
      showUIComponents: {
        control: false,
        splash: false,
        captionSetting: false,
        preview: false,
        share: false,
        recommendation: false
      },
      loadAssets: [
        {
          type: "stylesheet",
          url: "sample-ui/view.css"
        },
        {
          type: "script",
          url: "sample-ui/controller.js"
        },
        {
          type: "view",
          url: "sample-ui/view.html"
        }
      ]
    }
  });

Preparing the view

The view is a partial HTML that is injected to the player SDK during runtime. The view shall include one parent element <anvato-controller>. The view content must be written inside this custom element as shown in the sample.

View for the Custom UI

<anvato-controller class="custom-ui">
  <div class="splash">
    <div class="title"></div>
    <div class="description"></div>
    <div class="play clickable"></div>
  </div>
  <div class="control">
    <div class="timeline">
      <div class="progress"></div>
    </div>
    <div class="play-pause button left"></div>
    <div class="time left" >
      <div class="vod">
        <span class="text current-time"></span>
        <span class="text">/</span>
        <span class="text total-duration"></span>
      </div>
      <div class="live">
        <span class="text">Live</span>
      </div>
    </div>
    <div class="fullscreen button right"></div>
  </div>
  <div class="spinner"></div>
  <div class="recommendation">
    <div class="up-next">
      <div class="content">
        <div class="title"></div>
        <div class="count-down"></div>
        <div class="play clickable">
        </div>
        <div class="cancel clickable">Cancel</div>
      </div>
    </div>
    <div class="grid">
      <div class="rows">
      </div>
    </div>
  </div>
</anvato-controller>

Implementing the controller

In order to implement the controller, we will be implementing the interfaces provided by the player SDK. These interfaces are available from internal anvp namespace which becomes available during the run time. This namespace shall not be confused with the public anvp namespace which was used for entering the player config and accessing API methods in the earlier versions of the player.

AnvatoCustomUIInterface

This interface provides access to:

• the custom UI container using container property
• mediator instance using mediator property
• static data using staticData needed for environment specific values and preset values such as caption properties

The implementation of this interface must provide readyCallback and finally UI sub-components must be registered using their respective variables:

• control,
• splash,
• captionSetting,
• preview,
• share,
• recommendation

In case you are not planning to provide all of these compoents, you are supposed to either provide an empty implementation for the provided sub-component interfaces or simply set related sub-component's showUIComponents value to true as shown above.

Subcomponent Interfaces

• ControlInterface
• SplashInterface
• CaptionSettingInterface
• PreviewInterface
• ShareInterface
• RecommendationInterface

These interfaces only include a not implemented warning mimicking pure virtual functions. The player SDK calls a comprehensive list of API methods implemented on these sub-component interfaces. However, not all of them are needed for customizing the player SDK. So you shall implement these methods based on your usecase. 'not implemented' warning can be supressed by setting the var notImplamentedWarning_ to false. A comprehensive list of these methods are provided in the sub-components reference.

These methods are the handles the player SDK uses to ask for an action, set some value or get information about the component. This covers the communication from the player SDK to the UI components.

When it comes to the communication from UI component to the player SDK, mediator instance provided by AnvatoCustomUIInterface is used. Mediator instance provides publish method for sending the topics with related payload. Comprehensive list of mediator topics is given in mediator topics.

The implementation for anvp.AnvatoCustomUIInterface

function CustomUI() {
  anvp.AnvatoCustomUIInterface.call(this);
  function init_() {
    parentElement = anvp.AnvatoCustomUIInterface.container;
    mediator = anvp.AnvatoCustomUIInterface.mediator;
    captionProps = anvp.AnvatoCustomUIInterface.staticData.captionProps;
    fullscreenSupport = anvp.AnvatoCustomUIInterface.staticData.fullscreenSupport;
  }
  this.readyCallback = function() {
    init_();
    parentElement.style.display = 'block';
  };
  this.control = ControlBar;
  this.splash = Splash;
  this.recommendation = Recommendation;
}
new CustomUI();

As you can see in the sample code for the implementation of AnvatoCustomUIInterface, control, splash and recommendation variables are populated with the implementation of anvp.ControlInterface, anvp.SplashInterface and anvp.RecommendationInterface.

A sample implementation for these sub-components is given in the sample code pane.

The implementation for anvp.ControlInterface

function ControlBar() {
  anvp.ControlInterface.call(this);
  this.timers_ = {};
  this.notImplementedWarning_ = true;
  this.setResponsive_ = function() {
    getElementFromClassPath('control').setAttribute('data-state', 'responsive');
  }
}

ControlBar.prototype = Object.create(anvp.ControlInterface.prototype);

ControlBar.prototype.init = function(node, w, h) {
  getElementFromClassPath('control:play-pause').onclick = function() {
    mediator.publish('playPauseClicked');
  };
  getElementFromClassPath('control:fullscreen').onclick = function() {
    mediator.publish('fullscreenClicked');
  };
  getElementFromClassPath('control:timeline').onclick = function(e) {
    var seekIndex = getSeekIndex(e, this);
    mediator.publish('seekRequest', seekIndex);
  };
};
ControlBar.prototype.updateDuration = function(index) {
  currentTime = index;
  getElementFromClassPath('control:timeline:progress').style.width =
      (currentTime * 100 / totalDuration) + '%';
  getElementFromClassPath('control:current-time').innerHTML =
      sec2TimeString(Math.round(currentTime));
  if (currentTime) {
    show(getElementFromClassPath('control:time'));
  }
};
ControlBar.prototype.setDuration = function(duration) {
  currentTime = 0;
  totalDuration = duration;
  hide(getElementFromClassPath('control:time'));
  getElementFromClassPath('control:total-duration').innerHTML =
      sec2TimeString(Math.round(totalDuration));
};
ControlBar.prototype.setVisibilityMode = function(mode) {
  getElementFromClassPath('control').setAttribute('data-state', mode);
};
ControlBar.prototype.showTemporarily = function() {
  getElementFromClassPath('control').setAttribute('data-state', 'visible');
  if (this.timers_.setResponsive) {
    clearTimeout(this.timers_.setResponsive);
    delete this.timers_.setResponsive;
  }
  this.timers_.setResponsive = setTimeout(this.setResponsive_, 3000);
};
ControlBar.prototype.setPaused = function(flag) {
  getElementFromClassPath('control:play-pause')
      .setAttribute('data-state', flag ? 'paused' : 'playing');
  if (flag) {
    setTimeout(this.setVisibilityMode.bind(this, 'visible'), 100);
    if (this.timers_.setResponsive) {
      clearTimeout(this.timers_.setResponsive);
      delete this.timers_.setResponsive;
    }
  }
};
ControlBar.prototype.setFullscreen = function(flag) {
  getElementFromClassPath('control:fullscreen')
      .setAttribute('data-state', flag ? 'on' : 'off');
};
ControlBar.prototype.setLive = function(flag) {
  var fn = flag ? hide : show;
  fn(getElementFromClassPath('control:timeline'));
  getElementFromClassPath('control:time')
      .setAttribute('data-state', flag ? 'live' : 'vod');
};
ControlBar.prototype.destroy = function() {
  for (var t in this.timers_) {
    if (this.timers_.hasOwnProperty(t)) {
      clearTimeout(this.timers_[t]);
      delete this.timers_[t];
    }
  }
};

The implementation for anvp.SplashInterface

function Splash() {
  anvp.SplashInterface.call(this);
  this.notImplementedWarning_ = true;
}

Splash.prototype = Object.create(anvp.SplashInterface.prototype);

Splash.prototype.init = function() {
  getElementFromClassPath('splash:play').onclick = function() {
    mediator.publish('playRequest', true);
  };
};
Splash.prototype.show = function(splashMode, playerMode, img, remaining) {
  var splash = getElementFromClassPath('splash');
  splash.setAttribute('data-mode', splashMode);
  show(splash);
  mediator.publish('splashModeUpdated', splashMode);
  if (img) {
    cacheImages([img], function() {
      getElementFromClassPath('splash').style.background =
          'url(' + img + ') center center / 100% no-repeat';
    });
  } else {
    getElementFromClassPath('splash').style.background = 'none';
  }
};
Splash.prototype.setInfo = function(title, description) {
  getElementFromClassPath('splash:title').innerHTML = title;
  getElementFromClassPath('splash:description').innerHTML = description;
};
Splash.prototype.hide = function() {
  hide(getElementFromClassPath('splash'));
};
Splash.prototype.buffering = function(on) {
  getElementFromClassPath('custom-ui')
      .setAttribute('data-buffering', on ? 'on' : 'off');
};

The implementation for anvp.RecommendationInterface

function Recommendation() {
  anvp.RecommendationInterface.call(this);
  this.notImplementedWarning_ = true;
}

Recommendation.prototype =
    Object.create(anvp.RecommendationInterface.prototype);
Recommendation.prototype.init = function() {
  // populate HTML for recommendation frames
  generateGrid();
  // attach onclick event handlers
  for (var frameId = 0; frameId < recomFrameCount; frameId++) {
    var frame = getElementFromClassPath('recommendation:frame' + frameId);
    frame.onclick = onFrameClick(frameId);
  }
  getElementFromClassPath('recommendation:cancel').onclick = function() {
    clearTimers(recomTimers);
    hide(getElementFromClassPath('recommendation:up-next'));
    show(getElementFromClassPath('recommendation:grid'));
  };
  getElementFromClassPath('recommendation:play').onclick = function() {
    clearTimers(recomTimers);
    selectNextVideo(0);
  };
  getElementFromClassPath('recommendation:replay').onclick = function() {
    clearTimers(recomTimers);
    mediator.publish('playRequest', true);
    hideRecommendations();
  };
};
Recommendation.prototype.setRecommendations = function(vList, countDownTime) {
  recomVideoList = vList || [];
  recomVideoImgURLs = {};
  recomImgCacheCount = 0;
  recomCountDownSeconds =
      (typeof countDownTime != 'undefined' ? countDownTime :
                                             recomCountDownSeconds);
  var urlList = [];

  // set the frame video metadata and hide unused frames
  for (var idx = 0; idx < recomFrameCount; idx++) {
    var framePath = 'recommendation:frame' + idx;
    var frame = getElementFromClassPath(framePath);
    if (idx < recomVideoList.length) {
      var video = recomVideoList[idx];
      setInnerHTML(getElementFromClassPath(framePath + ':name'), video.title);
      setInnerHTML(
          getElementFromClassPath(framePath + ':duration'),
          sec2TimeString(video.duration));
      // keep list of frame indexes for each url in case multiple frames use
      // the same image url
      var idxList = recomVideoImgURLs[video.image];
      if (idxList) {
        idxList.push(idx);
      } else {
        recomVideoImgURLs[video.image] = [idx];
        urlList.push(video.image);
        recomImgCacheCount++;
      }
      show(frame);
    } else {
      hide(frame);
    }
  }
  mediator.publish('loadingRecommendations');
  // load all of the thumbnails images for the recommendations
  cacheImages(urlList, function(img) {
    recomImgCacheCount--;
    if (!img.src) return;
    var idxList = recomVideoImgURLs[img.src];
    for (var i = 0; i < idxList.length; i++) {
      var thumbnailPath = 'recommendation:frame' + idxList[i] + ':thumbnail';
      getElementFromClassPath(thumbnailPath).src = img.src;
      if (idxList[i] === 0) {
        getElementFromClassPath('recommendation:up-next')
            .style.backgroundImage = 'url(' + img.src + ')';
      }
    }
    // check if all thumbnail images have been loaded
    if (recomImgCacheCount === 0) {
      mediator.publish('recommendationsReady');
    }
  });
};
Recommendation.prototype.show = function(title) {
  if (!recomVideoList.length) return;
  var video = recomVideoList[0];
  getElementFromClassPath('recommendation:title').innerHTML =
      'Up Next: ' + (video.title || '');
  show(getElementFromClassPath('recommendation:up-next'));
  hide(getElementFromClassPath('recommendation:grid'));
  show(getElementFromClassPath('recommendation'));
  countDown(recomCountDownSeconds);
};

Customized Player

The player below demonstrates the customization achieved using the steps above. The files for this customization are available here.

Mediator topics

Mediator topics are published using the publish method of the mediator instance exposed from anvp.AnvatoCustomUIInterface. These must be published together with the arguments explained below.

mediator.publish('MEDIATOR_EVENT', arguments...);

bitrateSelected

bitrateSelected topic

Arguments:

Name	Type	Description
bitrate	number	The selected bitrate

captionLanguageSelected

captionLanguageSelected topic

Arguments:

Name	Type	Description
language	string	Selected caption language

captionStyleUpdate

captionStyleUpdate topic

Arguments:

Name	Type	Description
style	object	Caption style object

catchLive

catchLive topic

dispatchEvent

Event used for dispatching an SDK event for the page listener

Arguments:

Name	Type	Description
name	string	Event name
args	array	Arguments array

fullscreenClicked

fullscreenClicked topic

loadeddata

loadeddata topic

Arguments:

Name	Type	Description
readyState	number	HTML5 video ready state enum

loadingRecommendations

loadingRecommendations topic

playPauseClicked

playPauseClicked topic

Arguments:

Name	Type	Description
isPauseInternal	boolean	Flag used for indicating non-user triggered events to prevent a user interaction SDK event

playRequest

playRequest topic

Arguments:

Name	Type	Description
initial	boolean	The flag indicating if the play request is initial play request to include load first

recommendationSelected

recommendationSelected topic

Arguments:

Name	Type	Description
video	object	An object containing metadata for the selected recommendation video. Must include either a video url and format ('m3u8', 'mp4', etc.) or an id for the current MCP. Should also include a title, description, poster image URL, and video duration in seconds
isManual	boolean	indicates if recommendation item is selected manually or as a result of count down/auto advance

recommendationsReady

recommendationsReady topic

seekRequest

seekRequest topic

Arguments:

Name	Type	Description
timeIndex	number	New time index for seeking
origin	string	The component the topic is published from

splashModeUpdated

splashModeUpdated topic

Arguments:

Name	Type	Description
mode	string	Splash mode

toggleCaptionSet

toggleCaptionSet topic

toggleSharePanel

toggleSharePanel topic

volumeUpdate

volumeUpdate topic

Arguments:

Name	Type	Description
volume	number	Audio level

Sub-components reference

This section includes the API nethods the UI sub-compoenents interfaces provide:

• Control
• Splash
• Recommendation

Control

Decorates the control bar and hooks up the logic for the various control elements

Control API Methods

• .init(node, w, h)
• .rescale(w, fullscreen)
• .updateDuration(index)
• .updateLanguage()
• .setDuration(duration)
• .setVisibilityMode(mode)
• .showTemporarily()
• .hide()
• .setPaused(flag)
• .setFullscreen(flag)
• .setFullscreenButton(flag)
• .toggleCaptionSettingButton(flag)
• .setAvailableCaptionLanguages(languages, currentLanguage)
• .setAvailableBitrates(bitrates, currentBitrate)
• .setPlaylistReady(flag)
• .showRecallLabel(timeIndex)
• .hideRecallLabel()
• .setLive(flag)
• .setLiveCatch()
• .setAdMode(flag, counterAvailable)
• .setVolume(volume)
• .toggleVolume()
• .setDownload(url)
• .updateAdBreaks(indices, duration)
• .onBitrateChanged(bitrate)
• .onBitrateChangeInProgress(bitrate)

control.init(node, w, h)

Initializes the control instance

Param	Type	Description
node	HTMLElement	Container node
w	Number	Width
h	Number	Height

control.rescale(w, fullscreen)

Resizes the control node

Param	Type	Description
w	Number	Width
fullscreen	Boolean	Fullscreen flag

control.updateDuration(index)

Updates the current time and timeline bar width

Param	Type	Description
index	Number	Time index

Returns: Object - Layout instance

control.updateLanguage()

Update all of the user-facing text for this module to use the current language

control.setDuration(duration)

Sets the duration of the content

Param	Type	Description
duration	Number	Total duration

control.setVisibilityMode(mode)

Changes the visibility behavior of the control bar. There are three modes in which the control bar can be: 'visible', 'hidden', 'responsive'. In visible mode, the control bar is always visible. In hidden mode, the control bar is never visible. In responsive mode, the control bar is temporarily visible in response to the mouse moving over the video.

Param	Type	Description
mode	String	The visibility mode to use ('visible', 'hidden', or 'responsive')

control.showTemporarily()

If visibilityMode is set to 'responsive', then this makes the control bar temporarily visible

control.hide()

Hides the control bar

control.setPaused(flag)

Sets the play/pause button to show the play or pause icon according to the given flag

Param	Type	Description
flag	Boolean	If true, then the play/pause button will be set to show the play icon

control.setFullscreen(flag)

Sets the fullscreen button to show the enlarge or shrink icon according to the given flag

Param	Type	Description
flag	Boolean	If true, then the fullscreen button will be set to show the shrink icon

control.setFullscreenButton(state)

Shows or hides the fullscreen button. Fullscreen must also be supported by the user's device in order to be shown

Param	Type	Description
flag	Boolean	If true, then show the fullscreen button

control.toggleCaptionSettingbutton(flag)

Shows the caption 'Settings' option when the flag is true, hides the option when the flag is false

Param	Type	Description
flag	Boolean	If true, then the captions 'Settings' option will be shown. If false, then the option will be hidden

control.setAvailableCaptionLanguages(languages, currentLanguage)

Updates the list of available caption languages that the user can choose from, and disables the entry for the language that is currently in use

Param	Type	Description
languages	Array.<String>	The languages that captions are available for
currentLanguage	String | null	The caption language that is currently being used or null if captions are off

control.setAvailableBitrates(bitrates, currentBitrate)

Sets the array of available bitrates in the stream

Param	Type	Description
bitrates	Array.<Number>	Available bitrates
currentBitrate	Number	Currently streaming/loaded bitrate
bitratesToLabel	Object	Mapping from bitrates to custom labels

control.setPlaylistReady(flag)

Indicates the playlist is ready or not to hide/display a playlist button

Param	Type	Description
flag	Boolean	Flag for playlist readiness

control.showRecallLabel(timeIndex)

Used for displaying the current time before a preview enabled seek is initiated

Param	Type	Description
timeIndex	Number	Current time index before seek

control.hideRecallLabel()

Used for hiding the current time after a preview enabled seek is initiated

control.setLive(flag)

Sets the live flag so that the control bar can adapt its view to live or vod mode

Param	Type	Description
flag	Boolean	Live flag

control.setLiveCatch()

Indicates live is caught and view can be updated for live sync

control.setAdMode(flag, counterAvailable)

Sets ad mode (ad or content) so that the control bar can update its view accordingly

Param	Type	Description
flag	Boolean	Ad flag
counterAvailable	Boolean	Flag for indicating another UI element will be displaying a countdown

control.setVolume(volume)

Sets the audio volume

Param	Type	Description
volume	Number	The volume level to use from 0.0 to 1.0

control.toggleVolume()

Toggles the volume on and off. When toggled back on, the volume returns to the value it was at before being toggled off

control.setDownload(url)

Indicates that the video is downloadable and a button needs to be displayed

Param	Type	Description
url	String	Downloadable video URL

control.updateAdBreaks(indices, duration)

Updates the ad breaks so that the view can be updated

Param	Type	Description
indices	Array.<Number>	Ad marker positions (in seconds)
duration	Number	Content duration excluding the ad durations

control.onBitrateChanged(bitrate)

Indicates the bitrate has been changed

Param	Type	Description
bitrate	Number	New bitrate value

control.onBitrateChangeInProgress(bitrate)

Indicates that a bitrate change is in progress

Param	type	Description
bitrate	Number	Prospective bitrate value

Splash

Displays a splash image, play button, item title, and item description

Splash API Methods

• .init()
• .getCurrentMode() ⇒ string
• .getCurrentPoster() ⇒ String
• .show(splashMode, playerMode, img, [remaining])
• .setInfo(title, description)
• .setChromecastInfo(status, chromecastName)
• .resetInfo()
• .hide()
• .buffering(on)
• .rescale(w, fullscreen)

splash.init()

Initializes the splash object

splash.getCurrentMode() ⇒ string

Gets the current splash mode

Returns: string - selectedModeKey

splash.getCurrentPoster() ⇒ String

Gets current poster image

Returns: String - currentPosterURL

splash.show(splashMode, playerMode, img, [remaining])

Displays the splash (sync. or async.)

Param	Type	Description
splashMode	String	Splash mode
playerMode	String	Splash mode
img	String	Image URL (enforces async when provided)
[remaining]	Number	Remaining time in seconds

splash.setInfo(title, description)

Sets the title and description information and makes info holder visible

Param	Type	Description
title	String	Item title
description	String	Item description

splash.setChromecastInfo(status, chromecastName)

Notifies about the chromecast state and related metadata

Param	Type
status	string
chromecastName	string

splash.resetInfo()

Resets the title and description information and makes info holder invisible

splash.hide()

Hides the splash object

splash.buffering(on)

Displays or hides the progress circle

Param	Type	Description
on	Boolean	A flag indicating whether to show the progress circle

splash.rescale(w, fullscreen)

Rescales the splash

Param	Type	Description
w	Number	Width
fullscreen	Boolean	Fullscreen flag

Recommendation

Provides a UI for the user at the end of a playlist that displays a grid of recommended videos

Recommendation API Methods

• .init()
• .setRecommendations(vList, countDownTime)
• .show(title)
• .hide()

recommendation.init()

Initializes the recommendation instance

recommendation.setRecommendations(vList, countDownTime)

Sets the list of recommended videos to be displayed

Param	Type	Description
vList	Object	A list of video objects. Each object must include either a video url and format ('m3u8', 'mp4', etc.) or an id for the current MCP. Should also include a title, description, poster image URL, and video duration in seconds
countDownTime	Number	The time in seconds to countdown before autoplaying the first recommendation

recommendation.show(title)

Displays the recommendations

Param	Type	Description
title	String	The title to display above the grid of recommendations

recommendation.hide()

Hides the recommendations

Data Adaptors

Data adaptors are used for fetching a specific media content platform's media metadata and converting that into Anvato Web Player SDK's media information that is used as an initialization configuration or a playlist item.

While this documentation explains using only TKX Data Adaptor, it is possible to implement a similar adaptor for various other media platforms.

TKX Adaptor

TKX adaptor accepts the TKX specific parameters in an init configuration and converts them into the standard media information the player SDK consumes such as url, title, description, poster and other metadata.

Parameter	Type	Definition
video	String	Video ID provided by MCP
accessKey	String	Enables the remote config and TVE services such as metadata lookup, schedule, geo station check and parental control.
token	String	Provides access to the video. This token can be generated using the token generation algorithm or obtained from MCP embed code

Integrating the TKX Adaptor

Using the player SDK with the TKX adaptor involves the following steps:

1. Add the TKX Adaptor script ​<script src='//w3.cdn.anvato.net/player/prod/v3/scripts/tkxadaptor.min.js'></script>
2. Add the usual web player SDK script ​<script src='//w3.cdn.anvato.net/player/prod/v3/scripts/anvload.js'></script>
3. Instantiate TKX Adaptor var tkxAdaptor = new TkxAdaptor({debug: false});
4. Pass the init configuration and a callback to the getMediaInfo method of tkx adaptor instance tkxAdaptor.getMediaInfo({     accessKey: "X8POa4zPPaKVZHqmWjuEzfP31b1QM9VN",     video: "3697661",     token: "1xj4kk7xz_fVPtiSr68S5eBfhNOjAZOfDKqURVp7-Kc~MX4wfg" }, onMediaInfo);
5. Init the web player SDK as usual using the converted configuration inside the callback method function onMediaInfo(initConfig){     AnvatoPlayer('p0').init(initConfig); }

Use Cases

Anvato Video Player Plugin for WordPress

Introduction

Anvato WordPress plugin enables Anvato Media Content Platform (MCP) customers to embed a video player into their posts with a single click.

Installation

To get the Anvato WordPress plugin working with your WordPress account, please follow the steps below:

Step 1

Download the plugin folder here.

Step 2a

Go to your WordPress admin panel. Click on Plugin > Add New. Then click on the Upload Tab.

Upload the zip file that you downloaded from step 1 in the plugins folder of your WordPress install.

You will be taken to the activate a plugin page. Please make sure that you click on Activate the plugin link on the page. This step completes your installation.

Step 2b

If you like to use installation via FTP, please follow these steps. Access your host through the FTP manager. Access the path /wp-content/plugins/ and upload files there.

Once you have uploaded, then you would need to click on the Plugins tag in your WordPress admin panel. You will see the plugin you just uploaded. Click on the Activate button and you are done.

Step 3

Get the below configuration parameters from your Anvato support contact

• MCP URL
• MCP ID
• Station ID
• Public Key
• Private Key

Step 4

Set default video player size & autoplay state

• Player URL
• width
• height

Step 5 (Optional)

Set tracking parameters for analytics, leave it empty if you use default

• Tracker ID
• Profile
• Account
• Tracking Server

Step 6

Set monetization parameters if you want to display preroll and midroll ads.

If you are using DFP Ad server, please use the below parameter to insert your VAST Tag.

• DFP Premium Ad Tag

Usage (by Web Editor)

While editing a WordPress post, click the “Add Media“ tool, and choose “Insert Anvato Video” from left hand side bar.

Most recent videos in Anvato Media Content Platform are displayed in a pop-up overlay. You can narrow down the search by entering titles, descriptions or keywords.

Select the videos you wish to insert into your posts, and click “insert into Post” button. You are done.

Please note that when you select more than 1 video, you will create a playlist on a single player.

How it Works

On the background, we have inserted a WordPress short code into your post. This shortcode will display a video player when your users visit this page.

Advanced Settings

Parameters and Shortcodes

// Creates a player
[anvplayer video="282411"]

// Creates a player of 300×125 pixels that auto plays video id 282411.
[anvplayer video="282411" width=”300” height=”125” autoplay=”true” ]

When you use Anvato WordPress Plugin, you can customize your player using shortcode attribute at page level. You can add the following attributes to your shortcode

• video [Video ID]
• width [in px]
• height [in px]
• autoplay [true if autoplay is requested]

Facebook Instant Articles

Facebook Instant Articles are supported by the Web Player SDK. In order to embed a video in a Facebook Instant Article, please follow the steps below:

1. Prepare your player configuration:

Prepare your video configuration in a JSON format.

// Sample player configuration
{
    "url":"https://mcp-download.storage.googleapis.com/anv-videos/variant/3697036.m3u8",
    "poster":"https://mcp-media.storage.googleapis.com/anv-iupl/5FA/ACA/5FAACA8FB2F3459C81F2CEF515615DAF",
    "title":"Sintel",
    "description":"Third Open Movie by Blender Foundation"
}

2. Remove new lines and extra spaces from your player configuration and encode your player configuration using base64 encoding:

// Base64 encoded player configuration
"eyJ1cmwiOiJodHRwOi8vbWNwLWRvd25sb2FkLnMzLmFtYXpvbmF3cy5jb20vYW52LXZpZGVvcy92YXJ
pYW50LzM2OTcwMzYubTN1OCIsInBvc3RlciI6Imh0dHA6Ly9tY3AtbWVkaWEuczMuYW1hem9uYXdzLmN
vbS9hbnYtaXVwbC81RkEvQUNBLzVGQUFDQThGQjJGMzQ1OUM4MUYyQ0VGNTE1NjE1REFGIiwidGl0bGU
iOiJTaW50ZWwiLCJkZXNjcmlwdGlvbiI6IlRoaXJkIE9wZW4gTW92aWUgYnkgQmxlbmRlciBGb3VuZGF
0aW9uIn0="

Note: Make sure that it is a valid formatted JSON string.

3. Use our Facebook Instant Articles loader (anvloadfbia.html) to prepare the URL for the embedded iframe by using your base64 encoded player configuration to fill in the anvkey url parameter:

Template URL: https://w3.cdn.anvato.net/player/prod/v3/anvloadfbia.html?anvkey=[BASE64_ENCODED_CONFIGURATION]

// Example:
"https://w3.cdn.anvato.net/player/prod/v3/anvloadfbia.html?anvkey=eyJ1cmwiOiJodHRwOi8vbWNwLWRvd25sb2FkLnMzLmFtYXpvbmF3cy5jb20vYW52LXZpZGVvcy92YXJpYW50LzM2OTcwMzYubTN1OCIsInBvc3RlciI6Imh0dHA6Ly9tY3AtbWVkaWEuczMuYW1hem9uYXdzLmNvbS9hbnYtaXVwbC81RkEvQUNBLzVGQUFDQThGQjJGMzQ1OUM4MUYyQ0VGNTE1NjE1REFGIiwidGl0bGUiOiJTaW50ZWwiLCJkZXNjcmlwdGlvbiI6IlRoaXJkIE9wZW4gTW92aWUgYnkgQmxlbmRlciBGb3VuZGF0aW9uIn0="

Note: You can test this url by opening the URL on your browser. Given that the iFrame is hosted in a secure URL, make sure that your CDN supports secure connections (https cert) to avoid mixed content or certification errors.

4. Use the following template to create the Facebook Instant Article embedded video using the prepared URL from the previous step:

<!-- Template: -->
<figure class="op-interactive">
    <iframe src="[ANVLOADFBIA_PREPARED_URL]"
      width="640" height="360" sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox" allowfullscreen
      layout="responsive" scrolling="no" frameborder="0"></iframe>
</figure>

<!-- Example: -->
<figure class="op-interactive">
    <iframe src="https://w3.cdn.anvato.net/player/prod/v3/anvloadfbia.html?anvkey=eyJ1cmwiOiJodHRwOi8vbWNwLWRvd25sb2FkLnMzLmFtYXpvbmF3cy5jb20vYW52LXZpZGVvcy92YXJpYW50LzM2OTcwMzYubTN1OCIsInBvc3RlciI6Imh0dHA6Ly9tY3AtbWVkaWEuczMuYW1hem9uYXdzLmNvbS9hbnYtaXVwbC81RkEvQUNBLzVGQUFDQThGQjJGMzQ1OUM4MUYyQ0VGNTE1NjE1REFGIiwidGl0bGUiOiJTaW50ZWwiLCJkZXNjcmlwdGlvbiI6IlRoaXJkIE9wZW4gTW92aWUgYnkgQmxlbmRlciBGb3VuZGF0aW9uIn0="
      width="640" height="360" sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox" allowfullscreen
      layout="responsive" scrolling="no" frameborder="0"></iframe>
</figure>

5. The tag is now ready to be embedded in a Facebook Instant Article. For more information regarding third party embeds please refer to FBIA documentation.

Pausing the Player in Inactive Tabs

// Adapted from the code example on the Mozilla Developer Network documentation
// for the Page Visibility API (https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API)

// Set the name of the hidden property and the change event for visibility
var hidden, visibilityChange;
if (typeof document.hidden !== 'undefined') { // Opera 12.10 and Firefox 18 and later support
  hidden = 'hidden';
  visibilityChange = 'visibilitychange';
} else if (typeof document.msHidden !== 'undefined') {
  hidden = 'msHidden';
  visibilityChange = 'msvisibilitychange';
} else if (typeof document.webkitHidden !== 'undefined') {
  hidden = 'webkitHidden';
  visibilityChange = 'webkitvisibilitychange';
}

// If the page is hidden, pause the video;
// if the page is shown, play the video
function handleVisibilityChange() {
  if (document[hidden]) {
    AnvatoPlayer('p0').pause();
  } else {
    AnvatoPlayer('p0').play();
  }
}

AnvatoPlayer('p0').on('ready', function(playerInstance) {
  // ...
  // Warn if the browser doesn't support addEventListener or the Page Visibility API
  if (typeof document.addEventListener === 'undefined' || hidden === undefined) {
    console.log('This demo requires a browser, such as Google Chrome or Firefox, that supports the Page Visibility API.');
  } else {
    // Handle page visibility change
    document.addEventListener(visibilityChange, handleVisibilityChange, false);
  }
});

In some cases, you may want to pause video content when the user switches tabs or pause audio content on mobile when returning to the home screen. This can be accomplished using the Page Visibility API.

See the sample code for a basic implementation of pausing when the tab is inactive and playing when the user returns to the tab. Note that this example applies to both desktop and mobile. You may need to detect the user's device or browser first in order to apply this behavior for particular user environments.

Release Notes

Latest Version 3.2.8 (11/07/2018)

1. Made STRICT_MEDIA_URL_ORDER default playerSelectionType
2. Ensured loadScript loads safe absolute URLs against XSS
3. Fixed viewability event causing error after destroy
4. Used ENABLED VPAID mode for ios devices in DFP plugin
5. Introduced aspectRatio to override default 16:9 aspect ratio
6. Conviva plugin is now available as a custom plugin
7. Avoided case where player gets stuck during failover
8. IAS plugin is now available for client-side DFP ads
9. Added SHAK001 to blacklist errors, enhanced failover
10. Prevented preroll playing in the background during failover workflow.
11. Avoided conflict between client-side and server-side ads
12. Exposed dfp library, vast and media request and load events
13. Fixed bitrate comparison in AnvatoMse when switching up
14. Fixed the issue with ad timer text on resize
15. Fixed initial bitrate switch issue on Safari
16. Avoided processing multiple video or audio streams
17. Added prior live offset usage evaluation for DASH catchLive
18. Provided autoplay based on viewability
19. Provided playlist manipulation API methods
20. Allowed multiple event names for on, off/unbind, unbindAll
21. Fixed an issue impacting catching live for DASH
22. Fixed setBitrate from halting segment downloads
23. Added support for disableMutedAutoplay config parameter

Version 3.2.7 (10/03/2018)

1. Added LEGACY_VM_SUPPORT compile flag for ie11 error for HLS
2. Provided 3 optimization modes for MSE based HLS: ASM, MODULARIZED_WEB_ASSEMBLY and WEB_ASSEMBLY
3. Limited auto bitrate switches based on screen size
4. Performed quicker bitrate switches when player is resized to a bigger size
5. Fixed an issue affecting ad clicks for DFP VPAID ads
6. Added remote config support for bitrate cap parameters: disableAutoBitrateSwitchCap and autoBitrateSwitchCapScale
7. Introduced additional stream error code PLAY480 for HLS streams when the sequence number resets to another offset
8. Added shareLink to generateEmbed output
9. Added segment duration based refresh time for HLS playlist
10. Fixed Conviva plugin creating multiple video sessions when blacklisting the stream
11. SDK now display error slate of DRM010 when DRM playback is attempted on a non-SSL page
12. Enabled seek after seek offset correction
13. Added dfp client-side disableCustomClickTracking parameter
14. Set sessionAutoPlaySupport.unmutedAutoPlay in setVolume
15. Avoided duplicate 608 captions rendered as sidecar
16. Removed the restriction for dispatching VIDEO_STARTED event when video starts with a non-zero offset
17. Fixed issue where ts segment timeout cap could be negative
18. Added isPresentationTime argument to seekTo API method
19. Fixed videoJSON to manifest redirect's failover obstruction
20. Enabled switching rendition when rendition is stale
21. Added ad break duration to AD_BREAK_START for DFP CSAI
22. Added stop call for comScore plugin when the document goes into hidden mode
23. Avoided unnecessary stop() calls for comScore
24. Added IMPLICIT_PAUSE event to distinguish pause events not triggered by user interaction
25. Introduced playerSelectionType and STRICT_MEDIA_URL_ORDER
26. Allowed failover for assets with videoJSON request redirecting to manifest
27. Fixed the currentAd is not available due to ad blocker

Version 3.2.6 (09/04/2018)

1. chromeless parameter now hides splash gradient and ad timer
2. Improved caption styling persistence through failovers and renderer switches
3. Updated player state for implicit pauses (relevant to tapping on home button on mobile browsers)
4. Matched setCaptionStyle API capabilities with those of caption settings UI
5. Prevented gap recovery causing completed event during live playback
6. Set comscore plugin ad metadata for live content
7. Prevented showing control bar icons during ad on resize
8. Added adsRequestTimeout to DFP plugin
9. Fixed incorrect AdBreakIndex reported by ad break events.
10. SDK now dispatches PRESENTATION_UPDATED for FreeWheel ads and main content
11. Removed VoD only restriction for setCaption API
12. Prevented direct gap recovery on waiting event
13. Delayed adding source buffer until MSE sourceopen event
14. Added derived metadata support for the Nielsen plugin
15. Added check for video playback in ShakaVideo during buffering event
16. Prevented reload when there is pending play promise
17. Provided implied canplay callback based on non-zero buffer
18. Cancelled non-buffered seek for Shaka library v2.
19. Handled implicit gaps that have no indicator event
20. Downgraded shaka library to 2.0 from 2.4 adapting abr
21. Player SDK now detects stream type (live/VoD) from HLS manifest sparing the need for setting live flag for external URL playbacks
22. Handled the case in which TKX video request returns manifest
23. Fixed low bandwidth seeking issues on Shaka media module
24. Added manual bitrate switch & abr UI representation for Shaka media module
25. Prevented evaluation for playlist items without metadata causing redundant reload and spinning wheel
26. Fixed URL resolution for master, rendition, segment URLs after 302 redirect for HLS
27. Added support for optional addTemporalSlot FW parameters
28. Allow custom plugins to receive all the player events.
29. Fixed AD_BREAK_START event is being sent for each individual ad for DFP CSAI
30. Revealed enablePreloading param for DFP client-side ads
31. Exposed extra ad metadata for client-side DFP video tracking
32. Handled sidecar caption file loading failure
33. Fixed client-side DFP postroll not getting played when the VMAP has only postroll.
34. SDK now skips feed items with falsy c_is_playable_l value
35. Published bitrateChanged event for playback using native HTML5 video when media url is set
36. Enabled blacklisting of failed recommendation items
37. Allowed multiple levels of fallbacks for media modules
38. Removed all listeners when destroy is called
39. Set player type and version for client-side DFP plugin

Version 3.2.5 (08/14/2018)

1. Added derived metadata support for the Nielsen plugin
2. Rectricted deferred metadata load to the items lacking media source information
3. Updated master, rendition, segment URLs after 302 redirect for HLS
4. Added support for optional addTemporalSlot FW parameters
5. Updated volume UI with the actual volume after setVolume, not given volume
6. Applied gap recovery to Shaka media module
7. Upgraded shaka media library to v2.4.2
8. Prioritized local config over remote config for custom plugins
9. Provided support audio-only HLS streams
10. Delayed opening audio source buffer for HLS until audio found
11. Fixed the issue where forward seeks recorded as backward seeks
12. Audio plays unmuted if volume is set to 0 and autoplay is enabled but not supported.
13. Fixed unmute button needing second click/tap
14. Allowed user to interact with skip ad button on iPad
15. Fixed the issue with parsing video codec from master.m3u8
16. Enabled fallback to muted autoplay when the autoplay detection times out
17. Fixed iOS Safari Audio stream does not play after video preroll autoplays.
18. Fixed missing setTimeDelta method on custom ui

Version 3.2.4 (07/02/2018)

1. Provided ComScore v6.2 integration using custom plugin architecture
2. Enhanced HLS media module to support NAL units that are partitioned inside multiple samples
3. Introduced a configurable progressTimeout for DFP VPAID ads (default is 3 seconds)
4. Added customTrackingServerSecure parameter to Adobe Heartbeat configuration
5. Fixed the issue in which manual bitrate setting was not preserved through unbuffered seek
6. Fixed decremented control bar icons' not getting displayed after increasing screen width
7. Fixed mute issue impacting audio only streams on mobile browsers
8. Non-buffered seek now seeks to the exact time index as opposed to the segment start
9. Enhanced ManualAdScheduler to support external media urls
10. Made SidecarCaption case-insensitive to caption label
11. Fixed segment abort/timeout for the lowest rendition for bad network
12. Added AUTOPLAY_STATUS player event to reveal autoplay status: NONE , UNMUTED, MUTED or BLOCKED
13. Allowed playNext() API call for single item playback
14. Added updateDerivedMetadata API method to be able to change derived metadata
15. Added programChange API method to be able to set schedule based metadata for external url playback
16. Introduced network status events with BROWSER_OFFLINE, CRITICAL_OFFLINE_BUFFER and BROWSER_ONLINE critical buffer pause
17. Changed evaluation for pausing/resuming ads that prevented pausing during client-side ad due to server-side mode coexisting
18. Prioritized the script with data-anvp over anvload.js source to handle page level third parties' interefering with script tag during runtime
19. Added condition when searching for anvload.js script tag to handle dynamic script generation and init issue

Version 3.2.3 (05/30/2018)

1. SDK now sends PRESENTATION_UPDATED event during DFP client-side ads
2. Allowed passing content specific derived metadata and mapping information to include supporting external URLs
3. Fixed adding empty CEA608 closed captions with valid headers that supress side-car closed captions
4. SDK now allows implementing custom plugins that get loaded and injected into the player iframe context
5. Fixes the case in which pre-roll was regarded as post-roll.
6. Refactored ad timer logic into new AdTimer module
7. Refactored Learn More button into a new AdLearnMore module
8. Loading spinner is now displayed for HLS videos when the player is out of buffer
9. Added CAPTION_DETECTED event with caption languages as the payload
10. Implemented manual client-side ad break scheduling for DFP
11. Restored the current caption language after detecting 608 captions
12. Fixed the issue affecting client-side, post-roll only ad breaks by notifying the DFP plugin of video content end regardless of preroll
13. SDK now blacklists renditions after failed download attempts
14. Player now hides the ad timer and gradient when info set to false

Version 3.2.2 (05/08/2018)

1. Fixed the cookie removal issue by removing the path information for IE11/Edge support
2. Provided additional polyfills needed for the upgraded aes library on IE11
3. Added IS_OFFSITE macro and enabled offsitePlugins config
4. Limited server-side ad tracking flag addition to only dcs-*.apis based media urls
5. Added autoplay and muted playback information for DFP ad requests
6. Isolated hlscore to reduce memory consumption
7. Fixed the custom ui volume button not updating with first muted state
8. Added trace id anvtrid to the TKX requests
9. Enabled CBC mode for AES library for FairPlay cert decryption
10. Added support for getting Fairplay cert from TKX
11. Added support for dynamic playlist items with id and token
12. Populated playlist node layout for inline iphone/ipod playback
13. Added failover in JSHls for media decode errors
14. Blacklisted renditions on media decode error to continue playback with proper renditions or fallback to next available media module if none exists
15. Added vod/live specific embed parameters to enforce native HTML5 based HLS playback on Safari
16. Allowed Facebook Instant Article embed code key to be encoded using long form of config parameters
17. Removed splash header gradient if info and control are false
18. Modified util.removeCookies to remove from all subpaths
19. Added playlistBaseURL support from remote config.
20. Allowed passing custom fields in server-side Freewheel plugin
21. Allowed using multiple callbacks for get API methods

Version 3.2.1 (04/12/2018)

1. SDK now enables server-side tracking for live DAI enabled stream based on the selected media module
2. Provided iframe wrapper to handle Facebook Instant Articles resizing issue on iOS
3. Fixed 'Play Next' button being displayed for the last item in playlist after entering fullscreen
4. Added additional logs for verifying Google Analytics pings
5. Introduced iosCustomPlayback embed parameter that can be used to play ads in native fullscreen for clientSide DFP on iOS
6. Enhancements for playing third party HLS streams
7. Enhancements for CEA608 closed caption rendering and rescaling
8. SDK now blocks autoplay for audio only media if browser blocks unmuted autoplay
9. Added native .aac audio playback support
10. Fixed CEA608 closed captions remaining on view after an unbuffered seek
11. Fixed IE11 (Windows 10) DRM enabled DASH playback issues

Version 3.2.0 (03/20/2018)

1. Fixed issue where the player ignores logo sizeFactor parameter
2. Logo is now hidden during ads
3. Changed cust_params value replacement for '%C' in dfp plugin
4. Enabled using DFP client side config from remote configuration
5. SDK now clears closed caption buffer when converting a previous segment
6. Prevented tracking calls being queued for server-side ad plugin
7. Consolidated loadScreen showing up on various custom UI implementations
8. Fixed the issue in which clicking skip video button during last video in playlist displays splash but video keeps playing
9. Handled discontinuities for init segments
10. Replaced pts_offset/pts_section with dts_offset/dts_section
11. Enhancements to perform quicker initial bitrate switch for HLS
12. SDK now uses the first DTS value instead of first PTS for baseMediaDecodeTime
13. SDK now sets play head to the buffer range start for first segment (needed for segments that do not start with a key frame)
14. The sdtp mp4 box is now added when it is missing during ISO-BMFF conversion
15. Implemented checking for gap after switching the bitrate
16. Fixed spinning wheel showing up due to an intermittent delayed playhead update for Firefox browser
17. Fixed ad tracking issue by using ad sequence index as opposed to ad index for ad events
18. SDK now appends video init data to sourcebuffer only when it is needed
19. Implemented caching for video init data per rendition
20. Improved support for external streams with B-frames
21. Enabled HTTP/HTTPS adaptation for real time analytics
22. Replaced gesture="media" with allow="autoplay" for iframes
23. Enabled UTF8 encoding and decoding support for aes util methods
24. Google Analytics plugin now supports tracking custom events which allows tracking based on the event payload
25. Fixed the issue in which Heartbeat v1.5 video complete event is not tracked after a user performs seek
26. Enabled support for VMAP with both linear and non-linear ad content
27. Fixed live flag overriding explicit autoplay false setting
28. Allowed FreeWheel AdManager to be configured in onBeforeVideoLoad hook

Version 3.1.7 (02/06/2018)

1. Improved autoplay detection for Safari browsers
2. Fixed closed captions settings color picker overflow on Firefox
3. Fixed time index label showing up after resize for live
4. Enabled deferred metadata fetching for playlist UI
5. Fixed Moat client-side plugin not getting initialized
6. Fixed autoplay mute lock evaluation for native media playback
7. Added dfp clientSide bitrate parameter which makes IMA SDK select an ad video lower than this bitrate

Version 3.1.6 (01/24/2018)

Enabled dynamic autoplay capability detection to handle new autoplay policies enforced by browsers such as Chrome 64+, Safari 11+. This detection provides three suggestions and the player SDK takes the actions in the order listed below:

1. Unmuted playback is allowed: Player SDK proceeds with unmuted autoplay
2. Muted playback is allowed: Player SDK proceeds with muted autoplay and stays muted until the user unmutes the video.
3. None of them is allowed: Player SDK waits for the user's tap/click on play button to start playback.

Version 3.1.5 (01/18/2018)

1. Fixed an issue which prevents custom UI rendering for share link, AMP and Facebook Instant Articlers
2. Now it is possible to change freewheel configuration using onBeforeVideoLoad hook
3. Enabled 3rd party cookie blocker checker for Safari on Mac OS
4. Introduced getPlaylistIndex API method and PLAYLIST_ITEM_CHANGED event to reveal playlist index
5. Fixed the SSL error caused by the outdated Freewheel AdManager library URL.
6. Enhanced gap handling near the end of HLS stream evaluating the unbuffered seek offset

Version 3.1.4 (12/21/2017)

1. Made freewheel library URL socket adaptive
2. Prevented the latency in closed captions showing up
3. Measures taken to handle imminent autoplay policy change with Chrome 64+
4. Improved the playback for external HLS streams with backup streams
5. Fixes handling preamble for CEA608 captions
6. Fixed single quote breaking iframe generation when passes with inline data-anvp or init API method
7. Fixed clientside freewheel ad to content switch
8. Fixed unclean end of aac frames error
9. Added DFP clientSide parameter fullAdClickableOnMobile
10. Prevented further polling when an ad blocker blocks the library for the DFP plugin

Version 3.1.3 (11/20/2017)

1. Control subcomponents can be hidden using the name + ButtonVisible embed parameter
2. Fixed default ui control bar gradient showing up in the custom ui
3. Converted s3 based urls to google storage based ones
4. Fixed ad tracker indices mismatch
5. Introduced preferredCdn to prioritize one cdn among multiple sources
6. Enabled tracking for breakStart and ClickTracking vast events
7. Enabled tracking for smart xml videoView events
8. Disable fullscreen button for Android WebView implementations. Android WebView does not currently support the fullscreen API.
9. Styled DFP 'Learn More' button consistently between android/ios
10. Prevented ciu_sz appending to zero size companion entries (zero size companion entry is used for getting all sizes for testing purposes)
11. OnCaptionUpdated, set caption setting to current language if available
12. Added playbackOrigin to the PLAYING_START event
13. Added pagination to recommendations UI
14. Added config parameter bufferForCatchLive for HTML5 player catchLive
15. Added layout configuration for overlay ads (non-linear DFP ads)
16. Introduced derivedMetadata embed parameter which is used for passing derived metadata from application layer.
17. Show poster image before video loads when autoplay is true
18. Added support for ComScore library v5.2.0 Added DerivedMetadata support in ComScore plugin (new plugin)
19. Made buffered seek for HTML5 player catchLive instead of reload
20. Limited min and max font size for nativeController captions
21. Added config param to render 608/sidecar captions for Safari HTML5 player
22. Introduced SITE_URL macro for heartbeat
23. Introduced streamTokenizationCheck embed parameter

Version 3.1.2 (10/12/2017)

1. Prevented new dfp iframes being appended which blocks ad clicks
2. Prevented now service based program change event overriding an event info that starts earlier than the schedule
3. Enabled backup vcodec value in case CODECS atrribute is not provided for a rendition
4. SDK now appends ciu_szs to DFP adTagUrl in the presense of companion placeholder registration
5. Reset RTAnalytics hotspots when new asset is loaded
6. User-defined labels now fully supported via onBitrateUpdated. If multiples bitrates are mapped onto the same custom label, the label will correspond to the higheset bitrate that maps onto it.
7. Allow feed id to be provided for recommendations
8. Made codec info extraction space insensitive
9. Filtered out audio only renditions from HLS manifest parsing
10. Set ad/ad break index and duration to -1/0 when undefined (heartbeat requests on seek event)
11. Prevented autoplay on android with dfp ads when no initial ad config given but set with onBeforeVideoLoad hook later
12. Introduced allowAutoPlayWithAdsOnAndroid embed parameter for testing DFP's autoplay support
13. Exposed DFP ad error codes in the error event appended to the end
14. Introduced the use of default image for recommendation items to prevent blocking due to the missing images
15. Provided a tkx data adaptor to be used with a lightweight generic player sdk added build config for data adaptors non-minified version of requirejs is needed for local debugging

Version 3.1.1

1. Fixed autosizing issue impacting browsers on Android.
2. Made HLS tag parsing whitespace insensitive
3. Added device id to tkx requests populated with a UUID cached for 6 months
4. Fixed mute API call removing muted attribute that blocks mobile autoplay
5. Fixed closed captions' losing sync for MSE based HLS
6. Increased default side car lines to 3
7. Enabled closed caption customization for CEA-608 type on MSE based HLS
8. Enabled timed metadata parsing from rendition custom tags
9. Enabled closed caption customization for DASH captions
10. API method playByIndex is now available to play an item by index as opposed to video id
11. Changed the live chapter context for Adobe Heartbeat & Nielsen when derived metadata is enabled
12. Derived metadata is not enabled by default for Adobe Hearbeat & Nielsen plugin
13. Audio only (mp3 containter) playback capability is now available using direct media url and format as mp3

Version 3.1.0

1. Prevented DRM detection for non-SSL pages
2. Added DRM020 error indicating that FairPlay cert is not accepted
3. Implemented auto bitrate switch for DASH Live
4. Enabled manual bitrate selection for DASH Live
5. Enhanced autobitrate switch heuristics
6. Exposed CUE_POINT and SEGMENT_BEACON events
7. Realtime analytics enhancements to cover tracking error details and hot spots for VOD
8. Fixed splash mode stuck at loadScreen for stitched ads flow
9. Added debugMode support for joint Heartbeat Nielsen SDK (needed for certification through log messages)
10. Fixed the bug causing 360 playback to fail
11. Fixed TIME_UPDATED not firing for replayed section after a backwards seek
12. Removed intent player related triggers
13. Handled the issue in which chrome throws a video error while performing DRM detection
14. Implemented MOAT plugin for server-side stitched ads
15. Enabled iOS inline IMA support
16. Event and caption parsing for live DASH streams
17. Added support for MOAT with DFP client side ads
18. Enabled derived metadata for joint Heartbeat Nielsen plugin
19. Upgraded joint Heartbeat Nielsen library to 1.6.9
20. Made custom UI assets' relative URLs relative to the page as opposed to the SDK base URL

Version 3.0.8

1. Support for non-conformant encoder codec parsing string
2. Removed static xUrl service url (placed for demo purposes)
3. Updated flash binary to include dfxp parsing for dfxp millisec.
4. Provided Promise polyfill for IE9+
5. 360 Turn on strategy changed, prevented potential multiple async callback to load 360 dependencies
6. Fixed embed code not displaying protocol correctly
7. Cancelled Loader level pluginUpdate that only updates references, converted it to re-init supported plugin (dfp currently)
8. Handled pluginUpdate called after pollAds->requestAds
9. Added error code expected on browsers running on iOS devices lacking DRM support:
   • 'DRM004', 'The browser does not have DRM support', true
10. Improved Safari browser detection
11. Added error codes:
    • 'DRM010', 'DRM is not allowed on a page without SSL', true
    • 'DRM011', 'Browser does not support DRM encryption type', true
12. Fixed the issue causing dai vod dash with drm to stall after add
13. Handled gap with readyState 4 at the beginning for shaka adaptation layer
14. Fixed playlist load image problem on the first 2 seconds
15. playlist embed parameter now accepts external url objects, also mixmatching video id and external url is allowed
16. Removed playlist item limit ios Caption issue fixed, embedded caption selection via player controls supported (previously only by device settings)
17. Exposed a callback onBeforeVideoLoad and event beforeVideoLoad which provides a way for those callbacks/listeners to return a modified config blocking the video load. Using these changes one can change the dfp config before each load.
18. Added support for getting video projection mode from MCP
19. Fairplay drm is now available for native hls playback on MacOS Safari browser. This blocks MSE capability in the presence of drm config while loadinf HLS on MacOS Safari
20. Enhancements in 360 feature
21. Send comscore pause during ad
22. Elapsed time is now available for analytics plugins
23. Waived the need for passing a profile for heartbeat plugin when a config is provided via page level config or remote config
24. Additional play tracking for nielsen per up-to-date documentation
25. Added xUrl support to cast sender

Version 3.0.7

1. Enhancements in Nielsen plugin
2. Provided a timeout between dfp plugin loaded and started event with default 5 seconds and configurable with startTimeout embed parameter under dfp->clientSide
3. Enabled master caching for MSE based HLS playback configurable with masterCacheDuration embed param with the default 30 seconds value
4. Bound bitrate set methods and events to flash player
5. Enabled HDS support via flash player
6. Added error code VMNG020 to notify media formats are not supported
7. Enabled error slate for critical error messages respecting previously displayed error message
8. Prevented request to an invalid playlistJSON location
9. Exposed getAdDuration API method to cover server and client side ads
10. Fixed splash not showing up when poster image url is not accessible
11. Prevented duplicated timer starts on multiple ad starts during failover
12. Fixed byte-range to non byte-range switch for MSE based HLS
13. Fixed play button staying after implied mobile pause (browser trigerred pause) during ad
14. Caption button is removed from small player sizes
15. Enabled initialBitrate and autoBitrateSwitch embed parameters for MSE based HLS
16. Enabled support for DFP overlay ads
17. Introduced the event NON_LINEAR_AD_DISPLAYED for overlay ads
18. Extended the pause on click behavior via pauseOnClick embed parameter to include resume
19. Prevented share button click's causing pauseOnClick
20. The play API now accepting array of video ids and external url object
21. Enhancements for Google Analytics custom dimensions

Version 3.0.6

1. The pause on click behavior is now available via pauseOnClick embed parameter
2. play(mediaInfo) API now accepts array of video ids and objects populated with external url
3. Google Analytics is now available
4. Security enhancement for flash binary
5. The error slate displayed when a 360 video is played on a browser lacking 360 support can now be disabled with setting display360ErrorSlate to false.
6. 360 playback on mobile browsers now supports swapping to navigate
7. Fullscreen button can now be hidden using fullscreenButtonVisible embed parameter
8. Looping through the playlist is now possible using loop embed parameter
9. The player now preserves fullscreen mode for playlist as long as there is next item in the playlist
10. Error codes PLAY455 and PLAY456 are introduced
11. Failover enhancements to cover unsupported codec cases
12. MP4 media can now be downloaded using the download button enabled via downloadable embed parameter
13. Fixed logo initial resizing problem
14. Integrated playready and handled license server selection heuristic based on the browser support
15. The channel, ovp and sdk in Adobe Heartbeat are now configurable using the embed parameters channel, ovp and sdk under heartbeat
16. Applied stream gap handling to shaka strategy/adaptation layer
17. SDK init sequence is changed; the script tag is now added first without data-anvp property and init API method is called with ithe init configuration
18. SDK event listeners can now be added using on and removed unbind methods
19. Individual event listener now accepts camelcase event names as well
20. The following error events are introduced to indicate lack of drm support:
    • DRM002, Failed to initialize media keys, critical
    • DRM003, Media keys needed for DRM session are not initialized on video element, critical
21. Fixed DASH playback start problem caused by async play
22. Added SHAK002, Browser is not supported by Shaka media module to play the stream, critical error
23. Fixed the issue in which live flag is overriding the autoplay set to false
24. Fixed stitched ad postroll to splash switch replicated on Shaka integration
25. Propogated the Firefox stall fix to DashVideo
26. Fixed the issue in which Firefox gets stuck on non-buffered seek/offseted start
27. Enabled Playready DRM license server config

Version 3.0.5

1. Now DASH support is available for both live and VoD content
2. DRM support for DASH format is now available
3. Fix for stitched ad postroll to inital screen switch replicated on Shaka integration
4. Fix for live content's overriding the autoplay setting
5. Fix for the issue in which Firefox 51+ gets stuck on non-buffered seek/offseted start
6. Updated email server url with https enabled one
7. Replaced flash binary with ligth weight version
8. Added non-critical error code ADTR001, Failed to enable click through due to the missing tracking info
9. Styling fix for IE9-10 count down timer
10. Disabled autostart in the presence of DFP plugin on iOS
11. Introduced the following error codes:
    • SHAK001, Shaka media module encountered an issue while loading the stream, critical
    • VMNG010, No published urls in the provided source, critical
12. Fixed the VoD Dash replay issue on shaka player caused by async Shaka destroy
13. Skip button customization is now avaialable
14. UI elements are now hidden until flash player loads in fallback mode
15. Fixed share icons click issue for live content
16. Fixes IE 9-10 compatibility issues blocking player load
17. Fixed mute() API methods requiring duplicated unmute button clicks
18. Fixed Samsung S5 Native Player related issues
19. Player SDK now can get and prioritize DFP ad tag url from MCP video config
20. Blocked autoplay for the following combinations
    • Android + dfp client side
    • iPad/iPhone + dfp + lack of inlineVideoPlaybackSupport
    • Firefox for iOS
21. The following events are fired in the above cases:
    • PLAY511, The browser does not support autoplay
    • PLAY512, Autoplay blocked due to the lacking support in DFP Plugin
22. Fix for small size player styling
23. Event SKIPPABLE_STATE_CHANGED is introduced
24. skipAd() API method exposed
25. Translation enabled for skip ad button (applies to the custom video element usage on DFP which is observed on iPad Safari)
26. Fixes for recommendation view, its timer and replay click
27. Fixed the volume icon and stream volume mismatch
28. Added optinal pauseOnClick functionality in which only splash is clicked to pause and not the play button
29. Fixed MP4 playback problem on Firefox
30. Implemented ComScore extended requirements
31. Fix for Freewheel issues on Android
32. Caption button is removed during ads
33. Enabled EXT-X-BYTERANGE support for MSE based HLS

Version 3.0.4

1. autoplay embed parameter now accepts passing in macros
2. Fixed the issue in which control bar stays while playing content on mobile browsers
3. MEDIA_URLS_SET event is now available with published urls payload enabled by embed parameter revealMediaUrls
4. Added getPoster API method
5. Added instance id to onReady callback dedicated to the each instance
6. Fix for (progressive -mp4-) seek issue on MacOS Safari
7. Fix for the fullscreen issue on Safari browsers
8. Added IS_DESKTOP macro
9. Added AD_SKIPPED event with adId, adIndex and adDuration payload
10. Added SSHR100 error code whose info is populated with email server response
11. Added emailServer embed parameter to override email server (remote config override included)
12. DFP plugin now replaces inline macros given in the adTagUrl
13. Fixed the issue of following video macros not getting updated in playlist

Version 3.0.3

Summary of features:

1. MSE based HLS playback on desktop and mobile browsers
2. Timed metadata extraction on Android browsers which is useful for more timely schedule information and more ac curate analytics services
3. Embedded closed captions on Android devices
4. Mobile autoplay and inline playback on mobile browsers
5. 360 view on desktop and Android browsers. (Apple device browsers are currently lacking the WebGL CORS support needed for 360 view.)
6. Fine tuned auto bitrate switch and better manual bitrate switch experience on browsers supporting MSE specification

Version 2.142.15

1. Updated email server URL
2. IMA SDK companions can now be fetched regardless of companion size by setting companion width and height to 0
3. Added version strings to anvp namespace
4. Handled possible error logs caused by passing non-existing plugin config to plugins section
5. Included flash side fix for missing VIDEO_STARTED event on replay
6. Google Analytics plugin is now available to support the latest Google Analytics libraray
7. Made Google Analytics event category configurable with category embed parameter under googleAnalytics config
8. Changing playhead time for ads in heartbeat plugin is now possible using the embed parameter changePlayheadDuringAds under heartbeat plugin config
9. Fixed chapter index change on seek for heartbeat chapter tracking for server side stitched ads
10. Fixed the issue in which JSON polyfill is encountering a conflict in commonjs like environments
11. Play API method now supports tkx token
12. Handled the case in which IMA SDK starts an ad although the ad is not classified as preroll (no previous ad events either)
13. Fix for supporting any non-abbreviated param from base64 key (wordpress generated sharelink)
14. Fixed the control bar popup regression including css changes
15. Minor styling changes for Notification (used for Nielsen)

Version 2.142.13

1. Introduced accessEnablerLoaderPath embed parameter that allows Adobe Pass binaries to load from a given url
2. Fix for logo dynamic resizing issue for IE browser versions lacking offsetHeight support
3. Added ownerId, categories, tags fields to the METADATA_LOADED event payload
4. Rounded bitrate labels for kbps.
5. Fix for the issue related to the handling HLS tag EXT-X-MEDIA-SEQUENCE

Version 2.142.12

1. Added HOST to supported macros
2. Added PLAY920 No next item in the playlist (non-critical) and PLAY921 No previous item in the playlist (non-critical) error messages
3. Added user field enabled realtime analytics
4. Play next button is now available
5. Prevented the case in which load screen is shown briefly after a playlist item is selected
6. Added android tv (nexus player) device detection
7. Fix for ad count down timer for stitched ad work flow
8. ID3 event payload now includes the publisher as the second parameter
9. seekTo API method is now deferred when player is not ready to seek
10. Introduced CAPTION_DETECTED event to notify about caption type (sidecar or closed) and caption languages (HTML5 mode for now)
11. Fix for closed caption appearing on pause (exit on ott -firetv- apps)
12. Fix for the issue of closed caption remaining on ended video event
13. Implemented ComScore extended metadata using derived metadata
14. Updated logo widget to ignore empty targetURL so that it can be also used as watermark
15. Added getThumbnail API method
16. Real time analytics plugin now reports video view hotspots
17. Added embed parameter deviceId to be passed to the tkx for ad targetting etc

Version 2.142.11

1. Fixed the issue related to the client-side ads from DFP that do not have an assigned schedule overlapping with content playback (HTML5 mode only)
2. play(videoInfo) API method now triggers the initial view in the absence of user interaction on mobile devices (external playlist usecase) as opposed to trying to play the content
3. getPlaylist() API method now includes thumbnail in addition to the previously available poster image with thumbnail and src_image_url entries
4. Other service updates

Version 2.142.10

1. Three user fields are now available in realTimeAnalytics config: uf1, uf2, uf3
2. Enhancements for resume and seek during playback on iPhone Safari browser
3. Nielsen plugin is now available for Adobe Heartbeat Analytics
4. Nielsen (as Adobe Heartbeat plugin) opt-out via embed parameter is now available: optOutOverride under nielsen under heartbeat to start opted out
5. Nielsen (as Adobe Heartbeat plugin) opt-out/in via API method is now available optInNielsen() and optOutNielsen()
6. Fixed client side preroll and content volume sync issue
7. Fixed non-precached items in a playlist issue impacting mobile browsers (HTML5 mode)
8. Fixed buffering view issue caused by ad blockers
9. Fixed the issue related to stitched ad duration vs content duration tracking on Adobe Heartbeat
10. Enforcing SSL for resources loaded on an SSL enabled page

Version 2.142.9

1. Enabled initial bitrate override from remote config
2. Fixed the auto bitrate label while using manual bitrate selection which applies to progressive media playback on HTML5 mode
3. Handled an issue in which VPAID preroll is failed without calling onAdError on dfp plugin
4. Updated search closed captions text
5. Enabled chromeless embed parameter to match flash and cover info, control and spinnerVisible embed parameters
6. Fixed playhead values for stitched ads in VoD playback
7. Enhancements for ad playback in Android native browser
8. Playlist icon is now hidden during ad playback
9. Fixed buffering issue associated with preload embed parameter
10. Fixes related to the playlist use case along with preload embed parameter
11. Added favicon for shared videos
12. getEmbedCode now supports w3 deployment location deployed with short cache entry point
13. Fix for encoded nielsen payload issue in Flash player mode
14. https override added for parent pages served with https
15. made playlist JSONp urls socket adaptive
16. Playback enhancements on IE browsers
17. Enabled passing page level heartbeat custom metadata which overrides internally managed ones in case of a conflict
18. HDS format deprioritized while selecting source on Flash player mode
19. Added traditional chinese language support

Version 2.142.8

1. Compatibility enhancements for IE11
2. Introduced token embed parameter that is part of the embed code/share link generated from MCP
3. Nielsen ID3 tag extraction enabled on HTML5 mode
4. Updated Real Time Analytics time delta calculation to support absolute time string (enabled by absTime)
5. Enhancements for multi-closed caption support on HTML5 mode
6. Adobe Heartbeat Flash library security update
7. Flash fix for preserving the volume setting while switching from client side ad to content.

Version 2.142.7

1. IMA SDK URL is now socket adaptive
2. Enabled SSL evaluation for Adobe Heartbeat plugin
3. Fix for implicit buffering detection
4. Fix for countdown timer learn more button fix overlap
5. Previously shared videos using older Heartbeat version are now enforced to use Adobe Heartbeat 1.5
6. Chinese language support for displayed metadata
7. Fixed the issue related to the external url and Heartbeat version 1.5 conflict
8. Introduced setStartType API method for external playlist and live use cases
9. Enhanced support for playback and embedded captions of external streams
10. Introduced token embed parameter that is generated by backend service to sign the tkx requests
11. Added the support for token parameter in the share link
12. Waived the need for player ID in the share link
13. Heartbeat plugin can now fallback to use static metadata in case schedule information is not available for live stream.

Version 2.142.6

1. Nielsen plugin is now available with DTVR service.
2. Nielsen plugin uses production library by default while it is possible to override environment with embed parameter environment under nielsen namaspace.
3. BUFFER_START and BUFFER_END events are exposed to notify the application layer about buffering
4. Bug fix related to the client side ad volume control while using HTML5 mode on desktop browsers.
5. The player SDK now avoids preloading the stream on HTML5 mode unless preload is set to true (applies to desktop browsers since mobile browsers does not allow that)
6. Chromecast sender library is now socket adaptive for SSL pages
7. Service updates including the ones related to supporting external streams

Version 2.142.5

1. In case a video is embedded with the html5 flag set to true, it is carried over to the shared video
2. Non-tkx work flows are now enforced to tkx work flow with accessKey injection
3. HTML5 player now resizes inside shared video iframe while the task of maintaining the aspect ratio is still the publisher’s responsibilty
4. Heartbeat API call sequence updated to match Adobe Heartbeat Dec 2015 documentation: https://marketing.adobe.com/resources/help/en_US/sc/appmeasurement/hbvideo/video.pdf
5. titleVisible embed parameter added for hiding title in player overlay screens
6. Device detection enhanced for Asus Android devices
7. IE11 flash issue fixed by introducing the embed parameter and accompanying macro; useDirectWMode: “[[IS_IE11]]”
8. HTML5 player now can use any external media module / proxy for playback given externalVideoInterface is set to true and externalMediaCall callback is implemented under anvp.{PLAYER_INSTANCE}

Version 2.142.4

1. bitrateMenuVisible embed parameter introduced for hiding bitrate icon
2. IS_IE11 macro is introduced to be used at the first level embed parameter and evaluated as boolean.
3. printConfigs() under anvp name space included to get merged configs of all players in a page
4. printConfig() under anvp.{PLAYER_INSTANCE} name space included to get merged configs of the specific player
5. “Learn More” button enabled for ios devices where DFP can not place its own Learn More button
6. “Skip Ad” button enabled for DFP ads allowing skip
7. The bug related to the blocked the 3rd party cookies impacting VOD has been fixed
8. Adobe Heartbeat tracking is now available for external live streams without schedule service

Version 2.142.3

1. IS_MOBILE macro is enabled to be evaluated as boolean for the first level embed parametes
2. Error PLAY410, “The content has expired” (non-critical) added
3. Fix for DFP IMA SDK’s click/tap behavior change on mobile browsers
4. chapterTracking embed parameter is now available under heartbeat to disable tracking chapters.
5. Enabled insecure iframe mode for IMA SDK
6. Other service updates

Version 2.142.2

1. The following error messages are added:
   • ACTRL070, “Failed to generate security token. Possible reason: accessKey is not recognized” (critical)
   • ACTRL071, “Failed to retrieve the content. Possible reason: the video ID is either invalid or not provisioned for the accessKey” (critical)
   • ACTRL072, “Cannot access this video or channel.” (critical)
   • ACTRL079, “Generic backend error” (critical) added. The error information is replaced by back generated error message.
   • LOAD020, “Missing/outdated Adobe Flash Player plugin” (critical)
   • LOAD021, “Blacklisted Adobe Flash Player plugin version detected” (non-critical)
   • SCOR001, “Failed to get a valid Comscore clientId (c2)” (non-critical)
   • ADST001, “Failed to get ad breaks” (non-critical)
   • PLAY900, “Schedule service returned an expired event” (non-critical)
2. autoHideDelay embed parameter is introduced to configure delay for hiding control bar and splash (default is 3 seconds)
3. updatePlugin(pluginName, config) API method added for changing plugin parameter on the fly
4. updateMvpd(mvpd) API method added for changing mvpd name on the fly for analytics (the use case of adobe pass page level)
5. Introduced enforceFlashBlacklist embed parameter to notify the user about updating flash plugin for predefined flash versions
6. Stitched Ad UI support to detect and display ad breaks for HTML5 player
7. The following events are introduced/standardized across mobile/desktop browsers:
   • AD_BREAKS, “Ad breaks detected in the content”
   • AD_BREAK_STARTED, “Ad break has started”
   • AD_STARTED, “Ad has started”
   • AD_COMPLETED, “Ad has completed”
   • AD_BREAK_COMPLETED, “Ad break has completed”
   • BUFFER_LIMIT_UPDATED, “Buffer limit has been updated”. This event is enabled with revealBufferBufferInfo embed parameter. Enabled with revealAdBreaks embed parameter for ad stitched playback on HTML5 player
   • PRESENTATION_UPDATED, “Current time, total time or content type has changed”
   • METADATA_LOADED, “Program metadata loaded”
8. Passing version: “1.5″ in heartbeat config is now enough for enabling v1.5 Heartbeat analytics without setting flashPath embed parameter
9. Description is removed from the default player UI.

Version 2.140.0

1. HTML5 DFP plugin based on IMA SDK is upgraded
2. HTML5 DFP preroll playback issue for replays is fixed
3. The bug related to the HTML5 DFP postroll is fixed

Version 2.139.4

1. Fix for IE ad error (Flash Player)
2. HOST macro enabled for comscore
3. Prioritization for MP4 base profile on non-safari desktop browsers
4. Video load error messages enabled to include network and ready states (HTML5 Player)

Version 2.139.3

1. The error DFP010, “DFP plugin encountered an error” (non-critical) added.
2. Third party cookie checking is performed for only JS based Adobe Pass and stream served from Akamai.
3. Third party cookie checking is diabled for IE and Safari browsers due to their third party cookie evaluations.
4. Analytics plugins are now fed with rovi id instead of event id if rovi metadata is provisioned for the client.
5. The bug related to the repeated preroll in case of an unavailable stream is fixed.
6. Custom desktop player path is now available with flashPath embed parameter.

Version 2.139.2

1. The error ACTRL060, “Adobe Pass did not return any valid service zip” (non-critical) added
2. Third party cookie checking is enabled for adobe pass
3. The error PLGNL001, “Failed to initialize the plugin” (non-critical) added
4. The error HRTBT001, “Failed to get a valid account ID (RSID)” (non-critical) added
5. Deferred resizing fix for orientation change event on mobile/tablet devices
6. Adobe Heartbeat Analytics plugin config now accepts Adobe RSID API information for populating “account” (RSID) during run-time
7. AuthZ Token verification enabled
8. Device detection is enhanced to detect Samsung S6 and Chrome OS capabilities
9. Custom targeting macros are extended for DFP ad plugin to include the following templates under keyValues entry:
   • MCP_ID
   • VIDEO_ID
   • OWNER_ID
   • CATEGORIES
   • TITLE
   • DESCRIPTION
   • DURATION
   • PROGRAM_NAME
10. The 3rd party cookie checker is now baseURL and secure socket adaptive
11. Cache buster for playlist files
12. The error MPX007, “No valid items in the feed” added
13. The issue related to the black bars on Chrome browsers attributed to the latest PPAPI Flash plugin and hardware accelaration is fixed

Version 2.139.1

1. Enhancements on device detection
2. VOD metadata lookup is introduced to be enabled by selective embed parameter under accessControl to bypass entitlement for specified videos
3. Intent Player initialization is enhanced to include tkx enabled flows
4. The event PROVIDER_LIST_SET is introduced to expose providers from Adobe Pass plugin

Version 2.139.0

1. The bug preventing playlist mode with tkx enabled flow is fixed.
2. The configuration for ad plugins is now divided into clientSide and serverSide so that client-side preroll and server-side stitched ads can be served together (backwards compatible).
3. Introduced DFP targeting using the embed parameters: keyValues for general targeting, shareKeyValues for shared videos under dfp or clientSide/serverSide entries.
4. Macros are introduced for including run-time metadata in ad targeting (dfp) and comscore configurations.
5. Adobe Heartbeat plugin implementation is upgraded to use the latest Adobe libraries.
6. Comscore plugin implementation is upgraded to use the latest libraries.
7. The bug related to the initial SEGMENT_TYPE_CHANGED with “master” argument is fixed.
8. The event FIRST_FRAME_READY now has eventId as the first arg if available for live stream.
9. The schedule service is implemented for both Desktop and Mobile/Tablet.
10. The event PROGRAM_CHANGED now has the 4th argument detail to display all metadata from rovi
11. The event NEXT_PROGRAM is introduced with similar payload of PROGRAM_CHANGED.
12. Mobile/tablet player now updates the title and description of the live program sent to the analytics services.

Version 2.138.1

1. The event COMPANION_AVAILABLE is introduced to provide an alternative approach to processing companion ads.
2. Missing or incompatible Flash Player plugin error message is enabled.
3. Rating configuration is extended to include custom rating images using the embed parameters logoBaseUrl and format.
4. Sharing via e-mail is enhanced to avoid spam filters enabled on specific mail service providers.
5. Subscription based entitlement flow is enabled with the Login interface in the player; the event SUBSCRIBER_AUTHORIZATION_STATUS is introduced to get the status updates.
6. Any ad duration mismatch affecting the quartile tracking for DAI (Digital Ad Insertion) is now handled by the player.

Version 2.138.0

1. The scrollbar bug appearing on IE9 is fixed.
2. Mobile/Tablet playlist now has fallback image in case of a missing thumbnail or image load error.
3. Playlist button is displayed only if there are more than 1 videos and embed parameter playlistMode not set to “external”.
4. Desktop player playlist selection issue is fixed.

Version 2.137.4

1. Debug value for the duration between Long Preview and Short Preview has been replaced with the production value (24 hours).

Version 2.137.3

1. Control bar now has configurable remaining color (on Tablet).
2. Display and hide API methods for main components are provided (on Tablet/Mobile).
3. Auto-switch to next item while playing a playlist is now the default behavior.
4. Event updates on iOS 8.x affecting seek and pause upon a tap on a preroll are addressed.
5. Bug related to 1 item playlist is fixed.
6. Maximum item amount in playlist is increased to 30.
7. injectStyle api method added for testing a custom stylesheet.

Version 2.137.2

1. The entries about the live event restriction, mvpdAuthenticationNeeded and tveCheckNeeded, are added to the metadata provided by PROGRAM_CHANGED event.
2. USER_INTERACTION event is enabled for goLive API method.
3. The bug related to the messaging encountered while embedding multiple players is fixed.

Version 2.137.1

1. Encrypted zips provided by MVPDs (with the encrypted flag set to true on setMetadataStatus) are handled as hzip in post data and fired with HOME_ZIP_DETECTED event.
2. zipDecryption embed parameter is introduced to maintain decryption request sent by player (needed for entitlement flows at which decryption is handled by player side request); default is false.
3. POPUP_BLOCKED and POPUP_DISPLAYED events are activated for provider login window handled by Flash based Adobe Pass (needed for only Safari Browsers due to its user interaction context detection for Flash). JavaScript based Adobe already has these events enabled.

Version 2.137.0

1. Fail over logic is implemented for supported live streams. The event FAILOVER_STATION_LOADED is fired with the first argument as the failover channel upon a successful switch to failover channel.
2. Social and e-mail share link is detected using the followings in order:
   • User override with shareLink embed parameter,
   • Facebook open graph tags,
   • SEO canonical URL,
   • Parent page URL.
3. Share at is enabled to cover emailed share links. This feature works by using anvt URL parameter and startAt embed parameter.
4. E-mail share is now using HTML based template.
5. “Skip Ad” button’s location is now configurable using the embed parameter skip. A sample configuration is similar to that of rating and logo widgets: {location:”TR”,margin:”10px”}.

Version 2.136.18

1. baseURL is deprecated; providing a valid source URL is sufficient for switching the environments. The usage of ‘//’ in script source for adapting to the protocol http or https is still supported.
2. User interaction context is changed to bypass pop-up blockers’ blocking provider login pages in refreshless mode of Adobe Pass.
3. Debug message filtering is available by passing an array of module names to the debug embed parameter. Each module’s messages are displayed in a different color in supported browsers.
4. Flash log mesages are directed to the Logger module. It can be filtered by setting debug embed parameter to ["Flash"].
5. Absolute timestamped logging implemented on Logger. This is enabled by setting absTime.

Version 2.136.14

1. Adobe Pass’ “Internal Authorization Error” for a valid credential has been prevented.
2. AccessControl module is now performing the TVE Check after authZ check for providers failing to provide service zip after authN.
3. Player now supports static companions with creative type “application/x-shockwave-flash” (for server-side stitched streams).
4. The event PROGRAM_CHANGED is now more accurate using additional parameters.
5. The event COMPANION_INJECTED is introduced to notify the SDK user about the companion. For server-side stitched ads this event is fired always after AD_STARTED event.
6. Resource for events with no rating is passed to the Comcast SSO as a blank string as opposed to “TV-Y”.
7. The event SEGMENT_TYPE_CHANGED is introduced for distinguishing the type of the segment (master, ad, slate) for server-side ad stitched streams.
8. Error LOAD010 is now thrown by the player to indicate that browser is blocking the third party cookies.
9. The event AUTHORIZATION_STATUS contains an additional parameter, the detailed error provided by the provider.
10. Player now performs a timeout check against Adobe Pass service failure / intential blocking. Time-out period is by default 60 seconds. This value can be overridden by setting the timeOut parameter with a value not less than 60 under accessControl namespace.
11. Error ACTRL050 is introduced to indicate that Adobe Pass failed to respond within the specified time out limit.
12. Error ACTRL052 is introduced to indicate that Adobe Pass failed to check authorization within the specified time out limit.

Version 2.136.8

1. Error ACTRL031 now includes the provider specific authorization failure message.
2. The bug related to the pInstance encountered while loading the player script along with others dynamically is fixed.
3. MRSS sent as resource to Comcast is modified to activate parental control.
4. Player normalizes various formats of rating such as “TVPG”, “TV-PG” or “PG” including lowercases.
5. debug embed parameter is now bound to the debug mode of Flash based Adobe Pass.
6. Meaures taken to decrease the latency while using Flash based Adobe Pass.
7. New environments are deployed: Development, Staging and Production. Activating these environments are possible with the following settings:
   • Development: baseURL must be set to “http://qa.up.anv.bz/dev/”, script source must be “http://qa.up.anv.bz/dev/scripts/anvload.js”. Custom Flash path must be written as absolute URL to include baseURL.
   • Staging: Script source must be “http://up.anv.bz/latest/scripts/anvload.js”. Custom Flash paths must be written as absolute URL.
   • Production: baseURL must be set to _“http://up.anv.bz/{CLIENT_NAME}/”_, script source must be _“http://up.anv.bz/{CLIENT_NAME}/scripts/anvload.js”_. Custom Flash path must be written as absolute URL to include baseURL.

Version 2.136.3

1. Embed parameter passive is introduced for toggling on/off PASSIVE state for preview. This parameter must be used under preview namespace.
2. Embed parameter refreshless is introduced for choosing between opening a new login tab/window and doing a full page redirection. This parameter must be used under accessControl namespace.
3. The latency issue encountered in Chrome/Webkit based browsers caused by Flash based Adobe Pass is resolved.
4. The player now throws the error ACTRL041 for the users with no service zip while switching to the ENTITLEMENT state.

Version 2.136.0

1. Server-side ad stitching log corresponding to the session specified with sessionId is accessible with Ctrl + Shift + F9 (Additionally Fn may be needed for keyboards defaulting to the multimedia options).
2. Error codes ACTRL041 and ACTRL042 are available for detailing the authorization failure due to the user’s TVE rights.
3. Flash based Adobe Pass support is now available in addition to the JavaScript based Adobe Pass support (default). Switching to the Flash based Adobe Pass is possible with useFlash embed parameter under accessControl namespace.
4. Embed parameter environment under accessControl namespace is introduced to select the Adobe Pass environment. Possible values are “staging” and “production” (default).
5. Comcast encrypted zip parsing is enabled.

Version 2.135.23

1. API method getPreviewState() is introduced to retrieve the preview state (while the Temp Pass is activated)
2. Player’s merged configuration generated using all other configs mentioned in IFRAMED JS embed option is exposed with anvp.{PLAYER_INSTANCE}.mergedConfig
3. Option to inject the IFRAMED Provider Login to a custom HTML element is introduced. This option is activated by assigning the HTML element id to the iFramedLoginPlaceholderId property under accessControl object. The events PROVIDER_IFRAME_INJECTED and PROVIDER_IFRAME_REMOVED are also provided to notify the SDK user about the opportunity to display/hide the placeholder.
4. Ad Stitching session id anvp.{PLAYER_INSTANCE}.sessionId is introduced to facilitate Ad Ops debugging.
5. FreeWheel Ad Request URL used for server-side ad stitching is exposed with anvp.{PLAYER_INSTANCE}.adRequest

Version 2.135.3

1. Server-side FreeWheel configuration activated ,
2. Embed parameter accessKey is introduced to accomplish the following tasks:
   • Enabling internal TVE services such as parental control, TVE Rights checking etc.
   • Making use of a remote configuration to include parameters for common workflows such as preview feature (this minimizes the embed parameters),
3. TVE API services activated to include:
   • Remote config,
   • Metadata lookup,
   • Parental control based on metadata and PROGRAM_CHANGED event,
   • Geo-station control on every PROGRAM_CHANGED event
4. Switch to PASSIVE mode on failed authZ is removed,
5. Access Control Error Messages are introduced to provide more detailed information about entitlement failures,
6. Further enhancements on bitrate switch.

Version 2.135.0

1. IFramed login is activated for Adobe Pass,
2. Transition to the preview state ENTITLEMENT is now occurring as a result of authorization check after a successful authentication,
3. POPUP_BLOCKED event is introduced to indicate a popup blocker (also starting to poll for pop-up),
4. POPUP_DISPLAYED event is introduced to indicate when a popup succeeded/popup unblocked,
5. Bitrate selection algorithm is improved to have a smaller delay before switching to the appropriate bitrate.

Version 2.134.0

1. defaultPicker embed parameter is introduced for disabling the default MVDP picker,
2. PICKER_REQUESTED event is available for tracking the opportunity to display custom MVPD picker when defaultPicker is set to false,
3. PICKER_DISPLAYED event is available to notify that default MVPD picker is displayed.
4. The API method setSelectedProvider() is provided to be called from custom MVPD pickers.

Version 2.133.0

1. Adobe Pass has been modified for refresh-less authN,
2. Internal Temp Pass Flow has been implemented,
3. PREVIEW_STATUS, PREVIEW_EXPIRED and USER_INTERACTION events are introduced.
4. triggerUserInteraction() is available for triggering user interaction which may be used during preview states.