var stats;
var numStats;
var displayedStatIndex;

$(document).ready(function(){
		$.getJSON("/stats.php", function(data){
			var tickerHTML = '<div id="ticker">' +
				'<div id="play24h">Playbacks in the past day: <span class="number">' + data.play.h24 + '</span></div>' +
				'<div id="sess24h">User creations in the past day: <span class="number">' + data.sess.h24 + '</span></div>' +
				'<div id="play30d">Playbacks in the past month: <span class="number">' + data.play.d30 + '</span></div>' +
				'<div id="sess30d">User creations in the past month: <span class="number">' + data.sess.d30 + '</span></div>' +
				'<div id="play365d">Playbacks in the past year: <span class="number">' + data.play.d365 + '</span></div>' +
				'<div id="sess365d">User creations in the past year: <span class="number">' + data.sess.d365 + '</span></div>' +
				'</div>';
			$("#header").append(tickerHTML);
			stats = $("#ticker div");
			numStats = stats.length;
			displayedStatIndex = Math.floor(Math.random()*numStats);
			displayNextTicker();
			setInterval("displayNextTicker()", 6500);
		});
});

function displayNextTicker()
{
	var nextStatIndex = displayedStatIndex+1;
	if (nextStatIndex > numStats-1)
		nextStatIndex=0;
	$('#ticker div:visible').css('bottom', 0).animate({bottom: '1.2em'}, 1500, function(){$(this).hide()});
	$(stats.get(nextStatIndex)).css('bottom', '-17px').show().animate({bottom: '0'}, 1500); //stupid IE didn't like -1.2em
	displayedStatIndex=nextStatIndex;
}