@extends('BaseSistemaWeb')

@section('CSS')
{{ HTML::style('DataTables/dataTables.bootstrap.min.css') }}
{{ HTML::style('DataTables/responsive.dataTables.min.css') }}
{{ HTML::style('bootstrap-wysihtml5/src/bootstrap-wysihtml5.css') }}
{{ HTML::style('Spectrum/spectrum.min.css') }}
<style>
	.nav-tabs > li.active a{
		background-color: #eee;
	}
	.nav-tabs > li.active a:hover,
	.nav-tabs > li.active a:active,
	.nav-tabs > li.active a:focus{
		background-color: #eee !important;
	}
	.nav-tabs > li > a{
		margin: 0px;
	}
	.nav-tabs > li > a:hover {
		color: #1b1e24;
	}
	.tab-pasarelas .nav-tabs {
		margin-left: 15px;
	}
	/*.block-web .tab-container> .nav-tabs > li.active > a, .block-web .tab-container> .nav-tabs > li.active > a:hover, .block-web .tab-container> .nav-tabs > li.active > a:focus{
		background-color: #FFF !important;
	}*/
	.step.paginas{
		border-top-right-radius: 5px;
		border-top-left-radius: 5px;
		background-color: #687174;
		margin: 1px;
	}
</style>
@stop

@section('Contenido')
<div class="row">
	<div class="col-md-12">
		<h2><i class="icons-web-site" style="font-size: 30px !important;"></i> Sitio Web </h2>
	</div><!--/col-md-12-->
</div><!--/row-->

<div class="row">
	{{--
	<div class="col-md-12">
		<nav class="navbar navbar-inverse">
			<ul class="nav navbar-nav">
				<li><a href="{{ URL::to('templates') }}">Ver todos los Templates</a></li>
				<li><a href="{{ URL::to('templates/create') }}">Crear un Template</a>
			</ul>
		</nav>
	</div>
	--}}
	<div class="col-md-12">
		@if (Session::has('message'))
		<div class="alert alert-info">{{ Session::get('message') }}</div>
		@endif
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div class="block-web">
			<div class="header"> 
				<h3 class="content-header"> 
					Correos electrónicos de gestión de usuarios
				</h3>
			</div>
			<div class="row">
				<div class="col-md-11">
					<div class="tab-container">
												<ul class="nav nav-tabs " style="background-color: unset;">
							<li class="step  active paginas">
								<a  href="#MSJS" data-toggle="tab"><span> Envío de credenciales </span></a>
							</li>
							<li class="step  paginas">
								<a  href="#MSJPF" data-toggle="tab"><span>  Recuperación de contraseña </span> </a>
							</li>
						</ul>
						<div class="tab-content" style="padding-left: 0px; padding-right: 0px;">
							<div class="tab-pane " id="MSJPF">
								<div class="form-group">
									<label>Indiciaciones de correo electrónico para recuperacion de contraseña</label> 
									<textarea class="form-control" rows="7" name="msjbackup">{{ $recuperacion }}</textarea> 
									<span class="text-danger" id="errmsjbackup"> </span> 
								</div>
							</div>
							<div class="tab-pane active" id="MSJS">
								<div class="form-group">
									<div class="form-group">
										<label>Indiciaciones de correo electrónico para envio de credenciales por creacion de cuenta</label> 
										<textarea class="form-control" rows="7" name="msjCred">{{ $cred }}</textarea> 
										<span class="text-danger" id="errmsjCred"> </span> 
									</div>
								</div>
							</div>
						</div>
					</div>

				</div>
			</div>
			
			<div class="form-group bottom">		
				<button type="button" class="btn btn-primary btn-correos">Guardar</button>
			</div>
		</div>
	</div>
</div><!--/row end-->
@stop

@section('JS')
{{ HTML::script('DataTables/jquery.dataTables.min.js') }}
{{ HTML::script('DataTables/dataTables.bootstrap.min.js') }}
{{ HTML::script('DataTables/dataTables.responsive.min.js') }}
{{ HTML::script('bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js') }}
{{ HTML::script('WebPro/plugins/toggle-switch/toggles.min.js') }}
{{ HTML::script('bootstrap-wysihtml5/src/locales/bootstrap-wysihtml5.es-ES.js') }}
{{ HTML::script('Spectrum/spectrum.min.js') }}
{{ HTML::script('Spectrum/jquery.spectrum-es.min.js') }}
<script type="text/javascript">

</script>
@stop

