//variáveis externas
var titulo;
var imgsrc;
var viewdiv;

window.onload = function(){
	
	//fades
	divLoading = new fx.Opacity("viewchart",{duration:150, onComplete:exibeGrafico});
	divLoading.hide();
	
	molLoading = new fx.Opacity("moldura",{duration:150});
	molLoading.hide();
	
	molWid = new fx.Width("moldura",{duration:350});
	molHei = new fx.Height("moldura",{duration:350});
	
	divWid = new fx.Width("viewchart",{duration:350});
	divHei = new fx.Height("viewchart",{duration:350});
	
	//onchange na select Cidade para adicionar ao título
	var tab = document.getElementById("mensal");
	var sel = tab.getElementsByTagName("select")[0];
	sel.onchange = function(){
		h2Cidade(sel);
	}
	h2Cidade(sel);
}

function openChart(tit, url, x, y){
	
	var a = document.getElementById("fechar_grafico");
	var div = document.getElementById("viewchart");
	var mol = document.getElementById("moldura");
	
	//update das variaveis externas
	titulo = tit;
	imgsrc = url;
	viewdiv = div;
	
	if (div.getElementsByTagName("img").length!=0){
		div.removeChild(div.getElementsByTagName("img")[0]);
	}
	
	if (div.getElementsByTagName("h3").length!=0){
		div.removeChild(div.getElementsByTagName("h3")[0]);
	}
	
	mol.style.width = (x+50)+"px";
	mol.style.height = (y+80)+"px";
	mol.style.marginLeft = "-"+((x/2)+25)+"px";
	mol.style.marginTop = "-"+((y/2)+25)+"px";
	
	div.style.width = (x+10)+"px";
	div.style.height = (y+50)+"px";
	div.style.marginLeft = "-"+((x/2)+3)+"px";
	div.style.marginTop = "-"+((y/2)+5)+"px";
	
	//exibe - fade
	molWid.custom(x+30, x+50);
	molHei.custom(y+50, y+90);
	divWid.custom(x, x+10);
	divHei.custom(y, y+50);
	
	divLoading.custom(0,1);
	molLoading.custom(0,0.6);
	a.style.display="block";
	
	var fechar = document.getElementById("fechar_grafico");
	fechar.style.marginLeft = (x/2)+"px";
	fechar.style.marginTop = "-"+((y/2)+16)+"px";
}

function exibeGrafico(){
	//alert(titulo+" "+imgsrc+" "+viewdiv);
	var h3 = "<h3>"+titulo+"</h3>";
	var imagem = "<img src='"+imgsrc+"'>";
	viewdiv.innerHTML = h3+imagem;
}

function fecharGrafico(){
	var mol = document.getElementById("moldura");
	var div = document.getElementById("viewchart");
	var a = document.getElementById("fechar_grafico");
	
	//oculta - fade
	divLoading.custom(1,0);
	molLoading.custom(0.6,0);
	a.style.display="none";
	//mol.style.display="none";
}

function chartMensal(tipores, tipo){

	var tab = document.getElementById("mensal");
	var sel = tab.getElementsByTagName("select")[0];
	var cidade = sel.options[sel.selectedIndex].value;
	var ano = document.getElementById("ano").value;
	var titulo = "";
	
	//título do chart
	if (tipo=="linha"){
		switch (tipores){
			case "empresas":
				titulo = "Empresas doadoras durante "+ano+" em "+cidade;
				break;
			case "instituicoes":
				titulo = "Instituições receptoras durante "+ano+" em "+cidade;
				break;
			case "quilos":
				titulo = "Quilos distribuídos durante "+ano+" em "+cidade;
				break;
			case "complementacao":
				titulo = "Complementação de refeições durante "+ano+" em "+cidade;
				break;
		}
	
	} else if (tipo=="pie"){
		switch (tipores){
			case "empresas":
				titulo = "Participação nas empresas doadoras durante "+ano;
				break;
			case "instituicoes":
				titulo = "Participação nas instituições receptoras durante "+ano;
				break;
			case "quilos":
				titulo = "Participação nos quilos distribuídos durante "+ano;
				break;
			case "complementacao":
				titulo = "Participação na complementação de refeições durante "+ano;
				break;
		}
	}
	
	if (tipo=="linha" && cidade==""){
		alert("Escolha uma cidade primeiro.");
	
	} else {
	
		var ajax = new Request();
		var callback = function(str){
	
			if (tipo=="linha"){
				openChart(titulo, str, 680, 200);
			} else if (tipo=="pie"){
				openChart(titulo, str, 400, 120);
			}
		}
		var insert = "?tipo="+tipo+"&ano="+ano+"&cidade="+cidade+"&tipores="+tipores;
		ajax.doGet("ChartMensal"+insert, callback, "text");
	}
}

function h2Cidade(sel){
	var cidade = sel.options[sel.selectedIndex].value;
	var h2 = document.getElementsByTagName("h2")[1];
	var span = h2.getElementsByTagName("span")[0];
	span.innerHTML = ": "+cidade;
}