NAV
Platform SDKs
Android SDKApple TV Data APIChromecast SDKFireTV SDKRoku SDKTvOS SDKWeb Player SDK v3Web Player SDK v3 with MCP IntegrationiOS SDK
     
Service APIs
Feeds APILive Streaming APIVOD Encoder APIVast Conditioning API

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.
format String File format for the media asset (e.g. 'm3u8', 'mpd', 'mp4', 'mp3').
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.
expectPreroll Boolean Used to prevent the player from starting the main content before a client-side preroll is loaded. Default is false.
expectPrerollTimeout Number Max number of seconds to wait for a client-side preroll before starting the main content. Only used when expectPreroll is true. Default is 5.
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.
initialBitrate Number Used for overriding the initial rendition the SDK will select. The value must be specified in kbps. The SDK chooses the rendition with bitrate value closest to specified initialBitrate
autoBitrateSwitch Boolean Used for disabling the SDK's default auto bitrate switch. Once disabled the SDK will use the initial bitrate value (either SDK default or specified value with initialBitrate).
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.
pauseOnClick Boolean Allows the user to pause the video when clicking on the video instead of the pause button specifically. Default is false.

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

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

getCaptionStyle()

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

Provides the current caption style setting values

Returns Type
Caption style settings CaptionStyleSettings

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 a video url and format ('m3u8', 'mp4', etc.). 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 Detail (available for SSAI only)
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

Ad Detail

AdDetail : Object

AdDetail.adIndex : number

The ad index within the current ad break

AdDetail.totalAds : number

The total number of ads in the current ad break

AdDetail.tracking : Object

tracking.clickThrough : Array.<String> | null

Click through URI for application layer rendering their own UI to display a page when user clicks on ad video

tracking.clickTracking : Array.<String> | null

Click tracking URIs for application layer rendering their own UI to track when the user clicks on the ad video

API Hooks

The following API hooks are triggered by certain player events. When an API hook is triggered, the player executes your callback function and uses the returned value before continuing.

NOTE: These API hooks should be registered before calling .init(...) on the player instance.

onBeforeVideoLoad

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
});

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).

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

onBeforeSeek

onBeforeSeek

AnvatoPlayer('p0').on('beforeSeek', function(info) {
  var adBreakIndexToWatch = null;
  // info object can be used to determine which ad break
  // to watch before completing the seek. Set the
  // adBreakIndexToWatch variable to the desired
  // ad break index.
  return { watchAdBreakIndex: adBreakIndexToWatch };
});

SDK calls this hook when the user issues a seek but before the player completes the seek. Application layer can return an object that specifies whether the user should first watch an ad break before completing the seek.

Parameters:

Name Type Description
info Object Info object describing the seek and ad break information for the current video.

The info object contains the following properties:

Returns  Type
An object with an optional watchAdBreakIndex property. Set this value to an ad break index value (0-indexed) to have the user watch that ad break before completing the seek. By default the player will complete the seek immediately. Object

onBeforeAdBreak

onBeforeAdBreak

AnvatoPlayer('p0').on('beforeAdBreak', function(info) {
  var skipAdBreak = false;
  // info object can be used to determine whether the
  // player should skip the ad break or not. Set the
  // skipAdBreak variable to true in order to have the
  // player skip the ad break.
  return { skipAdBreak: skipAdBreak };
});

SDK calls this hook before each server-side ad break. Application layer can return an object that specifies whether the player should skip the ad break or not (for VOD assets only).

Parameters:

Name Type Description
info Object Info object describing the ad break information.

The info object contains the following properties:

Returns  Type
An object with an optional skipAdBreak property. Set this value to true to have the player skip the ad break. By default the player will not skip the ad break. Object

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.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
ACTRL073 The accessKey is restricted. 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

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.

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

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

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:

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.

Snip20141020_14

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

Snip20141020_16

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.

Snip20141020_18

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

Snip20141020_15

Step 4

Set default video player size & autoplay state

Snip20141021_20

Step 5 (Optional)

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

Snip20141021_21

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.

Snip20141021_22

Usage (by Web Editor)

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

wp4

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.

wp5

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.

wp6

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

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:

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)
enablePreloading If true, then the IMA SDK will attempt to preload the video ad assets in advance. See the IMA SDK documentation for limitations (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

IAS Parameters

IAS plugin configuration

plugins: {
  ias: {
    anId: 'AD NETWORK ID',
    pubOrder: 'YOUR OWN VIDEO ORDER',
    pubId: 'YOUR OWN ADVERTISER', // When non-AdX creatives are used
    custom: 'customValue', // Custom key value pairs can be added.    
    custom2: '[[VIDEO_ID]]', // Their values can be populated with macros mentioned above.
    custom3: '[[TITLE]]',
  }
}
Plugin Name Parameters Definition
ias anId Ad network ID provided by IAS
pubOrder Video order
pubId Advertiser ID (when non-AdX creatives are used)
(customKey) Any custom key-value pair can be given to send custom parameters. (Optional)

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:

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.

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 implementation of this interface must provide readyCallback and finally UI sub-components must be registered using their respective variables:

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

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);
  if (!recomVideoList.length) {
    return false;
  }
  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');
    }
  });
  return true;
};
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

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

Control API Methods

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

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

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

Returns: Boolean - True if there are recommendations to display, false otherwise

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

recommendation.rescale(width)

Resizes the recommendation UI components

Param Type Description
width Number Width of the player in pixels

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.

Snip20141020_14

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

Snip20141020_16

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.

Snip20141020_18

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

Snip20141020_15

Step 4

Set default video player size & autoplay state

Snip20141021_20

Step 5 (Optional)

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

Snip20141021_21

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.

Snip20141021_22

Usage (by Web Editor)

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

wp4

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.

wp5

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.

