/* Note: this is QND code, not to be used for anything other
 * than the tab on the homepage
 */
var tabs;
var containers;

Event.observe(window, 'load', initaliseTabs);

function initaliseTabs() {
    tabs = $("tabcontrol")
    if(tabs)
        tabs = tabs.childElements("li");
    containers = $("tabcontainer")
    if (containers)
        containers = containers.childElements("div");
	tabs.each (
		function(tab) {
			Event.observe(tab, 'click', tabchangeselection);
			Event.observe(tab, 'mouseover', tabhover);
			Event.observe(tab, 'mouseout',  tabout);
		}
	)
	Event.stopObserving(window, 'load', initaliseTabs);
}

function tabhover(event) {
	Event.element(event).addClassName("hover");
}

function tabout(event) {
	Event.element(event).removeClassName("hover");
}


function tabchangeselection(event) {
	tabs.each(function(item) {item.removeClassName('on')});
	containers.each(function(item) {item.removeClassName('on')});
	var tab = Event.element(event);
	tab.addClassName("on");
	containers[tabs.indexOf(tab)].addClassName("on");
}