// JavaScript Document

	
	// CSS CLASS ASSIGNMENTS
	var CSS_NORMAL 			= "sp-linkNormal";
	var CSS_HOVER 			= "sp-linkHover";
	var CSS_ACTIVE 		    = "sp-linkActive";
	
	var CSS_BORDERREMOVE 	= "sp-linkNormalblue";
	var CSS_BLUELINE		= "sp-blueline";
	
	var CSS_LEFTNORMAL 		= "sp-leftLinkNormal";
	var CSS_LEFTHOVER		= "sp-leftLinkhover";
	var CSS_LEFTACTIVE	    = "sp-leftLinkActive";
	var ELEMENT_TABLE		= "#sp-tab td";
	
	var mAllTabsLength		= 0;
	
	
	// DOCUMENT LOADED - START LISTENING TO THE TD'S

	document.observe("dom:loaded", function() {
			var allTabs = $$(ELEMENT_TABLE);
			mAllTabsLength = allTabs.length;
			
	  		allTabs.each(function(tab) {
	  			//alert(tab.className);
	  			fixCurrent(tab);
	  			
	  			tab.observe("mouseover", function(ev){
					
					var element = Event.element(ev);
					mouseHover(element,true);
	
				});
	
	  			tab.observe("mouseout", function(ev){
					
					var element = Event.element(ev);
					
					mouseHover(element,false);
	
				});			
				
	  		});
	});
	
	var fixCurrent = function(tab) {
		
		if (tab.hasClassName(CSS_ACTIVE) || tab.hasClassName(CSS_LEFTACTIVE)) {
			
			var next = tab.nextSiblings();
			var diff = mAllTabsLength - next.length;

			if (next.length > 1) {
				next[0].addClassName(CSS_BORDERREMOVE);
			} else if (next.length > 0){
				down = next[0].down(0);
				down.addClassName(CSS_BLUELINE);					
			}

		}
		
	}
	

	var mouseHover = function(elem, isMouseOver) {
		
		if (!elem.hasClassName(CSS_ACTIVE) && !elem.hasClassName(CSS_LEFTACTIVE)) {

			var next = elem.nextSiblings();
			var tempElem =  next[0];
			var tempClass = CSS_BORDERREMOVE;
			var add = CSS_HOVER;
			var remove = CSS_NORMAL; 
			if(!isMouseOver) {

				add = CSS_NORMAL;
				remove = CSS_HOVER;
			}	
			//If there are tabs		
 			if (next.length > 0) {
 				
	  			//First Element change the class
				if (next.length == (mAllTabsLength-1)) {
	
					add = CSS_LEFTNORMAL; 
					remove = CSS_LEFTHOVER; 
					if (isMouseOver) {
						remove = CSS_LEFTNORMAL;
						add = CSS_LEFTHOVER;
						
					}
					
				//If its the last element		
				} else if (next.length == 1) {				
					tempElem = next[0].down(0);
					tempClass = CSS_BLUELINE; 	
				}  
					
				elem.removeClassName(remove);
				elem.addClassName(add);
					
				if (isMouseOver)
					tempElem.addClassName(tempClass);
				else
					tempElem.removeClassName(tempClass);	
														
	 		}			
		}   			 		
  			
	} 
		

