/* Curso iMasters - Criando Web Sites com Ajax - 2006 */
/* Autor: Leandro Vieira Pinho [ leandroimasters@plugsites.net ] */

// Esta função instancia o objeto XMLHttpRequest
function openAjax() {
	var ajax;
	try {
		ajax = new XMLHttpRequest();
	} catch(ee) {
		try {
			ajax = new ActiveXObject("Msxml2.XMLHTTP");
		} catch(e) {
			try {
				ajax = new ActiveXObject("Microsoft.XMLHTTP");
			} catch(E) {
				ajax = false;
			}
		}
	}
	return ajax;
}

// Chama a função loadFunctions ao carregar a página
window.onload = loadFunctions;

// Função que chama outras funções
function loadFunctions() {
	focusNome();
	ativarBtnEnviarBtnComentar();
}

// Utilizado para evitar de digitar: document.getElementById toda hora, tornando o processo mais prático
function gE(ID) {
	return document.getElementById(ID);
}

// Utilizado para evitar de digitar: document.getElementsByTagName toda hora, tornando o processo mais prático
function gEs(tag) {
	return document.getElementsByTagName(tag);
}


// Utilizado para criar o fundo sobre a página (wiewport), body.
function exibirBgBody() {
	// Seleciona a tag body. item(0) por que só existe uma tag body
	var tagBody = gEs('body').item(0);
	// Pega os tamanhos atuais da página, como largura, altura, ...
	var sizesPage = getPageSize();
	// Vamos criar uma tag div
	var bgBody = document.createElement('div');
	// Setar o atributo ID a div criada
	bgBody.setAttribute('id','bgBody');
	// Essa div terá o tamanho exato da página
	bgBody.style.height = arrayPageSize[1] + 'px';
	// Essa div terá a largura exata da página
	bgBody.style.width = arrayPageSize[0] + 'px';
	// Evita criar a div novamente
	if (!gE('bgBody')) {
		tagBody.insertBefore(bgBody, tagBody.firstChild);
	}	
}

// Cria a div denominada como boxCad, a qual conterá o formulário de cadastro
function boxCad() {
	// Cria um 'container' que comportará o formulário de cadastro.
	var objBody = gEs('body').item(0);
	var sizesPage = getPageSize();
	var boxCad = document.createElement('div');
	boxCad.setAttribute('id','boxCad');
	var wPage = arrayPageSize[0]; // Largura total da página
	var hPage = arrayPageSize[1]; // tamanho total da página
	/*boxCad.style.width = (wPage / 2) + 'px'; // metade da largura da página*/
	boxCad.style.height = (wPage / 2) + 'px'; // metada da altura da página
	boxCad.style.marginTop = -(wPage / 4) + 'px'; // 1 quarto da largura
	//boxCad.style.marginLeft = -(wPage / 4) + 'px'; // 1 quarto da altura
	objBody.insertBefore(boxCad, objBody.lastChild);
}

// Utilizado para criar o efeito de loading
function loading(opt) {
	if (opt == true) {
		// A tag que receberá a img de loading
		var refer = gE('bgBody');
		// O tamanho da referida tag
		var referHeight = refer.offsetHeight;
		// Dizemos que os elementos dentro dela será alinhado ao centro
		refer.style.textAlign = 'center';
		// Criamos uma imagem, img.
		var img = document.createElement('img');
		// Informamos o caminho da img
		img.setAttribute('src','img/imgLoading.gif');
		// Setamos um atributo ID na img criada
		img.setAttribute('id','loading');
		// Definimos seu tamanho
		img.setAttribute('width','126');
		// Dizemos que o margin-top será a metada do tamanho da div
		img.style.marginTop = (referHeight /2) + 'px';
		// Evita que seja criada duas ou mais img de loading
		if (!document.getElementById('loading')) {
			// Insere a img na tag informada na variável refer
			refer.insertBefore(img, refer.firstChild);
		}
	} else if (opt == false) {
		// Referenciamos a img de login através de seu ID
		var imgLoading = gE('loading');
		// Removemos a img de loading
		if (imgLoading) {
			imgLoading.parentNode.removeChild(imgLoading);
		}
	}
}


