Storyline 360 Javascript Interaction

Hello,

I'm working with Javascript in story_html5 of Storyline 360 but my custom functionality not work.

My custom functionality works perfectly in story_html5 of Storyline 2 but doesn't work in story_html5 of Storyline 360.

Only player.GetVar("val_name") and player.SetVar("val_name", "value") are working in Storyline 360.

 

My custom functionality that I want from javascript interaction are:

  • Get current slide information player.currentSlide()
    • title (Slide title) example: My Slide 1
    • id (Slide ID) example: 6eeggBml5DU
    • lmsid (LMS ID) example: Slide1
    • slideIndex (Slide Index) example: 5
    • ....
  • Get last slide information story.allSlides[story.allSlides.length - 1]
    • the same attributes of above javascript
  • Jump to any slide by id. Example player.showSlideID("6eeggBml5DU")

 

Please check the attached story to see my javascript interaction test in Storyline 2.

  • It will alert pop up with current information on each start timeline of slide
  • On 1st slide there is a button "Go to last slide by Javascript", it will jump to last slide.

 

Thanks,

Sopharo

27 Replies
Ashley Terwilliger

Hi Sopharo,

Thanks for sharing the example and information here with us. We do have an open issue regarding the Javascript player variables not functioning in Storyline 360 with HTML5, so I'll include this forum discussion as a part of the report to our team. 

From here, I’ll meet with my team to take a closer look so we can determine next steps. 

Depending on priority and risk, some bugs can be fixed quickly, while others take longer to resolve. Here's more information on how we identify and tackle bugs.

I’ll let you know as soon as we have an update on this issue. Thanks so much again for letting us know about this, and I’m sorry if it’s slowing you down.

Adam Trosper

Hi Ashley,

Any word on this?  This is causing issues in a number of our courses.  We can't even get a simple alert() function to work when using the "Execute JavaScript" trigger.  

When we run the same test in Storyline 2, it works fine.  However, since there's no way to export a 360 project to open in Storyline 2, we are at the mercy of waiting for a bug fix to be able to roll these modules out.

Ashley Terwilliger

Hi Adam,

No update yet, and I'm sorry that it's really slowing you down! I'll share the continued issues here with our team so that we're aware of impact while we work on prioritizing bugs and next steps. Just as a note, here's how we work and tackle bugs. 

I’ll let you know as soon as we have an update on this issue. 

Ashley Terwilliger

Hi Adam,

We don't have a public facing bug based, so there isn't a spot that you could currently see that. Our team is continuing work on the process for prioritizing and communicating that information back to customers here in ELH and as a part of Support cases and that article is a good break down of what we've got so far and we'll keep folks posted on any changes to that! 

Phil Mayor

You should be able to get an alert to show if you have no javascript errors.  

The player functions you are calling have never been exposed publicly by articulate and I remember previous posts where Articulate did say they have not exposed them just in case they decide to change them and break something in your projects.

 

Ashley Terwilliger

Hi Maria,

No update or changes yet. As Phil mentioned earlier in this discussion, they were something that we purposefully didn't expose in case they changed in the future and broke content.

Our team is aware what a headache this is causing for users so they're looking at ways they can build in these types of features and concepts into Storyline directly so that you wouldn't have to use the workarounds. We're in the initial stages of that discussion, so there isn't a way to estimate when or what will be available, but we'll keep folks posted here in the E-Learning Heroes community.

Trevor White-Miller

Hi, was the specific Javascript issue for player.SetVar("val_name", "value") for html5, which was noted 12 months ago at the top of the thread by Ashley, been fixed?

I have checked the release notes but can't see it listed. 

Having recently moved from SL2 to SL360 I now have all of our courses with this feature not working. The list of SL360 issues is growing and causing alot of pain.

 

Steve Flowers

Hi Trevor - I haven't seen any issues with SetVar or GetVar in 360. Almost every publish I make contains a JS exchange of variables and this has worked consistently in my testing. The issues above have to do with undocumented player features like getting the current slide values, navigating to specific slides, etc.. These are all things that have been behind the curtain but have worked in the past.

