$(document).ready(function(){
	
	var cantidad = $(".tira .item").size();
	var pos = 1;
	var i = 0;
	var ancho = $(".tira .item:first").width();
	var habilitar = true;
	
	function Mover(id)
	{
		if(habilitar)
		{
			habilitar = false;
			$(".tira").animate({
								left: (((id-1)*ancho)*(-1))+"px"
							  }, 500, function(){
								$(".estado.activo").removeClass("activo");
								$(".estado[rel=" + id + "]").addClass("activo");
								pos = id;
								if(pos < 1 || pos > cantidad)
								{
									habilitar = true;
									Mover(1);
								}
								else
								{
									habilitar = true;
								}
							  });
		}
	}
	
	$(".tira").width(ancho*cantidad);
	
	$(".tira .item").each(function(){
		
		$("<div />").attr("rel",(i+1)).addClass("estado").appendTo(".estados");
		i++;
		if(i == cantidad)
		{
			//	Termino
			$(".estados .estado:first").addClass("activo");
			$(".estado").click(function(){
				Mover($(this).attr("rel"));
			});
			$(".boton.izquierda").click(function(){
				if(pos == 1)
				{
					Mover(Number(cantidad));
				}
				else
				{
					Mover(Number(pos)-1);
				}
			});
			$(".boton.derecha").click(function(){
				if(pos == cantidad)
				{
					Mover(Number(1));
				}
				else
				{
					Mover(Number(pos)+1);
				}
			});
		}
	});
	
});