<?php $__env->startSection('CSS'); ?>
<?php echo HTML::style('bootstrap-select/css/bootstrap-select.min.css'); ?>

<?php echo HTML::style('TouchSpin/jquery.bootstrap-touchspin.min.css'); ?>

<?php echo HTML::style('jquery-ezdz/jquery.ezdz.min.css'); ?>

<?php echo HTML::style('Spectrum/spectrum.min.css'); ?>

<?php echo HTML::style('jQueryUI/jquery-ui-1.12.1.custom/jquery-ui.min.css'); ?>

<?php echo HTML::style('jquery-ui-timepicker-addon/jquery-ui-timepicker-addon.min.css'); ?>

<style type="text/css">
	.pointer{ cursor:pointer; }
	.Separacion{ display: inline-block; padding: 1px; }
</style>
<?php echo HTML::style('image-picker/image-picker.css'); ?>

<style type="text/css">
	.image_picker_image{ height: 260px !important; width: 200px !important; }
</style>
<?php echo HTML::style('WebPro/plugins/dropzone/dropzone.css'); ?>

<?php echo HTML::style('image-picker/image-picker.css'); ?>

<style type="text/css">
	.img-biblioteca { height: 100px; }
	.image_picker_image { height: 100px !important; width: 119px !important; }
	.ModalBiblioteca .modal-dialog { width: 75%; }
	.ModalCronometro .modal-dialog { width: 55%; }
	.ModalBiblioteca .modal-dialog .modal-footer, .ModalCronometro .modal-dialog .modal-footer { display: unset !important; border-top: unset !important; }
	/*.image_picker_image { object-fit: contain; }*/
	.text-count-wrapper-t { display: none; }
	.text-count-wrapper-d { display: none; }
	.modal-backdrop { z-index: 1040 !important; }
	.ModalBiblioteca, .ModalCronometro { z-index: 99999 !important; }
	.ModalVideo{ z-index: 9999 !important; }
	.ModalEtiqueta{ z-index: 10011 !important; }
	.image_picker_image {
	    height: 100px !important;
    	width: 119px !important;
    	object-fit: contain;
	}
	.ezdz-dropzone {
		width: 60px !important;
		height: 50px !important;
		display: inline-block;
		margin-right: 3%;
		border: 3px dotted #787878 !important;
	}
	.ezdz-dropzone div {
		/*line-height: 526%;*/
		padding-top: 6%;
		font: bold 34px arial !important;
		color: #787878;
	}
	.ezdz-dropzone.inactivo {
		pointer-events: none;
	}
	.modalCrearVinvulos {
		z-index: 10010 !important;
	}
	.modalCrearVinvulos .bootstrap-dialog-close-button {
		display: block !important;
	}
	.modal .bootstrap-dialog-close-button{
		display: block !important;
	}
	.mdAvatar .modal-dialog .modal-content .modal-header{ background-color: #363B3F; }
	.progress-bar-danger2 { background-color: #CC0000;}
	.entry-tooltip-positioner {
		position: absolute !important;
		color: #FFFFFF !important;
		background-color: black !important;
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
		font-size: 12px !important;
		font-style: normal !important;
		font-weight: normal !important;
		line-height: 1.42857143 !important;
		text-align: left !important;
		text-align: start !important;
	}
	.modalTooltip{
		z-index: 9999999 !important;
	}
	#cke_mensaje a.cke_button__cronometro span.fa, #cke_mensaje a.cke_button__video span.fa{
		font: normal normal normal 16px/1 FontAwesome !important;
		font-size: 16px !important;
	}
</style>
<?php $__env->stopSection(); ?>


<?php $__env->startSection('Contenido'); ?>
<div class="row">
	<div class="col-md-12">
		<h2><i class="fa fa-envelope-o"></i> E-Mail Marketing </h2>
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div class="block-web">
			<div class="header"> <h3 class="content-header"> Editar secuencia de seguimiento </h3> </div>
			<div class="porlets-content">
				<?php echo Form::open(array('route' => array('SysWebEmailMarketingListasSubscriptoresSecuenciasSeguimientosEditar', $ListaEmail->id, $SecuenciaSeguimiento->id), 'method' => 'post', 'class' => 'form-horizontal row-border', 'id' => 'frmEditar')); ?>

					<div class="form-group asunto">
						<label class="col-sm-3 control-label"> Campos disponibles para el asunto <i class="fa fa-question-circle tooltips" data-toggle="tooltip" data-placement="bottom" title="Estos son los campos de tu lista de suscriptores que podrás agregar en el asunto de este correo"></i> </label>
						<div class="col-sm-9">
							<?php foreach($Campos as $Campo): ?>
							<?php $label = ($Campo->requerido==1)?'success':'info'; ?>
							<div class="Separacion pointer" onclick="AgregarTexto('<?php echo $Campo->slug; ?>', this)"> <span class="label label-<?php echo $label; ?>"> <?php echo $Campo->nombre; ?> </span> </div>
							<?php endforeach; ?>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label"> Asunto </label>
						<div class="col-sm-9">
							<?php echo Form::text('asunto', $SecuenciaSeguimiento->asunto,  array('class' => 'form-control', 'placeholder' => '', 'id' => 'asunto')); ?>

							<div class="progress" style="margin-top: 5px;">
								<div id="progresoAsunto" class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
									<span class="sr-only">0% de progreso</span>
								</div>
							</div>
							<span class="text-danger" id="errasunto"> </span>
						</div>
					</div>
					<div class="form-group mensaje">
						<label class="col-sm-3 control-label"> Campos disponibles para la pre-cabecera <i class="fa fa-question-circle tooltips" data-toggle="tooltip" data-placement="bottom" title="Estos son los campos de tu lista de suscriptores que podrás agregar en la pre-cabecera de este correo"></i> </label>
						<div class="col-sm-9">
							<?php foreach($Campos as $Campo): ?>
							<?php $label = ($Campo->requerido==1)?'success':'info'; ?>
							<div class="Separacion pointer" onclick="AgregarTextoPreCabecera('<?php echo $Campo->slug; ?>', this)"> <span class="label label-<?php echo $label; ?>"> <?php echo $Campo->nombre; ?> </span> </div>
							<?php endforeach; ?>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label"> Pre-cabecera (Opcional) </label>
						<div class="col-sm-9">
							<?php echo Form::text('pre_cabecera', $SecuenciaSeguimiento->preCabecera,  array('class' => 'form-control', 'placeholder' => '', 'id' => 'pre_cabecera')); ?>

							<div class="progress" style="margin-top: 5px;">
								<div id="progresoPreCabecera" class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
									<span class="sr-only">0% de progreso</span>
								</div>
							</div>
							<span class="text-danger" id="errpre_cabecera"> </span>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label"> Adjuntar archivo (Opcional) </label>
						<div class="col-sm-9">
							<div style="padding-top: 10px;"></div>
							<input type="file" name="adjunto" class="flInput" style="border: unset; margin-bottom: 10px;" accept="image/png, image/jpeg, application/pdf, application/msword, application/vnd.ms-excel, application/vnd.ms-powerpoint, application/x-rar-compressed, application/zip, application/x-zip-compressed, multipart/x-zip">
							<span class="text-muted" style="display: block;"> Fotmatos soportados "jpg, jpeg, png, pdf, doc*, xls*, ppt*, zip y rar", no mayores a 5MB </span>
							<?php
								$tieneArchivo = false;
								if( PlantillaCorreo::where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->count() > 0 ){
									$idPCTmp = PlantillaCorreo::select('id')->where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->first()->id;
									if( AdjuntoxPlantilla::where('plantillas_correos_id', '=', $idPCTmp)->count() > 0 ){
										$tieneArchivo = true;
										$idAATmp = AdjuntoxPlantilla::select('archivos_adjuntos_id AS aaId')->where('plantillas_correos_id', '=', $idPCTmp)->first()->aaId;
										$ArchivoAdjunto = ArchivoAdjunto::select('id', 'nombre')->where('id', '=', $idAATmp)->first();
										?>
							<span class="label label-info archivoAdjunto<?php echo $ArchivoAdjunto->id; ?>">
								<?php echo $ArchivoAdjunto->nombre; ?> &nbsp;&nbsp; <i class="fa fa-trash" style="color: #ff634d; cursor: pointer;" onclick="eliminarArchivo(<?php echo $ArchivoAdjunto->id; ?>)"></i>
							</span>
										<?php
									}
								}
							?>
						</div>
					</div>
					<div class="form-group mensaje">
						<label class="col-sm-3 control-label"> Campos disponibles </label>
						<div class="col-sm-9">
							<?php foreach($Campos as $Campo): ?>
							<?php $label = ($Campo->requerido==1)?'success':'info'; ?>
							<div class="Separacion pointer" onclick="AgregarTexto('<?php echo $Campo->slug; ?>', this)"> <span class="label label-<?php echo $label; ?>"> <?php echo $Campo->nombre; ?> </span> </div>
							<?php endforeach; ?>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label"> Evaluar vínculos </label>
						<div class="col-sm-9">
							<label class="checkbox-inline">
								<?php $Clic = ($SecuenciaSeguimiento->clic==1)?true:null; ?>
								<?php echo Form::checkbox('clic', 1, $Clic, array('id' => 'clic')); ?>

								<span class="custom-checkbox"></span> Medir clics
							</label>
							<span class="text-danger" id="errconfirmacion"> </span>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label"> Mensaje </label>
						<div class="col-sm-6">
							<?php /* Form::textarea('mensaje'(, str_replace('{ clic }', '', $SecuenciaSeguimiento->mensaje), array('class' => 'form-control ckeditor', 'rows' => '2', 'placeholder' => 'Escriba el mensaje')) */ ?>
							<?php 
								$msj = htmlspecialchars_decode($SecuenciaSeguimiento->mensaje);
								$msj = preg_replace('/(\"{\")/', '\'{"', $msj);
								$msj = preg_replace('/(}\")/', '}\'', $msj);
							?>
							<?php echo Form::textarea('mensaje', $msj, array('class' => 'form-control ckeditor', 'rows' => '2', 'placeholder' => 'Escriba el mensaje')); ?>

							<span class="text-danger" id="errmensaje"> </span>
						</div>
					</div>
					<div id="hdnmensaje" style="display: none;"></div> <?php /* Div utilizado para modificar el mensaje en caso de realizar una evaluación de vínculos */ ?>
					<div class="form-group">
						<label class="col-sm-3 control-label"> Días despues </label>
						<div class="col-sm-9">
							<?php echo Form::text('dias_despues', $SecuenciaSeguimiento->dias_despues,  array('id' => 'dias_despues')); ?>

							<span class="text-danger" id="errdias_despues"> </span>
							<?php
								$idSS = $SecuenciaSeguimiento->id;
								$nProgramado = DB::table('colas_tareas AS ct')->whereRaw('ct.payload LIKE \'%"SSID":"'.$idSS.'"%\' OR ct.payload LIKE \'%"SSID":'.$idSS.'%\'')->count();
							?>
							<?php if( $nProgramado > 0 ): ?>
								<br>
								<div class="alert alert-info" role="alert">
									Este cambio será aplicado a los suscriptores de tu lista que no tengan una secuencia programada
								</div>
							<?php endif; ?>
						</div>
					</div>
					<div class="form-group" style="display: none;">
						<label class="col-sm-3 control-label"> Tipo de mensaje </label>
						<div class="col-sm-9">
							<label class="checkbox-inline">
								<?php $ST = ($SecuenciaSeguimiento->tipo=='T')?true:null; ?>
								<?php echo Form::checkbox('tipo', 1, $ST, array('id' => 'tipo')); ?>

								<span class="custom-checkbox"></span> Solo texto, no quiero la plantilla HTML
							</label>
							<span class="text-danger" id="errtipo"> </span>
						</div>
					</div>
					<div id="confplantilla" <?php if($ST): ?> style="display: none;" <?php endif; ?>>
						<div class="form-group">
							<label class="col-sm-3 control-label"> Plantilla HTML </label>
							<div class="col-sm-9">
								<?php /* MACRO REALIZADO POR KEVIN MORÁN PUEDE UBICARSE EN /app/start/global.php AL FINAL DEL DOCUMENTO POR SI NECESITA MODIFICARSE */ ?>
								<?php echo Form::slPlantillasMensajesC('color', array('azul' => 'blue', 'verde' => 'green', 'rosado' => 'pink'), $SecuenciaSeguimiento->color); ?>

								<span class="text-danger" id="errcolor"> </span>
							</div>
						</div>
					</div>
					<?php $Cantidad = EtiquetaxSecuenciaSeguimiento::where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->count(); ?>
					<div style="display: none;">
						<div class="form-group">
							<label class="col-sm-3 control-label"> Enviar mensaje a </label>
							<div class="col-sm-9">
								<div class="radio-inline">
									<label>
										<input type="radio" <?php if($Cantidad == 0): ?> checked <?php endif; ?> value="T" id="suscriptoresTodos" name="suscriptores">
										<span class="custom-radio"></span> Todos los suscriptores
									</label>
								</div>
								<div class="radio-inline">
									<label>
										<input type="radio" <?php if($Cantidad > 0): ?> checked <?php endif; ?> value="S" id="suscriptoresSegmento" name="suscriptores">
										<span class="custom-radio"></span> Segmento de etiquetas
									</label>
								</div>
							</div>
						</div>
						<div id="dvSegmentoEtiquetas" <?php if($Cantidad == 0): ?> style="display: none;" <?php endif; ?> >
							<div class="form-group">
								<label class="col-sm-3 control-label"> Etiquetas asociadas </label>
								<div class="col-sm-9">
									<select class="form-control selectpicker" multiple data-live-search="true" data-selected-text-format="count" id="etiquetas" name="etiquetas[]">
										<option value="0" disabled> Seleccione las etiquetas a asociar... </option>
										<?php foreach($Etiquetas as $indice => $Etiqueta): ?>
										<?php $seleccionada = EtiquetaxSecuenciaSeguimiento::where('etiquetas_id', '=', $Etiqueta->id)->where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->count(); ?>
										<option value="<?php echo $Etiqueta->id; ?>" <?php if( $seleccionada == 1 ): ?> selected <?php endif; ?> id="op<?php echo $Etiqueta->id; ?>"> <?php echo $Etiqueta->nombre; ?> </option>
										<?php endforeach; ?>
									</select>
									<span class="text-danger" id="erretiquetas"> </span>
									<div id="dvEtiquetas" style="padding-top: 10px;">
										<?php foreach($Etiquetas as $indice => $Etiqueta): ?>
											<?php if( EtiquetaxSecuenciaSeguimiento::where('etiquetas_id', '=', $Etiqueta->id)->where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->count() == 1 ): ?>
										<span class="label label-info" data-valor="<?php echo $Etiqueta->nombre; ?>">
											<?php echo $Etiqueta->nombre; ?>

										</span> &nbsp;
											<?php endif; ?>
										<?php endforeach; ?>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="bottom">
						<button id="btnPreview" type="button" class="btn btn-default tooltips" onclick="PruebaEnvio(<?php echo $SecuenciaSeguimiento->id; ?>)" data-toggle="tooltip" title="Realiza una prueba del envío del mensaje"> <i class="fa fa-eye"></i> </button>
						<?php echo Form::button('Editar', array('class' => 'btn btn-warning', 'id' => 'btnEditar', 'type' => 'submit')); ?>

						<?php echo HTML::linkRoute('SysWebEmailMarketingListasSubscriptoresSecuenciasSeguimientos', 'Cancelar', array($ListaEmail->id), array('class' => 'btn btn-default')); ?>

					</div>
				<?php echo Form::close(); ?>

				<?php 
					$cid = Cliente::select('id')->where('users_id', '=', Auth::user()->id)->first()->id;
					$etiquetas = Etiqueta::select('id', 'nombre')->where('clientes_id', '=', $cid)->get();
					$Cliente = Cliente::find(Cliente::select('id')->where('users_id', '=', Auth::user()->id)->first()->id);
				?>
				<input type="hidden" id="rutalistas" value="<?php echo URL::route('SysWebPAterrizajeListasSuscriptores', array('')); ?>/">
				<input type="hidden" id="cid" value="<?php echo $cid; ?>">
				<input type="hidden" id="rutacronomail"  value="<?php echo URL::route('SysWebEmailMarketingCronometro', array('idMCoS', 'parametros')); ?>">
				<input type="hidden" id="zonaHoraria" value="<?php echo $Cliente->zona_horaria; ?>">
				<input type="hidden" id="idLSE" value="<?php echo $SecuenciaSeguimiento->id; ?>">
				<input type="hidden" id="rutagenerarimgvideo" value="<?php echo URL::route('SysWebEmailMarketingGenImgVideo'); ?>">
				<input type="hidden" id="rutagenerarimggmapyv" value="<?php echo URL::route('SysWebEmailMarketingGenImgArchivo'); ?>">
		</div>
		
	</div>
</div><!--/row end-->
<?php $__env->stopSection(); ?>

<?php $__env->startSection('JS'); ?>
<?php /* HTML::script('WebPro/plugins/ckeditor-new/ckeditor.js') */ ?>
<?php echo HTML::script('CKEditor/ckeditor-full/ckeditor.js'); ?>

<?php echo HTML::script('CKEditor/ckeditor-full/adapters/jquery.js'); ?>

<?php echo HTML::script('TouchSpin/jquery.bootstrap-touchspin.min.js'); ?>

<?php echo HTML::script('image-picker/image-picker.min.js'); ?>

<?php echo HTML::script('SysWeb/SumeClientes/php.js'); ?>

<?php echo HTML::script('bootstrap-select/js/bootstrap-select.min.js'); ?>

<?php echo HTML::script('bootstrap-select/js/i18n/defaults-es_CL.min.js'); ?>

<?php echo HTML::script('WebPro/plugins/dropzone/dropzone.min.js'); ?>

<?php echo HTML::script('jquery-ezdz/jquery.ezdz.min.js'); ?>

<?php echo HTML::script('jQueryValidate/jquery.validate.min.js'); ?>

<?php echo HTML::script('jQueryValidate/additional-methods.min.js'); ?>

<?php echo HTML::script('jQueryValidate/jquery.validationEngine-es.js'); ?>

<?php echo HTML::script('Alphanum/jquery.alphanum.min.js'); ?>

<?php echo HTML::script('jQuery-Text-Counter/textcounter.min.js'); ?>

<?php echo HTML::script('bootstrap-datetimepicker/js/moment-with-locales.js'); ?>

<?php echo HTML::script('bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js'); ?>

<?php echo HTML::script('Spectrum/spectrum.min.js'); ?>

<?php echo HTML::script('Spectrum/jquery.spectrum-es.min.js'); ?>

<?php echo HTML::script('jQueryUI/NT/jquery-ui.min.js'); ?>

<?php echo HTML::script('jquery-ui-timepicker-addon/jquery-ui-timepicker-addon.min.js'); ?>

<?php echo HTML::script('jquery-ui-timepicker-addon/jquery-ui-timepicker-es.js'); ?>

<script type="text/javascript">
	CKEDITOR.config.disableObjectResizing = true;
	CKEDITOR.config.extraPlugins = "simplebutton";
	CKEDITOR.config.allowedContent = true;
	CKEDITOR.config.forcePasteAsPlainText = true;
	<?php if( !isset( $_GET['avanzado'] ) ): ?>
	CKEDITOR.config.removeButtons = "Source";
	<?php endif; ?>
	function AgregarTexto(slug, elemento){
		var slug = slug;
		slug = "{ "+slug+" }";
		if( $(elemento).closest(".form-group").hasClass("mensaje") ){
			CKEDITOR.instances.mensaje.insertText(slug);
		}
		else{
			var txtAsunto = $('[name="asunto"]');
			var caretPos = txtAsunto[0].selectionStart;
			var textAreaTxt = txtAsunto.val();
			var txtToAdd = slug;
			txtAsunto.val(textAreaTxt.substring(0, caretPos) + txtToAdd + textAreaTxt.substring(caretPos));
		}
	}
	function AgregarTextoPreCabecera(slug){
		var slug = slug;
		slug = "{ "+slug+" }";
		var txtAsunto = $("#pre_cabecera");
		var caretPos = txtAsunto[0].selectionStart;
		var textAreaTxt = txtAsunto.val();
		var txtToAdd = slug;
		txtAsunto.val(textAreaTxt.substring(0, caretPos) + txtToAdd + textAreaTxt.substring(caretPos));
	}
	function barraProgreso(elemento){
		var contadorWrapper = (elemento=="Asunto")?$(".text-count-wrapper-t"):$(".text-count-wrapper-d");
		var barra = (elemento=="Asunto")?$("#progresoAsunto"):$("#progresoPreCabecera");
		var total = (elemento=="Asunto")?100:250;
		var letrasEscritas = parseInt( contadorWrapper.find(".text-count").html() );
		var color = "";
		var porcentajeEscrito = 100;
		if( letrasEscritas <= total ){
			porcentajeEscrito = (letrasEscritas*100)/total;
			if( elemento == "Asunto" ){
				if( letrasEscritas <= 43 ){
					color = "progress-bar-success";
				}
				else if( letrasEscritas >= 44 && letrasEscritas <= 60  ){
					color = "progress-bar-warning";
				}
				else if( letrasEscritas >= 61 && letrasEscritas <= 100 ){
					color = "progress-bar-danger";
				}
			}
			else{
				if( letrasEscritas <= 39 ){
					color = "progress-bar-danger";
				}
				else if( letrasEscritas >= 40 && letrasEscritas <= 70  ){
					color = "progress-bar-warning";
				}
				else if( letrasEscritas >= 71 && letrasEscritas <= 130 ){
					color = "progress-bar-success";
				}
				else if( letrasEscritas >= 131 && letrasEscritas <= 250 ){
					color = "progress-bar-danger2";
				}
			}
		}
		barra.removeClass("progress-bar-success progress-bar-warning progress-bar-danger progress-bar-danger2").addClass(color).css("width", porcentajeEscrito+"%");
	}
	function DecodificarVinculo(){
		editor = CKEDITOR.instances.mensaje;
		var mensaje = editor.getData();
		$("#hdnmensaje").html(mensaje);
		$("#hdnmensaje").find("a").each(function(){
			var ruta = $(this).attr("href");
			if( ruta.indexOf("{ clic }") !== -1 ){
				ruta = ruta.replace("-", "/");
				ruta = ruta.replace("{ clic }", "");
				ruta = decode(ruta);
				$(this).attr("href", ruta);
			}
		});
		$("#hdnmensaje").find("img").each(function(){
			var width = $(this).css("width").replace("px","");
			var height = $(this).css("height").replace("px","");
			$(this).attr("width", width);
			$(this).attr("height", height);
		});
		mensaje = $("#hdnmensaje").html();
		editor.setData(mensaje);
		for(instance in CKEDITOR.instances){ CKEDITOR.instances[instance].updateElement(); }
	}
	function CodificarVinculo(){
		editor = CKEDITOR.instances.mensaje;
		var mensaje = editor.getData();
		$("#hdnmensaje").html(mensaje);
		$("#hdnmensaje").find("a").each(function(){
			var codificado = encode($(this).attr("href"));
			codificado = codificado.replace("/", "-");
			var ruta = "{ clic }"+codificado;
			//var ruta = "{ clic }"+encode($(this).attr("href"));
			$(this).attr("href", ruta);
		});
		mensaje = $("#hdnmensaje").html();
		editor.setData(mensaje);
		for(instance in CKEDITOR.instances){ CKEDITOR.instances[instance].updateElement(); }
	}
	/*function PruebaEnvio(){
		var Campos = [ <?php foreach($Campos as $Campo): ?> { slug:"<?php echo $Campo->slug; ?>", nombre:"<?php echo $Campo->nombre; ?>" }, <?php endforeach; ?> ];
		editor = CKEDITOR.instances.mensaje;
		var mensaje = editor.getData();
		var campos = "";
		for(i=0; i<Campos.length; i++){
			if( mensaje.search(Campos[i].slug) != -1 ){
				campos += "<div class='form-group'> \
							<label> "+Campos[i].nombre+" </label> <br> \
							<input type='text' name='"+Campos[i].slug+"' class='form-control'> \
							<input type='hidden' name='Campos[]' value='"+Campos[i].slug+"'> \
							<spam id='err"+Campos[i].slug+"' class='text-danger'> </spam> \
						</div>"
			}
		}
		if( campos != "" ){ var fielset = "<fielset> <legend> Campos personalizados del mensaje </legend> "+campos+" </fielset>"; }
		for(instance in CKEDITOR.instances){ CKEDITOR.instances[instance].updateElement(); }
		var tipo = ($("#tipo").is(":checked"))?'T':'H';
		var mensaje = " \
						<div class='row'> \
							<div class='col-xs-12'> \
								<form id='frmPruebaEnvio'> \
									<div class='form-group'> \
										<label> Correo electronico a enviar </label> <br> \
										<input type='text' name='correo_electronico0' class='form-control'> \
										<spam id='errcorreo_electronico0' class='text-danger'> </spam> \
									</div> \
									<fielset> \
										<legend> Campos personalizados del mensaje </legend> \
										"+campos+"\
									</fielset> \
									<input type='hidden' name='listas_emails_id' value='<?php echo $ListaEmail->id; ?>'> \
									<input id='msj' type='hidden' name='mensaje' value=''> \
									<input type='hidden' name='clic' value='"+$("#clic").val()+"'> \
									<input type='hidden' name='tipo' value='"+tipo+"'> \
									<input type='hidden' name='color' value='"+$("#slPlantillasMensajes").val()+"'> \
									<input type='hidden' name='asunto' value='"+$("#asunto").val()+"'> \
								</form> \
							</div> \
						</div> \
					";
		BootstrapDialog.show({
			title: "Correo de prueba de secuencia de seguimiento",
			type: BootstrapDialog.TYPE_DEFAULT,
			message: mensaje,
			draggable: true,
			buttons: [{
				id: "btnEnviar",
				label: "Enviar",
				cssClass: "btn-primary",
				action: function(dialogItself){
					$("#btnEnviar").prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i> Enviando');
					$.post(
						"<?php echo URL::route('SysWebEmailMarketingPruebaEnvioSSEnviar'); ?>",
						$("#frmPruebaEnvio").serialize(),
						function(data){
							$("#btnEnviar").prop("disabled", false).html("Enviar");
							if(data.success){
								new PNotify({ title: "Felicidades!", text: data.mensaje, type: "success" });
								dialogItself.close();
							}
							else{
								if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
								$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
							}
							if($("#clic").is(":checked")){ DecodificarVinculo(); }
						},
						"json"
					);
				},
			}],
			onhide: function(dialogRef){
				if($("#clic").is(":checked")){ DecodificarVinculo(); }
			},
			onshown: function(dialogRef){
				//CONVERSIÓN DE VÍNCULOS
				if($("#clic").is(":checked")){ CodificarVinculo(); }
				editor = CKEDITOR.instances.mensaje;
				var msj = editor.getData();
				$("#hdnmensaje").html(msj);
				msj = $("#hdnmensaje").html();
				$("#msj").val(msj);
			},
		});
	}*/
	function PruebaEnvio(idSS){
		var idSS = idSS;
		editor = CKEDITOR.instances.mensaje;
		var msj = editor.getData();
		$.post(
			"<?php echo URL::route('SysWebEmailMarketingPruebaEnvioSSObtencionCampos'); ?>",
			{idSS:idSS, mensaje: msj, asunto:$("#asunto").val()},
			function(data){
				if(data.success){
					var fielset = "";
					var campos = "";
					var clase = "hide"
					if(data.campos.length > 0){
						clase = "";
						for(i=0; i<data.campos.length; i++){
							campos += "<div class='form-group'> \
											<label> "+data.campos[i].nombre+" </label> <br> \
											<input type='text' name='"+data.campos[i].slug+"' class='form-control'> \
											<input type='hidden' name='Campos[]' value='"+data.campos[i].slug+"'> \
											<spam id='err"+data.campos[i].slug+"' class='text-danger'> </spam> \
										</div>"
						}
						var fielset = "<fielset> \
											<legend> Campos personalizados del mensaje </legend> \
											"+campos+" \
										</fielset>";
					}
					var mensaje = " \
						<div class='row'> \
							<div class='col-xs-12'> \
								<form id='frmPruebaEnvio'> \
									<div class='form-group'> \
										<label> Correo electronico a enviar </label> <br> \
										<input type='text' name='correo_electronico0' class='form-control'> \
										<spam id='errcorreo_electronico0' class='text-danger'> </spam> \
									</div> \
									<fielset class='camposP "+clase+"'> \
										<legend> Campos personalizados del mensaje </legend> \
										"+campos+"\
									</fielset> \
									<input type='hidden' name='idSS' value='"+idSS+"'> \
									<input type='hidden' name='clic' value='"+$("#clic").val()+"'> \
									<input type='hidden' name='tipo' value='T'> \
									<input type='hidden' name='color' value='"+$("#slPlantillasMensajes").val()+"'> \
									<input type='hidden' name='asunto' value='"+$("#asunto").val()+"'> \
									<input type='hidden' name='mjs' value='"+msj+"'> \
								</form> \
							</div> \
						</div> \
					";
					BootstrapDialog.show({
						title: "Correo de prueba de secuencia de seguimiento",
						type: BootstrapDialog.TYPE_DANGER,
						message: mensaje,
						draggable: true,
						closable: false,
						closeByBackdrop: false,
						cssClass: "mdAvatar",
						buttons: [{
							id: "btnEnviar",
							label: "Enviar",
							cssClass: "btn-primary btn-block btn-lg",
							action: function(dialogItself){
								$("#btnEnviar").prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i> Enviando');
								<?php if(PlantillaCorreo::where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->count() > 0): ?>
									var idP = "<?php echo PlantillaCorreo::select('id')->where('secuencias_seguimientos_id', '=', $SecuenciaSeguimiento->id)->first()->id; ?>";
									var ruta = "<?php echo URL::route('SysWebEmailMarketingEnvioCorreoPlantillaxCliente'); ?>";
									var camposP = [];
									var formData = new FormData();
									$("#frmPruebaEnvio").find(".camposP").find("input").each(function(){
										var nombre = $(this).attr("name");
										var valor =  $(this).val();
										camposP.push(valor);
										formData.append(nombre, valor)
									});
									/*var envio = {
										codigoHTML: msj,
										tipo: "enviar",
										tipoCliente: "secuencia",
										idS: idSS,
										idP: idP,
										campos: camposP,
										correo: $('[name="correo_electronico0"]').val(),
										adjunto: $('[name="adjunto"]').val(),
									}*/
									if($('[name="adjunto"]').val() != ""){
										formData.append("adjunto", $('[name="adjunto"]')[0].files[0]);
									}
									formData.append("codigoHTML", msj);
									formData.append("tipo", "enviar");
									formData.append("tipoCliente", "secuencia");
									formData.append("idS", idSS);
									formData.append("idP", idP);
									formData.append("campos", camposP);
									formData.append("correo", $('[name="correo_electronico0"]').val());
									$.ajax({
									url: ruta,
									type:"POST",
									processData:false,
									contentType: false,
									data: formData,
									complete: function(data){
										$("#btnEnviar").prop("disabled", false).html("Enviar");
										if(data.responseJSON.success){
											new PNotify({ title: "Felicidades!", text: data.responseJSON.mensaje, type: "success" });
											dialogItself.close();
										}
										else{
											if(data.responseJSON.mensaje != ''){ new PNotify({ title: "Error", text: data.responseJSON.mensaje, type: "error" }); }
											$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
										}
									}
								});
								<?php else: ?>
									var ruta = "<?php echo URL::route('SysWebEmailMarketingPruebaEnvioSSEnviar'); ?>";
									var envio = $("#frmPruebaEnvio").serialize();
									$.post(
										ruta,
										envio,
										function(data){
											$("#btnEnviar").prop("disabled", false).html("Enviar");
											if(data.success){
												new PNotify({ title: "Felicidades!", text: data.mensaje, type: "success" });
												dialogItself.close();
											}
											else{
												if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
												$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
											}
										},
										"json"
									);
								<?php endif; ?>				
							}
						}],
						onhide: function(dialogRef){
							$("body").addClass("modal-open");
							if($("#clic").is(":checked")){ DecodificarVinculo(); }
						},
						onshown: function(dialogRef){
							$("body").removeClass("modal-open");
							//CONVERSIÓN DE VÍNCULOS
							if($("#clic").is(":checked")){ CodificarVinculo(); }
							editor = CKEDITOR.instances.mensaje;
							var msj = editor.getData();
							$("#hdnmensaje").html(msj);
							msj = $("#hdnmensaje").html();
							$("#msj").val(msj);
						}
					});
				}
				else{
					if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
				}
			},
			"json"
		);
	}
	function eliminarArchivo(idA){
		var idA = idA;
		var mensaje = '<form action="#" id="frmCrearCampanha"> \
			<div class="form-group" style="margin-bottom: 0px;"> \
				<label> ¿Seguro que deseas eliminar el archivo adjunto? </label> \
				<div class="alert alert-info" role="alert" style="margin-bottom: 0px;"> \
					Al eliminarlo este archivo dejará de enviarse como adjunto en este correo a los futuros suscriptores \
				</div> \
			</div> \
			<input type="hidden" name="idAA" value="'+idA+'"> \
		</form>';
		BootstrapDialog.show({
			cssClass: "mdAvatar",
			title: "Eliminar de archivo adjunto",
			type: BootstrapDialog.TYPE_WARNING,
			message: mensaje,
			draggable: true,
			buttons: [{
				id: "btnEliminarAA",
				label: "Eliminar",
				cssClass: "btn-warning btn-lg btn-block",
				action: function(dialogItself){
					$('[type="file"]').after('<input type="hidden" name="adjuntoEl" value="'+idA+'">');
					$(".archivoAdjunto"+idA).remove();
					$(".ezdz-dropzone").removeClass("inactivo");
					dialogItself.close();
				}
			}]
		});
	}
	var ckEditor = CKEDITOR.replace(
		"mensaje",
		{
			toolbar: [
				{
					name: "document",
					items: [
						"Source"
					]
				},
				{
					name: "clipboard",
					items: [
						"Cut",
						"Copy",
						"Paste",
						"PasteText",
						"PasteFromWord",
						"-",
						"Undo",
						"Redo"
					]
				},
				{
					name: "editing",
					items: [
						"Scayt"
					]
				},

				{
					name: "basicstyles",
					items: [
						"Bold",
						"Italic",
						"Underline",
						"Strike",
						"-",
						"RemoveFormat"
					]
				},
				{
					name: "paragraph",
					items: [
						"NumberedList",
						"BulletedList",
						"-",
						"Outdent",
						"Indent",
						"-",
						"Blockquote"
					]
				},
				{
					name: "align",
					items: [
						"JustifyLeft",
						"JustifyCenter",
						"JustifyRight",
						"JustifyBlock"
					]
				},
				{
					name: "links",
					items: [
						"Link",
						"Unlink"
					]
				},
				{
					name: "insert",
					items: [
						"Image",
						"Table",
						"Cronometro",
						"Video"
					]
				},
				{
					name: "styles",
					items: [
						"Styles",
						"Format",
						"Font",
						"FontSize"
					]
				},
				{
					name: "colors",
					items: [
						"TextColor",
						"BGColor"
					]
				},
				{
					name: "tools",
					items: [
						"simplebutton",
						"Maximize"
					]
				}
			]
		}
	);
	ckEditor.addCommand("CrearCronometro", {
		exec: function(e) {
			modalCronometro();
		},
	});
	ckEditor.ui.addButton("Cronometro", {
		label: "Cronómetro",
		command: "CrearCronometro",
		toolbar: "insert",
		icon: "_ fa fa-clock-o _"
	});
	ckEditor.addCommand("CrearVideo", {
		exec: function(e) {
			modalVideoTextoPlano();
		},
	});
	ckEditor.ui.addButton("Video", {
		label: "Agregar Video",
		command: "CrearVideo",
		toolbar: "insert",
		icon: "_ fa fa-youtube-play _"
	});
	CKEDITOR.on("dialogDefinition", function(ev){
		var dialogName = ev.data.name;
		var dialogDefinition = ev.data.definition;
		if( dialogName == "image" ){
			var viejoOnShow = dialogDefinition.onShow;
			var nuevoOnShow = function(){
				//CONFIGURO LA SELECCIÓN DE LA IMÁGEN DE LA BIBLIOTECA DE IMÁGENES --------------------------------------------------------------------------------------
				var rutaImagen = $(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_input_text");
				rutaImagen.prop("readonly", true);
				$(".cke_dialog").find(".btnBiblioteca").remove();
				$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").append('<a style="margin-top: 14px; margin-left: auto; margin-right: auto; -moz-user-select: none;" href="javascript:void(0)" title="Buscar en biblioteca" hidefocus="true" class="cke_dialog_ui_button btnBiblioteca" role="button"> \
					<span class="cke_dialog_ui_button abierto">Buscar en biblioteca</span> \
				</a>');
				$(".cke_dialog").find(".btnCronometro").remove();
				$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").append('<a style="display: none; margin-top: 14px; margin-left: auto; margin-right: auto; -moz-user-select: none;" href="javascript:void(0)" title="Modificar cronometro" hidefocus="true" class="cke_dialog_ui_button btnCronometro" role="button"><span class="cke_dialog_ui_button abierto">Modificar cronometro</span></a>');
				$(".cke_dialog").find(".btnVideoB").remove();
				$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").append('<a style="display: none; margin-top: 14px; margin-left: auto; margin-right: auto; -moz-user-select: none;" href="javascript:void(0)" title="Modificar video" hidefocus="true" class="cke_dialog_ui_button btnVideoB" role="button"><span class="cke_dialog_ui_button abierto">Modificar video</span></a>');
				if(  rutaImagen[1].value.includes("Cronometro") ){
					var parametrosCronometro = rutaImagen[1].value;
					$(".cke_dialog").find(".cke_dialog_tabs").find("a[title='Avanzado']").css("display", "none");
					$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").find(".btnBiblioteca").css("display", "none");
					$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").find(".btnCronometro").css("display", "");
					$(".cke_dialog").find(".btnCronometro").click(function(e){
						var rutaCronometro = rutaImagen[1].value;
						var splitRutaC = rutaCronometro.split("/");
						var parametros = splitRutaC.pop();
						modalCronometro(parametros);
						$(".cke_dialog").find(".cke_dialog_ui_button_ok").find(".cke_dialog_ui_button").trigger("click");
					});
				}
				else if( rutaImagen[1].value.includes("videos-de-correos") ){
					$(".cke_dialog").find(".cke_dialog_tabs").find("a[title='Avanzado']").css("display", "none");
					$(".cke_dialog").find(".cke_dialog_tabs").find("a[title='Vínculo']").css("display", "none");
					$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").find(".btnBiblioteca").css("display", "none");
					$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").find(".btnCronometro").css("display", "none");
					$(".cke_dialog").find(".cke_dialog_image_url .cke_dialog_ui_button").closest(".cke_dialog_ui_hbox_last").find(".btnVideoB").css("display", "");
					$(".cke_dialog").find(".btnVideoB").click(function(e){
						$(".cke_dialog").find(".cke_dialog_ui_button_ok").find(".cke_dialog_ui_button").trigger("click");
						var inputsCk = $(".cke_dialog").find(".cke_dialog_ui_input_text");
						var urlVideo = inputsCk[15].value;
						var rutaImagenVideo = rutaImagen[1].value;
						modalVideoTextoPlano(urlVideo, rutaImagenVideo);
					});
				}
				else{
					$(".cke_dialog").find(".cke_dialog_tabs").find("a[title='Avanzado']").css("display", "");
				}
				$(".cke_dialog").find(".btnBiblioteca").click(function(e){
					e.preventDefault();
					var boton = $(this);
					boton.addClass("abierto");
					var mensaje = '<div class="col-md-12"> \
						<div class="row"> \
							<div class="col-md-8"> \
								<label> Selecciona una imágen de las bibliotecas de imágenes </label> \
								<div style="height: 465px; overflow: auto;" id="Biblioteca"> \
									<select id="slBiblioteca" style="visibility: hidden;"></select> \
								</div> \
							</div> \
							<div class="col-md-4"> \
								<div class="row"> \
									<div class="col-md-12"> \
										<label> Ó Sube tu imágen (Esta se almacenará en tu biblioteca y podras utilizarla cuantas veces quieras) </label> \
										<form action="#" class="dropzone" id="flImagen"> \
											<div class="fallback"> \
												<input name="file" type="file"> \
											</div> \
										</form> \
									</div> \
									<div class="col-md-12" style="padding-top: 10px;"> \
										<div class="alert alert-warning" role="alert"> \
											<ul> \
												<li> Las imágenes no deben tener un tamaño mayor a 1MB </li> \
												<li> Solo aceptamos imágenes en formato JPG, PNG y GIF </li> \
											</ul> \
										</div> \
									</div> \
									<div class="col-md-12" style=""> \
										<div class="form-group"> \
											<label> Ó escriba la ruta de la imagen </label> \
											<input type="text" class="form-control" id="txtImagen"></input> \
										</div> \
										<div class="form-group"> \
											<button type="button" class="btn btn-primary btn-block btn-lg" id="btnCrearImagen"> Usar imágen </button> \
										</div> \
									</div> \
								</div> \
							</div> \
						</div> \
					</div>';
					BootstrapDialog.show({
						title: "Biblioteca de imágenes",
						type: BootstrapDialog.TYPE_DEFAULT,
						message: mensaje,
						draggable: true,
						cssClass: "ModalBiblioteca",
						onshown: function(dialogRef){
							$("#flImagen").dropzone({
								url: $("#hdnRutaImagenes").val(),
								maxFiles: 1,
								acceptedFiles: "image/jpeg,image/png,image/gif",
								maxFilesize: 1,
								success: function(file, response){
									if(response.success){
										var value = response.imagen;
										var img = new Image();
										img.src = value;
										img.onload = function(){
											if(img.height != 0){
												rutaImagen.val(value);
												rutaImagen.trigger("blur");
												$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
												dialogRef.close();
												$.isLoading("hide"); NProgress.done();
											}
											else{
												new PNotify({ title: "Error", text: "La imágen no pudo ser cargada, por favor vuelve a intentarlo", type: "error" });
												$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
												dialogRef.close();
												$.isLoading("hide"); NProgress.done();
											}
										}
										img.onerror = function(){
											new PNotify({ title: "Error", text: "La imágen no pudo ser cargada, por favor vuelve a intentarlo", type: "error" });
											$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
											dialogRef.close();
											$.isLoading("hide"); NProgress.done();
										};
									}
									else{
										dialogRef.close();
										new PNotify({ title: "Error", text: "Ha ocurrido un error, por favor notificalo a soporte!", type: "error" });
									}
								},
								init: function() {
									this.on("addedfile", function(file){
										var dropzone = this;
										if(this.files.length > 1){
											new PNotify({ title: "Error", text: "No puedes subir más de 1 archivo", type: "error" });
											$.each(this.files, function(i, file){
												dropzone.removeFile(file);
											});
										}
									});
									this.on("maxfilesexceeded", function(file){
										new PNotify({ title: "Error", text: "No puedes subir más de 1 archivo", type: "error" });
										$.each(this.files, function(i, file){
											dropzone.removeFile(file);
										});
									});
									this.on("error", function(file, message){
										console.log( message );
										var mensaje = message;
										var borrar = false;
										if( mensaje.indexOf("Max filesize:") !== -1 ){
											borrar = true;
											var texto = "El archivo no debe de tener un tamaño mayor a 1MB";
										}
										else if( mensaje.indexOf("You can't upload files of this type.") !== -1 ){
											borrar = true;
											var texto = "El formato del archivo que intentas cargar no es soportado";
										}
										if( borrar ){
											var dropzone = this;
											$.each(this.files, function(i, file){
												dropzone.removeFile(file);
											});
										}
										new PNotify({ title: "Error", text: texto, type: "error" });
									});
									this.on("processing", function(file){
										$.isLoading({ text: "Cargando..." }); NProgress.start();
										$("#btnCrearImagen").prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i> Procesando...');
									});
								}
							}).on("thumbnail", function(file, dataUri) {
								console.log(dataUri);
							});
							$.get(
								$("#rutabibliotecascliente").val()+$("#cid").val(),
								function(data){
									if(data.success){
										$("#slBiblioteca").html("").append('<option value=""></option>');
										$.each(data.biblioteca, function(index, val){
											$("#slBiblioteca").append("<option data-img-src='"+val.ruta+"' value='"+val.id+"'>");
										});
										$("#slBiblioteca").imagepicker({hide_select: true, show_label: true});
										var i = 0;
										$(".image_picker_selector").find("[title]").each(function(){ $(this).tooltip(); });
									}
									else{
										$("#slBiblioteca").hide();
										$("#Biblioteca").append('<div id="dvWrBiblioteca" class="alert alert-warning" role="alert"> Aún no tienes ningúna imágen almacenada en tu biblioteca </div>');
									}
								},
								"json"
							);
							$("#btnCrearImagen").click(function(e){
								$.isLoading({ text: "Cargando..." }); NProgress.start();
								$("#btnCrearImagen").html('<i class="fa fa-spinner fa-spin"></i> Cargando').prop("disabled", true);
								if( $("#txtImagen").val() == "" && $("#slBiblioteca").val() == ""){
									$.isLoading("hide"); NProgress.done();
									new PNotify({ title: "Error", text: "Debes seleccionar una imágen de la biblioteca, subir una imágen o ingresar la ruta de la imágen que deseas almacenar", type: "error" });
								}
								else{
									if( $("#txtImagen").val() != "" ){
										var value = $("#txtImagen").val();
									}
									else{
										var value = $("#slBiblioteca option:selected").attr("data-img-src");
									}
									var img = new Image();
									img.src = value;
									img.onload = function(){
										if(img.height != 0){
											rutaImagen.val(value);
											rutaImagen.trigger("blur");
											$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
											dialogRef.close();
											$.isLoading("hide"); NProgress.done();
										}
										else{
											new PNotify({ title: "Error", text: "La imágen no pudo ser cargada, por favor vuelve a intentarlo", type: "error" });
											$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
											dialogRef.close();
											$.isLoading("hide"); NProgress.done();
										}
									};
									img.onerror = function(){
										new PNotify({ title: "Error", text: "La imágen no pudo ser cargada, por favor vuelve a intentarlo", type: "error" });
										$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
										dialogRef.close();
										$.isLoading("hide"); NProgress.done();
									};
								}
							});
						},
					});
				});
				//-------------------------------------------------------------------------------------------------------------------------------------------------------
				//-------------------------------------------------------------------------------------------------------------------------------------------------------
				//ASIGNO EL 100% Y DESACTIVO LA EDICIÓN DEL CAMPO DEL ANCHO DE LA IMÁGEN ------------------------------------------------------
				$(".cke_dialog").find(".cke_dialog_ui_labeled_label:contains('Ancho')").parent().find(".cke_dialog_ui_input_text").val("100%");
				$(".cke_dialog").find(".cke_dialog_ui_labeled_label:contains('Alto')").parent().find(".cke_dialog_ui_input_text").val("100%");
				//-----------------------------------------------------------------------------------------------------------------------------
			};
			dialogDefinition.onHide = function(){
				editor = CKEDITOR.instances.mensaje;
				var sel = editor.getSelection();
				nodo = sel.getStartElement();
				var txtAltura = this.getContentElement( 'info', 'txtHeight' ).getValue();
				var txtAnchura = this.getContentElement( 'info', 'txtWidth' ).getValue();
				if(txtAltura != ""){
					nodo.setAttribute("height", txtAltura);
				}
				if(txtAnchura != ""){
					nodo.setAttribute("width", txtAnchura);
				}
			};
			dialogDefinition.onShow = function(){
				viejoOnShow.call(this, arguments);
				nuevoOnShow.call(this, arguments);
			};
		}
		if(dialogName == "link"){
			var viejoOnShow = dialogDefinition.onShow;
			editor = CKEDITOR.instances.mensaje;
			var sel = editor.getSelection();
			nodo = sel.getStartElement();
			var infoTab = dialogDefinition.getContents( "info" );
			InputAutomatizacion = {
				type: "text",
				id: "InputA",
				label: "",
				className: "hide InputA",
				"default": "",
			}
			infoTab.elements.push(InputAutomatizacion);
			buttonAutomatizacion = {
				type: "button",
				id: "AutomatizacionId",
				label: "Agregar automatización",
				title: "Automatización",
				className: "buttonA",
				onClick: function(){
					/*<?php foreach($etiquetas as $etiqueta): ?>
					etiquetas += '<option value="<?php echo $etiqueta->id; ?>"><?php echo $etiqueta->nombre; ?></option>';
					<?php endforeach; ?>*/
					var msjCuerpoAutomatizaciones = '<form id="frmAutomatizacion"> \
						<div class="form-group"> \
							<label for="tipo">Tipo de automatización</label> \
							<select class="form-control" name="tipo" title="Selecciona el tipo de automatización"> \
								<option value="AE">Añadir etiqueta</option> \
								<option value="M">Mover suscriptor</option> \
								<option value="C">Copiar suscriptor</option> \
							</select> \
							<span id="errtipo" class="text-danger"></span> \
						</div> \
						<div class="dvMyC" style="display: none;"> \
							<div class="form-group"> \
								<label for="listas">¿A que lista de suscripción?</label> \
								<select class="form-control" name="listas" data-live-search="true" title="Selecciona la lista de suscripción" data-selected-text-format="count"></select> \
								<span id="errlistas" class="text-danger"></span> \
							</div> \
							<div class="form-group"> \
								<label class="checkbox-inline" style="padding-left: 0px;"> \
									<input name="chCopiarEtiquetas" id="chCopiarEtiquetas" type="checkbox"> \
									<span class="custom-checkbox"></span> \
									¿Copiar las etiquetas que ya tenga el suscriptor? \
								</label> \
							</div> \
							<div class="form-group"> \
								<label class="checkbox-inline" style="padding-left: 0px;"> \
									<input name="chAsignarEtiquetas" id="chAsignarEtiquetas" type="checkbox"> \
									<span class="custom-checkbox"></span> \
									¿Asignar nuevas etiquetas al suscriptor? \
								</label> \
							</div> \
						</div> \
						<div class="dvEtiquetas" style="display: none;"> \
							<div class="form-group"> \
								<label for="etiquetas">¿Que etiqueta(s)?</label> \
							</div>\
							<div class="input-group">\
								<select class="form-control" name="etiquetas" multiple data-live-search="true" title="Selecciona la etiqueta(s) que deseas añadir" data-selected-text-format="count"> \
								</select> \
								<div class="input-group-btn"> <button id="btnAddEtiqueta" class="btn btn-default" type="button"> <i class="fa fa-plus"></i> </button> </div>\
									<span class="text-danger" id="erretiquetas"> </span> \
								<span id="erretiquetas" class="text-danger"></span> \
								</div> \
							</div> \
						</div> \
					</form>';
					BootstrapDialog.show({
						title: "Configuración de Automatizaciones",
						type: BootstrapDialog.TYPE_PRIMARY,
						message: msjCuerpoAutomatizaciones,
						size: BootstrapDialog.SIZE_NORMAL,
						draggable: true,
						closable: false,
						cssClass: "modalCrearVinvulos color-head-modal mdAvatar",
						onshow: function(dialogAuto){
							var modalBodyConfAuto = dialogAuto.getModalBody();
							var etiquetas = "";
							$.get(
								"<?php echo URL::route('SysWebGClientesListarEtiquetas'); ?>",
								function(data){
									$.each(data, function(i, val){
										modalBodyConfAuto.find("[name='etiquetas']").append('<option value="'+val.id+'">'+val.nombre+'</option>');
									});
									modalBodyConfAuto.find("[name='etiquetas']").selectpicker("refresh");
								},
								"json"
							);
						},
						onshown: function(dialogAuto){
							var modalBodyConfAuto = dialogAuto.getModalBody();
							var urlField = infoTab.get( "InputA" );
							var jsonStringAuto = urlField[ "default" ];
							var hayJson = false;
							if( jsonStringAuto != "" && jsonStringAuto != null){
								hayJson = true;
								jsonStringAuto = JSON.parse(jsonStringAuto);
							}
							modalBodyConfAuto.find("#frmAutomatizacion").validate({
								ignore: [],
								errorPlacement: function(error, element) {
									var mensaje = error.html();
									var id = "err" + error.attr("id").substr(0, error.attr("id").indexOf("-error"));
									modalBodyConfAuto.find("#" + id).html(mensaje);
								},
								success: function(label, element) {
									var id = "err" + label.attr("id").substr(0, label.attr("id").indexOf("-error"));
									modalBodyConfAuto.find("#" + id).html("");
								},
								lang: "es",
								rules: {
									tipo: "required"
								},
								messages: {
									tipo: "Este campo es requerido"
								}
							});
							//CONFIGURACIÓN DE SELECT DE TIPO DE AUTOMATIZACIÓN --------------------------------------------------------------------------------
							modalBodyConfAuto.find('[name="tipo"]').selectpicker().on("changed.bs.select", function(e, clickedIndex, isSelected, previousValue){
								var valor = $(this).selectpicker("val");
								if( valor == "AE" ){
									modalBodyConfAuto.find(".dvEtiquetas").show("slow");
									modalBodyConfAuto.find(".dvMyC").hide("slow");
									modalBodyConfAuto.find("[name='etiquetas']").rules("add", {
										required: true
									});
									modalBodyConfAuto.find('[name="listas"]').rules("remove");
								}
								else{
									modalBodyConfAuto.find(".dvMyC").show("slow");
									modalBodyConfAuto.find("[name='listas']").rules("add", {
										required: true
									});
									if( !modalBodyConfAuto.find('[name="chAsignarEtiquetas"]').is(":checked") ){
										modalBodyConfAuto.find(".dvEtiquetas").hide("slow");
										modalBodyConfAuto.find('[name="etiquetas"]').rules("remove");
									}
								}
							});
							if( hayJson ){
								if( jsonStringAuto.proceso == "etiquetar" ){
									modalBodyConfAuto.find('[name="tipo"]').val("AE");
									modalBodyConfAuto.find(".dvEtiquetas").show("slow");
								}
								else if( jsonStringAuto.proceso == "mover" ){
									modalBodyConfAuto.find('[name="tipo"]').val("M");
								}
								else{
									modalBodyConfAuto.find('[name="tipo"]').val("C");
								}
								if( jsonStringAuto.proceso != "etiquetar" ){
									modalBodyConfAuto.find(".dvMyC").show("slow");
								}
								modalBodyConfAuto.find('[name="tipo"]').selectpicker("refresh");
								modalBodyConfAuto.find('[name="tipo"]').trigger("change");
							}
							//----------------------------------------------------------------------------------------------------------------------------------
							//CONFIGURACIÓN DE SELECT DE LISTAS DE SUSCRIPCIÓN -----------------------------------------------------------------------------------------
							modalBodyConfAuto.find('[name="listas"]').selectpicker();
							var rutaListas = $("#rutalistas").val()+$("#cid").val();
							$.get(
								rutaListas,
								function(data){
									$.each(data, function(i, val){
										if(val.tipo == "N"){
											modalBodyConfAuto.find('[name="listas"]').append('<option value="'+val.id+'" data-tipo="'+val.tipo+'">'+val.nombre+'</option>');
										}
									});
									if( hayJson ){
										modalBodyConfAuto.find('[name="listas"]').val(jsonStringAuto.idLE);
									}
									modalBodyConfAuto.find('[name="listas"]').selectpicker("refresh");
								},
								"json"
							);
							//------------------------------------------------------------------------------------------------------------------------------------------
							modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("refresh");
							//CONFIGURACIÓN DE ETIQUETAS -----------------------------------------------------------------------------------------------------------------------------------------
							modalBodyConfAuto.find('[name="etiquetas"]').selectpicker().on("changed.bs.select", function(e, clickedIndex, isSelected, previousValue){
								var idsEtiquetas = modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("val");
								modalBodyConfAuto.find(".dvEtiquetasSel").html("");
								if( idsEtiquetas != null ){
									$.each(idsEtiquetas, function(i, idEtiqueta){
										var nombreEtiqueta = modalBodyConfAuto.find('[name="etiquetas"] > [value="'+idEtiqueta+'"]').html();
										modalBodyConfAuto.find(".dvEtiquetasSel").append('<span class="label label-info" style="margin-left: 4px; margin-right: 4px;">'+nombreEtiqueta+'</span>');
									});
								}
							});
							modalBodyConfAuto.find("#btnAddEtiqueta").on("click", function(e){
								var mensaje = '<div class="row"> \
										<div class="col-sm-12">\
											<div class="col-sm-12">\
												<div class="input-group">\
													<input type="text" placeholder="Agregar etiqueta..." class="form-control" id="txtEtiqueta">\
													<div class="input-group-btn"> <button id="btnTxtEtiqueta" class="btn btn-default" type="button"> <i class="fa fa-plus"></i> </button> </div>\
												</div>\
												<span class="text-danger" id="errcampo"> </span>\
												<div class="alert alert-warning" role="alert" style="margin-top: 10px;">\
													<strong>IMPORTANTE:</strong> Los campos tienen un limite de 40 caracteres y no pueden llevar caracteres especiales (¡#?)\
													<br>\
												</div>\
											</div>\
										</div>\
									</div>';
								BootstrapDialog.show({
								title: "Agregar Nueva Etiqueta (Opcional)",
								type: BootstrapDialog.TYPE_DANGER,
								message: mensaje,
								draggable: true,
								closeByBackdrop: false,
								cssClass: "ModalEtiqueta color-head-modal mdAvatar ModalEtiqueta",
								onshown: function(dialogItself){
									$("body").addClass("modal-open");
									$("#btnTxtEtiqueta").click(function(){
										var nombre_etiqueta = $("#txtEtiqueta").val();
										$.isLoading({ text: "Cargando..." }); NProgress.start();
										$.post(
											"<?php echo URL::route('SysWebEmailMarketingEtiquetasAgregar'); ?>",
											{etiqueta:$("#txtEtiqueta").val()},
											function(data){
												if(data.success){
												var OpEtiquetas= modalBodyConfAuto.find('[name="etiquetas"]').val();
													if(OpEtiquetas != null ){
														OpEtiquetas.push(data.Etiqueta.id);
													}
													else{
														OpEtiquetas = data.Etiqueta.id;
													}
													modalBodyConfAuto.find('[name="etiquetas"]').append($("<option></option>").attr("value", data.Etiqueta.id).text(data.Etiqueta.nombre).attr("id", "op"+data.Etiqueta.id));
													//$("#etiquetas").append($("<option></option>").attr("value", data.Etiqueta.id).text(data.Etiqueta.nombre).attr("id", "op"+data.Etiqueta.id));
													//$('.selectpicker').selectpicker('val',OpEtiquetas);
													modalBodyConfAuto.find('[name="etiquetas"]').selectpicker('val',OpEtiquetas);
													//$("#etiquetas").selectpicker("refresh");
													modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("refresh");
													dialogItself.close();
													new PNotify({ title: "Realizado", text: "Etiqueta creada con Exito.", type: "success" });
													data.Etiqueta.nombre,
													$("#dvetiquetas").append(' \
														<span class="label label-info" data-valor="'+data.Etiqueta.nombre+'"> \
															'+data.Etiqueta.nombre+' \
														</span> &nbsp; \
													');
												}
												else{
													if(data.mensaje != ""){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
													$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
												}
												$("#txtEtiqueta").val("");
											},
											"json"
										);
										$(".tooltips").tooltip();
										$.isLoading("hide"); NProgress.done();
									});
								},
								onhidden: function(dialogItself){
								$("body").removeClass("modal-open");
								}
								});
							});
							/*var jsonEtiquetas = JSON.parse( $("#jsonEtiquetas").val() );
							$.each(jsonEtiquetas, function(i, etiqueta){
								modalBodyConfAuto.find('[name="etiquetas"]').append('<option value="'+etiqueta.id+'">'+etiqueta.nombre+'</option>');
							});*/
							if( hayJson ){
								if( jsonStringAuto.conEtiquetas || jsonStringAuto.proceso == "etiquetar" ){
									modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("val", jsonStringAuto.idsE);
									$.each(jsonStringAuto.idsE, function(i, idEtiqueta){
										var nombreEtiqueta = modalBodyConfAuto.find('[name="etiquetas"] > [value="'+idEtiqueta+'"]').html();
										modalBodyConfAuto.find(".dvEtiquetasSel").append('<span class="label label-info" style="margin-left: 4px; margin-right: 4px;">'+nombreEtiqueta+'</span>');
									});
								}
							}
							modalBodyConfAuto.find('[name="etiquetas"]').trigger("change");
							modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("refresh");
							//--------------------------------------------------------------------------------------------------------------------------------------------------------------------
							//CONFIGURACIÓN DE CHECKBOX DE ETIQUETAS ------------------------------------------
							modalBodyConfAuto.find('[name="chAsignarEtiquetas"]').click(function(e){
								var checkbox = $(this);
								if( checkbox.is(":checked") ){
									modalBodyConfAuto.find(".dvEtiquetas").show("slow");
									modalBodyConfAuto.find("[name='etiquetas']").rules("add", {
										required: true
									});
								}
								else{
									modalBodyConfAuto.find(".dvEtiquetas").hide("slow");
									modalBodyConfAuto.find('[name="etiquetas"]').rules("remove");
								}
							});
							if( hayJson ){
								if( jsonStringAuto.proceso != "etiquetar" ){
									if( jsonStringAuto.conEtiquetas ){
										modalBodyConfAuto.find('[name="chAsignarEtiquetas"]').trigger("click");
									}
								}
							}
							//---------------------------------------------------------------------------------
							if( hayJson ){
								if( jsonStringAuto.proceso != "etiquetar" ){
									if( jsonStringAuto.cpEtiquetas ){
										modalBodyConfAuto.find('[name="chCopiarEtiquetas"]').trigger("click");
									}
								}
							}
						},
						buttons: [{
							id: "btnConfAutomatizacion",
							label: "Crear",
							cssClass: "btn-primary btn-block btn-lg",
							action: function(dialogItself){
								var modalBodyConfAuto = dialogItself.getModalBody();
								if( modalBodyConfAuto.find("#frmAutomatizacion").valid() ){
									var jsonAutomatizacion = {};
									if( modalBodyConfAuto.find('[name="tipo"]').selectpicker("val") == "AE" ){
										jsonAutomatizacion.proceso = "etiquetar";
										jsonAutomatizacion.idsE = modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("val");
									}
									else if( modalBodyConfAuto.find('[name="tipo"]').selectpicker("val") == "M" ){
										jsonAutomatizacion.proceso = "mover";
									}
									else{
										jsonAutomatizacion.proceso = "copiar";
									}
									jsonAutomatizacion.cpEtiquetas = false;
									jsonAutomatizacion.conEtiquetas = false;
									if( modalBodyConfAuto.find('[name="tipo"]').selectpicker("val") != "AE" ){
										jsonAutomatizacion.idLE = modalBodyConfAuto.find('[name="listas"]').selectpicker("val");
										if( modalBodyConfAuto.find('[name="chCopiarEtiquetas"]').is(":checked") ){
											jsonAutomatizacion.cpEtiquetas = true;
										}
										if( modalBodyConfAuto.find('[name="chAsignarEtiquetas"]').is(":checked") ){
											jsonAutomatizacion.conEtiquetas = true;
											jsonAutomatizacion.idsE = modalBodyConfAuto.find('[name="etiquetas"]').selectpicker("val");
										}
									}
									var jsonStringAuto = JSON.stringify( jsonAutomatizacion );
									var urlField = infoTab.get( "InputA" );
									urlField[ "default" ] = jsonStringAuto;
									dialogItself.close();
								}
							}
						}]
					});
				}
			}
			infoTab.elements.push(buttonAutomatizacion);
			dialogDefinition.onShow = function(){
				viejoOnShow.call(this, arguments);
				var editor = CKEDITOR.instances.mensaje;
				var urlField = infoTab.get( "InputA" );
				urlField[ "default" ] = ""; //SE RESETEA YA QUE SI ES UN NUEVO VÍNCULO Y SE HA CONFIGURADO UNA AUTOMATIZACION PREVIA SE TOMAN ESOS DATOS
				var nodo = editor.getSelection().getSelectedElement();
				if( nodo != null ){ //SE USA YA QUE CUANDO ES UN NUEVO VÍNCULO POR CREAR NO SE HA DEFINIDO UN ELEMENTO SELECCIONADO
					var esVinculo = false;
					if( nodo.getName() == "img" ){ //SE VALIDA SI ES UNA IMAGEN PARA TOMAR EL VÍNCULO DEL NODO PADRE EN CASO DE QUE TENGA VÍNCULO
						nodo = editor.getSelection().getCommonAncestor();
						if( nodo.getName() == "a" ){
							esVinculo = true;
						}
					}
					if( nodo.getName() == "a" ){
						esVinculo = true;
					}
					if( esVinculo ){
						if( nodo.hasAttribute("data-automatizacion") ){ //SE VERIFICA SI EXISTE UN ATRIBUTO CON AUTOMATIZACIÓN PARA ASIGNACIÓN
							urlField[ "default" ] = nodo.getAttribute("data-automatizacion");
						}
					}
				}
				if($('[name="clic"]').is(":checked")){
					$(".buttonA").css("display", "inline-block");
				}
				else{
					$(".buttonA").css("display", "none");
				}
			};
			/*dialogDefinition.onHide = function(){
				var editor = CKEDITOR.instances.mensaje;
				var nodo = editor.getSelection().getSelectedElement();
				if( nodo != null ){
					var esVinculo = false;
					if( nodo.getName() == "img" ){ //SE VALIDA SI ES UNA IMAGEN PARA ASIGNAR EL ATRIBUTO AL NODO CORRESPONDIENTE
						nodo = editor.getSelection().getCommonAncestor();
						if( nodo.getName() == "a" ){
							esVinculo = true;
						}
					}
					if( nodo.getName() == "a" ){
						esVinculo = true;
					}
					if( esVinculo ){
						var urlField = infoTab.get( "InputA" );
						var jsonA = urlField[ "default" ];
						if(jsonA != ""){
							nodo.setAttribute("data-automatizacion", jsonA);
						}
					}
				}
			};*/
			dialogDefinition.onHide = function () {
				var editor = CKEDITOR.instances.mensaje;
				var ranges = editor.getSelection().getRanges();
				if (ranges.length > 0) {
					var range = ranges[0];
					var node = range.startContainer;
					if (node.type === CKEDITOR.NODE_TEXT) {
						node = node.getParent();
					}
					if (node.getName() === "img" || node.getName() === "a") {
						var urlField = infoTab.get("InputA");
						var jsonA = urlField["default"];
						if (jsonA !== "") {
							node.setAttribute("data-automatizacion", jsonA);
						}
					}
				}
			};
		}
	});
	function modalCronometro(parametros){
		var editarCronometro = ( parametros == "" || parametros == undefined ) ? false : true;
		parametros = ( editarCronometro ) ? parametros.replace(/.gif/g, "") : "";
		var btnVEC = ( editarCronometro ) ? "Modificar" : "Crear";
		var setParametros = ( editarCronometro  ) ? atob(parametros) : "";
		setParametros = setParametros.split("&");
		var funcionC = ( editarCronometro ) ? setParametros[3].replace(/funcion=/g, "") : "";
		var temaC = ( editarCronometro ) ? setParametros[4].replace(/tema=/g, "") : "sf";
		var zonaHorariaC = ( editarCronometro ) ? setParametros[5].replace(/zonaHoraria=/g, "").replace(/%2F/g, "/") : "(UTC+00:00) UTC";
		var fechaFC = ( editarCronometro ) ? setParametros[6].replace(/fechaFinalizacion=/g, "").replace(/%2F/g, "/").replace(/%20/g, " ").replace(/%3A/g, ":") : moment().add(15, "minutes").format("YYYY/MM/DD HH:mm:ss");
		var colorFuenteC = ( editarCronometro ) ? setParametros[11].replace(/colorFuente=/g, "") : "#343234";
		var tipoFuenteEtiquetaC = ( editarCronometro ) ? setParametros[13].replace(/tipoFuente=/g, "") : "Verdana";
		var colorPuntosC = ( editarCronometro ) ? setParametros[14].replace(/colorPuntos=/g, "") : "#245AA4";
		var colorFuenteEtiquetaC = ( editarCronometro ) ? setParametros[15].replace(/colorFuenteEtiqueta=/g, "") : "#343234";
		var colorFondoC = ( editarCronometro ) ? setParametros[18].replace(/colorDeFondo=/g, "") : "transparent";
		var finC = ( editarCronometro ) ? setParametros[19].replace(/fin=/g, "") : "";
		var smhdC = ( editarCronometro ) ? setParametros[20].replace(/smhd=/g, "") : "";
		var reinicioC = ( editarCronometro ) ? setParametros[21].replace(/reinicio=/g, "") : 1;
		var colorRecuadroC = ( editarCronometro && temaC == "cf" ) ? setParametros[22].replace(/colorRecuadro=/g, "") : "";
		var attrcolorRecuadroC = ( editarCronometro && colorRecuadroC ) ? "data-reloj-color-recuadro='#245AA4'" : "";
		var mensaje = '<div class="col-md-12"> \
								<div class="row"> \
									<form id="frmCronometro"> \
										<div class="col-md-12"> \
											<div class="col-md-4"> \
												<label style="display: block;">Función de cronómetro <i class="fa fa-question-circle tooltips mensajeInfoCronometro" data-toggle="tooltip" title="Selecciona una función para el cronometro."></i></label> \
												<select id="funcionCronometro" class="form-control tooltips selectpicker" name="funcionCronometro" data-rule-required="true"> \
													<option value="" > Seleccione una opción... </option> \
													<option value="FF" > Fecha de finalización </option> \
													<option value="FE" > Correo Enviado </option> \
													<option value="FA" > Correo Abierto </option> \
												</select> \
												<span errorfor="funcionCronometro"></span> \
											</div> \
											<div class="col-md-4"> \
												<label style="display: block;"> Zona horaria </label> \
												<select id="slZonaHoraria" class="form-control" > \
													<option value="" disabled> Seleccione una opción </option> \
												</select> \
											</div> \
											<div class="col-md-2 caducidad" style="display: none;"> \
												<label style="display: block;">Tiempo</label> \
													<div class="input-group"> \
														<div class="input-group"> \
															<input type="number" id="txtCaducidad" style="width: 139px;" class="form-control" name="txtCaducidad" min="1" value="1"> \
															<span errorfor="txtCaducidad"></span> \
														</div> \
													</div> \
											</div> \
											<div class="col-md-2 caducidad" style="display: none;"> \
												<label style="display: block;">Caducidad</label> \
												<div class="input-group"> \
													<select id="slCaducidad" name="slCaducidad" data-width="135" class="form-control"> \
														<option value=""> Seleccionar... </option> \
														<option value="M"> Minutos </option> \
														<option value="H"> Horas </option> \
														<option value="D"> Día </option> \
													</select> \
													<span errorfor="slCaducidad"></span> \
												</div> \
											</div> \
											<div class="dvRelojFF col-md-4" style="display: none;"> \
													<label style="display: block;"> Fecha de finalización </label> \
													<input id="fechaReloj" type="text" style="margin-bottom: 0;" class="form-control"> </input> \
											</div> \
											<div class="form-group"> \
												<div class="col-md-12"  style="padding-top: 20px;"> \
													<div class="col-md-4"> \
														<label style="display: block;"> Tema </label> \
														<select id="slTipoTemaReloj" class="form-control" > \
															<option value="sf"> Texto Plano </option> \
															<option value="cf"> Recuadro </option> \
														</select> \
													</div> \
													<div class="col-md-4"> \
														<label style="display: block;">Fuente de cronómetro</label> \
														<select id="TipoFuenteCronometro" class="form-control" name=""> \
															<optgroup label="Fuentes genericas" class="fCronometro"> </optgroup> \
															<optgroup label="Google Fonts" class="fGCronometro"> </optgroup> \
														</select> \
													</div> \
													<div class="col-md-4"> \
														<label style="display: block;">Tiempo de reinicio  \
															<i class="fa fa-question-circle tooltips" data-toggle="tooltip" title="Aquí puedes configurar el tiempo que transcurrirá de la cuenta regresiva de este cronometro una vez publicado dentro del correo donde lo envíes. Te recomendamos que no sea más de 2 minutos (nosotros le ponemos 1 minuto) ya que entre más tiempo le pongas, más se tardará en aparecer en el cuerpo del correo una vez que el suscriptor lo abra (esto no afectará la fecha de finalización que se configure en este cronometro)."></i> \
														</label> \
														<div class="input-group">\
															<input type="number" value="1" id="minutosCronometro" class="form-control" min="1" max="3" name="minutosCronometro"> \
														</div>\
													</div> \
												</div> \
											</div> \
											<div class="form-group"> \
												<div class="col-md-12"  style="padding-top: 20px;"> \
													<div class="col-md-2"> \
														<label style="display: block;"> Color de fuente </label> \
														<input id="colorFuenteC" type="text" style="margin-bottom: 0;" class="form-control" ></input> \
													</div> \
													<div id="fondoCronometro" class="col-md-2"> \
														<label style="display: block;"> Color de fondo </label> \
														<input id="colorFondoC" type="text" style="margin-bottom: 0;" class="form-control" ></input> \
													</div> \
													<div id="recuadroCronometro" class="col-md-2"> \
														<label style="display: block;"> Color Recuadro </label> \
														<input id="recuadroC" type="text" style="margin-bottom: 0;" class="form-control" ></input> \
													</div> \
													<div class="col-md-2"> \
														<label style="display: block;"> Color de Puntos </label> \
														<input id="colorPuntosC" type="text" style="margin-bottom: 0;" class="form-control" ></input> \
													</div> \
													<div class="col-md-3"> \
														<label style="display: block;"> Color de fuente Etiquetas </label> \
														<input id="colorFuenteEC" type="text" style="margin-bottom: 0;" class="form-control" ></input> \
													</div> \
												</div> \
											</div> \
											<div class="form-group"> \
												<div class="col-md-12"  style="padding-top: 20px;"> \
													<label> Vista previa del diseño del Cronómetro </label> \
													<p class="text-info"><i class="fa fa-info-circle"></i> El funcionamiento de este elemento lo puedes ver únicamente en el correo enviado, dentro del editor aparecerá estático</p> \
													<div class="alert alert-warning mensaje-fa" role="alert" style="display: none;"> \
														<strong>¡Importante!</strong> \
														Recomendamos usar la opción de fecha de enviado, ya que la estadistica de abierto puede variar si los clientes de correo electronico de tus suscriptores no tienen habilitada la carga de imágenes. \
													</div> \
												</div> \
											</div> \
											<div class="form-group"> \
												<div class="col-md-12" style="margin-bottom: 20px"> \
													<img id="clock-email" class="clockdown-email" style="display:block; margin-left: auto; object-fit: contain; margin-right: auto;width: 75%; height: 80px;" data-reloj-funcion="'+funcionC+'" data-reloj-fin="'+finC+'" data-reloj-smhd="'+smhdC+'" data-reloj-fecha="'+fechaFC+'" data-reloj-reinicio="'+reinicioC+'" data-reloj-tema="'+temaC+'" data-reloj-color-fondo="'+colorFondoC+'" data-reloj-color-fuente="'+colorFuenteC+'" data-reloj-transparent="1" data-reloj-color-puntos="'+colorPuntosC+'" data-reloj-color-etiqueta="'+colorFuenteEtiquetaC+'" data-reloj-fuente="'+tipoFuenteEtiquetaC+'" '+attrcolorRecuadroC+' data-reloj-dd="1" data-reloj-hh="1" data-reloj-mm="1" data-reloj-ss="1" data-reloj-timezone="'+zonaHorariaC+'" data-reloj-timezone-label="" src="" alt="Cronometro de finalización de promoción"> \
												</div> \
											</div> \
											<div class="form-group"> \
												<button type="button" class="btn btn-primary btn-block btn-lg" id="btnCrearClockDown"> '+btnVEC+' </button> \
											</div> \
										</div> \
									</form> \
								</div> \
							</div>';
			BootstrapDialog.show({
				title: "Cronómetro",
				type: BootstrapDialog.TYPE_INFO,
				message: mensaje,
				draggable: true,
				closeByBackdrop: false,
				cssClass: "ModalCronometro mdAvatar",
				onshown: function(dialog){
					$("body").addClass("modal-open");
					var ventana = dialog.getModalBody();
					ventana.find(".tooltips").tooltip({
						position: {
							my: "center top-8",
							at: "center bottom",
						},
						tooltipClass: "entry-tooltip-positioner modalTooltip",
					});
					var paleta = new Array();
					//FUENTE PARA CRONOMETRO
					fontFamly(ventana.find("#TipoFuenteCronometro"));
					ventana.find("#TipoFuenteCronometro").selectpicker({
						open: function( event, ui ) {
							$("#TipoFuenteCronometro-menu").find("li.ui-menu-item").each(function(index){
								$(this).find(".ui-menu-item-wrapper").css("font-family", $(this).find(".ui-menu-item-wrapper").text());
							});
						},
						select: function( event, ui ) {
							ventana.find(".fCronometro").css("font-family", "'"+ui.item.value+"',Verdana, sans-serif, Calibri");
						},
					});
					ventana.find("#TipoFuenteCronometro").on("change", function(){
						var fuente = $(this).val().replace(/\s/g, "");
						if( $(this).val().indexOf("new") > -1  ){
							fuente = $(this).val().replace(/\s/g, "-");
						}
						if( $(this).val().indexOf("linotype") > -1 || $(this).val().indexOf("Solid") > -1  ){
							fuente = $(this).val().replace(/\s/g, "-");
						}
						ventana.find(".clockdown-email").attr("data-reloj-fuente", fuente);
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					//ASIGNO FUENTE SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find('#TipoFuenteCronometro option:contains("'+tipoFuenteEtiquetaC+'")').prop("selected", true);
						ventana.find("#TipoFuenteCronometro").trigger("change");
					}
					//ZONA HORARIA CRONOMETRO
					var timeZoneLaravel2 = {
						"Pacific/Midway": "(UTC-11:00) Midway Island",
						"Pacific/Samoa": "(UTC-11:00) Samoa",
						"Pacific/Honolulu": "(UTC-10:00) Hawaii",
						"US/Alaska": "(UTC-09:00) Alaska",
						"America/Los_Angeles": "(UTC-08:00) Pacific Time (US &amp; Canada)",
						"America/Tijuana": "(UTC-08:00) Tijuana",
						"US/Arizona": "(UTC-07:00) Arizona",
						"America/Chihuahua": "(UTC-07:00) La Paz",
						"America/Mazatlan": "(UTC-07:00) Mazatlan",
						"US/Mountain": "(UTC-07:00) Mountain Time (US &amp; Canada)",
						"America/Managua": "(UTC-06:00) Central America",
						"US/Central": "(UTC-06:00) Central Time (US &amp; Canada)",
						"America/Mexico_City": "(UTC-06:00) Mexico City",
						"America/Monterrey": "(UTC-06:00) Monterrey",
						"Canada/Saskatchewan": "(UTC-06:00) Saskatchewan",
						"America/Bogota": "(UTC-05:00) Quito",
						"US/Eastern": "(UTC-05:00) Eastern Time (US &amp; Canada)",
						"US/East-Indiana": "(UTC-05:00) Indiana (East)",
						"America/Lima": "(UTC-05:00) Lima",
						"Canada/Atlantic": "(UTC-04:00) Atlantic Time (Canada)",
						"America/Caracas": "(UTC-04:30) Caracas",
						"America/La_Paz": "(UTC-04:00) La Paz",
						"America/Santiago": "(UTC-04:00) Santiago",
						"Canada/Newfoundland": "(UTC-03:30) Newfoundland",
						"America/Sao_Paulo": "(UTC-03:00) Brasilia",
						"America/Argentina/Buenos_Aires": "(UTC-03:00) Georgetown",
						"America/Godthab": "(UTC-03:00) Greenland",
						"America/Noronha": "(UTC-02:00) Mid-Atlantic",
						"Atlantic/Azores": "(UTC-01:00) Azores",
						"Atlantic/Cape_Verde": "(UTC-01:00) Cape Verde Is.",
						"Africa/Casablanca": "(UTC+00:00) Casablanca",
						"Europe/London": "(UTC+00:00) London",
						"Etc/Greenwich": "(UTC+00:00) Greenwich Mean Time : Dublin",
						"Europe/Lisbon": "(UTC+00:00) Lisbon",
						"Africa/Monrovia": "(UTC+00:00) Monrovia",
						"UTC": "(UTC+00:00) UTC",
						"Europe/Amsterdam": "(UTC+01:00) Amsterdam",
						"Europe/Belgrade": "(UTC+01:00) Belgrade",
						"Europe/Berlin": "(UTC+01:00) Bern",
						"Europe/Bratislava": "(UTC+01:00) Bratislava",
						"Europe/Brussels": "(UTC+01:00) Brussels",
						"Europe/Budapest": "(UTC+01:00) Budapest",
						"Europe/Copenhagen": "(UTC+01:00) Copenhagen",
						"Europe/Ljubljana": "(UTC+01:00) Ljubljana",
						"Europe/Madrid": "(UTC+01:00) Madrid",
						"Europe/Paris": "(UTC+01:00) Paris",
						"Europe/Prague": "(UTC+01:00) Prague",
						"Europe/Rome": "(UTC+01:00) Rome",
						"Europe/Sarajevo": "(UTC+01:00) Sarajevo",
						"Europe/Skopje": "(UTC+01:00) Skopje",
						"Europe/Stockholm": "(UTC+01:00) Stockholm",
						"Europe/Vienna": "(UTC+01:00) Vienna",
						"Europe/Warsaw": "(UTC+01:00) Warsaw",
						"Africa/Lagos": "(UTC+01:00) West Central Africa",
						"Europe/Zagreb": "(UTC+01:00) Zagreb",
						"Europe/Athens": "(UTC+02:00) Athens",
						"Europe/Bucharest": "(UTC+02:00) Bucharest",
						"Africa/Cairo": "(UTC+02:00) Cairo",
						"Africa/Harare": "(UTC+02:00) Harare",
						"Europe/Helsinki": "(UTC+02:00) Kyiv",
						"Europe/Istanbul": "(UTC+02:00) Istanbul",
						"Asia/Jerusalem": "(UTC+02:00) Jerusalem",
						"Africa/Johannesburg": "(UTC+02:00) Pretoria",
						"Europe/Riga": "(UTC+02:00) Riga",
						"Europe/Sofia": "(UTC+02:00) Sofia",
						"Europe/Tallinn": "(UTC+02:00) Tallinn",
						"Europe/Vilnius": "(UTC+02:00) Vilnius",
						"Asia/Baghdad": "(UTC+03:00) Baghdad",
						"Asia/Kuwait": "(UTC+03:00) Kuwait",
						"Europe/Minsk": "(UTC+03:00) Minsk",
						"Africa/Nairobi": "(UTC+03:00) Nairobi",
						"Asia/Riyadh": "(UTC+03:00) Riyadh",
						"Europe/Volgograd": "(UTC+03:00) Volgograd",
						"Asia/Tehran": "(UTC+03:30) Tehran",
						"Asia/Muscat": "(UTC+04:00) Muscat",
						"Asia/Baku": "(UTC+04:00) Baku",
						"Europe/Moscow": "(UTC+04:00) St. Petersburg",
						"Asia/Tbilisi": "(UTC+04:00) Tbilisi",
						"Asia/Yerevan": "(UTC+04:00) Yerevan",
						"Asia/Kabul": "(UTC+04:30) Kabul",
						"Asia/Karachi": "(UTC+05:00) Karachi",
						"Asia/Tashkent": "(UTC+05:00) Tashkent",
						"Asia/Calcutta": "(UTC+05:30) Sri Jayawardenepura",
						"Asia/Kolkata": "(UTC+05:30) Kolkata",
						"Asia/Katmandu": "(UTC+05:45) Kathmandu",
						"Asia/Almaty": "(UTC+06:00) Almaty",
						"Asia/Dhaka": "(UTC+06:00) Dhaka",
						"Asia/Yekaterinburg": "(UTC+06:00) Ekaterinburg",
						"Asia/Rangoon": "(UTC+06:30) Rangoon",
						"Asia/Bangkok": "(UTC+07:00) Hanoi",
						"Asia/Jakarta": "(UTC+07:00) Jakarta",
						"Asia/Novosibirsk": "(UTC+07:00) Novosibirsk",
						"Asia/Hong_Kong": "(UTC+08:00) Hong Kong",
						"Asia/Chongqing": "(UTC+08:00) Chongqing",
						"Asia/Krasnoyarsk": "(UTC+08:00) Krasnoyarsk",
						"Asia/Kuala_Lumpur": "(UTC+08:00) Kuala Lumpur",
						"Australia/Perth": "(UTC+08:00) Perth",
						"Asia/Singapore": "(UTC+08:00) Singapore",
						"Asia/Taipei": "(UTC+08:00) Taipei",
						"Asia/Ulan_Bator": "(UTC+08:00) Ulaan Bataar",
						"Asia/Urumqi": "(UTC+08:00) Urumqi",
						"Asia/Irkutsk": "(UTC+09:00) Irkutsk",
						"Asia/Tokyo": "(UTC+09:00) Tokyo",
						"Asia/Seoul": "(UTC+09:00) Seoul",
						"Australia/Adelaide": "(UTC+09:30) Adelaide",
						"Australia/Darwin": "(UTC+09:30) Darwin",
						"Australia/Brisbane": "(UTC+10:00) Brisbane",
						"Australia/Canberra": "(UTC+10:00) Canberra",
						"Pacific/Guam": "(UTC+10:00) Guam",
						"Australia/Hobart": "(UTC+10:00) Hobart",
						"Australia/Melbourne": "(UTC+10:00) Melbourne",
						"Pacific/Port_Moresby": "(UTC+10:00) Port Moresby",
						"Australia/Sydney": "(UTC+10:00) Sydney",
						"Asia/Yakutsk": "(UTC+10:00) Yakutsk",
						"Asia/Vladivostok": "(UTC+11:00) Vladivostok",
						"Pacific/Auckland": "(UTC+12:00) Wellington",
						"Pacific/Fiji": "(UTC+12:00) Marshall Is.",
						"Pacific/Kwajalein": "(UTC+12:00) International Date Line West",
						"Asia/Kamchatka": "(UTC+12:00) Kamchatka",
						"Asia/Magadan": "(UTC+12:00) Solomon Is.",
						"Pacific/Tongatapu": "(UTC+13:00) Nuku'alofa"
					};
					var label = ventana.find(".clockdown-email").attr("data-reloj-timezone-label");
					for (var prop in timeZoneLaravel2) {
						if( label == prop ){
							ventana.find("#slZonaHoraria").append('<option selected value="'+prop+'">'+timeZoneLaravel2[prop]+'</option>');
						}
						else{
							ventana.find("#slZonaHoraria").append('<option value="'+prop+'">'+timeZoneLaravel2[prop]+'</option>');
						}
					}
					//ASIGNO EL VALOR POR DEFECTO DE LA ZONA HORARIA DEL PERFIL DEL USUARIO -----------------------
					ventana.find("#slZonaHoraria").selectpicker({
						select: function( event, ui){
							document.execCommand(ui.item.value, false, true);
						}
					});
					var optionZonaHoraria = timeZoneLaravel2[ $("#zonaHoraria").val() ];
					//ASIGNO ZONA HORARIA SETEADA SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find('#slZonaHoraria option[value="'+zonaHorariaC+'"]').prop("selected", true);
						ventana.find(".clockdown-email").attr("data-reloj-timezone-label", ventana.find("#slZonaHoraria option:selected").text());
					}
					else{
						ventana.find('#slZonaHoraria option:contains("'+optionZonaHoraria+'")').prop("selected", true);
					}
					ventana.find("#slZonaHoraria").on("change", function(){
						ventana.find(".clockdown-email").attr("data-reloj-timezone-label", ventana.find("#slZonaHoraria option:selected").text());
						ventana.find(".clockdown-email").attr("data-reloj-timezone", $(this).val());
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					ventana.find("#slZonaHoraria").trigger("change");
					//FECHA DE FINALIZACION
					ventana.find("#fechaReloj").datetimepicker({
						closeText: "Cerrar",
						prevText: "&#x3C;Ant",
						nextText: "Sig&#x3E;",
						currentText: "Hoy",
						monthNames: [ "enero","febrero","marzo","abril","mayo","junio",
						"julio","agosto","septiembre","octubre","noviembre","diciembre" ],
						monthNamesShort: [ "ene","feb","mar","abr","may","jun",
						"jul","ago","sep","oct","nov","dic" ],
						dayNames: [ "domingo","lunes","martes","miércoles","jueves","viernes","sábado" ],
						dayNamesShort: [ "dom","lun","mar","mié","jue","vie","sáb" ],
						dayNamesMin: [ "D","L","M","X","J","V","S" ],
						weekHeader: "Sm",
						dateFormat: "dd/mm/yy",
						firstDay: 1,
						isRTL: false,
						showMonthAfterYear: false,
						yearSuffix: "",
						timeFormat: "HH:mm:ss",
						onClose: function(dateText, inst) {
							if( $("#fechaReloj").val() != "" ){
								ventana.find(".clockdown-email").attr("data-reloj-fecha", moment($("#fechaReloj").val(), ["DD/MM/YYYY HH:mm:ss"]).format("YYYY/MM/DD HH:mm:ss"));
								setParametrosReloj(ventana.find(".clockdown-email"));
							}
							else{
								alert("Debe seleccionar una fecha");
							}
						}
					});
					if( editarCronometro ){
						ventana.find("#fechaReloj").datetimepicker("setDate", new Date(fechaFC));
					}
					else{
						ventana.find("#fechaReloj").datetimepicker("setDate", moment(ventana.find(".clockdown-email").attr("data-reloj-fecha"), ["YYYY/MM/DD HH:mm:ss"]).format("DD/MM/YYYY HH:mm:ss"));
					}
					//TEMA CRONOMETRO
					ventana.find("#slTipoTemaReloj").selectpicker({
						select: function( event, ui){
							document.execCommand(ui.item.value, false, true);
						}
					});
					//ASIGNO TEMA SELECCIONADO SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find('#slTipoTemaReloj option[value="'+temaC+'"]').prop("selected", true);
						ventana.find("#slTipoTemaReloj").trigger("change");
						if( temaC == "sf" ){
							ventana.find("#recuadroCronometro").hide();
						}
					}
					else{
						ventana.find("#recuadroCronometro").hide();
					}
					ventana.find("#slTipoTemaReloj").on("change", function(){
						ventana.find(".clockdown-email").attr("data-reloj-tema", $(this).val());
						var temaReloj = $(this).val();
						if( temaReloj == "cf" ){
							ventana.find("#recuadroCronometro").show("slow");
							ventana.find("#colorFuenteC").spectrum("set", "#FFFFFF");
							ventana.find("#colorFuenteEC").spectrum("set", "#245AA4");
							ventana.find(".clockdown-email").attr("data-reloj-color-recuadro", "#245AA4");
							ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "#FFFFFF");
							ventana.find(".clockdown-email").attr("data-reloj-color-etiqueta", "#245AA4");
							ventana.find("#TipoFuenteCronometro").find("option[value='Luckiest Guy']").remove();
							ventana.find("#TipoFuenteCronometro").find("option[value='Orbitron']").remove();
							ventana.find("#TipoFuenteCronometro").find("option[value='Black Ops One']").remove();
							ventana.find("#TipoFuenteCronometro").find("option[value='Monoton']").remove();
							ventana.find("#TipoFuenteCronometro").find("option[value='Dancing Script']").remove();
							ventana.find("#TipoFuenteCronometro").find("option[value='Courgette']").remove();
							ventana.find("#TipoFuenteCronometro").find("option[value='Permanent Marker']").remove();
							ventana.find("#TipoFuenteCronometro").selectpicker("refresh");
						}
						else if( temaReloj == "sf" ){
							ventana.find("#fondoCronometro").show("slow");
							ventana.find("#recuadroCronometro").hide("slow");
							ventana.find("#colorFuenteC").spectrum("set", "#343234");
							ventana.find("#colorFuenteEC").spectrum("set", "#343234");
							ventana.find(".clockdown-email").attr("data-reloj-color-fondo");
							ventana.find(".clockdown-email").removeAttr("data-reloj-color-recuadro");
							ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "#343234");
							ventana.find(".clockdown-email").attr("data-reloj-color-etiqueta", "#343234");
							ventana.find("#TipoFuenteCronometro").find("option[value='Anton']").after("<option value='Luckiest Guy'>Luckiest Guy</option>");
							ventana.find("#TipoFuenteCronometro").find("option[value='Acme']").after("<option value='Orbitron'>Orbitron</option>");
							ventana.find("#TipoFuenteCronometro").find("option[value='Orbitron']").after("<option value='Black Ops One'>Black Ops One</option>");
							ventana.find("#TipoFuenteCronometro").find("option[value='Black Ops One']").after("<option value='Monoton'>Monoton</option>");
							ventana.find("#TipoFuenteCronometro").find("option[value='Bubblegum Sans']").after("<option value='Dancing Script'>Dancing Script</option>");
							ventana.find("#TipoFuenteCronometro").find("option[value='Indie Flower']").after("<option value='Courgette'>Courgette</option>");
							ventana.find("#TipoFuenteCronometro").find("option[value='Pacifico']").after("<option value='Permanent Marker'>Permanent Marker</option>");
							ventana.find("#TipoFuenteCronometro").selectpicker("refresh");
						}
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					//CADUCIDAD DE CRONOMETRO SEGUNDOS, MINUTOS, HORAS, DIAS-----------------------------------------------------------------
					ventana.find("#slCaducidad").selectpicker({
						select: function( event, ui){
							document.execCommand(ui.item.value, false, true);
						}
					});
					//ASIGNO CADUCIDAD SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find('#slCaducidad option[value="'+smhdC+'"]').prop("selected", true);
						ventana.find("#slCaducidad").trigger("change");
					}
					ventana.find("#slCaducidad").on("change", function(){
						var selectValue = $(this).val();
						ventana.find("#frmCronometro").validate().element(this);
						if (selectValue.length > 0) {
							$(this).next("div").removeClass("error");
						}
						else{
							$(this).next("div").addClass("error");
						}
						ventana.find(".clockdown-email").attr("data-reloj-smhd", $(this).val());
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					//SETEO MINUTOS DE VISUALIZACION DE  CRONOMETRO
					ventana.find("#minutosCronometro").bind('keyup mouseup', function () {
						ventana.find(".clockdown-email").attr("data-reloj-reinicio", $(this).val());
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					//ASIGNO MINUTOS DE VISUALIZACION SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find("#minutosCronometro").val(reinicioC);
					}
					ventana.find("#txtCaducidad").bind('keyup mouseup', function () {
						var contadorVal = $(this).val();
						ventana.find("#frmCronometro").validate().element(this);
						if (contadorVal > 0) {
							$(this).next("div").removeClass("error");
						}
						else{
							$(this).next("div").addClass("error");
						}
						ventana.find(".clockdown-email").attr("data-reloj-fin", $(this).val());
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					//ASIGNO TIEMPO DE CADUCIDAD SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find("#txtCaducidad").val(finC);
					}
					//FUNCION DE CRONOMETRO
					ventana.find("#funcionCronometro").selectpicker();
					//ASIGNO FUNCION SI SE ENCUENTRA EDITANDO CRONOMETRO
					if( editarCronometro ){
						ventana.find('#funcionCronometro option[value="'+funcionC+'"]').prop("selected", true);
						if( funcionC == "FF" ){
							ventana.find(".dvRelojFF").show("slow");
							ventana.find(".caducidad").hide("slow");
							ventana.find(".mensaje-fa").hide("slow");
						}
						else if( funcionC == "" ){
							ventana.find(".caducidad").hide("slow");
							ventana.find(".dvRelojFF").hide("slow");
							ventana.find(".mensaje-fa").hide("slow");
						}
						else if( funcionC == "FA" ){
							ventana.find(".mensaje-fa").show("slow");
							ventana.find(".caducidad").show("slow");
							ventana.find(".dvRelojFF").hide("slow");
						}
						else{
							ventana.find(".caducidad").show("slow");
							ventana.find(".dvRelojFF").hide("slow");
							ventana.find(".mensaje-fa").hide("slow");
						}
						ventana.find("#funcionCronometro").trigger("change");
					}
					ventana.find("#funcionCronometro").on("change", function(){
						var funcion = $(this).val();
						var mensajeFF = "Fecha de finalización: El tiempo que configures en esta función iniciará su cuenta regresiva usando la fecha de finalización que establezcas en esta ventana."
						var mensajeFE = "Correo Enviado: El tiempo que configures en esta función iniciara su cuenta regresiva a partir de la fecha y hora en la que tu envíes el correo."
						var mensajeFA = "Correo Abierto: El tiempo que configures en esta funcón iniciará su cuenta regresiva al momento que detectamos que tu suscriptor abra el correo."
						ventana.find("#frmCronometro").validate().element(this);
						if (funcion.length > 0) {
							$(this).next("div").removeClass("error");
						}
						else{
							$(this).next("div").addClass("error");
						}
						ventana.find(".clockdown-email").attr("data-reloj-funcion", funcion);
						if( funcion == "FF" ){
							ventana.find(".dvRelojFF").show("slow");
							ventana.find(".caducidad").hide("slow");
							ventana.find(".mensaje-fa").hide("slow");
							ventana.find(".mensajeInfoCronometro").attr("title", mensajeFF);
							ventana.find("#slCaducidad").rules("remove");
							ventana.find("#txtCaducidad").rules("remove");
						}
						else if( funcion == "" ){
							ventana.find(".caducidad").hide("slow");
							ventana.find(".dvRelojFF").hide("slow");
							ventana.find(".mensaje-fa").hide("slow");
							ventana.find(".mensajeInfoCronometro").attr("title", "Selecciona una función para el cronometro.");
							ventana.find("#slCaducidad").rules("remove");
							ventana.find("#txtCaducidad").rules("remove");
						}
						else if( funcion == "FA" ){
							ventana.find(".mensaje-fa").show("slow");
							ventana.find(".caducidad").show("slow");
							ventana.find(".dvRelojFF").hide("slow");
							ventana.find(".mensajeInfoCronometro").attr("title", mensajeFA);
							ventana.find("#frmCronometro").validate();
							ventana.find("#slCaducidad").rules("add", { required: true, messages: { required: "Este campo es obligatorio" } });
							ventana.find("#txtCaducidad").rules("add", { required: true, messages: { required: "Este campo es obligatorio" }});
						}
						else{
							ventana.find(".caducidad").show("slow");
							ventana.find(".dvRelojFF").hide("slow");
							ventana.find(".mensaje-fa").hide("slow");
							ventana.find(".mensajeInfoCronometro").attr("title", mensajeFE);
							ventana.find("#frmCronometro").validate();
							ventana.find("#slCaducidad").rules("add", { required: true, messages: { required: "Este campo es obligatorio" }});
							ventana.find("#txtCaducidad").rules("add", { required: true, messages: { required: "Este campo es obligatorio" }});
						}
						setParametrosReloj(ventana.find(".clockdown-email"));
					});
					//COLOR FUENTE CRONOMETRO
					var colorFuCVE = "";
					if( editarCronometro ){
						colorFuCVE = colorFuenteC;
					}
					else{
						colorFuCVE = ( ventana.find(".clockdown-email").attr("data-reloj-tema") == "sf") ? "#343234" : "#FFFFFF";
					}
					ventana.find("#colorFuenteC").spectrum({
						appendTo: ventana,
						color: colorFuCVE,
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: ["#343234"],
						move: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-fuente", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "#000000");
						},
						change: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-fuente", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "#000000");
							setParametrosReloj(ventana.find(".clockdown-email"));
						},
						hide: function(color) {
							if( color != null ){
								paleta.push(color.toHexString());
							}
						}
					});
					//COLOR FONDO CRONOMETRO
					var colorFoCVE = "";
					if( editarCronometro ){
						colorFoCVE = ( colorFondoC == "transparent" ) ? "" : colorFondoC;
					}
					else{
						colorFoCVE = "";
					}
					ventana.find("#colorFondoC").spectrum({
						appendTo: ventana,
						color: colorFoCVE,
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: ["#FFFFFF"],
						allowEmpty: true,
						move: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-fondo", color):ventana.find(".clockdown-email").attr("data-reloj-color-fondo", "transparent");
						},
						change: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-fondo", color):ventana.find(".clockdown-email").attr("data-reloj-color-fondo", "transparent");
							setParametrosReloj(ventana.find(".clockdown-email"));
						},
						hide: function(color) {
							if( color != null ){
								paleta.push(color.toHexString());
							}
						}
					});
					//COLOR RECUADRO CRONOMETRO
					var colorReVEC = "";
					if( editarCronometro ){
						colorReVEC = colorRecuadroC;
					}
					else{
						colorReVEC = "#245AA4";
					}
					ventana.find("#recuadroC").spectrum({
						appendTo: ventana,
						color: colorReVEC,
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: ["#245AA4"],
						move: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-recuadro", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "");
						},
						change: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-recuadro", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "");
							setParametrosReloj(ventana.find(".clockdown-email"));
						},
						hide: function(color) {
							if( color != null ){
								paleta.push(color.toHexString());
							}
						}
					});
					//COLOR PUNTOS DE CRONOMETRO
					var colorPunVEC = "";
					if( editarCronometro ){
						colorPunVEC = colorPuntosC;
					}
					else{
						colorPunVEC = "#245AA4";
					}
					ventana.find("#colorPuntosC").spectrum({
						appendTo: ventana,
						color: colorPunVEC,
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: ["#245AA4"],
						move: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-puntos", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "");
						},
						change: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-puntos", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "");
							setParametrosReloj(ventana.find(".clockdown-email"));
						},
						hide: function(color) {
							if( color != null ){
								paleta.push(color.toHexString());
							}
						}
					});
					//COLOR DE FUENTES DE ETIQUETA
					var colorFuenteVEC = "";
					if( editarCronometro ){
						colorFuenteVEC = colorFuenteEtiquetaC;
					}
					else{
						colorFuenteVEC = ( ventana.find(".clockdown-email").attr("data-reloj-tema") == "sf") ? "#343234" : "#245AA4";
					}
					ventana.find("#colorFuenteEC").spectrum({
						appendTo: ventana,
						color:  colorFuenteVEC,
						showInput : true,
						showAlpha: false,
						preferredFormat: "hex",
						showPalette: true,
						showSelectionPalette: true,
						palette: ["#858585"],
						move: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-etiqueta", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "");
						},
						change: function(color){
							( color != null )? ventana.find(".clockdown-email").attr("data-reloj-color-etiqueta", color):ventana.find(".clockdown-email").attr("data-reloj-color-fuente", "");
							setParametrosReloj(ventana.find(".clockdown-email"));
						},
						hide: function(color) {
							if( color != null ){
								paleta.push(color.toHexString());
							}
						}
					});
					ventana.find("#frmCronometro").validate({
						errorElement: "span",
						errorClass: "text-danger",
						ignore: "",
						highlight: function (element, errorClass) {
							ventana.find(element).addClass("error");
						},
						unhighlight: function (element, errorClass) {
							ventana.find(element).removeClass("error");
						},
						errorPlacement: function (error, element) {
							error.insertAfter(ventana.find('span[errorfor="'+element.attr("name")+'"]'));
						},
						rules:{
							funcionCronometro: {
								required:true
							}
						},
						messages:{
							funcionCronometro: {
								required: "Por favor, elige una opción"
							},
						}
					});
					ventana.find("#minutosCronometro").numeric();
					ventana.find("#btnCrearClockDown").click(function(e){
						if( ventana.find("#frmCronometro").valid() ){
							if( ventana.find(".clockdown-email").attr("data-reloj-tema") ==  "sf" ){
								var clockdown = '<img class="relojCreado clockdown-email" style="margin-left: auto; object-fit: contain; margin-right: auto; width: 95%; height: 80px;" class="clockdown-email" data-reloj-funcion="'+ventana.find(".clockdown-email").attr("data-reloj-funcion")+'" data-reloj-fin="'+ventana.find(".clockdown-email").attr("data-reloj-fin")+'" data-reloj-smhd="'+ventana.find(".clockdown-email").attr("data-reloj-smhd")+'" data-reloj-reinicio="'+ventana.find(".clockdown-email").attr("data-reloj-reinicio")+'" data-reloj-color-fondo="'+ventana.find(".clockdown-email").attr("data-reloj-color-fondo")+'" data-reloj-color-fuente="'+ventana.find(".clockdown-email").attr("data-reloj-color-fuente")+'" data-reloj-color-puntos="'+ventana.find(".clockdown-email").attr("data-reloj-color-puntos")+'"  data-reloj-color-etiqueta="'+ventana.find(".clockdown-email").attr("data-reloj-color-etiqueta")+'" data-reloj-fuente="'+ventana.find(".clockdown-email").attr("data-reloj-fuente")+'" data-reloj-tema="'+ventana.find(".clockdown-email").attr("data-reloj-tema")+'" data-reloj-fecha="'+ventana.find(".clockdown-email").attr("data-reloj-fecha")+'" data-reloj-dd="1" data-reloj-hh="1" data-reloj-mm="1" data-reloj-ss="1" data-reloj-timezone="'+ventana.find(".clockdown-email").attr("data-reloj-timezone")+'" data-reloj-timezone-label="'+ventana.find(".clockdown-email").attr("data-reloj-timezone-label")+'" src="'+ventana.find(".clockdown-email").attr("src")+'" alt="Cronometro de finalización de promoción"> ';
							}
							else{
								var clockdown = '<img class="relojCreado clockdown-email" style="margin-left: auto; object-fit: contain; margin-right: auto;width: 95%; height: 80px;"class="clockdown-email" data-reloj-funcion="'+ventana.find(".clockdown-email").attr("data-reloj-funcion")+'" data-reloj-fin="'+ventana.find(".clockdown-email").attr("data-reloj-fin")+'" data-reloj-smhd="'+ventana.find(".clockdown-email").attr("data-reloj-smhd")+'" data-reloj-reinicio="'+ventana.find(".clockdown-email").attr("data-reloj-reinicio")+'" data-reloj-color-recuadro="'+ventana.find(".clockdown-email").attr("data-reloj-color-recuadro")+'" data-reloj-color-fondo="'+ventana.find(".clockdown-email").attr("data-reloj-color-fondo")+'" data-reloj-color-fuente="'+ventana.find(".clockdown-email").attr("data-reloj-color-fuente")+'" data-reloj-color-puntos="'+ventana.find(".clockdown-email").attr("data-reloj-color-puntos")+'"  data-reloj-color-etiqueta="'+ventana.find(".clockdown-email").attr("data-reloj-color-etiqueta")+'" data-reloj-fuente="'+ventana.find(".clockdown-email").attr("data-reloj-fuente")+'" data-reloj-tema="'+ventana.find(".clockdown-email").attr("data-reloj-tema")+'" data-reloj-fecha="'+ventana.find(".clockdown-email").attr("data-reloj-fecha")+'" data-reloj-dd="1" data-reloj-hh="1" data-reloj-mm="1" data-reloj-ss="1" data-reloj-timezone="'+ventana.find(".clockdown-email").attr("data-reloj-timezone")+'" data-reloj-timezone-label="'+ventana.find(".clockdown-email").attr("data-reloj-timezone-label")+'" src="'+ventana.find(".clockdown-email").attr("src")+'" alt="Cronometro de finalización de promoción"> ';
							}
							CKEDITOR.instances.mensaje.insertHtml(clockdown);
							dialog.close();
						}
					});
				},
				onhidden: function(dialogItself){
					$("body").removeClass("modal-open");
				}
			});
	}
	function setParametrosReloj(elemento){
		// AGREGO O REEMPLAZO STRING EN PARAMETROS DEL QUERY =   ruta.query.a = [1, 2, 3];   a=1&a=2&a=3------------------
		elemento = elemento;
		var ruta = new Url;
		var tipoCorreo = "secuencia";
		var idCorreoSTP = $("#idLSE").val();
		var idC = $("#cid").val();
		ruta.query.idC = idC;
		ruta.query.CoS = tipoCorreo;
		ruta.query.idCoS = idCorreoSTP;
		ruta.query.funcion =  elemento.attr("data-reloj-funcion");
		ruta.query.tema = elemento.attr("data-reloj-tema");
		ruta.query.zonaHoraria = elemento.attr("data-reloj-timezone");
		ruta.query.fechaFinalizacion = elemento.attr("data-reloj-fecha");
		ruta.query.mostrarDias = elemento.attr("data-reloj-dd");
		ruta.query.mostrarHoras = elemento.attr("data-reloj-hh");
		ruta.query.mostrarMinutos = elemento.attr("data-reloj-mm");
		ruta.query.mostrarSegundos = elemento.attr("data-reloj-ss");
		ruta.query.colorFuente = elemento.attr("data-reloj-color-fuente");
		ruta.query.tamanhoFuente =  ( elemento.attr("data-reloj-tema") == "cf" ) ? "40" : "55";
		ruta.query.tipoFuente = elemento.attr("data-reloj-fuente");
		ruta.query.colorPuntos = elemento.attr("data-reloj-color-puntos");
		ruta.query.colorFuenteEtiqueta = elemento.attr("data-reloj-color-etiqueta");
		ruta.query.tamanhoFuenteEtiqueta = "14";
		ruta.query.tipoFuenteEtiqueta = elemento.attr("data-reloj-fuente");
		ruta.query.colorDeFondo = elemento.attr("data-reloj-color-fondo");
		ruta.query.fin = elemento.attr("data-reloj-fin");
		ruta.query.smhd = elemento.attr("data-reloj-smhd");
		ruta.query.reinicio = elemento.attr("data-reloj-reinicio");
		//------------------------------------------------------------------------------------------------------
		if( elemento.attr("data-reloj-tema") == "cf"  ){
			ruta.query.colorRecuadro= elemento.attr("data-reloj-color-recuadro");
		}
		//------------------------------------------------------------------------------------------------------
		var rutaCronometro = $("#rutacronomail").val();
		var idMCoS = btoa('idMCoS');
		var rutaCronometroLimpia =  rutaCronometro.replace(/idMCoS/g, idMCoS).replace(/%7B/g, '').replace(/%7D/g, '');
		var parametrosLimpios = ruta.query;
		parametrosLimpios = String(ruta.query);
		parametrosLimpios = parametrosLimpios.replace(/=%23/g, "=");
		var jsonParametros = new Array(parametrosLimpios);
		var parametrosCodificados = btoa(jsonParametros);
		var rutaNueva = rutaCronometroLimpia.replace(/parametros/, parametrosCodificados + ".gif");
		elemento.attr("src", rutaNueva);
	}
	function fontFamly(elemento, font){
		var elemento = elemento
		var fuenteReloj = (font != undefined)?font:"Verdana";
		var GFontsCr = "";
		var Fuentes = ["Arial", "Bebas Neue", "Comic Sans", "Courier new", "Palatino linotype", "Times new roman", "Trebuchet", "Tahoma", "Impact", "Verdana"];
		for(var i = 0; i < Fuentes.length; i++){
			if(fuenteReloj.indexOf(Fuentes[i]) > -1){
				elemento.find(".fCronometro").append($("<option selected></option>").attr("value", Fuentes[i]).text(Fuentes[i]).css("font-family", Fuentes[i]));
			}
			else{
				elemento.find(".fCronometro").append($("<option></option>").attr("value", Fuentes[i]).text(Fuentes[i]).css("font-family", Fuentes[i]));
			}
		}
		if( $(".clockdown-email").length > 0  ){
			var cronometro = $(".clockdown-email");
			if( cronometro.attr("data-reloj-tema") == "sf"){
				var GFontsCr = ["Oswald", "Montserrat", "Open Sans", "Raleway", "Roboto", "Poppins", "Epilogue", "Rubik", "Lato", "Ubuntu", "Asap", "Dosis", "PT Sans", "Josefin Sans", "Fira Sans", "Source Sans Pro", "Archivo Narrow", "Nanum Gothic", "Space Grotesk", "IBM Plex Serif", "Adamina", "Nixie One", "Play Fair Display", "Anton", "Luckiest Guy", "Bangers", "Acme", "Orbitron", "Black Ops One",  "Monoton", "Bubblegum Sans", "Dancing Script",  "Indie Flower", "Courgette", "Just Another Hand", "Pacifico", "Permanent Marker", "Shadows Into Light" ];
			}
			else{
				var GFontsCr = ["Oswald", "Montserrat", "Open Sans", "Raleway", "Roboto", "Poppins", "Epilogue", "Rubik", "Lato", "Ubuntu", "Asap", "Dosis", "PT Sans", "Josefin Sans", "Fira Sans", "Source Sans Pro", "Archivo Narrow", "Nanum Gothic", "Space Grotesk", "IBM Plex Serif", "Adamina", "Nixie One", "Play Fair Display", "Anton", "Bangers", "Acme", "Bubblegum Sans", "Indie Flower", "Just Another Hand", "Pacifico", "Shadows Into Light" ];
			}
		}
		for(var i = 0; i < GFontsCr.length; i++){
			if(fuenteReloj.indexOf(GFontsCr[i]) > -1){
				elemento.find(".fGCronometro").append($("<option selected></option>").attr("value", GFontsCr[i]).text(GFontsCr[i]).css("font-family", GFontsCr[i]));
			}
			else{
				elemento.find(".fGCronometro").append($("<option></option>").attr("value", GFontsCr[i]).text(GFontsCr[i]).css("font-family", GFontsCr[i]));
			}
		}
	}
	function modalVideoTextoPlano(url, imagen){
		var editandoVideo = ( url != undefined ) ? true : false;
		var rutaVideo = ( editandoVideo ) ? url : "javascript:void(0);";
		var inputRutaVideo = ( editandoVideo ) ? url : "";
		var imagenVideo = ( editandoVideo ) ? imagen : "https://s3-us-west-2.amazonaws.com/biblioteca-img-clientes/5-HG3aB3OLoJOgz4rKTyPeVUVoRDw5UU.jpg";
		var btnCrearVideo = ( editandoVideo ) ? "Modificar video" : "Crear";
		var mensaje = '<div class="tab-pane cont" id="Video"> \
			<div class="row"> \
				<div class="col-md-12"> \
					<div class="form-group"> \
						<div class="col-md-12" style="/*margin-bottom: 15px;*/"> \
							<div class="form-group"> \
								<label> Ruta de video a agregar </label> \
								<div class="input-group"> \
									<input type="text" id="urlVideo" class="form-control" value="'+inputRutaVideo+'" placeholder="YouTube, Vimeo o exterior"> \
									<span class="input-group-btn"> \
										<button class="btn btn-warning" type="button" id="btnPosterVideo"> \
											<i class="fa fa-picture-o"></i> \
										</button> \
									</span> \
									<span class="input-group-btn"> \
										<button class="btn btn-success" type="button" id="btnAplicarCambiosVideo"> \
											<i class="fa fa-check"></i> \
										</button> \
									</span> \
								</div> \
								<input type="hidden" id="urlImagenVideo"> \
								<span id="errtxtVideo" class="text-danger"></span> \
							</div> \
						</div> \
						<div class="col-md-12" style="margin-bottom: 15px;"> \
							<label> Previsualización </label> \
							<div class="videoVistaPrevia center-block" style="max-width: 580px;">\
								<table class="editable video"> \
									<tbody> \
										<tr> \
											<td> \
												<table class="resize" style="width: 100%; height: 100%;"> \
													<tbody> \
														<tr> \
															<td> \
																<a id="rutaVid" href="'+rutaVideo+'"> \
																	<img src="'+imagenVideo+'" class="el" width="100%" style="width: 100%;"> \
																</a> \
															</td> \
														</tr> \
													</tbody> \
												</table> \
											</td> \
										</tr> \
									</tbody> \
								</table> \
							</div> \
						</div> \
					</div> \
					<div class="form-group"> \
						<button type="button" class="btn btn-primary btn-block btn-lg" id="btnCrearVideo"> '+btnCrearVideo+' </button> \
					</div> \
				</div> \
			</div> \
		</div>';
		BootstrapDialog.show({
			title: "Agregar Video",
			type: BootstrapDialog.TYPE_INFO,
			message: mensaje,
			draggable: true,
			closeByBackdrop: false,
			cssClass: "ModalVideo mdAvatar",
			onshown: function(dialog){
				$("body").addClass("modal-open");
				var ventana = dialog.getModalBody();
				ventana.find("#btnPosterVideo").on("click", function(){
					var mensaje = '<div class="col-md-12"> \
						<div class="row"> \
							<div class="col-md-8"> \
								<label> Selecciona una imágen de las bibliotecas de imágenes </label> \
								<div style="height: 465px; overflow: auto;" id="Biblioteca"> \
									<select id="slBiblioteca" style="visibility: hidden;"></select> \
								</div> \
							</div> \
							<div class="col-md-4"> \
								<div class="row"> \
									<div class="col-md-12"> \
										<label> Ó Sube tu imágen (Esta se almacenará en tu biblioteca y podras utilizarla cuantas veces quieras) </label> \
										<form action="#" class="dropzone" id="flImagen"> \
											<div class="fallback"> \
												<input name="file" type="file"> \
											</div> \
										</form> \
									</div> \
									<div class="col-md-12" style="padding-top: 10px;"> \
										<div class="alert alert-warning" role="alert"> \
											<ul> \
												<li> Las imágenes no deben tener un tamaño mayor a 1MB </li> \
												<li> Solo aceptamos imágenes en formato JPG, PNG y GIF </li> \
											</ul> \
										</div> \
									</div> \
									<div class="col-md-12" style=""> \
										<div class="form-group"> \
											<label> Ó escriba la ruta de la imagen </label> \
											<input type="text" class="form-control" id="txtImagen"></input> \
										</div> \
										<div class="form-group"> \
											<button type="button" class="btn btn-primary btn-block btn-lg" id="btnCrearImagenVideo"> Usar imágen </button> \
											<span id="errGenerico" class="text-danger"></span> \
										</div> \
									</div> \
								</div> \
							</div> \
						</div> \
					</div>';
					BootstrapDialog.show({
						title: "Agregar poster de video",
						type: BootstrapDialog.TYPE_INFO,
						message: mensaje,
						draggable: true,
						cssClass: "ModalBiblioteca mdAvatar",
						onshown: function(dialogRef){
							var ventanaImg = dialogRef.getModalBody();
							$("#flImagen").dropzone({
								url: $("#hdnRutaImagenes").val(),
								maxFiles: 1,
								acceptedFiles: "image/jpeg,image/png,image/gif",
								maxFilesize: 1,
								success: function(file, response){
									if(response.success){
										var value = response.imagen;
										var img = new Image();
										img.src = value;
										img.onload = function(){
											var alto = img.height;
											var ancho = img.width;
											if( ancho != 854  && alto != 480 ){
												$.isLoading("hide"); NProgress.done();
												$("#errGenerico").text("La imagen no cumple con las medidas. Te recomendamos las siguientes medidas (854 x 480)");
											}
											else{
												if(img.height != 0){
													ventana.find("#urlImagenVideo").val(value);
													ventana.find("#urlImagenVideo").trigger("blur");
													ventana.find("#btnAplicarCambiosVideo").trigger("click");
													$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
													dialogRef.close();
													$.isLoading("hide"); NProgress.done();
												}
												else{
													new PNotify({ title: "Error", text: "La imágen no pudo ser cargada, por favor vuelve a intentarlo", type: "error" });
													$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
													dialogRef.close();
													$.isLoading("hide"); NProgress.done();
												}
											}
										}
										img.onerror = function(){
											new PNotify({ title: "Error", text: "La imágen no pudo ser cargada, por favor vuelve a intentarlo", type: "error" });
											$("#btnCrearImagen").html("Usar imágen").prop("disabled", false);
											dialogRef.close();
											$.isLoading("hide"); NProgress.done();
										};
									}
									else{
										dialogRef.close();
										new PNotify({ title: "Error", text: "Ha ocurrido un error, por favor notificalo a soporte!", type: "error" });
									}
								},
								init: function() {
									this.on("addedfile", function(file){
										var dropzone = this;
										if(this.files.length > 1){
											new PNotify({ title: "Error", text: "No puedes subir más de 1 archivo", type: "error" });
											$.each(this.files, function(i, file){
												dropzone.removeFile(file);
											});
										}
									});
									this.on("maxfilesexceeded", function(file){
										new PNotify({ title: "Error", text: "No puedes subir más de 1 archivo", type: "error" });
										$.each(this.files, function(i, file){
											dropzone.removeFile(file);
										});
									});
									this.on("error", function(file, message){
										console.log( message );
										var mensaje = message;
										var borrar = false;
										if( mensaje.indexOf("Max filesize:") !== -1 ){
											borrar = true;
											var texto = "El archivo no debe de tener un tamaño mayor a 1MB";
										}
										else if( mensaje.indexOf("You can't upload files of this type.") !== -1 ){
											borrar = true;
											var texto = "El formato del archivo que intentas cargar no es soportado";
										}
										if( borrar ){
											var dropzone = this;
											$.each(this.files, function(i, file){
												dropzone.removeFile(file);
											});
										}
										new PNotify({ title: "Error", text: texto, type: "error" });
									});
									this.on("processing", function(file){
										$.isLoading({ text: "Cargando..." }); NProgress.start();
										$("#btnCrearImagen").prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i> Procesando...');
									});
								}
							}).on("thumbnail", function(file, dataUri) {
								console.log(dataUri);
							});
							$.get(
								$("#rutabibliotecascliente").val()+$("#cid").val(),
								function(data){
									if(data.success){
										ventanaImg.find("#slBiblioteca").html("").append('<option value=""></option>');
										$.each(data.biblioteca, function(index, val){
											$("#slBiblioteca").append("<option data-img-src='"+val.ruta+"' value='"+val.id+"'>");
										});
										ventanaImg.find("#slBiblioteca").imagepicker({hide_select: true, show_label: true});
										var i = 0;
										ventanaImg.find(".image_picker_selector").find("[title]").each(function(){ $(this).tooltip(); });
										ventanaImg.find(".image_picker_selector").find(".thumbnail").find("img").each(function(){
											var nodo = $(this);
											var img = new Image();
											img.src = nodo.attr("src");
											img.onload = function(e){
												var alto = img.height;
												var ancho = img.width;
												if( ancho != 854  && alto != 480 ){
													nodo.closest("li").addClass("hide");
												}
												else{
													nodo.closest("li").removeClass("hide");
												}
											};
										});
									}
									else{
										$("#slBiblioteca").hide();
										$("#Biblioteca").append('<div id="dvWrBiblioteca" class="alert alert-warning" role="alert"> Aún no tienes ningúna imágen almacenada en tu biblioteca </div>');
									}
								},
								"json"
							);
							ventanaImg.find("#btnCrearImagenVideo").on("click", function(){
								ventanaImg.find("#errGenerico").html("");
								$.isLoading({ text: "Cargando..." }); NProgress.start();
								ventanaImg.find("#btnCrearImagen").prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i> Procesando...');
								if( ventanaImg.find("#txtImagen").val() == "" && ventanaImg.find("#slBiblioteca").val() == "" && ventanaImg.find("#flImagen").val() == "" ){
									ventanaImg.find("#errGenerico").html("Debes seleccionar una imágen de la biblioteca, subir una imágen o ingresar la ruta de la imágen que deseas almacenar");
									$.isLoading("hide"); NProgress.done();
									ventanaImg.find("#btnCrearImagen").html("Usar imagen").prop("disabled", false);
								}
								else{
									if( ventanaImg.find("#txtImagen").val() != "" ){
										var img = new Image();
										img.src = ventanaImg.find("#txtImagen").val();
										img.onload = function(e){
											var alto = img.height;
											var ancho = img.width;
											if( ancho != 854  && alto != 480 ){
												$.isLoading("hide"); NProgress.done();
												$("#errGenerico").text("La imagen no cumple con las medidas. Te recomendamos las siguientes medidas (854 x 480)");
												ventanaImg.find("#btnCrearImagen").prop("disabled", false).html('<i class="fa fa-upload"></i> Subir imagen');
											}
											else{
												ventana.find("#urlImagenVideo").val( img.src );
												ventana.find("#btnAplicarCambiosVideo").trigger("click");
												dialogRef.close();
												$.isLoading("hide"); NProgress.done();
												ventanaImg.find("#btnCrearImagen").prop("disabled", false).html("Usar imagen");
											}
										};
									}
									else if( ventanaImg.find("#flImagen").val() != "" ){
										var formData = new FormData();
										formData.append("file", ventanaImg.find("#flImagen")[0].files[0]);
										$.ajax({
											type: "POST",
											url: $("#hdnRutaImagenes").val(),
											data: formData,
											cache: false,
											contentType: false,
											processData: false,
											dataType: "json",
											success: function(data){
												urlIcono = data.imagen;
												ventana.find("#urlImagenVideo").val( urlIcono );
												ventanaImg.find("#btnCrearImagen").prop("disabled", false).html("Usar imagen");
												ventana.find("#btnAplicarCambiosVideo").trigger("click");
												dialogRef.close();
												$.isLoading("hide"); NProgress.done();
											},
											error: function(jqXHR, textStatus, errorThrown){
												ventanaImg.find("#errGenerico").html("Ha ocurrido algún error inesperado, por favor vuelve a intentarlo...");
												$.isLoading("hide"); NProgress.done();
												ventanaImg.find("#btnCrearImagen").prop("disabled", false).html("Usar imagen");
											}
										});
									}
									else{
										urlIcono = ventanaImg.find("#slBiblioteca option:selected").attr("data-img-src");
										ventana.find("#urlImagenVideo").val( urlIcono );
										$.isLoading("hide"); NProgress.done();
										ventanaImg.find("#btnCrearImagen").prop("disabled", false).html("Usar imagen");
										dialogRef.close();
									}
									ventana.find("#btnAplicarCambiosVideo").trigger("click");
								}
							});
						},
					});
				});
				if(editandoVideo){
					ventana.find("#btnCrearVideo").prop("disabled", "disabled");
				}
				ventana.find("#btnAplicarCambiosVideo").on("click", function(){
					$.isLoading({ text: "Cargando..." }); NProgress.start();
					ventana.find("#errtxtVideo").html("");
					var urlVideo = ventana.find("#urlVideo").val();
					var idC = $("#cid").val();
					var urlImgVideo = ventana.find("#urlImagenVideo").val();
					if( ventana.find("#urlVideo").val() != "" ){
						$.post(
							$("#rutagenerarimgvideo").val(),
							{urlVideo: urlVideo, idC: idC, retorno: "base64", urlImgVideo: urlImgVideo},
							function(data){
								if( data.success ){
									ventana.find(".videoVistaPrevia .video a").attr("href", ventana.find("#urlVideo").val());
									ventana.find(".videoVistaPrevia .video img").attr("src", data.imagen);
								}
								if(editandoVideo){
									ventana.find("#btnCrearVideo").prop("disabled", false);
								}
								$.isLoading("hide"); NProgress.done();
							},
							"json"
						);
					}
					else{
						ventana.find("#errtxtVideo").html("La ruta del video no puede ir vacía...");
						$.isLoading("hide"); NProgress.done();
					}
				});
				ventana.find("#btnCrearVideo").click(function(e){
					$.isLoading({ text: "Cargando..." }); NProgress.start();
					ventana.find("#errtxtVideo").html("");
					if( ventana.find("#urlVideo").val() != "" ){
						if( ventana.find("#rutaVid").attr("href") != "javascript:void(0);" ){
							$.post(
								$("#rutagenerarimggmapyv").val(),
								{
									idC: $("#cid").val(),
									tipo: "V",
									rutaVieo: ventana.find(".videoVistaPrevia .video a").attr("href"),
									imagen: ventana.find(".videoVistaPrevia .video img").attr("src")
								},
								function(data){
									if( data.success ){
										var insertarVideo = '<a href="'+ventana.find("#urlVideo").val()+'"> \
											<img src="'+data.rutaImagen+'" class="videoTP" width="74%" height="74%" style="width: 74%; height: 74%;"> \
										</a>';
										CKEDITOR.instances.mensaje.insertHtml(insertarVideo);
										ventana.find("#errtxtVideo").html("");
										$.isLoading("hide"); NProgress.done();
										dialog.close();
									}
								}
							);
						}
						else{
							ventana.find("#errtxtVideo").html("Presiona el botón verde para que tu video sea cargado");
							$.isLoading("hide"); NProgress.done();
						}
					}
					else{
						ventana.find("#errtxtVideo").html("La ruta del video no puede ir vacía...");
						$.isLoading("hide"); NProgress.done();
					}
				});
			},
			onhidden: function(dialogItself){
				$("body").removeClass("modal-open");
			}
		});
	}
