Thousands separator (comma) in calculated score variable when displayed?

Hi all,

I'm guessing the answer to this question is probably no, but thought I'd check. (A search of the forum has yielded no similar posts.)

Is there a way to format a score or other numeric variable to display a comma as a thousands separator? (Storyline 360)

Background: I'm working on a jeopardy-style trivia game that shows the score as the game progresses and the total score on the results page. If the course is successful in teaching the learner something, the total score should be in the thousands by the end of the game. I'd like to be able to format the reference text box for the total score variable to display a thousands separator (comma). (Example: Instead of 2340, I'd like it to display as 2,340.) I've looked everywhere for a setting like this ... maybe it's just hidden somewhere?

Inserting a separate text box containing a comma isn't really an option, since its position would not be able to adjust with the position of digits in the score. It's likely to look sloppy (comma/number overlap).

If this setting doesn't currently exist, maybe I could create a feature request.

Thanks in advance,

Lisa

4 Replies
Matthew Bibby

 It can be done with JavaScript.

Let's assume that you have a number variable in Storyline called number and a text variable in Storyline called formattedNumber.

If you add this code to an Execute JavaScript trigger, the formattedNumber variable will display the comma separator:

function thousands_separators(num)
{
var num_parts = num.toString().split(".");
num_parts[0] = num_parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
return num_parts.join(".");
}

var player = GetPlayer();
var n = player.GetVar("number")
var f = thousands_separators(n);
player.SetVar("formattedNumber",f);

The formattedNumber variable needs to be a text variable to accommodate the comma. If you use a number variable for this, you'll just see the number that precedes the comma. 

Hope that helps.

Lisa Spirko

Hi Matthew. Thank you so much for your response and detailed example! A couple of clarifying questions:

  • To what does this Execute JavaScript trigger need to assigned in the When field? Start of timeline?
  • Just so I understand, it sounds like this is using a text-based variable to retrieve and display the number variable with the comma. In that case, wherever I currently have a text box with the number variable referenced (e.g. on the results page), I would change the number variable in that reference to the text variable, and run the Execute JavaScript trigger on that page. Is that right?

Thank you again for the instructions and TIA for clarifying. :)

Lisa

 

Lisa Spirko

I just went with my assumptions above and got it working great! Thank you so much! The only weird thing is that the animations I have on the text box with the reference to the formatted total score variable no longer work. The formatted score now just appears with no animation. Maybe animations don't play well with JavaScript?

It's not too big a deal, since the slide already has a fade transition on it, but it was a nifty little animation where the total score at that moment slid in from the right. Still, it's a small sacrifice to pay for having a thousands separator now. The only person who will know that an animation is missing will be me.

Many thanks again, Matthew!

Lisa