function tabs(id_categoria,opcao){

	var ajax = openAjax();
	ajax.open('GET', 'tabs.php?id_categoria=' + id_categoria+'&opcao='+ opcao, true);
	ajax.onreadystatechange = function() {
		var id = gE('tabs');	
		if (ajax.readyState == 1) {
			
			id.innerHTML = '<center><img src="img/5.gif" style="margin-top:108px;"></center>';
			
			
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {								
				/*$("#tabs").animate({opacity: 0.0},'slow',function(){
				$("#tabs").animate({opacity: 1.0},'slow')													   
													   
				});
				$("#tabs").slideUp('slow',function(){
				$("#tabs").slideDown('slow')													   
													   
				});*/
				id.innerHTML = ajax.responseText;				
				
				
			} 
		}
	}
	ajax.send(null);
	
}

function artBox(id_categoria,p){

	var ajax = openAjax();
	ajax.open('GET', 'artBox.php?id_categoria=' + id_categoria +'&p='+ p, true);
	ajax.onreadystatechange = function() {
		var artBox = gE('artBox');	
		if (ajax.readyState == 1) {
			
			gE('theLoading').innerHTML = '<img src="img/5.gif">';
			gE('theLoading').style.display = 'block';	
			
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				
				/*$("#artBox").hide('slow',function(){
				$("#artBox").show('slow')													   
													   
				})*/

				
				artBox.innerHTML = ajax.responseText;				
				
				
			} 
		}
	}
	ajax.send(null);
	
}

function imgBox(){

	var ajax = openAjax();
	ajax.open('GET', 'imgBox.php', true);
	ajax.onreadystatechange = function() {
		var mediaBox = gE('mediaBox');	
		if (ajax.readyState == 1) {
			
			mediaBox.innerHTML = '<img src="img/5.gif" style="margin-top:80px;">';
			mediaBox.style.display = 'block';	
			
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				
				/*$("#artBox").hide('slow',function(){
				$("#artBox").show('slow')													   
													   
				})*/

				
				mediaBox.innerHTML = ajax.responseText;				
				
				
			} 
		}
	}
	ajax.send(null);
	
}

function videoBox(){

	var ajax = openAjax();
	ajax.open('GET', 'videoBox.php', true);
	ajax.onreadystatechange = function() {
		var mediaBox = gE('mediaBox');	
		if (ajax.readyState == 1) {
			
			mediaBox.innerHTML = '<img src="img/5.gif" style="margin-top:80px;">';
			mediaBox.style.display = 'block';	
			
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				
				/*$("#artBox").hide('slow',function(){
				$("#artBox").show('slow')													   
													   
				})*/

				
				mediaBox.innerHTML = ajax.responseText;				
				
				
			} 
		}
	}
	ajax.send(null);
	
}

function artPag(pag,p){

	var ajax = openAjax();
	ajax.open('GET', 'artPag.php?pag=' + pag +'&p='+ p, true);
	ajax.onreadystatechange = function() {
		var artPag = gE('artPag');	
		if (ajax.readyState == 1) {
			
			gE('theLoading').innerHTML = '<img src="img/5.gif">';
			gE('theLoading').style.display = 'block';	
			
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				
				/*$("#artBox").hide('slow',function(){
				$("#artBox").show('slow')													   
													   
				})*/

				
				artPag.innerHTML = ajax.responseText;				
				
				
			} 
		}
	}
	ajax.send(null);
	
}

function PassaID(pag,Obj,ID){
	
	var ajax = openAjax();
	ajax.open('GET', pag+'?ajax=true&art_id='+ ID, true);
	ajax.onreadystatechange = function() {
		var ObjId = gE(Obj);
		if (ajax.readyState == 1) {
			ObjId.innerHTML = '<center><img src="img/5.gif" style="padding-top:10px;"></center>';
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				ObjId.innerHTML = ajax.responseText;				
			} 
		}
	}
	ajax.send(null);
	//showNum(ID);
}