</script>
<?php echo $__env->make('GenTemplate.ventana-biblioteca-imagenes-js', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('JSOr'); ?>
$(".flInput").each(function(e){
	$(this).ezdz({
		text: "<i class='fa fa-paperclip'></i>",
		validators: {
			maxSize: 5500000
		},
		previewImage: false,
		accept: function(file){
			//$(".ezdz-dropzone").addClass("inactivo");
		}
	});
});
<?php if( $tieneArchivo ): ?>
$(".ezdz-dropzone").addClass("inactivo");
<?php endif; ?>
$("[name='suscriptores']").click(function(e){
	if($(this).val() == "T"){
		$("#dvSegmentoEtiquetas").hide("slow");
		$("#etiquetas option:selected").removeAttr("selected");
		$("#etiquetas").selectpicker("refresh");
		$("#dvEtiquetas").html("");
	}
	else{
		$("#dvSegmentoEtiquetas").show("slow");
	}
});
$("#etiquetas").on("changed.bs.select", function(e){
	$("#dvEtiquetas").html("");
	$.each(
		$(this).val(),
		function(key, value){
			$("#dvEtiquetas").append(' \
				<span class="label label-info" data-valor="'+$("#op"+value).html()+'"> \
					'+$("#op"+value).html()+' \
				</span> &nbsp; \
			');
		}
	);
});
CKEDITOR.on("instanceReady", function(evt){ if($("#clic").is(":checked")){ DecodificarVinculo(); } });
$("select").imagepicker({ hide_select : true, show_label  : true });
$("#tipo").click(function(){
	if($("#tipo").is(":checked")){
		$("#confplantilla").hide("slow");
		$("#errcolor").html("");
	}
	else{
		$("#confplantilla").show("slow");
	}
});
$('[name="clic"]').on("click", function(){
	if(!$(this).is(":checked")){
		editor = CKEDITOR.instances.mensaje;
		var nodo = $('<div class="conetenedor">'+editor.getData()+'<div class="conetenedor">');
		nodo.find("[data-automatizacion]").removeAttr("data-automatizacion");
		editor.setData(nodo.html());
	}
});
<?php
	//$minDiasDespues = (SecuenciaSeguimiento::where('listas_emails_id', '=', $ListaEmail->id)->count() == 1)?0:1;
	$minDiasDespues = ($SecuenciaSeguimiento->posicion == 1)?0:1;
?>
$("#dias_despues").TouchSpin({
	min: <?php echo $minDiasDespues; ?>,
	verticalbuttons: true,
	verticalupclass: "glyphicon glyphicon-plus",
	verticaldownclass: "glyphicon glyphicon-minus",
	initval: <?php echo $SecuenciaSeguimiento->dias_despues; ?>

});
$("#dias_despues").numeric();
$('[name="pre_cabecera"]').alphanum({
	allow: "@!¡¿?+{}_",
	disallow: "",
	allowSpace: true,
	allowNewline: false,
	allowNumeric: true,
	allowLatin: true,
	allowOtherCharSets: true,
	maxLength: 250
});
$("#frmEditar").submit(function(e){
	$.isLoading({ text: "Cargando..." }); NProgress.start();
	$("#btnEditar").html('<i class="fa fa-spinner fa-spin"></i> Cargando').prop("disabled", true);
	e.preventDefault();
	for(instance in CKEDITOR.instances){ CKEDITOR.instances[instance].updateElement(); }
	//CONVERSIÓN DE VÍNCULOS
	if($("#clic").is(":checked")){
		CodificarVinculo();
	}
	else{
		DecodificarVinculo();
	}
	/*$.post(
		"<?php echo URL::route('SysWebEmailMarketingListasSubscriptoresSecuenciasSeguimientosEditar', array($ListaEmail->id, $SecuenciaSeguimiento->id)); ?>",
		$("#frmEditar").serialize(),
		function(data){
			$.isLoading("hide"); NProgress.done();
			$("#btnEditar").html("Editar").prop("disabled", false);
			if(data.success){
				new PNotify({ title: "Realizado", text: data.mensaje, type: "success" });
				setTimeout( function(){ window.location.href = "<?php echo URL::route('SysWebEmailMarketingListasSubscriptoresSecuenciasSeguimientos', array($ListaEmail->id)); ?>"; }, 3000 );
			}
			else{
				if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
				$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
				if($("#clic").is(":checked")){ DecodificarVinculo(); }
			}
		},
		"json"
	);*/
	var formData = new FormData(document.getElementById("frmEditar"));
	$.ajax({
		type: "POST",
		url: "<?php echo URL::route('SysWebEmailMarketingListasSubscriptoresSecuenciasSeguimientosEditar', array($ListaEmail->id, $SecuenciaSeguimiento->id)); ?>",
		data: formData,
		cache: false,
		contentType: false,
		processData: false,
		dataType: "json",
		success: function(data){
			$.isLoading("hide"); NProgress.done();
			$("#btnEditar").prop("disabled", false);
			$("#btnEditar").html("Editar");
			if(data.success){
				new PNotify({ title: "Realizado", text: data.mensaje, type: "success" });
				setTimeout( function(){ window.location.href = "<?php echo URL::route('SysWebEmailMarketingListasSubscriptoresSecuenciasSeguimientos', array($ListaEmail->id)); ?>"; }, 3000 );
			}
			else{
				if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
				$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
			}
		},
		error: function(jqXHR, textStatus, errorThrown){
			new PNotify({ title: "Error", text: textStatus + " " + errorThrown, type: "error" });
		}
	});
});
$("#asunto").textcounter({
	type: "character",
	min: 1,
	max: 100,
	countContainerClass: "text-count-wrapper-t",
	counterText: "Caracteres contados: %d",
	minimumErrorText: "40 son los caracteres mínimos recomendados",
	maximumErrorText: "Ha excedido la cantidad de caracteres recomendados",
	countSpaces: true,
	countDown: false,
	countDownText: "Le restan %d caracteres",
	countOverflowText: "La cantidad de caracteres excede los %d",
	init: function(el){
		barraProgreso("Asunto");
	}
});
$("#asunto").on("keyup click blur focus change paste", function(e){
	barraProgreso("Asunto");
});
$("#pre_cabecera").textcounter({
	type: "character",
	min: 0,
	max: 250,
	countContainerClass: "text-count-wrapper-d",
	counterText: "Caracteres contados: %d",
	minimumErrorText: "20 son los caracteres mínimos recomendados",
	maximumErrorText: "Ha excedido la cantidad de caracteres recomendados",
	countSpaces: true,
	countDown: false,
	countDownText: "Le restan %d caracteres",
	countOverflowText: "La cantidad de caracteres excede los %d",
	init: function(el){
		barraProgreso("preCabecera");
	}
});
$("#pre_cabecera").on("keyup click blur focus change paste", function(e){
	barraProgreso("preCabecera");
});
$(".tooltips").tooltip({
	position: {
		my: "center top-8",
		at: "center bottom",
	},
	tooltipClass: "entry-tooltip-positioner",
});
<?php $__env->stopSection(); ?>
<?php echo $__env->make('BaseSistemaWeb', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>