/* SETUP DA JANELA */

   $(document).ready(function(){
   var browser=navigator.appName;
   if (browser=="Opera"||browser=="Microsoft Internet Explorer"){ }else{
        $('#viewport').css ({'overflow' : 'hidden'})
        $('.java').css ({'display' : 'none'})
        $('#canvas').css({'opacity' : '0.0' , 'top' : '-16000px'})
        $('#placeholder').css({'opacity' : '0.0' , 'left' : '-16000px' , 'top' : '-16000px' , 'display' : 'none'  })
        $('#loader').css({'z-index' : '100' , 'position' : 'absolute' , 'opacity':'1', 'top' : '50%' , 'left': '50%'})
        $('#botoes').css({'display' : 'inline'})
        $('#canvas').css({'position' : 'absolute'})
        $('#viewport').dragscrollable({dragSelector: '#canvas', acceptPropagatedEvent: false});

        $('#canvas').mousedown(function(){
        $('#canvas').removeClass("mao_cursor");
        $('#canvas').addClass("mao_arrastar_cursor");        
        });
        
        $('#canvas').mouseup(function(){
        $('#canvas').removeClass("mao_arrastar_cursor");
        $('#canvas').addClass("mao_cursor");        
        });
        
      }
      });
 
/* QUANDO A PÁGINA E IMAGEM SÃO CARREGADAS */
   function carregar(pasta){
   var npasta = pasta;
   var animetcurto = 0;
   var animetlongo = 550;
   
   var browser=navigator.appName;
   if (browser=="Opera"||browser=="Microsoft Internet Explorer"){ }else{
      
        var oWidthO = $('#placeholder').width();
        var oHeightO = $('#placeholder').height();
        var vWidth = $('#viewport').width() - 50;
        var vHeight = $('#viewport').height() - 50;

        var per = (100 * (vWidth)) / oWidthO
        var perc = (per * oWidthO) / 100
        var xfactor = perc / oWidthO
        
        if (oWidthO < oHeightO)
        {
        var per = (100 * (vHeight)) / oHeightO
        var perc = (per * oHeightO) / 100
        var xfactor = perc / oHeightO
        }
        
        var iWidth = xfactor * oWidthO
        var iWidth = Math.round(iWidth)
        var iHeight = xfactor * oHeightO
        var iHeight = Math.round(iHeight)

        if (iWidth > oWidthO) {var iHeight = oHeightO;  var iWidth = oWidthO;}
        
        
        if (iWidth > vWidth)
        {
        var per = (100 * (vWidth)) / oWidthO
        var perc = (per * oWidthO) / 100
        var xfactor = perc / oWidthO
        var iWidth = xfactor * oWidthO
        var iWidth = Math.round(iWidth)
        var iHeight = xfactor * oHeightO
        var iHeight = Math.round(iHeight)  
        }
        
        if (iHeight > vHeight)
        {
        var per = (100 * (vHeight)) / oHeightO
        var perc = (per * oHeightO) / 100
        var xfactor = perc / oHeightO
        var iWidth = xfactor * oWidthO
        var iWidth = Math.round(iWidth)
        var iHeight = xfactor * oHeightO
        var iHeight = Math.round(iHeight)
        }
       
        var xI = ((vWidth+50) - iWidth) / 2
        var yI = ((vHeight+50) - iHeight) / 2
        
        var percentagem =  Math.round((iWidth * 100)/oWidthO);
        $("#percentagem").text(percentagem + "%");
        if (percentagem < 150||percentagem > 5) {
        $("#percentagem").css({'color': '#666666'});
        }
        if (percentagem == 150||percentagem == 5) {
        $("#percentagem").css({'color': 'red'});
        }

        $("#loader").animate({opacity:0}, animetlongo,
        function(){
        $("#canvas").animate ({ width: iWidth + 'px', height: iHeight + 'px', left: xI + 'px', top: yI + 'px' }, 0,
        function(){
        $("#loader").animate({top:-100 }, 0,
        function(){
        $("#canvas").animate ({ opacity: 1.0 }, animetlongo);})
        });
        $('#viewport').css ({'overflow' : 'auto'});
        rotacao();
        });
        
        
/* FUNÇÃO GERAL DE ANIMAÇÃO 0º e 180º */
        
        function animar(a,tempo){
        if (tempo != 0) {tempo = animetcurto}
        var oWidth = $('#canvas').width();
        var oHeight = $('#canvas').height();
        var vWidth = $('#viewport').width();
        var vHeight = $('#viewport').height();
        var per = a
                      
        var perc = (per * oWidth) / 100
        var xfactor = perc / oWidth
        var iWidth = xfactor * oWidth
        var iWidth = Math.round(iWidth)
        var iHeight = xfactor * oHeight
        var iHeight = Math.round(iHeight)
        
        if (oWidthO > oHeightO) {        
        if (oWidth < oHeight) {
        if (iHeight > (oWidthO*1.5)) {var iHeight = (oWidthO*1.5);  var iWidth = (oHeightO*1.5)}
        if (iHeight < (oWidthO*0.05)) {var iHeight = (oWidthO*0.05); var iWidth = (oHeightO*0.05)}
        } else {
        if  (iWidth > (oWidthO*1.5)) {var iWidth = (oWidthO*1.5); var iHeight = (oHeightO*1.5)}
        if  (iWidth < (oWidthO*0.05)) {var iWidth = (oWidthO*0.05); var iHeight = (oHeightO*0.05)}
        } }
        else
        {
        if (oWidth > oHeight) {
        if (iHeight > (oWidthO*1.5)) {var iHeight = (oWidthO*1.5);  var iWidth = (oHeightO*1.5)}
        if (iHeight < (oWidthO*0.05)) {var iHeight = (oWidthO*0.05); var iWidth = (oHeightO*0.05)}
        } else {
        if  (iWidth > (oWidthO*1.5)) {var iWidth = (oWidthO*1.5); var iHeight = (oHeightO*1.5)}
        if  (iWidth < (oWidthO*0.05)) {var iWidth = (oWidthO*0.05); var iHeight = (oHeightO*0.05)}
        } }
        
        if (iWidth < vWidth) { var xI = (vWidth - iWidth)/2 }
        if (iWidth > vWidth) { var xI = 0 }
        if (iHeight < vHeight) { var yI = (vHeight - iHeight)/2 }
        if (iHeight > vHeight) { var yI = 0 }
        
        if (ang == 0 || ang == 180)  {
        var percentagem =  Math.round((iWidth * 100)/oWidthO);        
        $("#percentagem").text(percentagem + "%");
        } else {
        var percentagem =  Math.round((iWidth * 100)/oHeightO);
        $("#percentagem").text(percentagem + "%");
        }
        
        if (percentagem < 150||percentagem > 5) {
        $("#percentagem").css({'color': '#666666'});
        }
        if (percentagem == 150||percentagem == 5) {
        $("#percentagem").css({'color': 'red'});
        }
        
        $("#canvas").stop().animate ({ width: iWidth + 'px', height: iHeight + 'px', left: xI, top: yI}, tempo);
        $("#canvas").animate ({opacity: "1.0"}, animetcurto);
      }

     $("#menos").click(function(){
       animar(70)
       });

     $("#mais").click(function(){
       animar(120)
       });
       
     $("#cem").click(function(){
        var oWidth = $('#canvas').width();
        var oHeight = $('#canvas').height();
        var vWidth = $('#viewport').width();
        var vHeight = $('#viewport').height();
        if (oWidthO > oHeightO) {
        if (oWidth < oHeight) {
        var iWidth = oHeightO
        var iHeight = oWidthO} else {
        var iWidth = oWidthO
        var iHeight = oHeightO}
        } else {
        if (oWidth > oHeight) {
        var iWidth = oHeightO
        var iHeight = oWidthO} else {
        var iWidth = oWidthO
        var iHeight = oHeightO
        }}
        
        if (iWidth < vWidth) { var xI = (vWidth - iWidth)/2 }
        if (iWidth > vWidth) { var xI = 0 }
        if (iHeight < vHeight) { var yI = (vHeight - iHeight)/2 }
        if (iHeight > vHeight) { var yI = 0 }
        
        if (ang == 0 || ang == 180)  {
        var percentagem =  Math.round((iWidth * 100)/oWidthO);        
        $("#percentagem").text(percentagem + "%");
        $("#percentagem").css({'color': '#666666'});
        } else {
        var percentagem =  Math.round((iWidth * 100)/oHeightO);
        $("#percentagem").text(percentagem + "%");
        $("#percentagem").css({'color': '#666666'});
        }
        
        $("#canvas").stop().animate ({ width: iWidth + 'px', height: iHeight + 'px', left: xI, top: yI }, animetcurto);
       });

     $("#fith").click(function(){
        fith()       
     });
       
     $("#fitv").click(function(){
       fitv()
       });
       
        function fith(tempo){
        var oWidth = $('#canvas').width();
        var vWidth = $('#viewport').width();
        var per = Math.round(((vWidth - 50) * 100) / oWidth)
        animar(per,tempo)
        }
       
       
        function fitv(tempo){
        var oWidth = $('#canvas').width();
        var oHeight = $('#canvas').height();
        var vWidth = $('#viewport').width();
        var vHeight = $('#viewport').height();
        var perW = Math.round(((vWidth - 50) * 100) / oWidth)
        var perH = Math.round(((vHeight - 50) * 100) / oHeight)
        var altura = (oHeight * perW) / 100
        var largura = (oWidth * perH) / 100
        if (altura < vHeight) {animar(perW,tempo)} else {animar(perH,tempo)}
        }       
       
     

     $(window).resize(function(){
        /*var oWidth = $('#canvas').width();
        var vWidth = $('#viewport').width();
        var per = Math.round(((vWidth - 50) * 100) / oWidth)
        animar(per)*/
        animar(100);
       });
       



var ang = 0; 

     $("#noventa").click(function(){
     if (ang == 270) {ang = 1}
     if (ang == 180) {ang = 270}
     if (ang == 90) {ang = 180}
     if (ang == 0) {ang = 90}
     if (ang == 1) {ang = 0}
     $("#canvas").stop().animate({opacity: "0.0"}, 100)
     setTimeout(function() {rotate(ang)}, animetcurto)
     });

     $("#menosnoventa").click(function(){
     if (ang == 90) {ang = 1}
     if (ang == 180) {ang = 90}
     if (ang == 270) {ang = 180}
     if (ang == 0) {ang = 270}
     if (ang == 1) {ang = 0}
     $("#canvas").stop().animate({opacity: "0.0"}, 100)
     setTimeout(function() {rotate(ang)}, animetcurto)
     });

       
function rotacao() {
		var image = document.getElementById('placeholder');
		var canvas = document.getElementById('canvas');
		var canvasContext = canvas.getContext('2d');
				canvas.setAttribute('width', image.width);
				canvas.setAttribute('height', image.height);
				canvasContext.drawImage(image, 0, 0);				
       }
       
function rotate(p_deg) {
		var image = document.getElementById('placeholder');
		var canvas = document.getElementById('canvas');
		var canvasContext = canvas.getContext('2d');
		
		switch(p_deg) {
			default :
			case 0 :
				canvas.setAttribute('width', image.width);
				canvas.setAttribute('height', image.height);
				canvasContext.rotate(p_deg * Math.PI / 180);
				canvasContext.drawImage(image, 0, 0);
				$("#canvas").css({width: '' , height: ''})
				fitv(0)
				break;
			case 90 :
				canvas.setAttribute('width', image.height);
				canvas.setAttribute('height', image.width);
				canvasContext.rotate(p_deg * Math.PI / 180);
				canvasContext.drawImage(image, 0, -image.height);
				$("#canvas").css({width: '' , height: ''})
				fitv(0)
				break;
			case 180 :
				canvas.setAttribute('width', image.width);
				canvas.setAttribute('height', image.height);
				canvasContext.rotate(p_deg * Math.PI / 180);
				canvasContext.drawImage(image, -image.width, -image.height);
				$("#canvas").css({width: '' , height: ''})
				fitv(0)
				break;
			case 270 :
			case -90 :
				canvas.setAttribute('width', image.height);
				canvas.setAttribute('height', image.width);
				canvasContext.rotate(p_deg * Math.PI / 180);
				canvasContext.drawImage(image, -image.width, 0);
				$("#canvas").css({width: '' , height: ''})
				fitv(0)
				break;
		};

       }

     $("#full").click(function(){
     $("#viewport").animate({marginLeft: "0px"}, animetcurto);
     $("#meta_container").animate({left: "-1500px"}, animetcurto);
     setCookie(npasta,'full',1);
     setTimeout(function() {fitv()}, animetcurto+200);
     /*animar(100);*/
     });
     
     $("#nofull").click(function(){    
     $("#viewport").stop().animate({marginLeft: "251px"}, animetcurto);
     $("#meta_container").stop().animate({left: "0px"}, animetcurto);
     setCookie(pasta,'notfull',1);
     setTimeout(function() {fitv()}, animetcurto+200);
     /*animar(100);*/
     });      
       
       }
     
     
     function setCookie(c_name,value,expiredays)
     {
     var exdate=new Date();
     exdate.setDate(exdate.getDate()+expiredays);
     document.cookie=c_name+ "=" +escape(value)+((expiredays==null) ? "" : "; expires="+exdate.toGMTString());
     }
     
     function getCookie(c_name)
      {
      if (document.cookie.length>0)
        {
        c_start=document.cookie.indexOf(c_name + "=");
        if (c_start!=-1)
          { 
          c_start=c_start + c_name.length+1 ;
          c_end=document.cookie.indexOf(";",c_start);
          if (c_end==-1) c_end=document.cookie.length
          return unescape(document.cookie.substring(c_start,c_end));
          } 
        }
      return ""
      }
     
     function checkCookie(){
      view=getCookie(pasta);
      if (view == 'full')
        {
         $("#viewport").animate({marginLeft: "0px"}, animetcurto);
         $("#meta_container").animate({left: "-1500px"}, animetcurto);
         setTimeout(function() {fitv()}, animetlongo + 50)
        }
      else{ }
        }
        
     checkCookie()
       }

