So my courses have to be timed for credit. I have an interaction which include several slides and pathways. I want to be able to make sure that the participants spend a certain amount of time going through the interaction or repeating the interaction to see different results. Is there a way to make sure an interaction takes a desired amount of time?
Thanks Berno. So can I just copy and past what you put in the first post into triggers at the beginning and the end of the interaction? How would I go about doing the calculations.... Sorry for so many questions. I really have no experience with JS.
Many thanks, Berno! Good job. Another problem--how could I go about achieving remaining time by using JS in this case as Sam did to add it to each slide? Sorry to trouble you !
I'm venturing - no really I'm tip-toeing - into Execution of JavaScript. And since I no NOTHING about it, I'm simply using what y'all offer here and C/P into the JavaScript box.So, I really appreciate the Q/A.
I know enough to understand that the trigger names must match the characters inside the Javascript window, e.g., in the case of the gsStart trigger, it matches the characters inside the first set of quotation marks in the player.SetVar line:
player.SetVar("gsStart", d.getTime());
So, I successfully implemented a trigger that shows how much time was spent on a previous slide when the Learner clicks the next button - and to display the time on the next slide. Essentially, I copied what you did, Berno, but using the next button instead of Submit.
What I really want to do is to have a counter that displays a number of seconds count on the current slide. So, nothing would be clicked, it would just count up in seconds. And I'd reference the count inside a text box.
I'd searched the forums a while back for this but didn't find exactly what I was looking for. Perhaps I missed it. Does anyone know how to do this?
You'd need to do this with an interval to repeatedly update the second value. I'll test one out to make sure there's no funny business or side effects and post in a bit.
In the mean time, here are some DYNAMITE references for learning more about JavaScript. The codacademy site is instructional candy. So good. All practice and feedback. Appendto isn't bad either, more demonstration if that's your preference.
I know enough to understand that the trigger names must match the characters inside the Javascript window, e.g., in the case of the gsStart trigger, it matches the characters inside the first set of quotation marks in the player.SetVar line:
Probably a typeo, but gsStart is a Storyline variable, not a trigger. If there is a way to fire a trigger in Storyline, it would be by setting a value in a variable to which a trigger is set to fire on that value.
Steve's suggestion of an interval timer is the right idea. I look forward to seeing it implemented.
Sam, yep was a typo. And I DO understand the difference between triggers and variables ... really Tx for proofing/editing. Don't want to lead people down the wrong path, nor do I want them to think I don't know my whatchamacallit from my elbow.
Steve, tx so much. As I mentioned in another thread to Nancy, I'll need to add this to my ToDo list. In the meantime, looking forward to your post. Oh, there's no rush. Just something I had in mind. And I know you're busy.
Here's a quick and dirty example. I'm using a text variable to catch the value but you could just as easily use a number for logic inside of Storyline. Some cool concepts at work here. Noteable are the establishment of global functions that make it easier to start and stop the timer. It also continues to run between slides if you don't stop it.
All of the trigger JavaScript is saved into a file called user.js. I'll crack this and save tinkers when testing. You're right, publishing every time isn't fun
I've extended Steve's code to add another variable that records elapsed seconds using the JavaScript Date() in addition to counting timer intervals. There shouldn't be much difference in the two unless other Storyline JavaScipts block the timer interval here and there. Maybe this would add up to something, maybe not, maybe accuracy doesn't matter in most situations. But using Date() doesn't cost anything additional, and you will get more accurate results.
This demo shows both counting along. You can simulate another JavaScript blocking the interval timer by clicking the "Busy" button once to view the cumulative difference.
Steve, this is great! Thanks so much. Definitely s/b a verified answer IMHO.
I did change the Set function to when the timeline starts, and put it on the slide master. And the buttons are working. I'm contemplating making a Screenr on this at some point, with your permission, and of course referencing this thread and you, since all I did was copy and paste. But I'm thinking others might like to have this. It's beautiful! So clean. And cool that it will run between slides. Haven't looked at that part yet.
Sam, I haven't had a chance to look at yours yet. Tx for contributing.
Sure, thing Rebecca. I'm not sure how initializing the functions on each slide (declaring, really) will affect the slide to slide timer. Should be OK (since I think it's just declaring the functions) but I haven't tested it. If it mucks up, let me know. I'll make an adjustment that'll help.
34 Replies
Hi Lance,
I'm not sure if this is what you're looking for but this is how I implemented it.
when the timeline starts I fire this JS:
var d = new Date();
var player = GetPlayer();
var start = player.SetVar("gsStart", d.getTime());
when the interaction has finished:
var d = new Date();
var player = GetPlayer();
var start = player.SetVar("gsEnd", d.getTime());
Using start and time you can perform the calculation you need.
I'm new to Storyline, and not familiar with JS. How would I go about doing that?
Add triggers to your interaction.
Specify Execute Javascript as the action.
Click the Script button
Enter Javascript code
Hello, Berno, your solution is quite cutting edge, could you share the story file ? I tried to add js trigger on my slide, but failed.
Hello Jon,
I had some JavaScript startup trouble as well.
http://community.articulate.com/forums/t/22924.aspx
Maybe this will help.
Thanks Berno. So can I just copy and past what you put in the first post into triggers at the beginning and the end of the interaction? How would I go about doing the calculations.... Sorry for so many questions. I really have no experience with JS.
With some additional effort, a time-remaining graphic could be added to every slide....
Lance,
Yes, you can copy and paste the JS code in triggers.
Regarding the calculations:
var player = GetPlayer();
var start = player.GetVar("gsStart");
var end = player.GetVar("gsEnd");
var duration = end - start;
You may want to divide by 1000 because the start and end time is in millisecond.
var duration = (end - start) / 1000;
Hello, Berno. Could you screenr how to use your js code ?
And here ..... is the storyline file!
gOOd LucK!
Many thanks, Berno! Good job. Another problem--how could I go about achieving remaining time by using JS in this case as Sam did to add it to each slide? Sorry to trouble you !
Hi All,
I'm venturing - no really I'm tip-toeing - into Execution of JavaScript. And since I no NOTHING about it, I'm simply using what y'all offer here and C/P into the JavaScript box.So, I really appreciate the Q/A.
I know enough to understand that the trigger names must match the characters inside the Javascript window, e.g., in the case of the gsStart trigger, it matches the characters inside the first set of quotation marks in the player.SetVar line:
player.SetVar("gsStart", d.getTime());
So, I successfully implemented a trigger that shows how much time was spent on a previous slide when the Learner clicks the next button - and to display the time on the next slide. Essentially, I copied what you did, Berno, but using the next button instead of Submit.
What I really want to do is to have a counter that displays a number of seconds count on the current slide. So, nothing would be clicked, it would just count up in seconds. And I'd reference the count inside a text box.
I'd searched the forums a while back for this but didn't find exactly what I was looking for. Perhaps I missed it. Does anyone know how to do this?
And thanks again.
Hi, Rebecca -
You'd need to do this with an interval to repeatedly update the second value. I'll test one out to make sure there's no funny business or side effects and post in a bit.
In the mean time, here are some DYNAMITE references for learning more about JavaScript. The codacademy site is instructional candy. So good. All practice and feedback. Appendto isn't bad either, more demonstration if that's your preference.
http://www.codecademy.com/
http://learn.appendto.com/lessons
Probably a typeo, but gsStart is a Storyline variable, not a trigger. If there is a way to fire a trigger in Storyline, it would be by setting a value in a variable to which a trigger is set to fire on that value.
Steve's suggestion of an interval timer is the right idea. I look forward to seeing it implemented.
Sam, yep was a typo. And I DO understand the difference between triggers and variables ... really Tx for proofing/editing. Don't want to lead people down the wrong path, nor do I want them to think I don't know my whatchamacallit from my elbow.
Steve, tx so much. As I mentioned in another thread to Nancy, I'll need to add this to my ToDo list. In the meantime, looking forward to your post. Oh, there's no rush. Just something I had in mind. And I know you're busy.
Here's a quick and dirty example. I'm using a text variable to catch the value but you could just as easily use a number for logic inside of Storyline. Some cool concepts at work here. Noteable are the establishment of global functions that make it easier to start and stop the timer. It also continues to run between slides if you don't stop it.
The value in the setInterval call "1000" is milliseconds. So that's a 1 second tick.
Thanks a lot, Steve, It's wonderful !
Steve,
The global functions idea is great.
I've placed my Javascript in a seperate .js file.
It allows you to experiment / test the JS code after publishing. Just alter the code and refresh your browser.
Saves a lot of time compared to publishing after every code change.
And you could edit the code in a JS savvy editor.
You have to alter your story.html file and perform some post-publish copy actions
in the story.html find the place where other JS code is included:
and add your own:
After each publish copy the altered story.html over the newly published one and copy your .js file to the story_content folder.
Have a nice weekend!
All of the trigger JavaScript is saved into a file called user.js. I'll crack this and save tinkers when testing. You're right, publishing every time isn't fun
Didn't know that. Great tip!
I've extended Steve's code to add another variable that records elapsed seconds using the JavaScript Date() in addition to counting timer intervals. There shouldn't be much difference in the two unless other Storyline JavaScipts block the timer interval here and there. Maybe this would add up to something, maybe not, maybe accuracy doesn't matter in most situations. But using Date() doesn't cost anything additional, and you will get more accurate results.
This demo shows both counting along. You can simulate another JavaScript blocking the interval timer by clicking the "Busy" button once to view the cumulative difference.
Steve, this is great! Thanks so much. Definitely s/b a verified answer IMHO.
I did change the Set function to when the timeline starts, and put it on the slide master. And the buttons are working. I'm contemplating making a Screenr on this at some point, with your permission, and of course referencing this thread and you, since all I did was copy and paste. But I'm thinking others might like to have this. It's beautiful! So clean. And cool that it will run between slides. Haven't looked at that part yet.
Sam, I haven't had a chance to look at yours yet. Tx for contributing.
Yeah!
Sure, thing Rebecca. I'm not sure how initializing the functions on each slide (declaring, really) will affect the slide to slide timer. Should be OK (since I think it's just declaring the functions) but I haven't tested it. If it mucks up, let me know. I'll make an adjustment that'll help.