WebObject

If Storyline's limitations are not enough, or if the content is ready to be used as it is, you can incorporate external web pages into your projects using Web Objects.

Unfortunately, Storyline does not provide an easy way to communicate. The WebObject feature makes up for this by connecting external embedded Web pages to the Storyline player. Sending data to Storyline is completely transparent.

How to use

---

To use this feature, let's get straight down to work and embed a Web Object in a slide. At this stage, it doesn't matter what the external web page is, even a simple index.html file can do the trick.

Then let's create a JavaScript trigger on the same slide.

Storyline trigger

When the timeline starts on 'this slide' 
- Executes 'JavaScript'  
    If 'isOnline' = value 'True'
        and 'nuggetsLoaded' = value 'True'

And let's enter the following line of code in the JavaScript trigger:

JavaScript

WebObject.connect();

The method accepts a character string as an argument.

If the argument is omitted, the SendToSTL value is passed: a file named SendToSTL.js, present in Nuggets, is linked by JavaScript injection to the index page of the Web Object ;

SendToSTL 'injection'

---

Nuggets provides a pre-written SendToSTL function which can be used from the Web Object index page once the connection has been made.

The function accepts a container object as its only argument, but in which it is possible to pass any data to the Storyline player, regardless of its number.

From the Web Object index page, buttons or events can send data to Storyline through the function.

JavaScript

const data = {  variable: 'une valeur', 
                oneAnotherVariable: true, 
                andAnotherVariable: 123 };
SendToSTL(data);

variable, oneAnotherVariable et andAnotherVariable are variables created in Storyline.