wp6

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

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.

Defining an Ad Policy

The onBeforeSeek and onBeforeAdBreak hooks can be used to define a policy that determines when users need to watch ad breaks instead of seeking over them and when users can skip ad breaks. This only applies to VOD assets with server-side ad breaks.

NOTE: These API hooks should be registered before calling .init(...) on the player instance.

Suppose you want to enforce an ad policy such that the user must watch the ad break that falls before the seek destination to prevent users from skipping over ads. You could search through the list of ad breaks in the info object and return the index of the ad break that comes right before the seek destination.

AnvatoPlayer('p0').on('beforeSeek', function(info) {
  var watchAdBreakIndex = null;
  for (var i = info.adBreaks.length - 1; i >= 0; i--) {
    if (info.adBreaks[i].start < info.seekTo) {
      watchAdBreakIndex = info.adBreaks[i].adBreakIndex;
      break;
    }
  }
  return {
    watchAdBreakIndex: watchAdBreakIndex
  };
});

Or suppose you want to enforce an ad policy such that the user will not watch the same ad break twice. For each video, you could record the index of each ad break that has been watched. You would then only return true for the skipAdBreak value in the onBeforeAdBreak hook if the ad break has not been watched yet.

var watchedAdBreaks = {};
AnvatoPlayer('p0').on('beforeAdBreak', function(info) {
  var hasWatched = info.adBreakIndex in watchedAdBreaks;
  watchedAdBreaks[info.adBreakIndex] = 1;
  return {
    skipAdBreak: hasWatched
  };
});

You may also apply both hooks to combine the policy rules. If the player evaluates the onBeforeSeek hook and a watchAdBreakIndex value is provided, then the player will evaluate the onBeforeAdBreak hook to determine whether the ad break is actually played.

Release Notes

Latest Version 3.2.10 (02/04/2019)

  1. Failover and playback stability enhancements:
    • Enabled failover for empty and stale DASH manifest
    • Enabled failover when all HLS renditions are stale
    • Enabled failover for all empty HLS renditions case
    • Reset capability blacklisting to resume failover flow from error slate
    • Added backup url evaluation to live DASH
    • Added retries for failed DASH manifest downloads
    • Reset the gap counters for DASH upon playback success
    • Reset gap counters on playback for JSHlsVideo and ShakaVideo
    • Allowed MSE player to adapt to higher bitrates on failover
    • Allowed failover retry for external streams
    • Prevented following playbacks for a stale rendition
    • Allowed retaining failover queue via resetFailoverQueueOnPrimary
  2. Content start and client-side ad work flow optimizations:
    • Added support for prefetchHlsManifest config parameter
    • Loaded plugin libraries before player initialization to request ads earlier
    • Initialized plugins once plugin libraries loaded
    • Added pluginInitialized event for pollAds optimization
    • Passed the prefetched manifests to MSE layer
    • Limited autoplay detection by using priors, device info
    • Cancelled log working set and provided stringify from logger
    • Enabled opt-in use of cached autoplay evaluation via cacheAutoPlayStatus
  3. Persisted selected bitrate through catch live for DASH
  4. Allowed displaying captions for slate type segment
  5. Reset DFP plugin currentTime value after content completed
  6. Prevented player from using wrong startAt after postroll
  7. Fixed race condition preventing ad tracking for live DASH
  8. Fixed issue with missing server-side Freewheel parameters
  9. Allowed external playlist playback when loading with key
  10. Google Plus button removed on share view
  11. Enabled initalBitrate and autoBitrateSwitch for DASH VoD and live
  12. Adjusted SDK for IMA SDK's need for the 2nd click on mobile browsers when custom click tracker is used
  13. Added adIndex and totalAds to AD_STARTED AdDetail object
  14. Prevented BEFORE_AD_BREAK at end of video without postroll
  15. Added ACTRL073 error code when accessKey is restricted
  16. Fixed error when lowest rendition is missing video codec
  17. Avoided caching single rendition in master cache
  18. Added onBeforeSeek and onBeforeAdBreak hooks
  19. Maintained seek location after recovering from failed seek
  20. Passed playback info object to IMA SDK instead of video element
  21. Updated getCurrentTime method to yield dfp playhead
  22. Prevented dispatching cues for regions skipped over

Version 3.2.9 (12/11/2018)

  1. Set assetName only once after PROGRAM_UPDATE on Conviva plugin
  2. Remove the logic to create new sessions per program on Conviva plugin
  3. Fixed clickthrough issue impacting client-side freewheel plugin
  4. Enabled playhead increment based on implicit gap evaluation
  5. Prevented an issue where the main content starts playback during ads
  6. Improved detection for media sequence number resets
  7. Allowed autoplaying the first recommendation when player width is small
  8. Introduced triggerResize method to be used when player is wrapped in a container and sent to fullscreen as opposed to using available fullscreen APIs
  9. Reused Widevine DRM key sessions for live DASH
  10. Upgraded shaka to v2.5 (used for DASH VoD) with large gap jumps enabled
  11. Dispatched stream error for MSE based HLS when DRM is configured
  12. Exposed ad info for adMediaLoaded event in DFP plugin
  13. Avoided fetching VideoJSON for external video in playlist
  14. Added getCaptionStyle API method
  15. Added feedBaseUrl parameter to override feed API baseUrl
  16. Introduced MSE buffer quotas, prevented exceeding the quota
  17. Provided deferred gap recovery for previous no buffer during DASH VoD playback
  18. Added support for the expectPreroll config parameter that makes the SDK wait for a preroll with a 5-second default time out
  19. Prevented expectPreroll behavior without ad config
  20. Enabled preloading prerolls for the DFP plugin
  21. Exposed clickthrough, clicktracking urls with AD_STARTED event for SSAI
  22. Security improvements

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:

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.