/**
 * modalFoto
 * 
 * Abre um img no meio da página com um tamanho definido
 * contendo o src passado como parâmetro
 * o restante da tela não pode ser clicado.
 *
 * Autor: Rômulo Berri
 * e-mail: romuloberri@yahoo.com.br
 *
 * Bibliografia consultada:
 * criar iframe com js: http://forums.about.com/n/pfx/forum.aspx?nav=messages&webtag=ab-javascript&tid=2847 
 * centralizar com css: http://www.maujor.com/tutorial/meio_tela.php
 * transparência com css: http://www.maujor.com/tutorial/transparencia.php
 * ocultar scrollbar com css: http://www.pinceladasdaweb.com.br/blog/2007/05/15/como-ocultar-a-barra-orizontal-scroll-com-css/
 * detectar a porcaria do MSIE: http://www.quirksmode.org/js/detect.html
 *
 *
 * Exemplo de chamada para abrir a foto:
 * onclick="openModalFoto('foto.jpg',658,530,'#DFDFDF',65)"
 */

function openModalFoto(src,largura,altura,corFundo,transparencia)
{

	//cria um div com o fundo transparente
	var makediv=document.createElement("div");
	makediv.setAttribute("id", "fundo");
	makediv.setAttribute("name", "fundo");
	//deixa o fundo ocupando toda a tela e com a transparência desejada 
	makediv.style.position  ="absolute";
	makediv.style.top       ="0";
	makediv.style.left      ="0";

	if (navigator.appName =="Microsoft Internet Explorer")
	{
		//lê a largura do documento
		if (!window.opera && !document.mimeType && document.all && document.getElementById){
			var larguraDoc =this.document.body.offsetWidth+"px";
		}
		else if(document.getElementById) {
			var larguraDoc =this.document.body.scrollWidth+"px";
		}
		makediv.style.width     =larguraDoc;
		makediv.style.height    =document.body.clientHeight+"px";
	} else {
		makediv.style.width     ="100%";
		makediv.style.height    ="100%";
	}
	makediv.style.height    =document.body.clientHeight+"px";
	makediv.style.border    ="none";
	makediv.style.opacity   ="0."+transparencia;
	makediv.style.MozOpacity ="0."+transparencia;
	makediv.style.filter    ="alpha(opacity="+transparencia+")";
	makediv.style.background=corFundo;

	 
	//botão fechar
    var makebutton=document.createElement("input");
	makebutton.setAttribute("id", "btFechar");
	makebutton.setAttribute("name", "btFechar");
	makebutton.setAttribute("value", "X");
	makebutton.setAttribute("type", "button");
	makebutton.setAttribute("alt", "Clique para voltar");
	makebutton.setAttribute("title", "Clique para voltar");
	makebutton.style.position   ="absolute";
	makebutton.style.top        =(parseInt(getScrollY()+(getWindowHeight())/2 - altura/2))+"px";//"50%";
	makebutton.style.left       =(parseInt(getScrollX()+(getWindowWidth())/2 + largura/2 - 48))+"px";//"50%";
	makebutton.style.width      ="40px";
	makebutton.style.backgroundColor = "Black";
	makebutton.style.border     = "0px";
	makebutton.style.color      = "Silver";
	makebutton.style.fontFamily = "Verdana, Geneva, Arial, Helvetica, sans-serif";
	makebutton.style.fontWeight = "bold";
	makebutton.style.fontSize   = "14px";
	
	//cria um img com o conteúdo
	var makeimg=document.createElement("img");
	makeimg.setAttribute("id", "popimg");
	makeimg.setAttribute("name", "popimg");
	makeimg.setAttribute("src", src); 
	makeimg.setAttribute("border", "0");
	makeimg.setAttribute("alt", "Clique para voltar");
	//centraliza o img na janela e define sua altura e largura
	makeimg.style.position   ="absolute";
	makeimg.style.left       ="50%";
	makeimg.style.top        =(parseInt(getScrollY()+(getWindowHeight())/2 ))+"px";//"50%";
	makeimg.style.marginLeft =(parseInt(- largura / 2))+"px";
	makeimg.style.marginTop  =(parseInt(- altura / 2))+"px";

    //cria um anchor q quando clicado fecha tudo
	var makeanchor=document.createElement("a");
	makeanchor.setAttribute("id", "closeModalFoto");
	makeanchor.setAttribute("name", "closeModalFoto");
	makeanchor.setAttribute("href", "javascript:void()");
   	makeanchor.onclick=closeModalFoto;

	document.body.appendChild(makeanchor);
	makeanchor.appendChild(makediv);
	makeanchor.appendChild(makeimg);
	makeanchor.appendChild(makebutton);

	//garante que a imagem seja mostrada
	makeimg.focus();

}

function closeModalFoto()
{
	var divFundo = parent.document.getElementById("fundo");
	divFundo.parentNode.removeChild(divFundo);
	var popIframe = parent.document.getElementById("popimg");
	popIframe.parentNode.removeChild(popIframe);
	var btFechar = parent.document.getElementById("btFechar");
	btFechar.parentNode.removeChild(btFechar);
	var acloseModalFoto = parent.document.getElementById("closeModalFoto");
	acloseModalFoto.parentNode.removeChild(acloseModalFoto);
}

function getWindowHeight() {
  var myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myHeight = document.body.clientHeight;
  }
  return myHeight;
}

function getWindowWidth() {
  var myWidth = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
  }
  return myWidth;
}

function getScrollX() {
  var scrOfX = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfX = document.documentElement.scrollLeft;
  }
  return scrOfX;
}

function getScrollY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
  }
  return scrOfY;
}