Command queue

The Inline AI script loads asynchronously, which means your JavaScript may run before the SDK is available on the page. The command queue solves this: it lets you call SDK methods immediately, buffering them until the SDK is ready to execute them in order. Once the script has loaded, any further calls to cmd.push() run right away. This guide explains how the queue works, which syntax to use, and how to structure your setup code correctly.

How the command queue works#

When you add the queue setup snippet before the script tag, you create a plain JavaScript array at window.InlineAI.cmd. Your calls to cmd.push() add entries to that array. When the Inline AI script loads, it reads every entry in the array, executes them in sequence, and then replaces cmd with a live dispatcher, so any subsequent cmd.push() calls execute immediately.

This pattern is intentionally simple: no special libraries, no build tools, no dependencies. It works in any browser that supports a basic <script async> tag.

Setting up the queue#

Place these two lines before the Inline AI <script> tag. The || {} and || [] guards ensure the snippet is safe to include multiple times (for example, across independently loaded page sections).

window.InlineAI = window.InlineAI || {};
window.InlineAI.cmd = window.InlineAI.cmd || [];

Command syntax#

The queue supports two ways to push commands.

Array syntax#

Pass an array where the first element is the method name as a string, followed by the method's arguments in order.

// ['methodName', arg1, arg2, ...]
window.InlineAI.cmd.push(['init', { publisherId: 'YOUR_PUBLISHER_ID' }]);
window.InlineAI.cmd.push(['mount', window.InlineAI.Placement.SearchFab]);
window.InlineAI.cmd.push(['on', window.InlineAI.Events.SearchOpen, function(data) {
  console.log('Searched:', data.query);
}]);

Array syntax is concise and maps directly to the method signatures in the SDK API reference.

Callback syntax#

Pass a function that receives the fully initialized sdk object as its first argument. Use this when you need to reference the return value of a method (such as the placement ID from mount()), or when you want to write several calls in one block with full IDE autocompletion support.

window.InlineAI.cmd.push(function(sdk) {
  var id = sdk.mount(sdk.Placement.KeyTakeaways, '.sidebar');
 
  sdk.on(sdk.Events.WidgetOpen, function() {
    console.log('Widget opened, placement:', id);
  });
});

Supported methods#

These methods are available through the command queue before the SDK script has loaded:

Behavior after SDK load#

Once the Inline AI script has initialized, cmd is replaced with a live dispatcher. Any call to cmd.push() after that point executes the command immediately; there is no buffering delay.

// After the SDK has loaded, this executes right away
window.InlineAI.cmd.push(['mount', window.InlineAI.Placement.BasicEmbed, 'new-container']);

This means you can safely use cmd.push() throughout your page code without worrying about whether the SDK has finished loading.

Complete setup example#

The following is a full working example. Place it before the <script> tag.

// Step 1: Initialize the queue
window.InlineAI = window.InlineAI || {};
window.InlineAI.cmd = window.InlineAI.cmd || [];
 
// Step 2: Initialize in programmatic mode
window.InlineAI.cmd.push(['init', { publisherId: 'YOUR_PUBLISHER_ID' }]);
 
// Step 3: Mount placements using array syntax
window.InlineAI.cmd.push(['mount', window.InlineAI.Placement.SearchFab]);
window.InlineAI.cmd.push(['mount', window.InlineAI.Placement.SearchEmbed, 'header-search', { placeholder: 'Search...' }]);
 
// Step 4: Subscribe to an event using array syntax
window.InlineAI.cmd.push(['on', window.InlineAI.Events.SearchOpen, function(data) {
  console.log('Searched:', data.query);
}]);
 
// Step 5: Use callback syntax for calls that need return values
window.InlineAI.cmd.push(function(sdk) {
  var id = sdk.mount(sdk.Placement.KeyTakeaways, '.sidebar');
 
  sdk.on(sdk.Events.WidgetOpen, function() {
    console.log('Widget opened, placement:', id);
  });
});

Then, after all the queue setup above, paste the embed snippet:

<script>
  (function(d) {
    var s = d.createElement('script');
    s.type = 'module';
    s.src = 'https://getinline.tech/default/assets/index.js?key=YOUR_PUBLISHER_ID';
    (d.getElementsByTagName('head')[0] || d.getElementsByTagName('body')[0]).appendChild(s);
  })(window.top.document);
</script>

Mixing array and callback syntax#

You can freely mix both syntaxes in the same queue. Commands execute in the order they are pushed, regardless of which syntax was used.

// Array syntax for simple calls
window.InlineAI.cmd.push(['init', { publisherId: 'YOUR_PUBLISHER_ID' }]);
window.InlineAI.cmd.push(['mount', window.InlineAI.Placement.Widget]);
 
// Callback syntax where you need the placement ID
window.InlineAI.cmd.push(function(sdk) {
  var searchId = sdk.mount(sdk.Placement.SearchEmbed, 'search-area');
 
  sdk.on(sdk.Events.PlacementMount, function(info) {
    if (info.id === searchId) {
      console.log('Search embed is live');
    }
  });
});

Best practices#