$(document).ready(function(){
     $("#infomp3").click(function(){
     $("#player").css({'height': '46%'})
     $("#trans").css({'z-index' : '3000' , 'width': '100%' , 'top': '50%', 'height':'50%', 'borderRight': 'none' , 'borderLeft': 'none'  , 'borderBottom': 'none'});
     var transTop = $('#trans').offset();
     var transLeft = $('#trans').width();
     $("#fecha_info").css({'z-index' : '4000' , 'top': (transTop.top-20) + 'px' , 'left' : (transLeft-75) + 'px' })
     });

     $("#info").click(function(){
     $("#trans").css({'z-index' : '3000' , 'top': '20%', 'width':'80%', 'height':'60%', 'left':'10%' })
     $("#trans2").css({'z-index' : '2000' , 'opacity': '0.5', 'top': '0'})
     var transTop = $('#trans').offset();
     var transLeft = $('#trans').width();
     $("#fecha_info").css({'z-index' : '4000' , 'top': (transTop.top-20) + 'px' , 'left' : (transLeft-75) + 'px' })
     });
     
     $("#fecha_info").click(function(){
     $("#trans").css({'top': '-5000' })
     $("#trans2").css({'top': '-5000' })
     $("#fecha_info").css({'top': '-5000' })
     $("#player").css({'height': '100%'})
     });
     
     $(window).resize(function(){
     var transTop = $('#trans').offset();
     var transLeft = $('#trans').width();
     $("#fecha_info").css({'z-index' : '4000' , 'top': (transTop.top-20) + 'px' , 'left' : (transLeft-75) + 'px' })
     });  
});

function mais_90(link){
      window.location.href=(link);
}

function menos_90(link){
      window.location.href=(link);
}

function espelhar(link){
      window.location.href=(link);
}