function showNum(ID){

	var ajax = openAjax();
	ajax.open('GET', 'showNum.php?ajax=true&art_id='+ ID, true);
	ajax.onreadystatechange = function() {
		var Div = gE('showNum');		
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				Div.innerHTML = ajax.responseText;				
			} 
		}
	}
	ajax.send(null);
	
}

function MudarPag(pag,ObjId,P,ID){

	var ajax = openAjax();
	ajax.open('GET', pag+'?ajax=true&p=' + P +'&art_id='+ ID, true);
	ajax.onreadystatechange = function() {
		var conteudo = gE(ObjId);	
		if (ajax.readyState == 1) {
			gE('theLoading').innerHTML = '<img src="img/5.gif">';
			gE('theLoading').style.display = 'block';	
		}
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				
				if(pag == 'comentarios.php'){
				$("#"+ObjId).hide('slow',function(){
				$("#"+ObjId).show('slow')														   
				});
				}else{
				$("#"+ObjId).fadeOut('slow',function(){
				$("#"+ObjId).fadeIn('slow')	
				});
				}
				
				conteudo.innerHTML = ajax.responseText;				
				
				
			} 
		}
	}
	ajax.send(null);
	
}

// Funções que será vinculadas ao botão Ok e Cancelar do formulário
function btnOkBtnCancelar() {
	// Se não houver os botões aborta a função
	if (!gE('btnOk')) return false;
	if (!gE('btnCancelar')) return false;

	gE('btnOk').onclick = function() {
									
		var tipoAcao = gE('action').value;
		
		if (tipoAcao == 'comentar') {
				
			var validacao = validarFormComentario();		
			if (validacao == true) {
				
				var dataPost = 'action=comentar&ID=' + gE('ID').value;
				
				var art_id = gE('ID').value;
				
				var ajax = openAjax();
				ajax.open('POST', 'actions.php?ajax=true', true);
				ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
				ajax.onreadystatechange = function() {
					
					if (ajax.readyState == 1) {

						gE('theLoading').innerHTML = '<img src="img/5.gif">';
						gE('theLoading').style.display = 'block';
						
					}
					if (ajax.readyState == 4) {
						if (ajax.status == 200) {
							$("#boxCad").animate({opacity : 0.0}, 'slow',function(){
							
								atualizaComentarios(art_id);
								removerDivs();
								showCom();
								showNum(art_id);								
								alert('Comentário adicionado com sucesso!');
								
							});	
							
						} // status ->200
					} // readyState->4
				} // ajax->onreadystatechange
				
				dataPost += '&nome=' + gE('nome').value;
				dataPost += '&email=' + gE('email').value;
				dataPost += '&comentario=' + gE('comentario').value;			
				//alert(dataPost);
				ajax.send(dataPost);
			}
			
			} else if (tipoAcao == 'enviar') {
				
			var validacao = validarFormEmail();		
			if (validacao == true) {
				
				var dataPost = 'action=enviar&ID=' + gE('ID').value;
				
				var ajax = openAjax();
				ajax.open('POST', 'actions.php?ajax=true', true);
				ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
				ajax.onreadystatechange = function() {
					if (ajax.readyState == 1) {

						gE('theLoading').innerHTML = '<img src="img/5.gif">';
						gE('theLoading').style.display = 'block';
						
					}
					if (ajax.readyState == 4) {
							if (ajax.status == 200) {							
								
									$("#boxCad").animate({opacity : 0.0}, 'slow',function(){
	
										removerDivs();
										alert('Indicação efetuada com sucesso!');
									});								
								
							} // status ->200
						} // readyState->4
				} // ajax->onreadystatechange	
				
				dataPost += '&nome=' + gE('nome').value;
				dataPost += '&nomeAmigo=' + gE('nomeAmigo').value;
				dataPost += '&emailAmigo=' + gE('emailAmigo').value;			
				//alert(dataPost);
				ajax.send(dataPost);
				
			 }						
			}			
		
		// Evita que o form seja enviado e dê o reload na página
		return false;
	}
	
	gE('btnCancelar').onclick = function() {
		
		$("#boxCad").animate({opacity : 0.0}, 'slow',function(){

				removerDivs();
		});
		
		return false;
	}
}


