function ExibeAguarde(id_obj) {
	$(id_obj).innerHTML = "<span class='aguarde'><br>Aguarde<img src='/images/aguarde.gif'></span>"
}

// desabilita as caixas de alteração de imagem
function CaixasDisabled(sim) {
	var d = "block";
	if (!sim) {d = "none";}
	$("div_efeitos_disabled").style.display = d;
	$("div_textos_disabled").style.display = d;
	if ($("div_props_disabled") != undefined) {
		$("div_props_disabled").style.display = d;
	}
}

function AguardeImagem(sim) {
	var div = "div_aguarde";
	if (sim) {
		CaixasDisabled(true);
		new Effect.Appear(div, {duration:0.5});		
	} else {
		CaixasDisabled(false);
		new Effect.Fade(div);
	}
}

function ZindexCaixa(div) {
	var div1, div2, div3, div4;
	if ($("div_efeitos") != undefined) {div1 = $("div_efeitos")}
	if ($("div_props") != undefined) {div2 = $("div_props")}
	if ($("div_textos") != undefined) {div3 = $("div_textos")}
	//if ($("div_album") != undefined) {div4 = $("div_album")}

	switch (div) {
		case div1:
			div1.style.zIndex = 5;
			div2.style.zIndex = 4;
			div3.style.zIndex = 4;
			//div4.style.zIndex = 3;
			break;
		case div2:
			div2.style.zIndex = 5;
			div1.style.zIndex = 4;
			div3.style.zIndex = 4;
			//div4.style.zIndex = 3;
			break;
		case div3:
			div3.style.zIndex = 5;
			div1.style.zIndex = 4;
			div2.style.zIndex = 4;
			//div4.style.zIndex = 3;
			break;
		/*
		case div4:
			div4.style.zIndex = 5;			
			div1.style.zIndex = 4;
			div2.style.zIndex = 4;
			div3.style.zIndex = 4;
			break;
		*/
	}
}

function ExibeEfeitos(sim) {
	var div = "div_efeitos";
	if (sim) {
		if ($(div).style.display == "none") {		
			new Effect.BlindDown(div, {To:0.1, duration:0.5});
			new Draggable(div, {ghosting:false});			
		}
		CaixasDisabled(false); // retira o disabled
		ZindexCaixa($(div)); // coloca a div na frente das outras
	} else {
		new Effect.Puff(div, {duration:0.5});
	}
}

function ExibeMolduras(sim) {
	var div = $("div_molduras");
	var link = $("a_molduras");
	if (sim) {
		if (div.style.display == "none") {
			div.style.display = "block";
			link.className = "submenu-over";
		}
	} else {
		div.style.display = "none";
		link.className = "submenu";
	}
}

function ExibeFutebol(sim) {
	var div = $("div_futebol");
	var link = $("a_futebol");
	if (sim) {
		if (div.style.display == "none") {
			div.style.display = "block";
			link.className = "submenu-over";
		}
	} else {
		div.style.display = "none";
		link.className = "submenu";
	}
}

function ExibePropriedades(sim) {
	var div = "div_props";
	var div2 = "div_propriedades";
	if (sim) {
		if ($(div).style.display == "none") {
			$(div2).innerHTML = "<div class='aguarde'><img src='/images/aguarde3.gif'><br><b>Carregando</b></div>";
			AjaxInclude("/imagem/propriedades", div2);
			new Effect.Appear(div, {To:0.1, duration:0.5});
			new Draggable(div, {ghosting:false});
		}
		CaixasDisabled(false); // retira o disabled
		ZindexCaixa($(div)); // coloca a div na frente das outras		
	} else {		
		new Effect.Puff(div, {duration:0.5});
		RemoverCorte();
	}
}

function ExibeTextos(sim) {
	var div = "div_textos";
	if (sim) {	
		if ($(div).style.display == "none") {			
			new Effect.Appear(div, {To:0.1, duration:0.5});
			
			// Cria o slider do tamanho da fonte
			sliderF = new Control.Slider('botao3','slider_tam_fonte',{
				range:$R(12,200), 
				increment:2,
				onSlide:function(v){$('txt_tam_fonte').value = parseInt(v)},
				onChange:function(v){/*AlteraImagem('texto');*/}
			});
			sliderF.setValue($('txt_tam_fonte').value);

			// Cria o colorpicker de cor da fonte
			ColorPickerAdd(1);			
			
			// drag drop
			new Draggable(div, {ghosting:false});
		}
		CaixasDisabled(false); // retira o disabled
		ZindexCaixa($(div)); // coloca a div na frente das outras		
	} else {
		new Effect.Puff(div, {duration:0.5});
	}
}

