var bg = "expando";
var bgSize;
var bgRatio;

var bodyW;
var bodyH;

var footer = "footer";
var footerH = 94;

bgSize = {
	width: 1200,
	height: 1000
};

bgRatio = bgSize.width / bgSize.height;

window.addEvent('domready', function()
{
	init();
	
	function init()
	{
		$(window).addEvent("resize", handleResize);
		$(window).addEvent("load", handleLoad);
		$(window).addEvent("scroll", handleScroll);
		
		$(window).fireEvent("resize");
	}
	
	function handleLoad(event)
	{
		$(window).removeEvent("focus");
		$(window).fireEvent("resize");
	}
	
	function handleResize(event)
	{
		var size = $(window).getSize();
		bodyW = size.x;
		bodyH = size.y;
		
		$$("#" + bg).erase('class');
		
		if ((bodyW / bgRatio) < bodyH) 
		{
			$$("#" + bg).set("class", "stretchImgTall");
		}
		else
		{
			$$("#" + bg).set("class", "stretchImgWide")
		}
		
		var newW = $(bg).width;
		var newH = $(bg).height;
		
		if (newH > bodyH)
		{
			$$("#page .mainBg").setStyle("top", Math.ceil((bodyH - newH) / 2) + "px");
			$$("#page .mainBg").setStyle("left", "0px");
		}
		else
		{
			$$("#page .mainBg").setStyle("top", "0px");
			$$("#page .mainBg").setStyle("left", Math.ceil((bodyW - newW) / 2) + "px");
		}
		
		pinFooterToBottom();
	}
	
	function handleScroll(event)
	{
		pinFooterToBottom();
	}
	
	function pinFooterToBottom()
	{
		//var scroll = $('foo').getScroll();
		var scrollY = $$('body')[0].getScroll().y;
		
		var footerY = bodyH - footerH + scrollY;
		$$("#" + footer).setStyle("top", footerY + "px");
		
		var pageW = $("page-container").getStyle("width").toInt();
		var footerX = bodyW / 2 - pageW / 2;
		$$("#" + footer + " dl").setStyle("left", footerX);
	}
});