//iphTexto é o input type hidden que armazena o texto que vai aparecer
//idTexto é o id do local onde o texto será inserido
//acao foi criada para que a imagem só expanda até que ela tenha retornado ao seu tamanho pequeno
//Existe duas classes diferentes catalogoExpanded pq o internet explorer interpreta css diferente dos outros browsers

function expand(idImg, idTexto, iphTexto)
{
        var imagem = document.getElementById(idImg);
        acao = idImg;
        
        //fundo é a imagem de fundo, a borda que aparece por traz de cada produto, 
        // foi usada parentNode até chegar na <div> que possui a imagem de fundo
        var fundo = imagem.parentNode.parentNode.parentNode;
        
        //Pequeno delay para que a imagem comece a crescer
        window.setTimeout("crescer('" + idImg + "', '" + idTexto + "', '" + iphTexto + "')",300);
        window.setTimeout("mudarFundo('" + idImg + "')", 300);
}

//função para expandir o fundo, ele troca a imagem de fundo por uma maior
function mudarFundo(idImg)
{   
    var imagem = document.getElementById(idImg);
	var fundo = imagem.parentNode.parentNode.parentNode;
	var browser = navigator.appName;
	if(browser == "Microsoft Internet Explorer")
    {
        if(acao == idImg)
        {
            fundo.className = "catalogoExpandedIE";
        }
    }
    else
    {
         if(acao == idImg)
        {
            fundo.className = "catalogoExpandedOutros";
        }
    }
}

//função fica em loop até chegar em seu tamanho maximo
function crescer(idImg, idTexto, iphTexto)
{	
    var imagem = document.getElementById(idImg);
    
    //quanto a imagem expande por loop
    var factorw = Math.round(imagem.width*.06);
	var factorh = Math.round(imagem.height*.06);
	
    var browser = navigator.appName;

	if(acao == idImg){	   
	    if(imagem.width + factorw < imagem.finalWidth)
	    {	
   		
		    imagem.width += factorw;
		    imagem.height += factorh;
		    window.setTimeout("crescer('" + idImg + "', '" + idTexto + "', '" + iphTexto + "')",18);
	    }
	    else
	    {   
    	    
		    imagem.width = imagem.finalWidth;
		    imagem.height = imagem.finalHeight;
		    
		    //adiciona o texto que aparece quando a imagem chegou a seu tamanho maximo
		    if(idTexto != "")
		    {   
		        if(browser == "Microsoft Internet Explorer")
		        {
		            document.getElementById(idTexto).innerText = document.getElementById(iphTexto).value;
			        document.getElementById(idTexto).style.visibility="visible";
			    }
			    else
			    {
			        document.getElementById(idTexto).textContent = document.getElementById(iphTexto).value;
			        document.getElementById(idTexto).style.visibility="visible";
			    }
		    }
	    }
    }
	
}

function contract(idImg, idTexto)
{
        acao = idTexto;
        diminuir(idImg, idTexto);
}
//função fica em loop até chegar em seu tamanho pequeno
function diminuir(idImg, idTexto)
{	
	
    var imagem = document.getElementById(idImg);
	var fundo = imagem.parentNode.parentNode.parentNode;
	var browser = navigator.appName;
	
	//quanto a imagem diminui por loop
	var factorw = Math.round(imagem.width*.06);
	var factorh = Math.round(imagem.height*.06);
	
	if(imagem.width - factorw > imagem.originalWidth)
	{
		imagem.width -= factorw;
		imagem.height -= factorh;
		window.setTimeout("diminuir('" + idImg + "', '" + idTexto + "')",3);
    }
	else
	{   
	    imagem.width = imagem.originalWidth;
		imagem.height = imagem.originalHeight;
		
		if(fundo.className == "catalogoExpandedOutros" || fundo.className == "catalogoExpandedIE" )
            fundo.className = "catalogo";
	}
	
	if(browser == "Microsoft Internet Explorer")
    {
        document.getElementById(idTexto).style.visibility="hidden";
        document.getElementById(idTexto).innerText = "";
    }
    else
    {   
        document.getElementById(idTexto).style.visibility="hidden";
        document.getElementById(idTexto).textContent = "";
    }	
}

function configuraTamanho(img, maxTam)
{
    // Só redimensiona a imagem caso a variavel maxTam seja diferente de 0.
    if (isNaN(maxTam) == false && maxTam != 0)
    {
        var imagem = document.getElementById(img);
        var w = Number(imagem.width);
        var h = Number(imagem.height);
        var max = Number(maxTam);
        
        if(w==0)
        {
            w = maxTam;
        }
        
        if(h==0)
        {
            h = maxTam;
        }
        
        // variavel que guarda a proporção de quanto a imagem diminui
        var mh = max/w;
        var mw = max/h;
        
        //Definem qual é o tamanho da imagem após o zoom

        imagem.finalWidth = imagem.width;
        imagem.finalHeight = imagem.height;

        //calculo das dimensões da imagem para manter a proporção
        if(imagem.width >= imagem.height)
        {   
            imagem.width = maxTam;
            imagem.height = String(mh*h);
            //alert("imagem: " + imagem.src + "\n\rw: " + w + " h: " + h + "\n\rmh: " + mh + " mw: " + mw + "\n\rwidth: " + maxTam + "\n\rheight: " + String(mh*h));
        }
        else
        {   
            imagem.height = maxTam;
            imagem.width = String(mw*w);
        }
        // Definem qual é o tamanho da imagem peguena
        
        imagem.originalWidth = imagem.width;
        imagem.originalHeight = imagem.height;
    }
}   
    
    
function adicionaEventos(idImg, idTexto, iphTexto, flagZoom)
{
    var imagem = document.getElementById(idImg);
    
    //caso o usuario deseja desligar o zoom basta mudar o valor desta variavel
    if(flagZoom == "1")
    {
        // adiciona os eventos onmouseover e onmouseout na imagem
        if(imagem.addEventListener)//outros browsers
        {
            imagem.addEventListener("mouseover", function(){expand(idImg, idTexto, iphTexto)}, true);
            imagem.addEventListener("mouseout", function(){contract(idImg, idTexto)}, true);
        } else if(imagem.attachEvent)//para o ie
        {
            imagem.attachEvent("onmouseover", function(){expand(idImg, idTexto, iphTexto)});
            imagem.attachEvent("onmouseout", function(){contract(idImg, idTexto)});
        } 
    }
}