// base.js
// some javascripts for Cosmos Motion site

// min-width emulator for IE
function minWidth(element, w)
{
	var elt = $(element);
	if(document.documentElement.clientWidth < w)
	{
		elt.setStyle(
		{
			width: w + "px"
		});
	}
	if(document.documentElement.clientWidth > w)
	{
		elt.setStyle(
		{
			width: "100%"
		});
	}
}

// browser detector
var Engine = {
	detect: function() {
		var UA = navigator.userAgent;
		this.isKHTML = /Konqueror|Safari|KHTML/.test(UA);
		this.isGecko = (/Gecko/.test(UA) && !this.isKHTML);
		this.isOpera = /Opera/.test(UA);
		this.isMSIE  = (/MSIE/.test(UA) && !this.isOpera);
		this.isMSIE7 = this.isMSIE && (/MSIE 7\./.test(UA) && !this.isOpera);
	}
}
Engine.detect();

// init page content
Event.observe(window, 'load', function()
{
	// poor little IE 6 doesn't support :hover; let's help him 
	if(Engine.isMSIE && !Engine.isMSIE7)
	{
		minWidth($("main-heading"), "960");
		minWidth($("content"), "960");
		minWidth($("main-footer"), "960");
		
		var buttons = $$("#main-heading #heading-nav li a");
		for(var i = 0; i < buttons.length; i++)
		{
			if(buttons[i].hasClassName("on"))
				continue;
				
			// Dear IE, would you be kind enough to update CSS
			// (it's a great time for it now, realy)
			Event.observe(buttons[i], 'mouseover', function(event)
			{
				var elt = Event.findElement(event, "a");					
				elt.descendants().invoke("setStyle",
				{
					backgroundPosition: "0px -70px",
					cursor: "pointer"
				});
			});
			Event.observe(buttons[i], 'mouseout', function(event)
			{
				var elt = Event.findElement(event, "a");					
				elt.descendants().invoke("setStyle",
				{
					backgroundPosition: "0px 0px",
					cursor: "default"
				});
			});
			Event.observe(buttons[i], 'mousedown', function(event)
			{
				var elt = Event.findElement(event, "a");					
				elt.descendants().invoke("setStyle",
				{
					backgroundPosition: "0px -140px",
					cursor: "pointer"
				});
			});
		}
		Event.observe(window, 'resize', function(event)
		{
			minWidth($("main-heading"), "960");
			minWidth($("content"), "960");
			minWidth($("main-footer"), "960");
		});
	}
});