You might try using a SL variable tied to a trigger that changes the state of the button when true, then use another trigger leveraging javascript to set the variable to true. Watch the order of triggers, as you'll need the button state trigger higher in the trigger order. State changing triggers are pretty powerful. We don't need javascript for everything :)
Yes, that is a good tip. However JS triggers can be very powerful and leverage the need to implement a lot of workarounds and hassle with "regular" triggers.
I find it a little peculiar that Articulate allows us to execute code to manipulate objects and elements, yet do not provide us the information to find the object-ID's and classes, for example for different states.
Let's say I want to run the following to solve my issue:
var textEntry = player.GetVar("TextEntry"); var button = player.GetPlayer().GetElementById("ButtonElementID");
if (textEntry === "some-string") { button.className = "desired-state-class";
I can't because I cannot find the object-information I need.
every static text in storyline is an embeded svg (grafik)
structur of storyline text in the html output
<div> ['demoText1'] - text box background with html styles (1) ... <svg> - text with textbox border with svg styles (2) path -> stroke (corresponds borderColor) -> fill (corresponds backgroundColor) text (line 1) -> fill (corresponds color) text (line 2) -> fill (corresponds color) ...
=> (1) backgroundColor works (but this only works, if there is no background defined in storyline)
=> (2) borderColor and color do not work at all
here are example scripts to modify svg textColor, borderColor and backgroundColor
6 Replies
You might try using a SL variable tied to a trigger that changes the state of the button when true, then use another trigger leveraging javascript to set the variable to true. Watch the order of triggers, as you'll need the button state trigger higher in the trigger order. State changing triggers are pretty powerful. We don't need javascript for everything :)
Hi Brian, and thanks for your reply.
Yes, that is a good tip. However JS triggers can be very powerful and leverage the need to implement a lot of workarounds and hassle with "regular" triggers.
I find it a little peculiar that Articulate allows us to execute code to manipulate objects and elements, yet do not provide us the information to find the object-ID's and classes, for example for different states.
Let's say I want to run the following to solve my issue:
var textEntry = player.GetVar("TextEntry");
var button = player.GetPlayer().GetElementById("ButtonElementID");
if (textEntry === "some-string")
{ button.className = "desired-state-class";
I can't because I cannot find the object-information I need.
storyline don't use IDs for slide-objects - only for the default navigation/menu/...
there is a trick to find the element - use the Accessibility / Alt Text
javascript for button 1 (modify with class*):
javascript for button 2 (modifiy with style):
* "hidden" is one of the storyline used css classes
Thank you very much, Jürgen. I'll take a look at this once I'm back at work.
This worked great for me. Do you have a list of what you can change with "style"? I tried some others (color, borderColor) and they didn't work.
storyline don't use html/css for
every static text in storyline is an embeded svg (grafik)
structur of storyline text in the html output
=> (1) backgroundColor works (but this only works, if there is no background defined in storyline)
=> (2) borderColor and color do not work at all
here are example scripts to modify svg textColor, borderColor and backgroundColor