var ListTabs = Class.create();
ListTabs.prototype = {
	initialize : function(element) {
		this.element = $(element);
		this.menu = $A(this.element.getElementsByTagName('a'));
		this.show(this.getInitialTab());
		this.menu.each(this.setupTab.bind(this));
	},
	setupTab : function(elm) {
		Event.observe(elm,'click',this.activate.bindAsEventListener(this),false);
	},
	activate :  function(ev) {
		var elm = Event.findElement(ev, "a");
        elm.blur();
		Event.stop(ev);
		this.show(elm);
		this.menu.without(elm).each(this.hide.bind(this));
		},
	hide : function(elm) {
		$(elm).removeClassName('active-tab');
        //$(elm).style.borderBottom = '1px solid #C3D6DF';
        //$(elm).style.backgroundColor = '';
        $(this.tabID(elm)).removeClassName('active-tab-body');
        if (elm.className &&  (' ' + elm.className + ' ').indexOf(' rollover ') != -1) {
            var img_tag = elm.childNodes[0];
            if (! img_tag.src.match(/over/i)) {
                img_tag.src = img_tag.src.replace(/(\.[^.]+)$/, '_over$1');
            }
        }

	},
	show : function(elm) {
        $(elm).addClassName('active-tab');
        //$(elm).style.borderBottom = '1px solid #F1F6F6';
        //$(elm).style.backgroundColor = '#F1F6F6';
		$(this.tabID(elm)).addClassName('active-tab-body');
        if (elm.className &&  (' ' + elm.className + ' ').indexOf(' rollover ') != -1) {
            var img_tag = elm.childNodes[0];
            img_tag.src = img_tag.src.replace(/_over(\.[^.]+)$/, '$1');
        }
	},
	tabID : function(elm) {
		return elm.href.match(/#(\w.+)/)[1];
	},
	// this will activate the first tab, if no tabs were clicked
	getInitialTab : function() {
		if (document.location.href.match(/#(\w.+)/)) {
			var loc = RegExp.$1;
			var elm = this.menu.find(function(value) {
                return value.href.match(/#(\w.+)/)[1] == loc;
            });
			return elm || this.menu.first();
		} else {
			return this.menu.first();
		}
	}
}

ListTabs.initWatch = function() {
	var tabsWidget = $A( document.getElementsByClassName( 'tabnav' ) );
	tabsWidget.each( function( ul ) {
		new ListTabs( ul );
	} );
};
Event.observe(window,'load',ListTabs.initWatch,false);