// coloca as caixas em suas respectivas posições iniciais
//---------------------------------------------------------------------------------------------
function EfeitosPosIni() {
	new Effect.Move ("div_efeitos", {x:2, y:34, mode: 'absolute', duration:0.5});
}
function PropriedadesPosIni() {
	new Effect.Move ("div_props", {x:117, y:34, mode: 'absolute', duration:0.5});
}
function TextosPosIni() {
	new Effect.Move ("div_textos", {x:230, y:34, mode: 'absolute', duration:0.5});
}
//---------------------------------------------------------------------------------------------

// retorna a tela pra o estado incial
function TelaInicial() {
	var checks1 = $N("chk_efeito");
	var checks2 = $N("chk_prop");
	ExibeImagem('A');
	$("div_menu_cima").style.visibility = 'hidden';
	//$("div_menu_baixo").style.visibility = 'hidden';	
	for (var i = 0; i < checks1.length; i++) {checks1[i].checked = false;} // desmarca todos os efeitos
	for (var i = 0; i < checks2.length; i++) {checks2[i].checked = false;} // desmarca todas as propriedades
	OcultaBoxsFlutuantes();
}

function Upload() {
	var form = document.getElementById("frm_upload");
	var action = "/imagem/upload";
	var file = $("file_upload");
	var ext;
	
	if (file.value == "") { 
		alert("Clique no botão ao lado e selecione a imagem que deseja enviar.");
		file.focus();
		return;
	}
	
	arq = file.value;
	ext = arq.substring(arq.length-4, arq.length);
	ext = ext.toLowerCase()

	if ((ext != "jpeg") && (ext != ".jpg") && (ext != ".gif") && (ext != ".png")) {	
		alert("Arquivo inválido!\n\nVocê só pode enviar arquivos nos formatos .JPG , .GIF ou .PNG");
		file.focus();
		return;
	}
	
	$("a_botao_upload").style.display = "none";
	$("span_aguarde_upload").style.display = "inline";
	
	// criando iframe
	var iframe = document.createElement("iframe");
	iframe.setAttribute("id","iframe_temp");
	iframe.setAttribute("name","iframe_temp");
	iframe.setAttribute("width","0");
	iframe.setAttribute("height","0");
	iframe.setAttribute("border","0");
	iframe.setAttribute("style","width:0; height:0; background-color:white; border: none;");
	
	// adicionando ao formulário
	form.parentNode.appendChild(iframe);
	window.frames['iframe_temp'].name = "iframe_temp"; //seta o nome pra funcionar no ie
	
	form.setAttribute("target", "iframe_temp");
	form.setAttribute("action", action);
	form.setAttribute("method","post");
	form.setAttribute("enctype","multipart/form-data");
	form.setAttribute("encoding","multipart/form-data");
	form.submit();
	
	// caso tenha algum aberto exclui
	Sair();
}

function OcultaBoxsFlutuantes() {
	$("div_efeitos").style.display = 'none';
	$("div_props").style.display = 'none';
	$("div_textos").style.display = 'none';
}

// exibe a imagem para edição
function EditaImagem(arquivo) {
	var checks1 = $N("chk_efeito");
	var checks2 = $N("chk_prop");
		
	AguardeImagem(true);
	
	// informações para editar a imagem
	$("hdn_arquivo").value = arquivo;
	$("hdn_imagem_original").value = arquivo;
	
	ExibeImagem('A');	
	
	// oculta aguarde do upload e exibe o botão de upload
	$("span_aguarde_upload").style.display = 'none';
	$("a_botao_upload").style.display = 'inline';
	
	// exibe os botões de edição da imagem
	$("div_menu_cima").style.visibility = 'visible';
	//$("div_menu_baixo").style.visibility = 'visible';
	
	// desmarca todos os efeitos
	for (var i = 0; i < checks1.length; i++) {checks1[i].checked = false;}
	for (var i = 0; i < checks2.length; i++) {checks2[i].checked = false;}
	$("chk_resize").checked = false;
	$("hdn_moldura").value = "";
	$("hdn_futebol").value = "";	
	
	// reinicia arquivo temporário
	/*
	var ajax = new AJAX();
	ajax.url = "/imagem/reset";	
	ajax.metodo = "POST";
	ajax.params = "imagem=" + imagem_id;
	ajax.retorno = function(retorno) {
		if (retorno == "EXCLUIU") {
			TelaInicial();
			ExibeAlbum(true);
		}
		AguardeImagem(false);
	}
	ajax.conectar();
	*/
}

