//Inicializando a classe da Galeria de fotos utlizando o prototype.js

var AlbumFotos = new Class({
	options: {
		espaco_fotos: 5,
		tempo_slide_show: 4,
		tipo_hint: 1,
		class_slide_show_play: 'album_slide_show_play',
		class_slide_show_pause: 'album_slide_show_pause',
		class_thumb: 'album_fotos_miniaturas',
		class_thumb_selecionada: 'album_fotos_miniaturas_selecionada'
	},
	
	//Método de inicialização da Classe
	initialize: function(options){		
		//Passando os parâmetros de inicialização da classe
		this.setOptions(options);		
		if(!this.options.url){
			alert('Caminho para o arquivo XML da galeria não especificado!');
			return false;
		}
		this.effects = [];
		
		//Criando o container da galeria que será substituido pela definitiva
		document.write("<div id=\"container_temp_" + this.options.variavel + "\"></div>");
		
		//Buscando o XML da galeria
		this.buscaXML(this.options.url);
	},
	
	//Realiza a requisição para a busca do XML
	buscaXML: function(url, constroi){
		//Buscando os dados da galeria
		new Ajax(url, {
			method: 'post',
			onSuccess: function(text, xml){
				//Processando o XML das configurações da galeria
				var xml_final = xml2array(text);
				this.config_album = {
					titulo: xml_final['album_fotos']['titulo'],
					descricao: xml_final['album_fotos']['descricao'],
					data: xml_final['album_fotos']['data'],
					thumb: xml_final['album_fotos']['thumb'],
					largura_foto: Number(xml_final['album_fotos']['largura_foto']),
					altura_foto: Number(xml_final['album_fotos']['altura_foto']),
					borda: Number(xml_final['album_fotos']['borda']),
					largura_thumb: Number(xml_final['album_fotos']['largura_thumb']),
					altura_thumb: Number(xml_final['album_fotos']['altura_thumb'])
				}
				
				//Processando o XML das fotos
				this.fotos_album = new Object();
				this.total_fotos = Number(xml_final['album_fotos']['_ELEMENTS']['total_fotos']['_DATA']);				
				for(var i=1; i<=this.total_fotos; i++){
					var temp_obj = {
						id: xml_final['album_fotos']['_ELEMENTS']['foto_' + i]['id'],
						titulo: xml_final['album_fotos']['_ELEMENTS']['foto_' + i]['titulo'],
						descricao: xml_final['album_fotos']['_ELEMENTS']['foto_' + i]['descricao'],
						thumb: xml_final['album_fotos']['_ELEMENTS']['foto_' + i]['thumb'],
						foto: xml_final['album_fotos']['_ELEMENTS']['foto_' + i]['foto']
					}					
					eval('this.fotos_album.foto' + i + ' = temp_obj;');
				}
				
				//Processando o XML da lista de galerias caso exista
				if(xml_final['album_fotos']['_ELEMENTS']['lista']){
					this.script_album = xml_final['album_fotos']['_ELEMENTS']['lista']['script'];
					this.albuns = new Object();
					var total_albuns = xml_final['album_fotos']['_ELEMENTS']['lista']['_ELEMENTS']['total']['_DATA'];
					for(var i=1; i<=total_albuns; i++){
						var temp_obj = {
							id: xml_final['album_fotos']['_ELEMENTS']['lista']['_ELEMENTS']['album_' + i]['id'],
							titulo: xml_final['album_fotos']['_ELEMENTS']['lista']['_ELEMENTS']['album_' + i]['titulo'],
							descricao: xml_final['album_fotos']['_ELEMENTS']['lista']['_ELEMENTS']['album_' + i]['descricao'],
							thumb: xml_final['album_fotos']['_ELEMENTS']['lista']['_ELEMENTS']['album_' + i]['thumb']
						}
						eval('this.albuns.album' + i + ' = temp_obj;');
					}
				}				
				show_hide_processando();
				
				//Iniciando a construção do album de fotos
				this.init_album(constroi);
			}.bind(this),
			
			onFailure:  function(){
				alert('Não foi possível obter informações do Album de fotos. Por favor contacte a 3PIXEL!');
				return false;
			}
		}).request();
	},
	
	//Realiza a construção do Album de fotos
	init_album: function(alteracao){
		//Verificando se é uma construção ou alteração de album
		if(!alteracao){
			//Criando o container do Album de Fotos
			var container_album = document.createElement('div');
			container_album.id = 'container_album_fotos' + this.config_album.id;
			container_album.className = 'album_fotos';
			$("container_temp_" + this.options.variavel).replaceWith(container_album);
			
			this.largura_container = this.config_album.largura_foto + (this.config_album.borda * 2);
			
			//HTML da Galeria de fotos
			var html_album = '<div id="container" align="center">';
				html_album += '	<div id="album_moldura" style="width: ' + this.largura_container + 'px">';
				
				html_album += '		<div id="album_fotos_barra_ferramentas" style="width: 100%">';
				
				//Verificando se é necessário criar o combo com os demais albuns de fotos
				if(this.albuns){
					html_album += '			<select id="album_fotos_lista" name="lista_galerias" onChange="' + this.options.variavel + '.selecionaAlbum(this.value)">';
					var cont = 1;
					var album = eval('this.albuns.album' + cont);
					while(album){
						if(album.selecionado){
							var mark = ' selected';
						}
						else{
							var mark = '';
						}
						html_album += '			<option value="' + album.id + '"' + mark + '>' + album.titulo + '</option>';
						cont++;
						album = eval('this.albuns.album' + cont);
					}
					html_album += '			</select>';
				}
				
				//Apresenta o total de fotos de fotos
				html_album += '			<div id="album_total_fotos" align="right"></div>';
				
				html_album += '		</div>';
				
				html_album += '		<div id="album_fotos_foto" style="min-height: ' + this.config_album.altura_foto + 'px; _height: ' + this.config_album.altura_foto + 'px; padding-bottom: ' + this.config_album.borda + 'px; width: ' + this.largura_container + 'px; padding-top: ' + this.config_album.borda + 'px;" align="center">';
				
				//Verificando se o tipo_hint é igual a 1
				if(this.options.tipo_hint == 1){
					html_album += '			<div id="album_fotos_descricao" class="album_fotos_descricao_icone" title="-" style="top: ' + (this.config_album.borda + 2) + 'px; left: ' + (this.config_album.borda + 2) + 'px"></div>';
				}
				
				html_album += '			<img id="album_fotos_img" width="' + this.config_album.largura_foto + '" height="' + this.config_album.altura_foto + '"/>';						
				html_album += '		</div>';
				
				//Verificando se o tipo_hint é igual a 2
				if(this.options.tipo_hint == 2){
					html_album += '			<div id="album_fotos_descricao_fixa" align="left" class="album_fotos_descricao_fixa" style="float: left"></div>';
				}
				
				html_album += '		<div id="album_fotos_controles" style="position: relative">';			
				html_album += '			<div id="album_seta_voltar" title="Foto anterior" onClick="' + this.options.variavel + '.navegacaoFotos(2)" style="display: none"></div>';			
				html_album += '			<div id="album_play_pause" title="Iniciar slide show" style="position: absolute; left: ' + (this.largura_container-35) /2 + 'px" onClick="' + this.options.variavel + '.slideShow()" class="album_slide_show_play"></div>';
				html_album += '			<div id="album_seta_avancar" title="Próxima foto" onClick="' + this.options.variavel + '.navegacaoFotos(1)"></div>';
				html_album += '		</div>';
				
				html_album += '		<div id="album_fotos_miniaturas"></div>';
				
				var fotos_por_pagina = Math.floor(this.largura_container / (this.config_album.largura_thumb + this.options.espaco_fotos));
				this.fotos_por_pagina = fotos_por_pagina;
				
				//Divs do scroller
				html_album += '		<div id="album_fotos_scroller" style="width: ' + this.largura_container + 'px">';
				html_album += '			<div id="album_fotos_scroll">';			
				html_album += '			</div>';
				html_album += '		</div>';
				
				html_album += '	</div>';
				html_album += '</div>';
	
			$(container_album.id).setHTML(html_album);
			
			//Armazenando o efeito de transição da foto
			this.foto = $('container_album_fotos' + this.config_album.id).getElementById('album_fotos_img');
			this.moldura_foto = $('container_album_fotos' + this.config_album.id).getElementById('album_fotos_foto');			
			this.effects['efeito_foto'] = new Fx.Style(this.foto, 'opacity');
			this.effects['efeito_moldura_foto'] = new Fx.Style(this.moldura_foto, 'height');
		}		
		
		//Construindo miniaturas
		this.constroiMiniaturas();
		
		//Se o número de fotos existentes for igual ao número por página não exibir o slider
		var scroler = $('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_scroller]');
		
		if(this.total_fotos > this.fotos_por_pagina){
			scroler.setStyle('display', 'block');
			var largura_container = this.largura_container;
			var miniaturas_container = $('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_miniaturas_container]');
			var tamanho_total = this.tamanho_total;
			//Função de inicialização do slider
			this.mySlide = new Slider($('album_fotos_scroller'), $('album_fotos_scroll'), {
				steps: 100,
				onComplete: function(step){					
					var myEffect = miniaturas_container.effect('margin-left', {duration: 500, transition: Fx.Transitions.linear});
					var end = ((step * (tamanho_total - largura_container))/100) * (-1);
					myEffect.start(end);
					this.percent = Number(step);
				}
			}).set(0);
		}
		//Do contrário, ocultando o scroller
		else{
			scroler.setStyle('display', 'none');
		}		
		
		//Verificando se o tipo_hint é igual a 1
		if(this.options.tipo_hint == 1){
			this.aplicaHint();
		}
		
		//Selecionando a primeira foto
		this.selecionaFoto(1);
	},
	
	//Construção das miniaturas
	constroiMiniaturas: function(){
		//Verificando se o total de fotos é inferior ao total por página
		
		if(this.fotos_por_pagina < this.total_fotos){
			var espaco_restante = this.largura_container - (this.fotos_por_pagina * (this.config_album.largura_thumb + this.options.espaco_fotos));
			this.options.espaco_fotos = Math.round((espaco_restante / this.fotos_por_pagina) + this.options.espaco_fotos);
		}else{
			var espaco_restante = this.largura_container - (this.total_fotos * (this.config_album.largura_thumb + this.options.espaco_fotos));
			this.options.espaco_fotos = Math.round((espaco_restante / this.total_fotos) + this.options.espaco_fotos);
		}				
		this.tamanho_total = ((this.total_fotos * this.config_album.largura_thumb) + ((this.total_fotos-1) * this.options.espaco_fotos)) + 11;
		var total_paginas = Math.floor(this.total_fotos / this.fotos_por_pagina);

		var html_miniaturas = '			<div id="album_fotos_miniaturas_container" style="width: ' + (this.tamanho_total + 50) + 'px; padding-left: 1px">';
		
		//Exibindo as miniaturas das fotosz'
		for(var i=1; i<=this.total_fotos; i++){
			var fotos = eval('this.fotos_album.foto' + i);
			if(i<this.total_fotos){
				var margin = '; margin-right: ' + this.options.espaco_fotos + 'px';
			}else{
				var margin = '';
			}

			html_miniaturas += '				<div id="foto_' + i + '" class="album_fotos_miniaturas" style="float: left; width: ' + this.config_album.largura_thumb + 'px; position: relative;' + margin + '" titulo="' + fotos.titulo + '" descricao="' + fotos.descricao + '" imagem="' + fotos.foto + '" onClick="' + this.options.variavel + '.selecionaFoto(' + i + ')">';
			html_miniaturas += '					<div id="marcador" style="position: absolute" align="center"></div>';
			html_miniaturas += '					<img id="miniatura" src="' + fotos.thumb + '" title="' + fotos.titulo + '"/>';
			html_miniaturas += '					<div id="album_fotos_titulo_foto" align="center">' + fotos.titulo + '</div>';
			html_miniaturas += '				</div>';
		}
		html_miniaturas += '			</div>';
		
		$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_miniaturas]').setHTML(html_miniaturas);
	},
	
	//Função para seleção de um novo album
	selecionaAlbum: function(valor){
		this.destroiGaleria();
		this.foto.setAttribute('src', '');
		this.buscaXML(this.script_album + valor, true);
		show_hide_processando('Buscando Album de fotos');
	},
	
	//Função que seleciona a imagem
	selecionaFoto: function(numero){
		if(this.foto_atual == numero){
			return;
		}
		//Executa fadeout para carregar
		this.effects['efeito_foto'].start(0).chain(
			function(){
				var sel_foto = $('container_album_fotos' + this.config_album.id).getElement('div[id=foto_' + numero + ']');
				var div_desc = $('container_album_fotos' + this.config_album.id).getElement('div[album_fotos_descricao]');
				
				var sel_foto_src = sel_foto.getProperty('imagem');
				var sel_foto_descricao = '<strong>' + sel_foto.getProperty('titulo') + '</strong><br>' + sel_foto.getAttribute('descricao');				
				
				//Apresentando o carregando
				$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_foto]').className = 'album_fotos_carregando';

				//Atualizando o HINT
				this.apresenta_descricao(sel_foto_descricao);
				
				//Marca a foto selecionada e move o scroll se necessário
				this.marcaFoto(numero);
				
				this.foto_atual = numero;				
				
				$('container_album_fotos' + this.config_album.id).getElement('div[id=album_total_fotos]').setHTML(numero + '/' + this.total_fotos);
				
				//Controlando navegação
				this.verificaFoto();
				
				//Aguarda o carregamento da foto para fazer o fadein
				var my_imagem = new Asset.image(sel_foto_src, {onload:
					function(){
						//Obtendo as dimensões da foto para verificar a necessidade de redmensionamento
						var img_height = my_imagem.height;
						this.foto.height = img_height;						
						
						this.effects['efeito_moldura_foto'].start(img_height).chain(
							function(){
								//Alterando o SRC da imagem
								this.foto.setAttribute('src', my_imagem.src);								
								
								this.effects['efeito_foto'].start(1);
								if(this.parou_slide_show){
									this.slideShow(true);
									this.parou_slide_show=null;
								}
								//Retirando o loading
								$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_foto]').className = '';
								//Limpando a cadeia de eventos para a próxima transição
								this.effects['efeito_moldura_foto'].start(img_height).clearChain();
							}.bind(this)
						)						
					}.bind(this)
				});
			}.bind(this)
		);
	},
	
	//Navegação de fotos (avançar e voltar)
	navegacaoFotos: function(modo){
		//Verifica se deve ser reiniciado o slide show após terminar de carregar a foto
		if(this.statusSlideShow){
			this.stopSlideShow();
			this.parou_slide_show = true;
		}
		
		if(modo==1){
			if(this.total_fotos > this.foto_atual){
				this.selecionaFoto(this.foto_atual + 1);				
			}
			//Voltando para a primeira foto (apenas via slideshow)
			else{
				this.selecionaFoto(1);
			}
		}
		else{
			if(this.foto_atual > 1){
				this.selecionaFoto(this.foto_atual - 1);				
			}	
		}
	},
	
	//Verifica em qual foto o Album se encontra para ocultar / exibir as setas
	verificaFoto: function(){
		//Seta proxima
		var seta_avancar = $('container_album_fotos' + this.config_album.id).getElementById('album_seta_avancar');
		var seta_voltar = $('container_album_fotos' + this.config_album.id).getElementById('album_seta_voltar');
		if(this.foto_atual == this.total_fotos){			
			seta_avancar.style.display = 'none';
			seta_voltar.style.display = 'block';
		}
		else if(this.foto_atual == 1){
			seta_avancar.style.display = 'block';
			seta_voltar.style.display = 'none';
		}
		else{
			seta_avancar.style.display = 'block';
			seta_voltar.style.display = 'block';
		}
	},
	
	//Marca o thumbnail selecionado
	marcaFoto: function(numero){
		//Desmarcando foto anterior
		if(this.foto_atual){
			var thumb = $('container_album_fotos' + this.config_album.id).getElement('div[id=foto_' + this.foto_atual + ']');
			thumb.className = this.options.class_thumb;
		}
		var thumb = $('container_album_fotos' + this.config_album.id).getElement('div[id=foto_' + numero + ']');
		thumb.className = this.options.class_thumb_selecionada;
		
		//movendo o scroll se necessário
		if(this.mySlide){
			var pos_left = (((numero-1) * this.config_album.largura_thumb) + ((numero-1) * this.options.espaco_fotos));			
			var pos_img = pos_left + this.config_album.largura_thumb + (this.options.espaco_fotos / 2);
			var tamanho_total = ((this.total_fotos * this.config_album.largura_thumb) + ((this.total_fotos-1) * this.options.espaco_fotos)) + 11;
			var area_visivel =  this.largura_container;
			var scrol = Math.abs($('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_miniaturas_container]').getStyle('margin-left').toInt());
		
			//Verificando se a imagem está fora da tela
			if((pos_img - scrol) > area_visivel){
				var percent = Math.ceil(((pos_img - (area_visivel + scrol)) * 100) / (tamanho_total - area_visivel));
				percent += this.mySlide.percent;
				this.mySlide.set(percent);
			}
			else if((pos_left - scrol) < 0){
				var percent = Math.ceil(((scrol - pos_left) * 100) / (tamanho_total - area_visivel));
				percent = this.mySlide.percent - percent;
				this.mySlide.set(percent);
			}
		}
	},
	
	apresenta_descricao: function(descricao){
		if(descricao && descricao != ''){
			//Identificando o tipo de descrição existente
			if(this.options.tipo_hint == 1){
				$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_descricao]').setStyle('display', 'block');
				this.myTips.toolTip.setHTML('<div class="album_fotos_hint-text"><span>' + descricao + '</span></div>');
			}
			else if(this.options.tipo_hint == 2){
				$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_descricao_fixa]').setHTML(descricao);
			}
		}
		else{
			//Identificando o tipo de descrição existente
			if(this.options.tipo_hint == 1){
				$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_descricao]').setStyle('display', 'none');
				this.myTips.toolTip.setHTML('<div class="album_fotos_hint-text"><span></span></div>');
			}
			else if(this.options.tipo_hint == 2){
				$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_descricao_fixa]').setHTML('');
			}
		}
	},
	
	//Aplica o hint para exibição da descrição da foto (modo suspenso)
	aplicaHint: function(){
		this.myTips = new Tips($('album_fotos_descricao'), {
			maxTitleChars: 50,
			className: 'album_fotos_hint',
			initialize:function(){
				this.fx = new Fx.Style(this.toolTip, 'opacity', {duration: 200, wait: false}).set(0);
			},
			onShow: function(toolTip) {
				this.fx.start(1);
			},
			onHide: function(toolTip) {
				this.fx.start(0);
			}
		});
	},
	
	//Controle do Slide show
	slideShow: function(modo){
		if((!this.statusSlideShow && modo==undefined) || modo==true){
			this.statusSlideShow = this.navegacaoFotos.periodical((this.options.tempo_slide_show * 1000), this, 1);
			var seta = $('container_album_fotos' + this.config_album.id).getElementById('album_play_pause');
			seta.className = this.options.class_slide_show_pause;
		}else{
			this.stopSlideShow();
			var seta = $('container_album_fotos' + this.config_album.id).getElementById('album_play_pause');
			seta.className = this.options.class_slide_show_play;
		}
	},
	
	stopSlideShow: function(){
		$clear(this.statusSlideShow);
		this.statusSlideShow = null;
	},
	
	//Função auxiliar para eliminar todas as informações da galeria atual
	destroiGaleria: function(){
		this.slideShow(false);
		this.foto_atual = undefined;
		$('container_album_fotos' + this.config_album.id).getElement('div[id=album_fotos_miniaturas]').setHTML('');
	}
});
AlbumFotos.implement(new Options, new Events);