Command Queue


When using the player API it can be challenging to detect when it’s ready to be used. Use the command queue to submit functions for the player to call when it’s ready.

1.0 | Single player on the page

Using the command queue is simple when your page contains only a single player. Simply make sure a few global variables are set, and then start adding functions for the player to call to the queue.

The first argument to the callback function is always a reference to the player API.

// Ensure the following globals are available
window.bluebillywig = window.bluebillywig || {};
window.bluebillywig.cmd = window.bluebillywig.cmd || [];

window.bluebillywig.cmd.push(function($$api) {
    $$api.on('volumechange', function() {
        console.log('The volume changed!');
    });
});

2.0 | Multiple players on the page

A page containing multiple players require a different approach: it’s necessary to specify which player should consume which request in the command queue. When omitted, the request is consumed by the first player, and ignored by the other players on the page.

To specify the player that should consume a request, the playerId has to be specified alongside the callback function.

// Ensure the following globals are available
window.bluebillywig = window.bluebillywig || {};
window.bluebillywig.cmd = window.bluebillywig.cmd || [];

// This request will be consumed by the player embedded with playout "default" and mediaclip 123456
window.bluebillywig.cmd.push({
    playerId: '/p/default/c/123456',
    callback: function($$api) {
        $$api.setMuted(true);
    }
});

// This request will be consumed by the player embedded with playout "someotherplayout" and mediaclip 56789
window.bluebillywig.cmd.push({
    playerId: '/p/someotherplayout/c/56789',
    callback: function($$api) {
        $$api.setMuted(false);
    }
});

The playerId always follows the following structure:

/p/{PLAYOUT_CODE}/{CONTENT_TYPE_INDICATOR}/{CONTENT_ID}

Where:

  • {PLAYOUT_CODE} is the URL-safe code of the playout used to place the player
  • {CONTENT_TYPE_INDICATOR} is a single character indicating the type of embed.
    • c for mediaclips
    • l for playlists
    • p for projects
    • a for outstream ad units
    • q for query embeds
  • {CONTENT_ID} refers to object id of the content you’re embedding for mediaclips, playlists and projects. For ad units, it’s the code of the ad unit. For query embeds, it’s the query.
Note:

Note that for outstream ad units, the {PLAYOUT_CODE} is always inarticle , and for players placed with the VAST Renderer API, the {CONTENT_TYPE_INDICATOR} is always a.

 

Was this article helpful?

Related Articles

Contact Support
Can't find the answer you're looking for?
Contact Support