// By: David Rugendyke
// Ver: 0.1


window.addEvent('domready', function() {

	// Initialise the image rollover menu class and set the class vars
	var nav = new menuTabs();

});


// Nav Roll Class
var menuTabs = new Class({
	
	// Class vars
	options: {
		tabButtons: null,
		tabButtonsOn: null
	},
	
	// Initialise the class
    initialize: function(){
		
		// Now add the mouseover events
		this.tabButtons = $$('.tabOff'); 
		this.tabButtonsOn = $$('.tabOn');
		// Combine them
		this.tabButtons.combine(this.tabButtonsOn);

		this.menuTabEvents();
    },
	
	// Adds events to all the main menu items
	menuTabEvents: function(){

		var Ob = this;
		// Attach events to each main menu
		this.tabButtons.each(function(tabEl) {
			
			$(tabEl).addEvent('click', function(){
				
				Ob.menuTabButtonClass(tabEl);
			});
				
		}); // End Menu Loop
	
	},
	
	// Changes the classes on the tab buttons
	menuTabButtonClass: function(tabElSel){

		var Ob = this;
		
		this.tabButtons.each(function(tabEl) {
			
				var currentID = $(tabEl).get('id');
			
				if(tabElSel == tabEl) {
					Ob.menuTabPanes(currentID);
					$(tabEl).set('class', 'tabOn');
				}else{
					(tabEl).set('class', 'tabOff');
				}
			});
	},
	
	
	// Changes the div to show when a button is clicked
	menuTabPanes: function(tabID){

		var tabPanes = $$('.tabPane'); 

		tabPanes.each(function(tabEl) {
			
			var tabCurrentId = $(tabEl).get('id');
			//alert('tab_'+tabID);
			if('tab_'+tabID == tabCurrentId) {
				$(tabEl).setStyle('display', 'block');
			}else{
				$(tabEl).setStyle('display', 'none');
			}
			
		});
	}
	
});