Trevor White-Miller

Hi Steve, Matthew. Thanks for the replies.

I have done some more investigation and I can see that the variable is actually updating from the javascript by outputting it to the screen (%   %). The issues appears to be that the trigger 'when variable changes' is not firing the Action. So in a simple example a Next button should change state from Hidden to Normal when the variable changes to True (True/False variable). I have tried a Text and Number variable and I'm only getting a dynamic change (the Action fires) for Number variables.  

Have either of you had any issues with 'when variable changes' triggers in 360?

Adam Trosper

Hi Trevor,

I have used SetVar in javascript before, and it has fired off the 'when variable changes' trigger.  An issue I ran into at one point is that if the variable doesn't change, that trigger won't fire off.  For example, if there is a Boolean variable set to True, and you call player.SetVar("var_name", true), it won't fire off this trigger, because the variable technically isn't changing.

To get around this issue in the past, I have used code to toggle the variable instead.  For example, I set up a trigger in SL that says, "when variable changes:  enable Next button" with NO CONDITIONS.  Then, in my javascript code, I write:

var status = player.GetVar("nextState");
status = !status; //switch between true/false
player.SetVar("nextState", status);

There are ways to shorten this code up, but I left it longer to emphasize the line that switches the status.

OWEN HOLT

I recently saw this issue in a reverse sort of way. I created a file that was working great in SL360 and my T/F variable change triggered going to the next slide perfectly. I recreated the file EXACTLY in SL2 and the advance to next slide wouldn't trigger even though I could see the variable change.  Out of curiosity, I recreated the file in SL3 and it too was broken, just like SL2.  I then opened my SL360 file in SL3 and saved it as an SL3 file and guess what... it worked. Something strange (and not wonderful) is happening with the "when variable changes" trigger across the various SL versions when working with T/F variables.

Matthew Bibby
Adam Trosper

I have used SetVar in javascript before, and it has fired off the 'when variable changes' trigger.  An issue I ran into at one point is that if the variable doesn't change, that trigger won't fire off.  For example, if there is a Boolean variable set to True, and you call player.SetVar("var_name", true), it won't fire off this trigger, because the variable technically isn't changing.

 

Another way to get around this is to have two triggers in Storyline. For example:

  • Change state of Next to Normal when variable nextBtn changes if nextBtn is equal to True
  • Change state of Next to Normal when timeline starts if nextBtn is equal to True

This way the change will happen both when the variable changes and also if the variable has changed on a previous slide.

Also, I think the issue with True/False is due to it being a boolean variable but we are trying to change it by throwing text at it. If I want a T/F variable I either use numbers (as Steve mentioned) or a text variable and push the values of true or false.

Although using those values in a text variable may be confusing if other devs pick up my .story file. 

Adam Trosper

I ran a few tests earlier today, and I concluded that all of the follow examples made the trigger fire off correctly:

var a = player.GetVar("A");  //where "A" is a Boolean.
a = !a;
player.SetVar("A", a);

---

player.SetVar("B", true);   //where "B" is a Boolean.

---

var d = player.GetVar("D");   //where "D" is a Number.
d += 1;
player.SetVar("D", d);

---

player.SetVar("E", !player.GetVar("E") );   //where "E" is a Boolean

---------------------------------------------------------------------------------------------------------------------------------------

 

However, it fails when I tried the following (because it's passing "true" as a string instead of a boolean):

player.SetVar("B", "true");  //where "B" is a Boolean

Hope this helps!

Trevor White-Miller

Hi everyone that replied. 

Yes, yes, yes. I have not been thinking of this as a Boolean value. So my javascript was passing 'true' as a text string. So the variable was updating but would not trigger the 'when changed' as the value was not correct. That explains why the javascript based trigger did not work, but a True/False 'when changed' would work if everything was generated by Storyline options only.

Thanks for your help, hopefully this will be useful to anyone looking for answer to same thing.