Today a client wanted me to write a ticker for their website to count the total amount of money that they have saved their clients so far on Solar Panel installations.
I did a couple of google searches and wasn’t able to come up with any tutorials, so I set off to write it myself. Fortunately, it was pretty cake.
The logic is straight forward, and can easily be applied to any language. Simply find your starting date, and your starting “amount”. In this case, as of May 1st 2008, HelioPower had saved their customers $3,107,500. I called this variable baseMoney. They did some calculations for me and determined that this number increases by $.14 (14 cents) every second. All you have to do is write a function that will find how many seconds it’s been since the starting date, and add those seconds (multiplied by your rate) to baseMoney.
Here’s what the code looks like in ActionScript 2.0:
//Starting Money Saved
var baseMoney:Number = 3107500;
//The date we're starting counting at
var d1:Date = new Date(2008, 04, 01, 0,0,0,0);
trace("Starting Date: " + d1);
//The time right NOW. No, right Now. No, right Now. No...
var d2:Date = new Date();
trace("Today: " + d2);
//How many seconds from the initial date to today's date
var addedSeconds:Number = Math.floor((d2 - d1)/1000);
//tickerval sets the function tick() to fire once every 1000ms (once per second)
var tickerval = setInterval(tick,1000);
Tick, which fires every second, simply increments the variable addedSeconds which is the total number of seconds since the initial date. It then calculates and outputs the updated number of dollars saved.
function tick()
{
var sumMoney:Number = baseMoney + ( addedSeconds * .04);
//This is the output. For more on fncCurrFormat, look below.
trace( fncCurrFormat(sumMoney, 2, ",") );
addedSeconds++;
}
The last step is to get the dollars into the correct format. For this I use a function I found called fncCurrFormat. I inherited this particular function in a .fla that I had to update years ago and have been using it ever since. I wish I could give credit where credit is due, but I'm unfortunately not sure where it is. Anyhow, here is the price formatting function.
fncCurrFormat = function (uknumValue, uknPlaces, strSeparator)
{
//trace("uknumValue: "+uknumValue+"\tuknPlaces: "+uknPlaces+"\tstrSeparator: "+strSeparator);
strResult = "";
var booError0 = false;
var booError1 = false;
if (typeof (uknumValue) == "string") {
var numValue = parseFloat(uknumValue);
if (isNaN(numValue)) {
booError0 = true;
}
} else if (typeof (uknumValue) == "number") {
var numValue = uknumValue;
} else {
booError0 = true;
}
if (typeof (uknPlaces) == "string") {
var numPlaces = (uknPlaces == "" || uknPlaces == null) ? 0 : parseInt(uknPlaces);
if (isNaN(numPlaces)) {
booError1 = true;
}
} else if (typeof (uknPlaces) == "number") {
var numPlaces = uknPlaces;
} else {
booError1 = true;
}
if (booError0 || booError1) {
strResult = (booError0 && booError1) ? "bad Value & bad Places" : "";
strResult = (!booError0) ? "bad Places" : "bad Value";
return "error";
} else {
var numRound = Math.pow(10, numPlaces);
numValue = Math.round(numValue*numRound);
var strValDec = (numPlaces>0) ? "."+String(numValue).substr(String(numValue).length-numPlaces) : "";
var strValInt = String(numValue).substr(0, String(numValue).length-numPlaces);
strValue = String(parseFloat(strValue));
var strValIntLen = strValInt.length;
numTriple = Math.floor((strValIntLen-1)/3);
numRemainder = ((strValIntLen-1)%3)+1;
for (var count = 0; count<numTriple; count++) {
strResult = strSeparator+strValInt.substr((strValIntLen-(3*(count+1))), 3)+strResult;
}
if (numRemainder) {
strResult = strValInt.substr(0, numRemainder)+strResult;
}
if (numPlaces && strValDec.length) {
strResult = (strResult == "") ? "0" : strResult;
strResult += strValDec;
}
}
return strResult
};
As I'm sure you can see it takes three arguments, the first being the string to format, the second being what character to separate blocks of digits by, and the third being how many decimal places to round to.
That's it! Peace of cake, no?
This is my first tutorial post ever, please let me know how I did.
Well, the title is misleading. I did have to launch this website in three hours–and it was a pain–but I got to come back in and spend some time on friday cleaning up loose ends and filling in the details, which as I’ve come to realize, are the only thing that make the difference between good web design and websites that look like they were made in Microsoft Word by a non English speaking grandmother.