// gira a imagem de acordo com o angulo informado
function GirarImagem(angulo) {
	$("hdn_angulo").value = angulo;
	AlteraImagem('girar');
}

// marca o checkbox/oculto da propriedade alterada
function AlteraPropriedade(valor) {
	var checks2 = $N("chk_prop");
	for (var i = 0; i < checks2.length; i++) {
		if (checks2[i].value == valor) {
			checks2[i].checked = !checks2[i].checked;
		}
	}
	AlteraImagem('propriedade');
}

// coloca a moldura na imagem
function AplicarMoldura(numero) {
	if ((numero == 0) || (numero == "")) {
		$("hdn_moldura").value = "";
	} else {
		$("hdn_moldura").value = numero;
	}
	ExibeMolduras(false);
	AlteraImagem('moldura');
}

// altera as propriedades do escudo do time
function AlteraFutebol() {
	var numero = $("hdn_futebol").value;
	if (numero != "") {
		AplicarFutebol(numero, false);
	}
}

// coloca o escudo do time na imagem
function AplicarFutebol(numero, oculta) {
	var marcou = false;
	var chks = $N("chk_futebol");
	
	if ((numero == 0) || (numero == "")) {
		$("hdn_futebol").value = "";
	} else {
		for (var i = 0; i < chks.length; i++) {
			if (chks[i].checked) {marcou = true;}
		}
		if (!marcou) {
			alert("Marque pelo menos uma posição para a imagem");
			return;
		}
		$("hdn_futebol").value = numero;
	}
	if (oculta) {
		ExibeFutebol(false);
	}
	AlteraImagem('futebol');
}

// Aplica o efeito a imagem.
function AlteraImagem(obj) {
	
	var indice, radios;
	var texto, texto_cor, texto_tam, negrito, italico, underline, gravity; // texto
	var checks1 = $N("chk_efeito"); // efeitos
	var checks2 = $N("chk_prop"); // propriedades
	var objs_fut; // futebol
	var links = $N("a_efeito");
	var original = true;
	var params = "opcao=alterar";		
	// redimensionar
	var redimensionar = "nao";
	var proporcional = "sim";
	var largura = 0;
	var altura = 0;
	// girar
	var angulo = "";
	var inverte = 0;
	// marca do imagemfacil
	var marca = "sim";
	/*
	if ($("chk_imagemfacil") != undefined) {
		if (!$("chk_imagemfacil").checked) {marca = "nao";}
	}
	*/	
	
	RemoverCorte();	
	AguardeImagem(true);

	// invert a imagem
	if ($("hdn_angulo").value != "") {
		inverte = 1;
		original = false;
	}
	
	// girar/angulo alterado
	if ($("hdn_angulo").value != "") {
		angulo = $("hdn_angulo").value;
		original = false;
	}
	
	// (des)marca o checkbox caso tenha clicado apenas no link
	switch (obj) {
		case "propriedade":
			original = false;
			break;
		case "moldura":
			original = false;
			break;
		case "marca":
			original = false;
			break;
		case "tamanho": // redimensionar tamanho
			$("chk_resize").checked = true;
			break;	
		default: // caixa de efeitos
			if ((obj != null) && (obj != "")) {
				if (obj.name == "a_efeito") {
					for (var i = 0; i < links.length; i++) {
						if (links[i] == obj) {indice = i;}
					}
					checks1[indice].checked = !checks1[indice].checked;
				}
			}
			break;
	}
	
	// se clicou direto no menu futebol ou já tem algum escudo selecionado
	if ((obj == "futebol") || ($("hdn_futebol").value != "")) {
		// posições do escudo
		objs_fut = $N("rdb_futebol");
		for (var i = 0; i < objs_fut.length; i++) {
			if (objs_fut[i].checked) {
				params += "&tamanho_fut=" + objs_fut[i].value;
			}
		}
		// posições do escudo
		objs_fut = $N("chk_futebol");
		for (var i = 0; i < objs_fut.length; i++) {
			if (objs_fut[i].checked) {
				//params += "&posicao_fut[]=" + objs_fut[i].value;
				params += "&posicao_fut=" + objs_fut[i].value;
				original = false;
			}
		}
	}
	
	// redimensiona a imagem
	if ($("chk_resize").checked) {
		redimensionar = "sim";
		largura = parseInt($("txt_largura").value);
		altura = parseInt($("txt_altura").value);
		proporcional = ($("chk_proporcao").checked) ? "sim" : "nao";
		original = false;	
	}
	
	// efeitos marcados
	for (var i = 0; i < checks1.length; i++) {
		if (checks1[i].checked) {
			params += "&efeito[]=" + checks1[i].value;
			original = false;
		}
	}

	// propriedades alteradas (checks ocultos)
	for (var i = 0; i < checks2.length; i++) {
		if (checks2[i].checked) {
			params += "&efeito[]=" + checks2[i].value;
		}
	}
	
	// texto na imagem
	texto = "";
	texto_cor = "";
	texto_tam = "";
	negrito = "";
	italico = "";
	underline = "";
	gravity = 0;
	if ($("text_imagem") != undefined) {
		if ($("text_imagem").value != "") {
			texto = $("text_imagem").value;
			texto_cor = $("cp_value_1").value; // cor retornada pelo colorpicker
			texto_tam = $("txt_tam_fonte").value; // tamanho retornado pelo slider
			negrito = ($("chk_negrito").checked) ? "sim" : "nao";
			italico = ($("chk_italico").checked) ? "sim" : "nao";
			underline = ($("chk_underline").checked) ? "sim" : "nao";
			// posição do texto
			radios = $N('rdb_gravity');
			for (var i = 0; i < radios.length; i++) {
				if (radios[i].checked) {
					gravity = radios[i].value;
				}
			}			
			original = false;
		}
	}
	
	// retorna a imagem original
	if (original) {
		EditaImagem($("hdn_imagem_original").value);
		return;
	}
	
	// parametros	
	params += "&arquivo=" + $("hdn_arquivo").value;
	params += "&redimensionar=" + redimensionar;
	params += "&largura=" + largura;
	params += "&altura=" + altura;
	params += "&proporcional=" + proporcional;
	params += "&angulo=" + angulo;
	params += "&marca=" + marca;
	params += "&texto=" + texto;
	params += "&texto_cor=" + texto_cor;
	params += "&texto_tam=" + texto_tam;
	params += "&texto_tam=" + texto_tam;
	params += "&negrito=" + negrito;
	params += "&italico=" + italico;
	params += "&underline=" + underline;
	params += "&gravity=" + gravity;
	params += "&moldura=" + $("hdn_moldura").value;
	params += "&futebol=" + $("hdn_futebol").value;
	
	var ajax = new AJAX();
	ajax.url = "/imagem/alterar";	
	ajax.metodo = "POST";
	ajax.params = params;
	ajax.retorno = function(retorno) {
		$("hdn_arquivo").value = retorno;
		ExibeImagem('T');		
	}
	ajax.conectar();	
}

