Playlists

Usually, playlists are created by customers using our API or the UI. Alternatively, playlists can also be generated directly via the player configuration when initializing a player instance.

You can create a playlist by adding a playlist object to the player configuration. This works both when embedding the player inline and when creating or updating the player dynamically.

If player token protection is enabled, you must provide a key and timestamp for each item in the playlist. When using videos from different projects, the corresponding private key of each project must be used to generate the correct key for that video.

If token protection is not enabled, the key and timestamp parameters can be omitted entirely.

Example playlist

<div id="player"></div>

<script src="//player.3qsdn.com/js3q.latest.js"></script>

<script>
  const player = new js3q({
    playoutId: '5c3b0910-8850-11e7-9273-002590c750be', // First video
    container: 'player1',
    key: { key }, // Key and timestamp are only required if token protection is active
    timestamp: { timestamp },
    playlist: {
      0: {
        playoutId: 'f98baa26-38ce-11e8-bcfd-0cc47a188158', // Data ID and title are required
        title: '3Q Logo Animation.mov',
        poster:
          'https://sdn-global-prog-cache.3qsdn.com/thumbs/2015/3144/688639/W6YXmD4g2vZf3Gqh.jpg',
        key: 0, // Key and timestamp are only required if token protection is active
        timestamp: 0,
      },
      1: {
        playoutId: 'd52fcc10-7022-11e9-8d5b-0cc47a188158',
        title: '3Q Logo Animation.mov',
        poster:
          'https://sdn-global-prog-cache.3qsdn.com/thumbs/2015/3144/688639/W6YXmD4g2vZf3Gqh.jpg',
        key: 0,
        timestamp: 0,
      },
    }
  })
</script>

Playlist options

The following additional options are available when configuring a playlist

Value	Description	Default
showPlaylist	deprecated	false
disablePlaylist	disable playlist in general	false
playlistShowList	show playlist on initial load	false
playlistLabel	the label for the playlist	''
playlistVisibleItems	amount of items shown in playlist	10
playlistMaxItems	maximum amount of items in playlist	500
playlistShowLatest	audio player only	false
playlistSticky	audio player only	false
playlistContainer	(playlist 2.0 only) - for external container, like comments	''
autoShuffle	randomizes the order of the playlist	false