//- Requires prototype.js

categoryButtons = {

	init:function(){
	
		
		hideCategoryPopups();
		addCategoryListeners();
	
	
	
		function hideCategoryPopups(){
			
			var categoryPopups = $$('#mainCol .categoryPopup');
			
				for(var i=0;i < categoryPopups.length;i++){
					categoryPopups[i].style.display = "none";
				}
				
				
			var aRefs =  $('categories').getElementsByTagName('a');
				
				for(var i=0;i < aRefs.length;i++){
					
					$(aRefs[i]).removeClassName('catClicked');
					$(aRefs[i]).addClassName('catNoHover');
			
				}
				

		}
		
		function clickedCloseButton(e){
			
			hideCategoryPopups();
			Event.stop(e);
			
		}
		
		
		function addCategoryListeners(){
			
			var aRefs = $('categories').getElementsByTagName('a');
				
				for(var i=0;i < aRefs.length;i++){
					Event.observe(aRefs[i], 'click', showCategoryPopup);
				}
				
				for(var i=0;i < aRefs.length;i++){
					Event.observe(aRefs[i], 'mouseover', mouseOver);
					Event.observe(aRefs[i], 'mouseout', mouseOut);
				}
						
			
			var closeX = $$('#mainCol .closeX');
				for(var i=0;i < closeX.length;i++){
					Event.observe(closeX[i], 'click', clickedCloseButton);
				};
				
				
				if($('homeCats')){
				
					var homeCatsARefs = $('homeCats').getElementsByTagName('a');
					for(var i=0;i < homeCatsARefs.length;i++){
						Event.observe(homeCatsARefs[i], 'click', showCategoryPopup2);
					}
				
				}
				
				
		}
		
		
		function mouseOver(e){
			Event.element(e).removeClassName('catNoHover');
			Event.element(e).addClassName('catHover');
		}
		
		function mouseOut(e){
			Event.element(e).removeClassName('catHover');
			Event.element(e).addClassName('catNoHover');
		}
		
		
		
		function showCategoryPopup(e){
			
			//this isn't working for some reason
			//alert(Event.element(e).readAttribute('class'));
			
			if(Event.element(e).getAttribute('class') == 'catClicked'){
				
				hideCategoryPopups();
				Event.element(e).removeClassName('catClicked')
				Event.element(e).addClassName('catHover');
				Event.stop(e);
				
			}else{
			
				hideCategoryPopups();
				
				var element = Event.element(e).getAttribute('id');
					
					Event.element(e).addClassName('catClicked');
					
					
					
				var	elementToShow = element.replace('But', 'Pop');
					
					$(elementToShow).style.display = "inline"; // change css to display:inline
					
					Event.stop(e);
	
			}
				
		}
		
		function showCategoryPopup2(e){
			
			hideCategoryPopups();
			
			//var link = element.up('a');
			var element = Event.element(e);
			var link = element.up('a');
			var	linkAtt = link.getAttribute('id');
				
				//show the popup
			var	elementToShow = linkAtt.replace('MainCatBut', 'Pop');
				$(elementToShow).style.display = "inline"; // change css to display:inline
			
				//set the left nav category button to hilite.
			var catButton = linkAtt.replace('MainCatBut', 'But');
				$(catButton).addClassName('catClicked');
				
				Event.stop(e);
	
				
		}


	}// end init
	
}

//Event.observe(window, 'load', categoryButtons.init);
document.observe("dom:loaded", categoryButtons.init); // this stops fouc