// tipo = 'A'rquivo ou 'T'emp
function ExibeImagem(tipo) {
	var arquivo = $("hdn_arquivo").value;
	AjaxInclude("/imagem/exibe?arquivo="+arquivo+"&tipo="+tipo, "div_img");
}

function saveImageAs (imgOrURL) {
	if (typeof imgOrURL == "object")
		imgOrURL = imgOrURL.src;
	window.win = open (imgOrURL);
	setTimeout("win.document.execCommand('SaveAs')", 500);
}

function Excluir() {
	//if (confirm("Confirma a exclusão da imagem selecionada?")) {
		AguardeImagem(true);
		var ajax = new AJAX();
		ajax.url = "/imagem/excluir";	
		ajax.metodo = "POST";
		ajax.retorno = function(retorno) {
			if (retorno == "OK") {
				$("hdn_arquivo").value = '';
				ExibeEfeitos(false);				
				AguardeImagem(false);
				TelaInicial();				
			} else {
				alert("ERRO - Exclusão de Imagem!")
			}
		}
		ajax.conectar();		
	//}
}

function Sair() {
	var ajax = new AJAX();
	ajax.url = "/imagem/excluir";	
	ajax.metodo = "POST";
	ajax.retorno = function(r) {}
	ajax.conectar();		
}

function Download() {
	var v, id, arquivo;
	location.href = "/imagem/download/";
	//location.href = "/imagem/download?imagem=" + $("hdn_imagem_id").value;
}

function AplicaMarca() {
	c = $("chk_imagemfacil");
	if (!c.checked) {
		if (!confirm("Prezado(a) Usuário(a),\n\nO ImagemFacil.com é um serviço gratuito, o que ajuda a mantê-lo funcionando é a propaganda e divulgação da marca, pedimos a gentileza de deixar a nossa marca em sua imagem, caso não queira, basta cancelar essa mensagem.\n\nObrigado ;-)")) {
			c.checked = false;
		} else {
			c.checked = true;
		}
	}
	AlteraImagem('marca');
}

