Javascript: Have you used it with Storyline & what for?
Jun 15, 2015
Hey peeps,
We're going to have a short session about using Javascript with Storyline at our Toronto event this week (community member Kristian Chartier will be delivering it!).
In that vein, I was hoping some community members might share insights into if and how they have extended Storyline's use with Javascript in the past. Just looking for a list of potential reasons one would use JS! Thanks for sharing!
Nicole
72 Replies
I've used it for a simple print button.
window.print();
I have used it to make training on a RF Gun training more engaging (think about the "guns" you see in Target that the associates use to find a product, price, etc) . We created a trigger with Javascript for characters (letters, numbers, backspace, etc) on the gun so that the learner could complete the task all onscreen! It perfectly simulated the actual experience on the gun which was great! I look forward to doing and learning more with JavaScript
I really enjoy this kind of conversation. Thank you for the detailed answer, Steve Flowers.
Our graphic designer and I have some interesting scenario and I am wondering whether we can solve the problem using javascript.
We are helping our professors to create online courses.
She is curious about whether we can lock the content that users have already seen. For example, there are seven chapters within one module. I put all the seven chapters in 7 separate scenes. After users go through the first chapter (the first scene), then the second chapter (the second scene) is available to them.
The key is the first scene has to be locked.
Does it possible to do this kind of action using javascript?
Hi Sammy, the short answer is yes, you can do it with JavaScript but I think you may be able to do the same with Variables, Triggers and Conditions as well. It depends on the exact flow you're looking for.
Let's say each chapter has a variable (with Locked, Not Started, Incomplete, Complete status). Ch1 is set to Not Started. Ch2 is Locked. Ch3 is locked, etc. If the chapter's status is locked, it is not accessible. You can set Chapter 1 to Incomplete when the users gets to the first page. When the user has seen all pages in Ch1, you can set Ch1's variable to Complete.
Then, Ch2 can watch this trigger and can change Ch2's initial variable status from Locked to Not Started. And now, you can move on to Ch2...
This is just a theory, I haven't tried it but if anyone has done something similar please chime in!
Zsolt
Hi Sammy -
You could do this with Javascript but it's not necessary. Everything you need to do this is available in triggers, conditions, and variables.
Using Javascript to create and evaluate arrays can be useful for checking locks / unlocks for sections and affecting visuals. I have an example of that somewhere here on the forums. This uses a variable for slide number and a listener trigger on the master that fires a Javascript trigger to commit that to an array (1,0,0,0,1,1,1,0). This array can be evaluated to determine an lock.
Zsolt beat me to it:)
The only advantage Javascript might provide is reduction in the number of triggers you would need to track progress. The downside is the script can be fragile (put a character in the wrong place and it's all broken) and the editor won't warn you if you messed something up.
@Nicole - that's a great idea!
Are you going to write any article/notes after the workshop with links to any "real life" examples?
I think we've hijacked @Nicole's original "Just looking for a list of potential reasons" post.
Hello, very new to the forums but have been working with SL for a while. I tried to use JS for a type of log. So that JS would make a text file on the local computer that would log in all the students that took the course on that computer. Sadly, I could never get it to work. I looked at the forums and all over the internet to find a solution but could not. The script I am using is here:
var fso = new ActiveXObject("Scripting.FileSystemObject");
var s = fso.OpenTextFile("C:\Text.txt", 8, true, 0);
var player = GetPlayer();
var name = player.GetVar("TextEntry");
s.WriteLine("Name: " + name);
s.WriteLine("==========");
s.Close();
I'm not sure where I went wrong.
A little late to the party. For a variety of reasons I had the time in the last week to do some experimentation and came up with the attached.
It uses a javascript to manipulate the states of an object.
Any critiques from the javascript mavens as to how to do it more efficiently will be gladly received.
I like this, there are so many uses for your code.
In Moodle, in a course with the Flexible sections format I've used Javascript to return to the relevant topic by trigerring window.history.go(-2); when Exit is clicked.
The Appearance settings in Moodle are:
Display package: Current window
Student skip content structure page: Always
Disable preview mode: Yes
Display course structure on entry page: No
I have used JavaScript for things like:
John, the Magic Ball looks good!
Based on the interest just in this thread, here's a demo (with source code) including some of the above mentioned JavaScript features. Feel free to rip it apart, customize it and re-purpose it if you like. http://bit.ly/1IjNEKs. I used @Allison's template and added the JavaScript.
I'd love to see other examples as well!
Something seems to be wrong with the link
John, you're right. Weird, I just put the same link in again and saved it. It seems to be working now.
Only just seen this but I have used javascript to export variables to a google spreadsheet ... https://community.articulate.com/discussions/articulate-storyline/exporting-variables-into-a-google-spreadsheet
I have also used JS to set up a print and email notes function
We also used jQuery and json2.js together to send the quiz information to the server (PHP) via AJAX, where it was stored in a database.
Add me to the list of people who would love to see some simple tutorials on this subject. Thank you to everyone in this thread for their contributions.
Here's a demo of sending (in this a variable) and receiving data to/from a Web server. The same concept goes for sending, for example name, email and score and store the info on the server. There you can build a leader board or something... We used this to send question level quiz details. I'm happy to provide the source files as well but you must have your own server to modify it for your needs. http://bit.ly/1girNbj
In case anyone can benefit, this site makes it incredibly easy to insert the "share" codes for all things social media: http://www.sharelinkgenerator.com/
This post was removed by the author
I have an object that I'd like to display on the slide, at a random location.
Is there any way to do this?
I have six images that must fall in each of the 96 cells at a time in random order
Hi Nataly
It would take a bit of work but you could create 6 number variables (one for each image) and then use random number generation to feed a number from 1-96 into each one and then change the state of the images based on the numbers in the variables - each image would need 96 states!
There's a random number generator script found on this page http://en-uk.articulate.com/support/storyline-2/javascript-best-practices-and-examples-sl2
Hope that helps
Helen
This discussion is closed. You can start a new discussion or contact Articulate Support.