Forum Discussion
Storyline variable data type bug
Hello e-Learning Hero community!
I have been very disappointed with Storyline recently, and need some help understanding it’s absolute INCONSISTENCY when it comes to handling the data type of its variables.
As this issue involves JavaScript, so naturally I don’t expect any help from the Articulate – so I’m asking for some help from the community. Even though there is JavaScript involved, I have narrowed down the bug to being caused by Storyline. (as far as I can tell)
This is attached to a larger project which I cannot share, but have been able to replicate what is happening with this proof of concept: https://360.articulate.com/review/content/8d644591-11c6-47c4-af71-e4b495e6390f/review
In Storyline, I have 4 numeric variables: number1, number2, number3, Sum.
Before the slide in question, I have 3 storyline triggers that set the value of number1, number2, number3 to specific values. Let’s say they get set to 25, 45 and 65.
When the slide starts, I run an execute JavaScript function to add those 3 together and push value to the variable Sum.
Here is the JavaScript.
var player = GetPlayer();
var value1 = player.GetVar('number1');
var value2 = player.GetVar('number2');
var value3 = player.GetVar('number3');
var sum1 = (value1 + value2 + value3);
console.log('Sum', typeof sum1, sum1);
player.SetVar('Sum',sum1);
Everything up to this point works as expected. When automatically ran at the beginning of the slide, the sum correctly gets set to 135 and the log in the console shows Sum remains a number.
Now onto the bug.
On the following slide, I have 3 numeric entry fields that are linked to the number variables I mentioned above.
Numeric Entry Field 1 is assigned to the variable “number1”
Numeric Entry Field 2 is assigned to the variable “number2”
Numeric Entry Field 3 is assigned to the variable “number3”
If you change ANY value amongst the 3 numeric entry fields and click “Calculate” you will see the Sum update and push a new log to the console.
Let’s say we change the 3 values to 32, 51, and 66 respectively.
Instead of the sum being 149 like it should, you’ll notice that it instead becomes 325166. You can check the type of each of these variables in the log and you will see that ANY value we change becomes a String. This causes our numbers to concatenate instead of add together.
While I could absolutely implement code to automatically filter these values into numbers, that is not a sustainable solution.
I’m trying to understand better WHY this is happening and if there is a workaround that’s actually sustainable and doesn’t create extra work for me.
Always use ' parseInt( )' to process calculations. As is variables in Storyline can tend to be strings. When they change to strings i cannot pinpoint precisely, so best to parseInt/toNumber or parseFloor variables of which you know they should be numeric. Using typeOf you can check whether vars are strings.
ONly the person who uploaded can see that
Ah, I didn't realize that! I've attached the file in this message.
Can you also post the .story file you used as the example?
I packaged the .story file inside the review link!
Please feel free to download it and dig into the file under the version drop-down.
as Math says most times they are strings, unless as you found you as on timeline start. I wonder if it is when they come from data entry fields but that is anecdotal.
In our tests it is the moment that a variable assigned to either or a text input or number input field gets reassigned a new value upon losing focus. Default values remain numbers and don’t get switched to strings, but as soon as you change that value in the input field, it becomes a string. Love these suggestions and insights.
Doing a 'parseInt()' was going to be my workaround for the time being, but was interested in finding the reason behind the switch. The projects we are working on require us to pass variables back and forth constantly and it numbers worked inside most javascript functions.
It became much more obvious any time addition was involved. Statements like:
var myNumber = (a + b + c);there are known problems with numeric entry fields and their auto created variables
a very interesting example of the bug - please upload the .story file here as attachment
Not a forever solution, but I've found a workaround that will work for now!
Designers looking to import numeric variables into JavaScript that interacted with numeric entry fields can use the 'Number()' wrapper when calling the variable in the Execute JavaScript function.
So instead of:
" var value1 = player.GetVar('number1'); "
Try this!
" var value1 = Number(player.GetVar('number1')); "
This will force the variable as its called to remain as a number.a real 'nice' bug
- with activating a numerical input field - the connected variable switches from number to string
- the incorrect variable type(s) is/are repaired internally on leave (???) the slide
example - all three numeric entries activated -> all three connected vars are string !!!
you have to expand your patch for all numeric entry fields, which are you using
var value1 = Number( player.GetVar('number1') );
var value2 = Number( player.GetVar('number2') );
var value3 = Number( player.GetVar('number3') );you can use "Number( ... )" or "parseInt( ... )" - both works
parseFloat() is more lenient than Number() because it ignores trailing invalid characters, which would cause Number() to return NaN.
parseFloat() the following
3.14
"3.14"
" 3.14 "
"314e-2"
"0.0314E+2"
"3.14some non-digit characters"All return 3.14
