You can easily create a playlist with our player by adding a playlist object to the player configuration. This can be done both when embedding the player inline as well as dynamically.

Please note that if player token protection is active, you will have to add key and timestamp to each item in the playlist. If you are using videos from different projects, you will need to use the private key of each video’s respective project to generate its key. If token protection is not active, you can omit the key and timestamp parameters entirely.

Example playlist

<script type="text/javascript" src="//player.3qsdn.com/js3q.latest.js"></script>
<div id="player1"></div>
<script type="text/javascript">
  var js3qVideoPlayer = new js3q({
    dataid: '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: {
        dataid: '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: {
        dataid: '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>

Configuration 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
playlistContainer (playlist 2.0 only) - for external container, like comments ''

Player Methods

Name Parameters Description
getPlaylistItems Returns an array of all available items in the playlist
playlistItem index: number Sets the active medium to the given index
next Plays the next item in the playlist
previous Plays the previous item in the playlist