Class: IntegrationElement

Web component to integrate the player.

See

IntegrationElementEventMap for a full list of event types and their payloads

Tagname

glomex-integration

Slot

(optional) Slot for custom media items (GlomexMediaItemElement, ExternalMediaItemElement or MediaItemElement)

Example


<glomex-integration
  integration-id="REPLACE_WITH_INTEGRATION_ID"
  playlist-id="REPLACE_WITH_PLAYLIST_ID"
></glomex-integration>

You can find more advanced examples in the GlomexMediaItemElement, ExternalMediaItemElement or MediaItemElement documentation.

Extends

LitElement

Implements

IntegrationProperties

Properties

hidden

hidden: boolean = false

Hides the integration element when set to true.

Attribute

hidden

Implementation of

IntegrationProperties.hidden

Overrides

LitElement.hidden

IntegrationEvent

static IntegrationEvent: typeof IntegrationEvent

KnownMarkerName

static KnownMarkerName: typeof KnownMarkerName

MarkerType

static MarkerType: typeof MarkerType

Mimetype

static Mimetype: typeof Mimetype

PlaybackMode

static PlaybackMode: typeof PlaybackMode

PresentationMode

static PresentationMode: typeof PresentationMode

ready

ready: Promise<void>

Resolves when the integration API is available (e.g. setting volume, play, pause, etc.). Alternatively to element.addEventListener(IntegrationEvent.READY, () => {...})

topLevelIframe

topLevelIframe: boolean = false

An optional flag that can mark the integration as if it is running in a top-level window context. Useful when the embedded iframe represents an article, which contains this integration.

Attribute

top-level-iframe

Implementation of

IntegrationProperties.topLevelIframe

adPlayer?

optional adPlayer: string

Implementation of

IntegrationProperties.adPlayer

crossorigin?

optional crossorigin: "" | "none" | "anonymous" | "use-credentials" = 'anonymous'

The crossorigin attribute is used to define the CORS (Cross-Origin Resource Sharing) policy for the video element. Defaults to anonymous. If set to none (non-standard value) it won’t require CORS headers for the loaded media files, though text-tracks from foreign origins then cannot be loaded.

Attribute

crossorigin

Implementation of

IntegrationProperties.crossorigin

extraContext?

optional extraContext: ExtraContext

An optional context object that can be used to pass additional application, device and user information to the integration.

Implementation of

IntegrationProperties.extraContext

index?

optional index: number = undefined

Determines the index of the media item within the playlist that should be or is currently selected.

Attribute

index

Implementation of

IntegrationProperties.index

integrationId?

optional integrationId: string

The identifier for this integration. This value is used to determine the configuration and behavior of the integration.

Attribute

integration-id

Implementation of

IntegrationProperties.integrationId

passback()?

optional passback: (payload) => void

Optional callback function invoked when the integration fails to load an advertisement. The callback receives an object with a reason property that explains why no ad was loaded. It must be defined before the element gets attached to the DOM.

Parameters

payload

reason

string

Returns

void

placement?

optional placement: string

Allows the publisher to provide an optional placement attribute, which supplies additional contextual information for enhanced analytics tracking. This can be a simple string or a stringified JSON object. If it is a stringified JSON object, its contents are forwarded as placementDetail. If the object contains a property key name, its value will be tracked for the placement attribute.

Attribute

placement

Implementation of

IntegrationProperties.placement

playlistId?

optional playlistId: string

Defines the playlist / content identifier that should be loaded and managed by the integration. It can be a single content id, a playlist id or auto. It must be empty when the content is provided via the media-item web components inside the integration.

Attribute

playlist-id

Implementation of

IntegrationProperties.playlistId

variant?

optional variant: string

Implementation of

IntegrationProperties.variant

Accessors

adCurrentTime

Get Signature

get adCurrentTime(): number

Returns the current playback time (in seconds) for the ad content. If no ad is currently active, this value is NaN.

Returns

number

adDuration

Get Signature

get adDuration(): number

Retrieves the total duration (in seconds) of the ad content. If no ad is currently active, this value is NaN.

Returns

number

adMuted

Get Signature

get adMuted(): boolean | undefined

Returns whether the ad playback is muted. If no ad is currently active, this value is undefined.

Returns

boolean | undefined

adPaused

Get Signature

get adPaused(): boolean | undefined

Indicates whether the ad playback is currently paused. If no ad is currently active, this value is undefined.

Returns

boolean | undefined

adVolume

Get Signature

get adVolume(): number | undefined

Retrieves the volume level for the ad playback. If no ad is currently active, this value is undefined.

Returns

number | undefined

buffering

Get Signature

get buffering(): boolean

Indicates whether the media is currently in a buffering state.

Returns

boolean

Get Signature

get consent(): Consent | undefined

Provides access to the user’s consent information.

Returns

Consent | undefined

content

Get Signature

get content(): MediaItem | undefined

Retrieves the currently selected content item.

Returns

MediaItem | undefined

contentPlaybackTime

Get Signature

get contentPlaybackTime(): number

Retrieves the playback time (in seconds) of the current content.

Returns

number

currentAd

Get Signature

get currentAd(): Ad | undefined

Retrieves details about the currently selected ad, if any.

Returns

Ad | undefined

currentTime

Get Signature

get currentTime(): number

Returns the current playback time (in seconds) of the media.

Returns

number

Set Signature

set currentTime(time): void

Seeks the media to the specified time, updating the current playback time.

Parameters

time

number

The time (in seconds) to seek to.

