Skip to content

Jetstrem player API options

The JetstreamPlayer class provides a simple interface to interact with an embedded video player through an iframe. It facilitates controlling playback, muting/unmuting, seeking, and retrieving playback-related information such as current time and duration.

Parameters

  • el: string - The selector of the HTML element where the iframe will be inserted.
  • options: JetstreamPlayerOptions - An object containing options for configuring the player.

Options

  • sticky?: boolean: Optional. Specifies whether the player should enable sticky behavior, such as Picture-in-Picture mode. If set to true, the player will enable sticky behavior; otherwise, it will be false or undefined.

  • events?: Partial<Record<PlayerEvents, (value?: unknown) => void>>: Optional. An object containing event listeners for player events. Each event listener is associated with a specific player event. The keys represent the player events, and the values are callback functions triggered when the corresponding event occurs. Events can include custom events defined by the PlayerEvents enum.

typescript
type PlayerEvents =
  | 'ready'
  | 'timeupdate'
  | 'play'
  | 'pause'
  | 'loadedmetadata'
  | 'ended'
  | 'volumechange'
  | 'error';
  • mediaId: string: Media id.

  • playerId?: string | undefined: Optional. Player preset id.

  • region?: string | undefined: Optional. Organization region.

  • width?: string | undefined: Optional. The width of the video player. If not specified, the default width will be used.

  • height?: string | undefined: Optional. The height of the video player. If not specified, the default height will be used.

Example

typescript
const player = new JetstreamPlayer('#video-container', {
  region: 'eu',
  mediaId: 'jsv:xxxxxxxxxx',
  playerId: 'jsp:xxxxxxxxx',
  sticky: true,
  events: {
    play: () => {
      console.log('Video played');
    },
    pause: () => {
      console.log('Video paused');
    },
    // Add more event listeners as needed
  },
});