Default Options

Pillarbox deviates from the default configuration provided by Video.js on the following key options:

enableSmoothSeeking=true

This option enables smooth seeking for Pillarbox, which means that the player will not pause or stutter when seeking to a different position in the video.

See Video.js enableSmoothSeeking Option.

fill=true

This mode allows the player to expand to fill its container.

See Video.js fill mode.

html5.vhs.useForcedSubtitles=true

This property enables the player to display forced subtitles by default. Forced subtitles are pieces of information intended for display when no other text representation is selected. They are used to clarify dialogue, provide alternate languages, display texted graphics, or present location/person IDs that are not otherwise covered in the dubbed/localized audio.

See VHS useForcedSubtitles Option.

liveTracker.trackingThreshold=120

This property defines a threshold that controls when the live UI should be shown. The live UI will be shown if the live edge is within this number of seconds from the current time.

See Video.js trackingThreshold Option.

liveTracker.liveTolerance=15

This property defines an option that controls how far from the seekable end should be considered live playback. The player will consider itself live if the current time is within this number of seconds from the live edge.

See Video.js liveTolerance Option.

liveui=true

This option allows the player to use the live UI that includes: A progress bar for seeking within the live window and a button that can be clicked to seek to the live edge with a circle indicating if you are at the live edge or not.

See Video.js liveui Option.

playsinline=true

This option indicates that the video is to be played "inline", that is within the element's playback area. This can be useful for mobile devices, where fullscreen playback may not be desired.

See Video element playsinline attribute.

plugins.eme=true

This property enables the EME plugin, which allows the player to handle encrypted media content using a Content Decryption Module (CDM). The CDM is responsible for decrypting the media and enforcing the license policy.

See Pillarbox DRM Support and Video.js Plugins Option.

responsive=true

This option enables responsive mode, which will cause the player to customize itself based on responsive breakpoints. This means that the player will adjust its size and layout according to the screen size and orientation.

See Video.js Responsive Option.

Custom Options

The options in this section complement those of video.js, further customizing the player experience.

srgOptions.dataProvider

Specific to media content from SRG SSR.

Specifies a custom function returning an object representing an SRG SSR media content. This function takes a single parameter: the string initially passed as the player's source, and return a JSON object representing the mediaComposition.

Usage

const player = pillarbox('player', {
  srgOptions: {
    // Defines the custom data provider
    dataProvider: (data) => JSON.parse(data)
  }
});

// A stringified object representing the mediaComposition
const mediaCompositionStringifiedObject = JSON.stringify({
  // ...
});

// Load the source with type 'srgssr/urn'
player.src({ src: mediaCompositionStringifiedObject, type: 'srgssr/urn' });

The returned object must conform to the Media Composition structure to ensure proper media playback.

The absence of a conforming object may lead to unexpected errors, affecting video playback.

srgOptions.dataProviderHost

Specific to media content from SRG SSR.

Specifies the host URL for the SRG SSR media content data provider. It is used to define a base URL for fetching media content metadata.

Usage

const player = pillarbox('player', {
  srgOptions: {
    // Defines the alternative host
    dataProviderHost: 'il-stage.srgssr.ch'
  }
});

// Load the source with type 'srgssr/urn'
player.src({ src: 'my-content-id', type: 'srgssr/urn' });

srgOptions.dataProviderUrlHandler

Specific to media content from SRG SSR.

Specifies a custom function to generate URLs for SRG SSR media content queries. The function accepts a content identifier and returns a string URL to query the back-end. It enables custom integration with various back-end systems while using SRG SSR's media playing capabilities.

Usage

const player = pillarbox('player', {
  srgOptions: {
    // Defines the custom URL handler
    dataProviderUrlHandler: (id) => `https://my-domain.com/content/${id}`
  }
});

// Load the source with type 'srgssr/urn'
player.src({ src: 'my-content-id', type: 'srgssr/urn' });

The custom URL handler constructs request URLs based on a content identifier. The returned URL must lead to a response conforming to the Media Composition structure to ensure proper media playback.

The absence of a conforming object from the server may lead to unexpected errors, affecting video playback.