Passing Values from HTML to Storyline

In the previous few post we discussed about moving information from Storyline to HTML/ PHP etc.

1. Storyline to PHP via FLASH

2. Storyline to PHP via JavaScript

3. Storyline to PHP via AJAX

One may notice that in all these cases, the data flows one way, i.e., you can pass the information from Storyline to HTML or PHP, but not vice-versa.

Let us discuss the same today:

Recently I made a course where I pushed the value from HTML (that was embedded in the Storyline) to pass values to Storyline player.


Click on the picture to view the demo

For this –

Step 1: I put the following code in the Javascript section of HTML <head>(in a function).

1
2
3
4
5
function story() {
var player = window.parent.GetPlayer();
var pass = 1;
player.SetVar("pass",pass);
   }

Step 2: Call the function in the body of the HTML. For example on clicking a button–

1
2
3
<button id="button2" class="hide_level" onclick="story();" >
Click here to push the data
</button>

This will push the value into a Storyline variable called ‘pass’ when a button is clicked.

Step 3: Upload the HTML and related files to server. (I haven’t yet tried including web object from local system)

Step 4: Now I create a variable in Storyline named “pass”.

Step 5: Add the webpage as a web object in Storyline.

And you are done! Publish and upload the output to the server.

This method has opened a box of opportunities.

For example – I can now save player scores in a CSV. Later I can pull the data from the CSV and create leader board.

How would you use this method?

  • BJ

    Do you have example storylines for these?