How to Embed Javascript in Articulate Storyline

We are massive fans of Articulate’s Storyline product here at 360elearning Company. It’s now our tool of choice when developing eLearning modules. One of the fantastic features is the use of triggers and in particular Javascript triggers by which we can embed Javascript in Articulate Storyline.

Now we are not Javascript experts, however that doesn’t stop us, as we have found many friends out there in the eLearning community who are more than happy to share Javascript code they have written. We have spent hours searching the web and the Articulate forums for pieces of code to make eLearning projects more exciting and interactive, and we thought we would share them with you.

1. Print the current window
This piece of code will print the current window to your nominated printer. A few people have queried whether it is possible to change the page settings (i.e. from portrait to landscape) unfortunately you are unable to.

window.print();

2. Popup message
This piece of code will create a popup message to your course. As you can imagine this can be used in a number of ways, but one of the most obvious is if you want to create a message that the learner must view all areas before the next button will work.

window.alert(‘You must explore all areas before proceeding.’);

3. Popup message with variable
This piece of code is a slight variation on the above code. This version will also pull through a variable (if you have one) into your message.

var player = GetPlayer();
alert(“Welcome back, ” + player.GetVar(“FirstName”) + “.”);

4. Save variables to a text file
This piece of code will save any variable a learner has entered to a text file.

var fso = new ActiveXObject(“Scripting.FileSystemObject”);
var s = fso.OpenTextFile(“C:\\Test.txt”, 8, true, 0);
var name = player.GetVar(“TextEntry”);
var email = player.GetVar(“TextEntry1”);
s.WriteLine(“Email: ” + email);
s.WriteLine(“Name: ” + name);
s.WriteLine(“==========”);
s.Close();

5. Generate a Random Number
This piece of code will generate a random number. The example below will generate a number between 1 and 10.

var randomnumber = Math.floor((Math.random()*10)+1);
var player = GetPlayer();
player.SetVar(“randnum”,randomnumber);

6. Send a completed result to your LMS
This piece of code sends a completed result to your LMS. The reason this is a handy little code is that you can set up a “pre-test” as well as a “post-test” and no matter which one is attempted (and passed), a result will be sent to your LMS that the course is completed.

var lmsAPI = parent;
lmsAPI.SetScore(90, 100, 0);
SetStatus(“completed”);

7. Pull a learners name from the LMS in Storyline
This piece of code pulls a learners name from the LMS straight into your Storyline project.

var lmsAPI = parent
var rawName = lmsAPI.GetStudentName();
var nameArray = rawName.split(“,”)
var niceName = nameArray[1] +” “+nameArray[0];
var p = GetPlayer();
p.SetVar(“username”,niceName);

These are the ones we have come across so far, we will add any more that we find. If you have any that you would like to add, share with us.