/*
	Juan: Bueno, el tema es así, traté de hacertelo lo mas facil posible.
	Estas dos funciones, moverDerecha y moverIzquierda, hacen la magia basándose en el array y la variable "actual".
	Ésta variable "actual" tiene el nombre del ID del div que se muestra por default cuando se carga la pantalla,
	si ves el archivo index.html vas a ver que está definido así:
		<div id="div_uno" class="pa">
			{contenido}
		</div>
	y el resto de los otros divs así:
		<div id="div_dos" class="pa" style="display:none;">	
			{contenido}
		</div>
	o sea, igual pero ocultos.
	Si vas a agregar mas divs para la transicion, asegurate que los agregás ocultos y tambien que agregás los IDs al array.
	Otra cosa, como yo copypastié el div_uno y tenia referenciado todos los 'swapImage' con IDs ,tenés que cambiar los IDs de
	los divs nuevos, porque el browser solo busca un ID por objeto HTML. Si querés te lo explico por telefono, sino tengo 
	que escribir mucho.
	Listo, eso es todo.
*/


var divs_array = ["div_uno","div_dos","div_tres"];
var actual = "div_uno";


function moverDerecha(){
	/* recorro el array con los ids de los divs, cuando encuentro el actual me fijo si es el caso base del movimiento y 
	   actuo en consecuencia */
	for (var i=0; i<divs_array.length; i++){
		if (divs_array[i] == actual){
			if(i+1 == divs_array.length){ //el caso base de ir a la derecha es que esté en el último...
				var animDiv = $("#"+divs_array[0]);
				$("#"+actual).fadeOut("slow");
				animDiv.css("top","0px");
				animDiv.css("left","1665px");
				animDiv.css("display","");
				animDiv.animate({'left': '0px'},{queue: false, duration:'toggle'});				
			}else{				
				$("#"+actual).fadeOut("slow");
				var animDiv = $("#"+divs_array[i+1]);
				animDiv.css("top","0px");
				animDiv.css("left","1665px");
				animDiv.css("display","");
				animDiv.animate({'left': '0px'},{queue: false, duration:'toggle'});
			}
			actual = animDiv.attr("id");
			$("#buchon").html(actual);
			break;
		}		
	}	
}


function moverIzquierda(){
	/* recorro el array con los ids de los divs, cuando encuentro el actual me fijo si es el caso base del movimiento y 
	   actuo en consecuencia */
	for (var i=0; i<divs_array.length; i++){
		if (divs_array[i] == actual){
			if(i==0){ //el caso base de ir a la izquierda es que esté en el primero...	
				var animDiv = $("#"+divs_array[divs_array.length-1]);			
				$("#"+actual).fadeOut("slow");
				animDiv.css("top","0px");
				animDiv.css("left","-1665px");
				animDiv.css("display","");
				animDiv.animate({'left': '0px'},{queue: false, duration:'toggle'});
			}else{
				$("#"+actual).fadeOut("slow");
				var animDiv = $("#"+divs_array[i-1]);
				animDiv.css("top","0px");
				animDiv.css("left","-1665px");
				animDiv.css("display","");
				animDiv.animate({'left': '0px'},{queue: false, duration:'toggle'});
			}
			actual = animDiv.attr("id");
			$("#buchon").html(actual);
			break;
		}		
	}
}