Archive for May, 2008


ad rejected by clientWhen I tell most people that I’m a graphic designer, they seem pleasantly surprised.  It seems to conjure up images of me sitting in a meadow sipping coca-cola and sketching logos for some environmental non-profit.

Well, truth be told, that isn’t so far off.  Just replace meadow with cave of computers, sketching with vectorizing, and environmental non-profit with “anyone with money”.

I don’t wear much high-contrast clothing and my apartment is very poorly decorated.  I think I might have been born to be a computer programmer, but ended up as a graphic designer featuring programming abilities.  I think this is why I’m not prepared for the #1 drawback of being a designer–which is that you’re designing for other people, not for yourself.

When I’m writing software, it either works, or it doesn’t.  You never have to move a semi-colon a quarter inch to the left.

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.

Powered by WordPress | Theme: Motion by 85ideas.