Implementing a Callback

Callbacks are choices that determine the outcome of later decisions, or even are just referred to, in later scenes. This can be implemented by using the variables plugin to save data and use it later to make decisions.

Example

Lets say you have a dialog in scene A, in which the viewers get to choose which question Nolan wiill ask Joe:

  1. Star Trek: “Captain Kirk or Captain Picard? Who’s the better captain?”
  2. Soft Drink: “Coke or Pepsi? Which one do you like better?”
  3. Twilight: “Team Edward ot Team Jacob?”

Joe doesn’t answer the question right away. The story continues to the next scene. Much later in scene B Joe finally answers Nolan. There are 3 possible answers:

  1. Picard
  2. Coke
  3. Team Edward

Structure

The following diagram describes a basic structure of our example. Scene A is followed by a decision - which question should be asked?
The highlighted video nodes are the callback. Which answer should be appended to the stream? This decision is based on the question the viewer clicked earlier. It is completely seamless and no UI is displayed to the viewer at this point.

The following sections include the steps to implement the callback.

Register a variable

First we need to register a variable to save the question that was selected.

player.variables.register('question', {initialValue: ''});

Save the question

We want to save the question selected by the viewer for later use. This can be done by registering a listener on the decision’s made event and calling the variables.setValue API.

let questionDecision = player.decision.get('node_sceneA');
questionDecision.on('made', function(decision) {
    player.variables.setValue('question', decision.selected.node.id);
});

Append the answer

As soon as scene B1 is pushed to the playlist we can push the answer video node as well by checking the variable’s value. The following snippet is a basic implementation:

// Grab a reference to the "node_sceneB1" instance
let nodeSceneB1 = player.repository.get('node_sceneB1');

// Register a listener that will be invoked
// when "node_sceneB1" is pushed to the playlist
nodeSceneB1.on('playlistpush', function() {
    // Map questions to answers
    const answers = {
        node_startrek: 'node_picard',
        node_drink: 'node_coke',
        node_twilight: 'node_teamedward'
    };

    // Find the answer that matches the question variable
    let question = player.variables.getValue('question');
    let answer = answers[question];

    // Append the answer node
    if (answer) {
        player.append(answer);
    }
});

See also decision made event, variables api regiter, setValue, getValue.

For a simpler implementation and walkthrough, check out the Callback snippet.

Rate this page: X
Tell us more!