Player configuration parameters are provided whenever a player instance is created.
var config = {
// Configuration here
};
var player = KalturaPlayer.setup(config);
The configuration uses the following structure:
{
targetId: string,
log: PKLogConfigObject,
disableUserCache: boolean,
text: PKTextConfigObject,
playback: PKPlaybackConfigObject,
sources: PKSourcesConfigObject,
streaming: PKStreamingConfigObject,
network: PKNetworkConfigObject,
customLabels: PKCustomLabelsConfigObject,
dimensions: PKDimensionsConfig,
abr: PKAbrConfigObject,
drm: PKDrmConfigObject,
playlist: KPPlaylistObject,
plugins: KPPluginsConfigObject,
advertising: KPAdvertisingConfigObject,
session: PKSessionConfigObject,
provider: ProviderOptionsObject,
ui: UIOptionsObject,
cast: CastConfigObject,
viewability: KPViewabilityConfigObject
}
Type: PKLogConfigObject
You can learn more about user preferences in the player here.
Type: PKTextConfigObject
Type: PKPlaybackConfigObject
This is a Boolean attribute that indicates the default setting of the loop playback option. If set, the player will restart playback upon completion. The attribute's default value is false, which means that the video will pause when the video is finished playing.
Type: PKSourcesConfigObject
Type: PKStreamingConfigObject
Type: PKNetworkConfigObject
Type: PKDimensionsConfig
Type: PKAbrConfigObject
Type: PKDrmConfigObject
Type: KPPlaylistObject
Type: KPPluginsConfigObject
This should map the plugin to its config object.
var config = { plugins: { myAwesomePlugin1: {}, myAwesomePlugin2: {} } };var config = { plugins: { myAwesomePlugin: { disable: true } } };
{ playAdsAfterTime?: number, showAdBreakCuePoint?: booleab, adBreakCuePointStyle?: Object, adBreaks: Array<KPAdBreakObject> }Description: Only play ad breaks scheduled after this time (in seconds). This setting is strictly after - e.g. setting playAdsAfterTime to 15 will cause the player to ignore an ad break scheduled to play at 15s.
Type PKAdBreakObject
{ position: number, percentage?: number, // optional every?: number, // optional ads: Array<PKAdObject> }Description: Alternative parameter to
position
. The position, in percentage of the media length, to show the ad break (optional).Important.
position
,percentage
andevery
are several options to configure the ad break position. Only one should be provided. If none will be provided, the ad break will be ignored. If more than one will be provided, only one configuration will be considered, by the following priority:
position
2.percentage
3.every
.Type PKAdObject
{ url?: Array<string>, response?: Array<string>, bumper?: boolean }Description: List of urls, each one specifies the ad tag url that is requested from the ad server. The player will request the first url, if failed, it will request the second url and so on (aka waterfalling).
var config = { advertising: { adBreaks: [ { position: 0, ads: [ { url: [VAST_URL], bumper: true } ] }, { percentage: 50, ads: [ { url: [VAST_URL, VAST_URL] //waterfalling }, { url: [VAST_URL] } ] }, { position: -1, ads: [ { response: [VAST_XML] } ] } ] } };
Type: PKSessionConfigObject
Type: ProviderOptionsObject
Type: UIOptionsObject
Type: CastConfigObject
The viewability feature is coupled with the autoplay/autopause configs
If the autoplay config is set to
autoplay: inview
the player will only play when it gets into the view
If the autopause config is set to
autopause: true
the palyer will pause the playback when it gets out of view
If floating player is configured, it will be used to float the player when it gets out of the view and it gets back to the place when you go into original viewport of player.
observedThresholds
Array<number> An array of numbers which indicate at what percentage of the target's visibility the observer's callback should be executed. It will fire events when it meets thresholds and the default player threshold is used for defining when to take an action.playerThreshold
number The minimal viewable percentage of the player to consider as visible.
In the player setup flow, the configuration described above (partially or in full) can be provided by a number of different sources. Each source has a priority, which determines whether the source has a greater or lesser impact on how the player is configured.
Available sources include:
- Application - This is the application that embeds the player and can be used to configures the player in-line upon instantiation.
- Server - This is a partner configuration that is saved on the server. The partner can use this configuration when configuring the player by suppling the
uiConfId
value. - Local Storage (Browser) - This is the user preferences configuration, which is saved in the local storage of the browser.
- Default Player Configuration - The default player configuration is defined internally by the player.
When the player builds its runtime configuration, it will need to know how to built the configuration correctly according to the priority of each configuration, which is as follows (#1 is highest; #4 is lowest):
- Local Storage
- Application
- Server
- Default Player Configuration
In this example, we'll use the following configuration from each source to see how that source affects the configuration:
Local Storage
{
muted: true,
audioLanguage: 'spa'
}
Application
{
muted: false,
volume: 0.7
}
Server
{
audioLanguage: 'eng';
autoplay: true;
}
Default Player Configuration
{
audioLanguage: '',
textLanguage: '',
muted: false,
volume: 1,
captionsDisplay: false
autoplay: false
}
The resulting runtime configuration will, therefore, be as follows:
{
audioLanguage: 'spa',
textLanguage: '',
muted: true,
volume: 0.7,
captionsDisplay: false,
autoplay: true
}