// Esta função seta o focus ao campo nome do formulário
function focusNome() {
	// Se hão houver o campo nome aborta a função
	if (!gE('nome')) return false;
	// Concede o focus ao campo nome do cadastro
	gE('nome').focus();
}

// Esta função valida os dados do formulário de preenchimento obrigatório
function validarFormEmail() {
	// Se não houver o formulário com o ID frmCad aborta a função
	if (!gE('frmCad')) return false;
	// Relação dos campos que devem ser preenchidos
	var nome = gE('nome');
	var nomeAmigo = gE('nomeAmigo');
	var emailAmigo = gE('emailAmigo');	
	// Valida o campo nome, ou seja, ele não pode ficar em branco
	if (nome.value == '' || nome.value == null) {
		// Informa ao usuário o erro ocorrido
		alert('Informe o seu nome.');
		// Seta o focus no campo com erro
		nome.focus();
		// Retorna false, para a outra saber que algo está errado e não liberar o cadastro
		return false;
	}
	// Valida o DDD e em seguida o telefone
	if (nomeAmigo.value == '' || nomeAmigo.value == null) {
		alert('Preencha o campo nome do amigo.');
		nomeAmigo.focus();
		return false;
	}
	
	// Verifica o e-mail informado, retornando false se ele for inválido e true se for válido
	var verificaEmail = validaEmail(emailAmigo.value);
	// Se for inválido exibe o erro
	if (verificaEmail == false) {
		alert('O e-mail informado é inválido. Verifique-o.');
		emailAmigo.focus();
		return false;
	}
	return true;
}

// Esta função valida os dados do formulário de preenchimento obrigatório
function validarFormComentario() {
	
	if (!gE('frmCad')) return false;
	
	var nome = gE('nome');
	var email = gE('email');
	var comentario = gE('comentario');	
	
	if (nome.value == '' || nome.value == null) {
	
		alert('Informe o seu nome.');	
		nome.focus();	
		return false;
	}	
		
	var verificaEmail = validaEmail(email.value);	
	if (verificaEmail == false) {
		alert('O e-mail informado é inválido. Verifique-o.');
		email.focus();
		return false;
	}
		
	if (comentario.value == '' || comentario.value == null) {
		alert('Preencha o campo Comentário.');
		comentario.focus();
		return false;
	}
	
	return true;
}

// Função que valida o e-mail informado
function validaEmail(email){
	return email.search(/(\w[\w\.\+]+)@(.+)\.(\w+)$/)==0;
}

// Esta função é utilizada para atualizar o relatório com os registrados da agenda
function atualizaComentarios(art_id) {
	var ajax = openAjax();
	ajax.open('GET', 'comentarios.php?ajax=true&art_id='+ art_id, true);
	ajax.onreadystatechange = function() {
		var conteudo = gE('conteudo');		
		if (ajax.readyState == 4) {
			if (ajax.status == 200) {
				conteudo.innerHTML = ajax.responseText;
				ativarBtnEditarBtnExcluir();
			} 
		}
	}
	ajax.send(null);
}

