Why the hate, man?
Here in Canada, income tax season is upon us and we don't much like to think about how quickly the government spends that money that we've been pitching at them.
So I thought to myself, "Hey, self, why not make it seem even worse!" So I set out on a short but enjoyable journey to reveal just how quickly my money evaporates. Yours, too!
This script will work for (or against, depending on your view) any government's burn rate and show visitors to your site the total that they've spent this year. Simply set up an HTML element to display the data and drop in this script.
The Code
Remember to add jQuery to your page:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.js" type="text/javascript"></script>
You can, of course, use any CDN you like to get the script on your page.
We need something to display the total in. I used this as a placeholder:
<div id="counter"></div>
Remember that with this script, the entire content of that element is going to be replaced several times a second so you don't want to put any text in there that you want to remain. Note the ID, as we're going to use it in our script.
Next, we'll need to block of some vars that will allow us to make the computations. This will go in the start of a script block.
var currentyear = new Date().getFullYear();
var startDateTicks = new Date(currentyear, 0, 1).getTime();
var $burnedMoneyElement = $("#counter");
var governmentBudget = 13265000000;
var moneyMultiplier = (((governmentBudget / 365) / 24) / 60) / 60;
Beauty, eh? Just update the
burnedMoneyElement
and the
governmentBudget
values as required, and we're almost there.
Now (drum roll please) our simple function to do the math:
function updateBurnedMoneyTicker() {
var curDateTicks = new Date().getTime();
var totalVal = 0;
totalVal = (curDateTicks - startDateTicks);
totalVal = totalVal / 1000;
totalVal = totalVal * moneyMultiplier;
$burnedMoneyElement.html(formatCurrency(totalVal));
setTimeout("updateBurnedMoneyTicker()", 333);
}
setTimeout
allows us to ask the browser's JavaScript engine to call a function at a set interval in milliseconds. Because we're calling ourselves here, we've got a recursive function that never ends. Feel free to crank that baby down to 30ms and watch the fury ensue!
You may notice the call to
formatCurrency
there, that's from our friends over at
javascript.internet.com[
^] and looks something like this:
function formatCurrency(num) {
num = num.toString().replace(/\$|\,/g, '');
if (isNaN(num))
num = "0";
sign = (num == (num = Math.abs(num)));
num = Math.floor(num * 100 + 0.50000000001);
cents = num % 100;
num = Math.floor(num / 100).toString();
if (cents < 10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
num = num.substring(0, num.length - (4 * i + 3)) + ',' +
num.substring(num.length - (4 * i + 3));
return (((sign) ? '' : '-') + '$' + num + '.' + cents);
}
Actually, it looks
exactly like that. I copied and pasted it.
We wire up the page with a simple method call when the page is loaded.
$(function () {
updateBurnedMoneyTicker();
});
There we are folks! In Manitoba, the government budget is a hefty $13.5 billion. Ouch, and bye-bye pay cheque!
Code Summary, All at Once
Here's all the juice you need, all in one spot.
<head>
</head>
<body>
<div id="counter"></div>
<script type="text/javascript">
var currentyear = new Date().getFullYear();
var startDateTicks = new Date(currentyear, 0, 1).getTime();
var $burnedMoneyElement = $("#counter");
var governmentBudget = 13265000000;
var moneyMultiplier = (((governmentBudget / 365) / 24) / 60) / 60;
$(function () {
updateBurnedMoneyTicker();
});
function updateBurnedMoneyTicker() {
var curDateTicks = new Date().getTime();
var totalVal = 0;
totalVal = (curDateTicks - startDateTicks);
totalVal = totalVal / 1000;
totalVal = totalVal * moneyMultiplier;
$burnedMoneyElement.html(formatCurrency(totalVal));
setTimeout("updateBurnedMoneyTicker()", 75);
}
function formatCurrency(num) {
num = num.toString().replace(/\$|\,/g, '');
if (isNaN(num))
num = "0";
sign = (num == (num = Math.abs(num)));
num = Math.floor(num * 100 + 0.50000000001);
cents = num % 100;
num = Math.floor(num / 100).toString();
if (cents < 10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
num = num.substring(0, num.length - (4 * i + 3)) + ',' +
num.substring(num.length - (4 * i + 3));
return (((sign) ? '' : '-') + '$' + num + '.' + cents);
}
</script>
</body>
Enjoy!