This time we want to create a universal counter that will count from one value to another over a fixed amount of time. We also want to be able to easily format the count with commas, add a dollar sign for currency formatting, and specify the number of digits to the right of the decimal point.

This is a perfect application for an expression applied to the source text parameter of a text layer. We'll drive the counter with AE's linear() interpolation method. This allows us (with a single line of code) to easily map the counting range across the duration of the count.

As a bonus, doing it this way will automatically give us a counter that will count up or down. All we have to do to make it count down is make the beginning count larger than the ending count. Also, this method will automatically cause the output to freeze when it reaches the end count.

For the formatting, we can take advantage of a couple of JavaScript's built in methods to help us accomplish our goal. We'll use the string method substr() to do the manipulation necessary to insert the commas and toFixed() to handle the formatting of the decimals. For negative numbers, we'll strip off the sign prior to formatting and re-apply it afterwards, along with an optional dollar sign.

The code may take you a while to decipher, but for most applications you should be able to just paste it into your project and modify the six variables at the beginning of the code.


numDecimals = 2;
commas = true;
dollarSign = true;
beginCount = -1999;
endCount = 1999;
dur = 4;

t = time - inPoint;
s = linear (t, 0, dur, beginCount, endCount).toFixed(numDecimals);
 
prefix = "";
if (s[0] == "-"){
  prefix = "-";
  s = s.substr(1);
}
if(dollarSign) prefix += "$";
 
if (commas){
  decimals = "";
  if (numDecimals > 0){
    decimals = s.substr(-(numDecimals + 1));
    s = s.substr(0,s.length - (numDecimals + 1));
  }
  outStr = s.substr(-s.length, (s.length-1)%3 +1);
  for (i = Math.floor((s.length-1)/3); i > 0; i--){
    outStr += "," + s.substr(-i*3,3);
  }
  prefix + outStr + decimals;
}else{
  prefix + s;
}

A few examples that demonstrate how, by manipulating a few variables, we can control the beginning and ending count, the duration of the count, whether the count is formatted with a dollar sign and/or commas, and the number of digits to the right of the decimal point.

Note that for best results, you'll want to use a mono spaced font (meaning that each character is the same width) so that the width of the display doesn't jump around. Lucida Console was used for this example.

The JavaScript string method substr() is used to extract a substring from a string and takes two parameters. The first parameter is the zero-based index of where to start extracting the substring. That means that "0" represents the first character, "1" represents the second character, and so on. The second (optional) parameter specifies how many characters to extract. For example, the expression ("abcdef").substr(1,3) would return "bcd". The second parameter is optional, and if it is omitted, the characters from the first parameter through the end of the string are returned. So, the expression ("abcdef").substr(1) would return "bcdef".