// Função que ativa o botão de edição e exclusão dos contatos
function ativarBtnEnviarBtnComentar() {
	// Seleciona todas as tags a, os links.
	var linksBtn = gEs('a');
	// Faz um loop por todos (links)
	for (var x = 0; x < linksBtn.length; x++) {
		// Cada link em si
		var linkBtn = linksBtn[x];
		// Cria uma vairável - atributoRel - com o valor do atributo rel do link
		var atributoRel = new String(linkBtn.getAttribute('rel'));
		// Verifico se o link será para edição dos dados
		if (atributoRel.substring(0,9) == 'btnEnviar') {
			linkBtn.onclick = function() {
				// Pego o ID do registro, que coloquei no atributo rel
				// Se fazer sem a palavra-chave this, o script sempre pegará o último da lista
				// O this neste caso é IMPORTANTISSÍMO
				var ID = this.getAttribute('rel').split('-')[1];
				// Executa a função que cria o fundo sobre página
				exibirBgBody();
				// Cria um div - definida como boxCad - que armazenará o formulário de cadastro
				boxCad();
				// Inicia o Ajax, através da variável Ajax
				var ajax = openAjax();
				// A tag bgBody conterá o formulário de cadastro
				var recipiente = gE('boxCad');
				// Informamos o método e a página que será requisitada
				ajax.open('GET', 'FormEmail.php?&ID=' + ID, true); 
				// bla
				ajax.onreadystatechange = function() {
					if (ajax.readyState == 1) {
						// Cria o efeito de loading
						loading(true);	
					} // if->readyState->1
					if (ajax.readyState == 4) {
						if (ajax.status == 200) {
							// Remove o efeito de loading
							loading(false);
							// Pega o conteúdo - HTML - da página requisitada: formulario.php?ajax=true e coloca dentra da div definida na variável recipiente
							
							$("#boxCad").css({'opacity' : '0'})
							$("#boxCad").animate({opacity : 1.0}, 'slow');
							
							recipiente.innerHTML = ajax.responseText;
							// Chama a função que trabalha sobre os botões de Ok e Cancelar
							btnOkBtnCancelar();
							// Seta o focus no campo nome do cadastro
							focusNome();
						} // if-status->200
					} // if->readyState->4
				} // ajax->onreadystatechange
				// Envia a requisição
				ajax.send(null);
				// Evita o reload da página
				return false;
			} // linkBtn.onclick
		} // if->btnEditar
		// Verifico se o link será para adicionar comentario ao artigo
				if (atributoRel.substring(0,11) == 'btnComentar') {
				linkBtn.onclick = function() {
				// Pego o ID do registro, que coloquei no atributo rel
				// Se fazer sem a palavra-chave this, o script sempre pegará o último da lista
				// O this neste caso é IMPORTANTISSÍMO
				var ID = this.getAttribute('rel').split('-')[1];
				// Executa a função que cria o fundo sobre página
				exibirBgBody();
				// Cria um div - definida como boxCad - que armazenará o formulário de cadastro
				boxCad();
				// Inicia o Ajax, através da variável Ajax
				var ajax = openAjax();
				// A tag bgBody conterá o formulário de cadastro
				var recipiente = gE('boxCad');
				// Informamos o método e a página que será requisitada
				ajax.open('GET', 'FormComentario.php?&ID=' + ID, true); 
				// bla
				ajax.onreadystatechange = function() {
					if (ajax.readyState == 1) {
						// Cria o efeito de loading
						loading(true);	
					} // if->readyState->1
					if (ajax.readyState == 4) {
						if (ajax.status == 200) {
							// Remove o efeito de loading
							loading(false);
							// Pega o conteúdo - HTML - da página requisitada: formulario.php?ajax=true e coloca dentra da div definida na variável recipiente
							recipiente.innerHTML = ajax.responseText;
							$("#boxCad").css({'opacity' : '0'})
							$("#boxCad").animate({opacity : 1.0}, 'slow');
							// Chama a função que trabalha sobre os botões de Ok e Cancelar
							btnOkBtnCancelar();
							// Seta o focus no campo nome do cadastro
							focusNome();
						} // if-status->200
					} // if->readyState->4
				} // ajax->onreadystatechange
				// Envia a requisição
				ajax.send(null);
				// Evita o reload da página
				return false;
			} // linkBtn.onclick
		} // if->btnComentar
	} // for
}

// Esta função elimina da página o fundo criado sobre o body e o boxCad;
function removerDivs() {
	var bgBody = gE('bgBody');
	var boxCad = gE('boxCad');
	bgBody.parentNode.removeChild(bgBody);
	if (boxCad) { // Por que ao clicar X (para deletar um registro) cria-se somente o encobridor e não o boxCad	
		boxCad.parentNode.removeChild(boxCad);
	}
}

/* Funções de terceiros */
// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
//
function getPageSize(){
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}

	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 

}