@section('JSOr')
	var htmlColor = '<div class="input color" style="height: 50px;">\
		<input type="text" name="cpColorDeFuente" class="color-picker"> \
	</div>';
	var span = '<span class="label label-success" data-valor="vinculo_recuperacion">Vinculo de recuperacion</span>\
	<span class="label label-success" data-valor="tienda">Tienda</span>\
		<span class="label label-success" data-valor="correo">Correo de soporte</span>\
		<span class="label label-success" data-valor="numero_whatsapp">Numero de whatsApp</span>\
	<span class="label label-success" data-valor="numero_telefono">Numero de teléfono</span>';
	var spanCE = '<span class="label label-success" data-valor="usuario">Usuario</span>\
	<span class="label label-success" data-valor="constrsenha">Contraseña</span>\
		<span class="label label-success" data-valor="ruta_acceso">Ruta de acceso</span>\
		<span class="label label-success" data-valor="tienda">Tienda</span>\
		<span class="label label-success" data-valor="correo">Correo de soporte</span>\
		<span class="label label-success" data-valor="numero_whatsapp">Numero de whatsApp</span>\
	<span class="label label-success" data-valor="numero_telefono">Numero de teléfono</span>';	
	$('[name*="msjbackup"]').each(function(){
		var name = $(this).attr("name");
		$('[name="'+name+'"]').wysihtml5({
			events: {
				load: function(e) {
					var wysihtml5Editor = $('[name="'+name+'"]').data("wysihtml5").editor;
					$(wysihtml5Editor.composer.doc).find("body").html($('[name="'+name+'"]').val());
					$(wysihtml5Editor.composer.doc).on("paste", function(e){
						e.preventDefault();
						var text = e.originalEvent.clipboardData.getData("text/plain");
						text = text.replace(/\n/g, "<br />");
						wysihtml5Editor.composer.commands.exec("insertHTML", text);
					});
					var toolbar = $('[name="'+name+'"]').data("wysihtml5").toolbar;
					$(toolbar).append(htmlColor);
					$(toolbar).find(".color-picker").spectrum({
						color: "#000000",
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: [],
						allowEmpty: false,
						beforeShow: function(color) {
							//
						},
						move: function(color){
							var valor = ( color != null )?color.toHexString():"#000000";
						},
						change: function(color){
							var valor = ( color != null )?color.toHexString():"#000000";
							fontColor(wysihtml5Editor.composer.doc, valor);
						},
						hide: function(color) {
							//
						}
					});
					$(toolbar).append('<li class="slug">'+span+'<li>');
					$(toolbar).find(".slug>span").on("click", function(){
						var valor = '{ '+$(this).attr("data-valor")+' }';
						wysihtml5Editor.composer.commands.exec("insertHTML", valor);
					});
				}
			},
			"stylesheets": ["{{ asset('bootstrap-wysihtml5/lib/css/wysiwyg-color.css') }}"],
			"font-styles": false, "emphasis": true, "lists": false, "html": false, "link": false,
			"image": false, "color": false, locale: "es-ES"
		});
	})
	$('[name*="msjCred"]').each(function(){
		var name = $(this).attr("name");
		$('[name="'+name+'"]').wysihtml5({
			events: {
				load: function(e) {
					var wysihtml5Editor = $('[name="'+name+'"]').data("wysihtml5").editor;
					$(wysihtml5Editor.composer.doc).find("body").html($('[name="'+name+'"]').val());
					$(wysihtml5Editor.composer.doc).on("paste", function(e){
						e.preventDefault();
						var text = e.originalEvent.clipboardData.getData("text/plain");
						text = text.replace(/\n/g, "<br />");
						wysihtml5Editor.composer.commands.exec("insertHTML", text);
					});
					var toolbar = $('[name="'+name+'"]').data("wysihtml5").toolbar;
					$(toolbar).append(htmlColor);
					$(toolbar).find(".color-picker").spectrum({
						color: "#000000",
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: [],
						allowEmpty: false,
						beforeShow: function(color) {
							//
						},
						move: function(color){
							var valor = ( color != null )?color.toHexString():"#000000";
						},
						change: function(color){
							var valor = ( color != null )?color.toHexString():"#000000";
							fontColor(wysihtml5Editor.composer.doc, valor);
						},
						hide: function(color) {
							//
						}
					});
					$(toolbar).append('<li class="slug">'+spanCE+'<li>');
					$(toolbar).find(".slug>span").on("click", function(){
						var valor = '{ '+$(this).attr("data-valor")+' }';
						wysihtml5Editor.composer.commands.exec("insertHTML", valor);
					});
				}
			},
			"stylesheets": ["{{ asset('bootstrap-wysihtml5/lib/css/wysiwyg-color.css') }}"],
			"font-styles": false, "emphasis": true, "lists": false, "html": false, "link": false,
			"image": false, "color": false, locale: "es-ES"
		});
	})
	$(".btn-correos").click(function(e){
		e.preventDefault();
		$.isLoading({ text: "Cargando..." }); NProgress.start();
		$.post(
			"{{ URL::route('SysWebSWebCorreosxUsuario') }}",
			{ msjCred: $('[name="msjCred"]').val(), msjbackup: $('[name="msjbackup"]').val() },
			function(data){
				$.isLoading("hide"); NProgress.done();
				if(data.success){
					new PNotify({ title: "Realizado", text: data.mensaje, type: "success" });
				}
				else{
					new PNotify({ title: "Realizado", text: data.mensaje, type: "error" });
				}
			},
			"json"
		);
	})
@stop