// JavaScript Document
var esquerda = 0;
var correr = 0;
var voltar = 0;
var largura = 0;
var limite_imagens = 0;
function Dimensiona_galeria(){
	var total_imagens = $("#miniaturas > img");
	limite_imagens = 0;
	correr = 0;
	voltar = 0;
	largura = 0;
	esquerda = 0;
	$('#miniaturas').css('width', total_imagens.length * 55);
	correr = 0;
	voltar = 0;
	largura = $("#miniaturas").css("width");
	limite_imagens = $("#lista_de_imagens").css("width");
	limite_imagens = parseInt(limite_imagens.substr(0, limite_imagens.length - 2));
	largura = parseInt(largura.substr(0, largura.length - 2));
	//alert("largura: " + largura + ", limite_imagens: "+limite_imagens);
	if (largura <= limite_imagens){
		$('#seta_left').hide();
		$('#seta_right').hide();
	}
	else{
		$('#seta_left').show();
		$('#seta_right').show();
	}
	
	$(".lista_de_imagens img").css({
								   opacity: ".5",
								   filter: "alpha(opacity=50)"
								   }).mouseover(function(){
		$(this).animate({opacity: '1'}, 'fast');
	}).mouseout(function(){
		$(this).animate({opacity: '.5'}, 'fast');
	}).click(function(){
		$('#imagem_focada').animate({
		opacity: '0',
		src: 'imagem.php?i=img/produtos/pro_'+$(this).attr('ref')+'.jpg&x=200&h=150'
		}, 'fast').attr().animate({
		opacity: '1'
		}, 'fast');
	});
}
$(document).ready(function(){
    Dimensiona_galeria();
	function Correr_imagens(){
		if (correr == 1){
			var valor = largura + esquerda;
			if (valor >= limite_imagens){
				esquerda = esquerda-5;
				$("#miniaturas").css("left", esquerda + "px");
				setTimeout(function(){Correr_imagens()}, 50);
			}
		}
	}
	function Voltar_imagens(){
		if (voltar == 1){
			if (esquerda < 0){
				esquerda = esquerda +5;
				$("#miniaturas").css("left", esquerda + "px");
				setTimeout(function(){Voltar_imagens()}, 50);
			}
		}
	}
	$("#seta_right").css({
						 opacity: ".5",
						 filter: "alpha(opacity=50)"
						 }).mouseover(function(){
		correr = 1;
		Correr_imagens();
		$(this).css({
					opacity: "1",
					filter: "alpha(opacity=100)"
					});
	}).mouseout(function(){
		correr = 0;
		$(this).css({
					opacity: ".5",
					filter: "alpha(opacity=50)"
					});
	});
	$("#seta_left").css({
						opacity: ".5",
						filter: "alpha(opacity=50)"
						}).mouseover(function(){
		voltar = 1;
		Voltar_imagens();
		$(this).css({
					opacity: "1",
					filter: "alpha(opacity=100)"
					});
	}).mouseout(function(){
		voltar = 0;
		$(this).css({
					opacity: ".5",
					filter: "alpha(opacity=50)"
					});
	});
});