/*
 * Transition Tabs
 * Este script crea un efecto de transicion (como un slide de imagenes) 
 * entre diferentes DIVs controlados por un menu en forma de TABs, 
 * no tiene soporte de ajax (aun... :-P)
 * Creado por Adan L�pez lopezajuan@yahoo.com.mx
 * Ultima Actualizacion: 21/Feb/2010
 */
var inTransition = false;
var useParameters = {};
var delay;
var effect;

TransitionTabs = function(parameters) {
	if(typeof(parameters) == 'undefined') var parameters = {};
		delay	= 	parameters.delay 	||	1;
		effect	= 	parameters.effect	||	'none';
		$$('ul.transitiontabs').each(function(menuList){
			$A(menuList.getElementsByTagName("li")).each(function(tabNode){
				Element.extend(tabNode).setStyle({'cursor':'pointer'});
				Element.extend(tabNode).onclick = function(){ changeTab(tabNode); } 
				hideContainer(tabNode);
			});
		});
}	

hideContainer = function(tabNode){
       var containerID = Element.extend(tabNode).readAttribute('value');
       if($(containerID) != null)
               if(Element.extend(tabNode).hasClassName('tab-selected')){
                       $(containerID).setStyle({'display':'block'});
               }else{
                       $(containerID).setStyle({'display':'none'});
               }
}

doTransition = function(activeTabValueID, clickedTabValueID){
	inTransition = true;
	$(activeTabValueID).setStyle({zIndex:'2'});
	$(clickedTabValueID).setStyle({zIndex:'1'});	
	switch(effect){
		case 'slide'	:	{
					new Effect.SlideUp(activeTabValueID, { duration: delay});
					new Effect.SlideDown(clickedTabValueID, { duration: delay, afterFinish: function(){ inTransition = false;} });
				}break;
		case 'fade' :	{
					new Effect.Appear(clickedTabValueID, { duration: delay});
					new Effect.Fade(activeTabValueID, { duration: delay, afterFinish: function(){ inTransition = false; }});
				}break;
		default :	{
					$(clickedTabValueID).show();
					$(activeTabValueID).hide();
					inTransition = false;
				}break;
		
	}
}

changeTab = function(tabNode){
	var clickedTabValueID = Element.extend(tabNode).readAttribute('value');
	var activeTabValueID = getCurrentActiveTabID(tabNode);
	if(!inTransition && activeTabValueID != null){
		setCurrentActiveTabID(tabNode);
		doTransition(activeTabValueID, clickedTabValueID);
	}
}

getCurrentActiveTabID = function(tabNode){
	var activeTabValueID = null;
	Element.extend(tabNode).siblings().each(function(elementNode){
		if(Element.extend(elementNode).hasClassName('tab-selected'))
			activeTabValueID = Element.extend(elementNode).readAttribute('value');
	});
	return activeTabValueID;
}

setCurrentActiveTabID = function(tabNode){
	Element.extend(tabNode).siblings().each(function(elementNode){
		if(Element.extend(elementNode).hasClassName('tab-selected'))
			Element.extend(elementNode).removeClassName('tab-selected');
		Element.extend(tabNode).addClassName('tab-selected');
	});
}

