var Fader = {
	elArray: null,
	init: function(){
		$$('.fade-trig').addEvent('click', Fader.toggle);
		Fader.elArray = $$('.fade-box').setStyle('opacity', 0);
		$$('.fade-box .close-trig').addEvent('click', Fader.fadeOut	);
	},
	
	toggle: function(e){
		e.stop();
		//first make sure they are all off
		//alert(Fader.elArray.length);
		for(var i = 0; i < Fader.elArray.length;i++){
			
			if(!Fader.elArray[i].hasClass('hide')){
				var fadingEl = Fader.elArray[i];
				var fadeOut = new Fx.Morph(fadingEl,{
					duration: 400,
					onComplete: function(){
						fadingEl.addClass('hide');	
					}
				});
				
				fadeOut.start({
					'opacity' : 0
				});
			
			}
		}
		
		var elToFade = $(this.rel);
		if(elToFade.hasClass('hide')){
			elToFade.removeClass('hide');	
		}
		
		var fadeIn = new Fx.Morph($(this.rel),{
			duration: 500
		});
		
		fadeIn.start({
			'opacity': 1.0
		});
		
	
		
	},
	
	fadeOut: function(e){
		e.stop();
		var elToFade = this.getParent();
		var fadeOut = new Fx.Morph(elToFade,{
					duration: 400,
					onComplete: function(){
						elToFade.addClass('hide');	
					}
				});
				
				fadeOut.start({
					'opacity' : 0
				});
	}

}
	



window.addEvent('domready', Fader.init);