Returns

void

duration

Get Signature

get duration(): number

Retrieves the total duration (in seconds) of the current media content.

Returns

number

ended

Get Signature

get ended(): boolean

Indicates whether the media playback has ended.

Returns

boolean

muted

Get Signature

get muted(): boolean

Indicates whether the media playback is currently muted.

Returns

boolean

Set Signature

set muted(value): void

Mutes or unmutes the media playback.

Parameters

value

boolean

A boolean value indicating whether to mute the media playback.

Returns

void

paused

Get Signature

get paused(): boolean

Returns true if the media playback is currently paused; otherwise, returns false.

Returns

boolean

playlist

Get Signature

get playlist(): MediaItem[] | undefined

Retrieves the current playlist.

Returns

MediaItem[] | undefined

presentationMode

Get Signature

get presentationMode(): PresentationMode

Retrieves the current presentation mode of the media player. This mode may affect how the media is displayed.

Returns

PresentationMode

seeking

Get Signature

get seeking(): boolean

Indicates whether the media is currently in a seeking state.

Returns

boolean

sessionId

Get Signature

get sessionId(): string

Returns the current session ID.

Returns

string

source

Get Signature

get source(): ContentSource | undefined

Retrieves the currently selected source.

Returns

ContentSource | undefined

version

Get Signature

get version(): string

Version of the integration

Returns

string

volume

Get Signature

get volume(): number

Returns the current volume level of the media playback (0-1).

Returns

number

Set Signature

set volume(value): void

Sets the media playback volume to the specified level.

Parameters

value

number

The volume level to be set (0-1).

Returns

void

wallClockTime

Get Signature

get wallClockTime(): number

Returns the current wall clock time (UNIX timestamp in seconds). Useful for livestreams.

Returns

number

Methods

disableTextTrack()

disableTextTrack(): void

Disable any active text track.

Returns

void

exitCurrentPresentationMode()

exitCurrentPresentationMode(options?): Promise<void>

Exits the current presentation mode.

Parameters

options?

Optional configuration.

byUser?

boolean

Indicates if the change was initiated by a user action.

Returns

Promise<void>

getAudioTracks()

getAudioTracks(): AudioTrack[] | undefined

Returns the available audio tracks.

Returns

AudioTrack[] | undefined

getCurrentAudioTrack()

getCurrentAudioTrack(): AudioTrack | undefined

Returns the current audio track.

Returns

AudioTrack | undefined

getCurrentTextTrack()

getCurrentTextTrack(): { id: string; kind: TextTrackKind; label: string; language: string; mode: "showing"; src: string; } | null

Returns the current text track.

Returns

{ id: string; kind: TextTrackKind; label: string; language: string; mode: "showing"; src: string; } | null

getCurrentVideoFrame()

getCurrentVideoFrame(): Promise<ImageBitmap>

Snapshots current video frame. Requires crossorigin to be set to anonymous.

Returns

Promise<ImageBitmap>

getCurrentVideoTrack()

getCurrentVideoTrack(): VideoTrack | null

Returns the current video track.

Returns

VideoTrack | null

getTextTracks()

getTextTracks(): TextTrack[]

Returns the available text tracks.

Returns

TextTrack[]

getVideoPlaybackQuality()

getVideoPlaybackQuality(): { bandwidth: number; bitrate: number; bytes: number; corruptedVideoFrames: number; creationTime: number; droppedVideoFrames: number; height: number; liveLatency: number; throughput: number; totalVideoFrames: number; width: number; } | undefined

Returns the current extended playback quality.

Returns

{ bandwidth: number; bitrate: number; bytes: number; corruptedVideoFrames: number; creationTime: number; droppedVideoFrames: number; height: number; liveLatency: number; throughput: number; totalVideoFrames: number; width: number; } | undefined

getVideoTracks()

getVideoTracks(): VideoTrack[]

Returns the available video tracks.

Returns

VideoTrack[]

pause()

pause(): Promise<void>

Pauses the current media playback.

Returns

Promise<void>

play()

play(options): Promise<void>

Initiates playback of the media content.

Parameters

options

startMethod

The method used to start playback (defaults to CLICK)

Returns

Promise<void>

setAudioTrackById()

setAudioTrackById(trackId): void

Set the audio track by Id.

Parameters

trackId

string

The identifier of the audio track to activate received from getAudioTracks (see AudioTrack.id).

Returns

void

setPresentationMode()

setPresentationMode(mode, options?): Promise<void>

Sets the presentation mode of the media player to the specified mode. This mode affects how the integration gets displayed (e.g. inline, dock, lightbox, fullscreen).

Parameters

mode

The presentation mode to set.

options?

Optional configuration.

byUser?

boolean = false

Indicates if the change was initiated by a user action.

Returns

Promise<void>

setTextTrackById()

setTextTrackById(trackId): void

Set the text track by Id.

Parameters

trackId

string

The identifier of the text track to activate received from getTextTracks (see TextTrack.id).

Returns

void

setVideoTrackById()

setVideoTrackById(videoTrackId): void

Sets the active video track by video track ID, or switches to automatic ABR mode.

Parameters

videoTrackId

The ID of the video track id to activate received from getVideoTracks (see VideoTrack.id). Pass null or undefined to enable automatic adaptive bitrate selection (ABR).

string | null | undefined

Returns

void

webkitRequestFullscreen()?

optional webkitRequestFullscreen(): void

Returns

void

Inherited from

LitElement.webkitRequestFullscreen