<%@ include file="/jsp/init.jsp" %>
<%@ include file="/jsp/admin/includes/menu-lateral-principal.jspf" %>

<div class="span10 context-pane">
	<%@ include file="/jsp/admin/includes/carregar-dados-wizard.jspf" %>
	
	<div class="formulario-mensagem-preview">
	
		<liferay-ui:header title="mensagem.header.pre-visualizar"/>
		
		<liferay-portlet:renderURL var="proximaPaginaURL">
			<liferay-portlet:param name="mvcPath" value="/jsp/admin/mensagem/agendamento.jsp"/>
			<liferay-portlet:param name="wizard" value="true"/>
			<liferay-portlet:param name="passoAtual" value="4"/>
			<liferay-portlet:param name="rascunho" value="${param.rascunho}"/>
		</liferay-portlet:renderURL>
		
		<liferay-portlet:renderURL var="paginaAnteriorURL">
			<liferay-portlet:param name="mvcPath" value="/jsp/admin/mensagem/formulario.jsp"/>
			<liferay-portlet:param name="wizard" value="true"/>
			<liferay-portlet:param name="passoAtual" value="2"/>
			<liferay-portlet:param name="rascunho" value="${param.rascunho}"/>
		</liferay-portlet:renderURL>
				
		<aui:form name="fmEmailTeste" method="post">
			
			<aui:input name="rascunho" value="${param.rascunho}" type="hidden"/>
			<c:set var="htmlMensagem">
				<c:choose>
					<c:when test="${template.estilo == 0}">
						${template.cabecalho}
						${mensagem.conteudo}
						${template.rodape}
					</c:when>
					<c:otherwise>
						${mensagem.conteudo}
					</c:otherwise>
				</c:choose>
			</c:set>
			<aui:input name="htmlMensagem" value="${htmlMensagem}" type="hidden"/>
			
			<c:set var="tituloPreview">
				<liferay-ui:message key='mensagem.titulo-preview'/>
			</c:set>
			<liferay-util:include 
					page="/jsp/admin/includes/componente-preview-html.jsp" 
					servletContext="<%=this.getServletContext()%>">
				<liferay-util:param name="tituloPreview" value="${tituloPreview}"/>
				<liferay-util:param name="html" value="${htmlMensagem}"/>
			</liferay-util:include>		
			
			<% if (anexos != null && anexos.size() > 0 ) {%>
			
			<div>
				<p></p>
				<p><strong><liferay-ui:message key="anexos.visualizacao"/>:</strong></p>
				<% for (AnexoMensagem anexo : anexos) {%>
				
				<a target="_blank" href="<%=anexo.getAnexoUrl()%>"><%=anexo.getFileName()%></a> <br/>
			
				<%} %>
			</div>
			
			<%} %>	
			
			<aui:field-wrapper cssClass="campos-email-teste">
				<div class="checkbox-wrapper" class="span8">
					<aui:input name="chkEnviarEmail" label="mensagem.preview.checkbox-email-teste" inlineField="true" type="checkbox"/>
				</div>
				<div class="clearfix"></div>
				<div id="camposWrapper" class="span8">
					<aui:input name="emailTeste" inlineField="true" cssClass="span9" label="" value="<%=user.getEmailAddress()%>"/>
					<aui:input name="contaSaidaId" value="${mensagem.contaSaidaId}" type="hidden"/>
					<aui:button name="btEnviarEmail" cssClass="btn-primary" value="mensagem.preview.botao.enviar-email"/>
					<div id="msgStatusEmailPreview"></div>
				</div>
				<div class="clearfix"></div>
			</aui:field-wrapper>
					
		</aui:form>
		
		<div class="botoes-acao-wizard-wrapper clearfix">
			<div class="botao-wizard-wrapper lado-esquerdo">
				<a href="javascript:" id="<portlet:namespace/>btAnterior" class="botao-wizard anterior">
					<i class="icon-circle-arrow-left"></i>
					<liferay-ui:message key="wizard.navegacao.botao.mensagem.preencher-dados"/>
				</a>
			</div>		
			<div class="botao-wizard-wrapper lado-direito">
				<a href="javascript:" id="<portlet:namespace/>btProximo" class="botao-wizard proximo">
					<liferay-ui:message key="wizard.navegacao.botao.mensagem.agendar"/>
					<i class="icon-circle-arrow-right"></i>
				</a>
			</div>
		</div>	
	</div>
</div> 

<liferay-portlet:resourceURL var="enviarEmalTesteURL" id="EnviarEmailMensagemTeste"/>

<aui:script use="node,aui-io-request">

	var camposWrapper = $("#camposWrapper");
	var chkEnviarEmail = $("#<portlet:namespace/>chkEnviarEmail");
	
	var showEnviarEmail = function() {
	    if (chkEnviarEmail.val() == "true"){
	    	camposWrapper.css("display", "block");
	    } else {
	    	camposWrapper.css("display", "none");
	    }
	};
	$(':checkbox').click(function() {
		showEnviarEmail();
	});

	A.one("#<portlet:namespace/>btProximo").on('click', function() {

		window.location='${proximaPaginaURL}';
	});

	A.one("#<portlet:namespace/>btAnterior").on('click', function() {

		window.location='${paginaAnteriorURL}';
	});	
	
	A.one("#<portlet:namespace/>btEnviarEmail").on("click", function(event){
		var objBotao = this;

		A.io.request('${enviarEmalTesteURL}', {
			method: 'post',
			data:  {
				<portlet:namespace/>emailTeste: A.one("#<portlet:namespace/>emailTeste").val(),
				<portlet:namespace/>contaSaidaId: A.one("#<portlet:namespace/>contaSaidaId").val()
			},
			on: {
				start: function() {
					exibirStatusEmailPreview("<liferay-ui:message key='mensagem.teste.enviando'/>");
					objBotao.disabled = true;
				},
				success: function(){
					exibirStatusEmailPreview("<liferay-ui:message key='mensagem.teste.sucesso'/>");
				},
				failure: function() {
					exibirStatusEmailPreview("<liferay-ui:message key='mensagem.teste.enviando'/>");
				},
				end: function() {
					objBotao.disabled = false;
				}
			}
		});
		
	});

	function exibirStatusEmailPreview(mensagem) {
		var obj = A.one("#msgStatusEmailPreview");
		obj.html(mensagem);
	}
</aui:script>
