In this video, I’ll show you two solutions to remove the decimal digits in a quiz score on the quiz results slide in Articulate Storyline 360.
When I delivered a client project last week, I got feedback where I was asked if it was possible to not show the decimal points in the quiz score in my delivered Storyline module. Now, in this video, I’ll show you two solutions to do this. One solutions is with triggers in Articulate Storyline and another solution is with a little bit of JavaScript edit in storyline.
The problem: Decimal digits
But, first, let’s take a look at the problem. Now, I have here a quiz with six question slides and results slide. Now, let’s preview this quiz, so I’ll click “Preview This scene” and now Articulate Storyline will preview my quiz. So, I’ll click on next and the first answer is right, so the first three questions I will answer correctly, and the four answers I will answer incorrectly. So, I have two correct answers and four incorrect answers. And if I click “Submit”, we will jump to the quiz results slide and see what happens.
So, you see that my score is now 33.33%, and my client wanted to show only 33%. Now, on the E-Learning Heroes forums, you can find a lot of old solutions that worked in Storyline 3, but not in Storyline 3 and 360 because Articulate changed the handling of decimal numbers. But I want to show you two solutions that will solve this issue. Now the first solution is a solution with triggers in Articulate Storyline. And the second solution is to add a few lines of JavaScript into Storyline. Now let’s go to the first solution. So, let’s close the Storyline preview, and I will go to my results slide. But before I’ll show you the first solution, I want to mention that this great solution is provided by Mitch Hayashi on the E-Learning Heroes forums almost two years ago, and you can find the link to the form thread in the description below this video.
A solution with triggers in Storyline
Now, what is the solution? Now the first step is to create a variable called “floorscore” in Storyline. So I’ll go to my variables panel here and I’ll click the green plus sign and type the name floorscore. And it will be a number variable and a default value is zero and I click “OK”. And I click on “OK” now, now the floor in the variable name refers to the JavaScript function, math.floor, where it rounds down number with decimal places to the largest integer. And that is what we are going to do with Java Storyline triggers. I’ll add a trigger now that sets the variable floorscore to a 100 when the timeline starts on the “Results” slide. So I’ll create a new trigger that says “Adjust variable”, adjust variable floorscore. That sets floorscore to 100 when the timeline starts on this slide.
So on the next step is to create another trigger where we subtract one from the floorscore variable, when this variable changes, just as long as the variable floorscore is greater than the default Articulate Storyline score. So let’s create this variable. So what we’ll do is adjust the variable floorscore. So the floorscore variable, and what we will do now is we’ll subtract one from floor score. When the timeline starts on this slide, where when the variable changes, Oh, let me see where it is. Here are “Variable changes”, and it will be floorscore. And we also create a condition. So the condition will be if our floorscore variable is greater than, and this won’t be a value but a variable. And let’s see where it is. A “Results.ScorePercent” we all going to use and take up.
Now, if our Storyline score is a 33.33%, what we saw in the example, Storyline subtracts one from floorscore until it reaches 33 and then floorscore is not greater anymore than the Storyline quiz variable. And the trigger will not be executed again. So what we can do now is that on the results slide, we can change the reference to a preferable result.score percent into floorscore. Now I will change this reference so we can see what it does. So I’ll add floorscore here and now let’s preview the module and answer the questions again. So I’m in the Storyline preview again. So let’s answer the first two questions correctly, and the other four answers incorrectly and six, and I’ll submit and jump to the results slide and what you see here. This is the standard Storyline quiz score that shows 33.33%.
And here at passing score, we changed it to the floorscore and our floorscore shows 33%. So this was the first solution in Articulate Storyline triggers. And I’ll now show you the second solution with a little bit of JavaScript codes.
Solution with Javascript in Storyline
Now and in the second solution, we’ll add some Javascript, but first for the second solution, we need two variables. So let’s go to our variables. We do, and you need the variables, nonrounded score and rounded score. So I already created them here, but you can create them here and then we’ll create a trigger. So I’ll create a trigger and not execute JavaScript, but adjust variable that says the nonrounded score will set it equal to the variable score percent. So let’s see where it is, it’s result.score percent. When the time I start on this slide and I will add it above the actions that will show the success and failure layer.
And the next step is to add a trigger that execute JavaScript. So let’s see where it is, execute JavaScript. Now it’s red so it means there is no Javascript included right now. So if you click it, the JavaScript window will open. Now I can add my lines of JavaScript. So I’ll copy them here and I can explain what they are doing. So the first line of JavaScript will rep all the Storyline variables and combine them to JavaScript. So you can communicate. The second line gets the value of the Storyline variable nonrounded score and sets it to the JavaScript variable rounded num value, for num value we’ll do a mass truncate. And that means that we’ll lose all the numbers after a coma or digit, and we’ll save it in the JavaScript variable here as “RoundedNum”. Now the Javascript here has rounded num”. The failure therefore will put it in the rounded score or firewall, so let’s click on “OK”. And “OK” here. And here, you see “RoundedScore”.
So now we can test our solution if it works now, because we all use JavaScript, we can’t use the preview function in Articulate Storyline, but we have to do it in the HTML output. So let’s open HTML output now. So I have here now, my Articulate storyline HTML output. So what we’ll do is I’ll answer the first two answers correctly, or questions correctly, and the third, fourth and fifth and sixth incorrectly. And now I’ll go to my “Results” slide. And you see here, this is the standard Storyline variable score with 33.33%. And this is the rounded num variables, a score. And you’ll see it’s 33%. So in this video, I’ll give you two solutions to lose the .33 in the result slide score.
You can do triggers in Articulate Storyline, or you can also do it with a four lines of JavaScript.
