$(function(){
	
	var install_gallery = function (context) {
		var gal = $(context);
		var thumb_bar = $('ul', gal);
		var thumbs = $('li', thumb_bar);
		var img_caption = $('.img_caption', gal);
		
		// Verifica se existem thumbs
		if (thumbs.length == 0) {
			return;
		}
		
		// Atalhos para a área de preview, imagem ampliada e seu link
		var pic_preview = $('.img_preview');
		var pic_link = $('a', pic_preview);
		// retirado remoção de largura devido a problemas de imagens q não redimensionam removeAttr('width').
		var pic = $('img', pic_preview).removeAttr('height').load(function(){
			$(this).fadeIn('fast');
		});
		
		// Cria a janela de zoom para visualizar as imagens ampliadas
		var pic_wnd = $.modal.template('Visualizar imagem', 'gallery_zoom');
		pic_wnd.append( $('<img />') );
		
		// Ao clicar no link da imagem ampliada, abre a janela de zoom
		pic_link.click(function(e){
			
			e.preventDefault();
			
			var link = $(this);
			var url = link.attr('href');
			
			$('img', pic_wnd).attr('src', url).attr('title', link.find('img').attr('title'));
			
			pic_wnd.modal();
			
		});

		var pic_img = $('img', pic_wnd);
		pic_img.load(function(){
			pic_wnd.css('width', pic_img.attr('width'));
		});
		
		// Elemento atual
		var curr = 0;
		// Limite
		var end = thumbs.length - 1;
		
		// Ativa o primeiro elemento por padrão
		thumbs.eq(0).addClass('on');
		
		// Seleciona um elemento por índice
		var go = function (pos) {
			
			if ((pos < 0) || (pos > end)) {
				return;
			}
			
			// Pega o elemento a selecionar
			var elem = thumbs.eq(pos).addClass('on');
			// Desativa o elemento anterior
			thumbs.eq(curr).removeClass('on');
			// Define o novo elemento ativo
			curr = pos;
			
			// Carrega a imagem com base no link do elemento selecionado 
			// e copia o title e o alt do link para a imagem
			var a = $('a', elem);
			pic.hide().attr('src', a.attr('href')).attr('alt', a.attr('alt') || '').attr('title', a.attr('title') || '');
			img_caption.text(a.attr('alt') || '-');
			pic_link.attr('href', a.attr('original'));
			
			// Calcula a diferença para alinhar ao centro
			var off = Math.round((thumb_bar.width() - elem.width()) / 2)
			
			// Cancela animações na barra de thumbs 
			thumb_bar.stop();
			// Rola a barra horizontalmente com uma duração de 0.5ms
			thumb_bar.scrollTo(elem, {axis:'x', duration: 500, offset: -off});
			
			// Reativa setas de rolagem
			var links = $('a.bt_left, a.bt_right', gal).removeClass('disabled');
			
			// Desativa setas se estiver nos limites
			if (pos == 0) {
				links.eq(0).addClass('disabled');
			}
			else if (pos == end) {
				links.eq(1).addClass('disabled');
			}
			
		};
		
		// Atalho para criar links
		var link = function (text, classes) {
			return $('<a />').attr('href', '#').text(text).addClass(classes);
		};
		
		// Cria as setas de rolagem
		thumb_bar.before(link('<', 'bt_left disabled').click(function(){
			go(curr - 1);
			return false;
		}));
		thumb_bar.after(link('>', 'bt_right').click(function(){
			go(curr + 1);
			return false;
		}));
		
		// Associa a seleção de item nos thumbs
		$('a', thumbs).each(function(i){
			$(this).click(function(){
				go(i);
				return false;
			});
		});
		
	};
	
	// Instalar a galeria (eg.: página de detalhe)
	install_gallery('.img_gallery');
	
	// Janela ajax para galeria de imagens dinâmica
	$('#result_list a.galeria, a.media_center').click(function(){
		var self = $(this);
		$.modal.ajaxWindow(self.attr('href'), ['Galeria de imagens', 'product_gallery_window'], function(){
			install_gallery(this);
		});
		return false;
	});
	
});