//--------------------------------------------------------------------------------------------------------------------------------------------------------------------
// ColorPicker
//--------------------------------------------------------------------------------------------------------------------------------------------------------------------
function ColorPickerAdd(id) {
	new Control.ColorPicker("cp_value_"+id, { "swatch":"cp_botao_"+id, IMAGE_BASE:"/images/colorpicker/", onClose:function(){/*AlteraImagem('texto');*/} });
}
function ColorPickerPlay() {
	//new Control.ColorPicker("hdn_cor_fonte", { "swatch" : "div_cp_fonte" });	
	//$("div_colorpicker").style.display = "block";
	//ColorPickerAdd(1);
}
function ColorPickerStop(id) {
	$("div_colorpicker").style.display = "none";
}

//--------------------------------------------------------------------------------------------------------------------------------------------------------------------
// Crop Functions
//--------------------------------------------------------------------------------------------------------------------------------------------------------------------
var CropImageManager = {
	curCrop: null,			
	init: function() {
		this.attachCropper();
	},			
	onChange: function( e ) {
		var vals = $F( Event.element( e ) ).split('|');
		this.setImage( vals[0], vals[1], vals[2] ); 
	},			
	setImage: function( imgSrc, w, h ) {
		$('img_edita').src = imgSrc;
		$('img_edita').width = w;
		$('img_edita').height = h;
		this.attachCropper();
	},
	attachCropper: function() {
		if (this.curCrop == null) this.curCrop = new Cropper.Img('img_edita', {minWidth:120, minHeight:120, onloadCoords:{x1:1, y1:1, x2:1, y2:1}, displayOnInit:true, onEndCrop:onEndCrop });
		else this.curCrop.reset();
	},
	removeCropper: function() {
		if( this.curCrop != null ) {
			this.curCrop.remove();
		}
	},
	resetCropper: function() {
		this.attachCropper();
	},
	preview: function() {
		this.ImgWithPreview = new Cropper.ImgWithPreview('img_edita', {previewWrap: 'previewWrap', minWidth: 120, minHeight: 120, ratioDim: {x: 120, y: 120}, onEndCrop: onEndCrop} )
	}	
};

function onEndCrop(coords, dimensions) {
	$('txt_corte_x').value = coords.x1;
	$( 'txt_corte_y' ).value = coords.y1;
	$( 'txt_corte_l' ).value = dimensions.width;
	$( 'txt_corte_a' ).value = dimensions.height;
}

// seleciona a área de corte
function SelecionarCorte() {		
	i = CropImageManager;	
	i.resetCropper();
	$("a_seleciona_corte").style.display = "none";
	$("a_cancela_corte").style.display = "block";
	new Effect.Move ("div_props", {x:-168, y:76, mode: 'absolute', duration:0.5}); // move para fora da tela
}

function RemoverCorte() {
	i = CropImageManager;
	i.removeCropper();
	if ($('txt_corte_x') != undefined) {
		$('txt_corte_x').value = '';
		$('txt_corte_y').value = '';
		$('txt_corte_l').value = '';
		$('txt_corte_a').value = '';
		$("a_cancela_corte").style.display = "none";
		$("a_seleciona_corte").style.display = "block";	
	}
}

function AplicarCorte() {
	var params;
	var marca = "sim";	
	if ($("txt_corte_x").value == "") {
		if ($("a_seleciona_corte").style.display == "block") {
			alert("1. Clique no botão [Selecionar Área].\n\n2. Selecione com o mouse a área da imagem que deseja cortar.\n\n3. Clique no botão [Cortar Imagem].");
		}
		return;
	}
	params = "marca=" + marca;
	params += "&corte_x=" + parseInt($("txt_corte_x").value);
	params += "&corte_y=" + parseInt($("txt_corte_y").value);
	params += "&corte_l=" + parseInt($("txt_corte_l").value);
	params += "&corte_a=" + parseInt($("txt_corte_a").value);

	AguardeImagem(true);
	RemoverCorte();
	var ajax = new AJAX();
	ajax.url = "/imagem/cortar";
	ajax.metodo = "POST";
	ajax.params = params;
	ajax.retorno = function(retorno) {
		$("hdn_arquivo").value = retorno;	
		ExibeImagem('T');
	}
	ajax.conectar();
}