{% extends "base/templates/base.html" %}
{% load thumbnail %}

{% block header_css %}
<link type="text/css" rel="stylesheet" href="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/persona' folder='media' %}css/mapa.css?v={{settings.JS_VERSION}}" />
{% endblock %}

{% block breadcumb %}
	<ul class="breadcrumb">
		<li><a href="/"><i class="icon-home2 position-left"></i>Principal</a></li>
		<li class="active">Registrar Persona</li>
	</ul>
{% endblock %}

{% block toolbar %}

{% endblock %}

{% block content %}
<div class="tabbable tab-content-bordered">
	<form method="post" name="registrar_persona_form" action="" enctype="multipart/form-data">
		{% csrf_token %}
		{{form.id}}{{form.errors.id}}
		{{ form.non_field_errors }}
		<ul class="nav nav-tabs nav-tabs-highlight">
			<li class="active"><a href="#informacion_general" data-toggle="tab">Informaci&oacute;n General</a></li>
			<li class="class_campos_contactos"><a class="{% if form.errores_contactos %}text-danger{% endif %}" href="#personas_contacto" data-toggle="tab">{% if form.errores_contactos %}* {% endif %}Personas de Contacto</a></li>
			<li class="class_campos_destinos"><a class="{% if form.errores_destinos %}text-danger{% endif %}" href="#personas_destino" data-toggle="tab">{% if form.errores_destinos %}* {% endif %}Destinos</a></li>
			<li><a class="tab-chofer hide {% if form.errores_chofer %}text-danger{% endif %}" href="#persona_chofer" data-toggle="tab">{% if form.errores_chofer %}* {% endif %}Informaci&oacute;n del Chofer</a></li>
		</ul>
		<div class="tab-content">
			<!-- informacion general -->
			<div class="tab-pane has-padding active" id="informacion_general">
				<div class="row">
					<div class="col-md-6 col-sm-12">
						<div class="row">
							<div class="col-md-6 col-sm-12">
								<div class="form-group">
									<label>Estado:</label>
									{{ form.estado }}{{ form.errors.estado }}
								</div>
							</div>
							<div class="col-md-6 col-sm-12">
								<div class="form-group {% if form.errors.tipo %}has-error{% endif %}">
									<label>Tipo:</label>
									{{ form.tipo }}{{ form.errors.tipo }}
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-md-12 col-sm-12">
								<div class="form-group">
									<label id="label_razon_social">Razon Social:</label>
									{{ form.razon_social }}{{ form.errors.razon_social }}
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-md-12 col-sm-12">
								<div class="form-group">
									<label id="label_nombre_comercial">Nombre Comercial:</label>
									{{ form.nombre_comercial }}{{ form.errors.nombre_comercial }}
								</div>
							</div>
						</div>
						<div class="row">
							<div id="id_campos_cedula" class="col-md-6 col-sm-12">
								<div class="form-group">
									<label>C&eacute;dula:</label>
									{{ form.cedula }}{{ form.errors.cedula }}
								</div>
							</div>
							<div id="id_campos_ruc" class="col-md-6 col-sm-12">
								<div class="form-group">
									<label>Ruc:</label>
									{{ form.ruc }}{{ form.errors.ruc }}
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-md-6 col-sm-12">
								<div class="form-group">
									<label>Email:</label>
									{{ form.email }}{{ form.errors.email }}
								</div>
							</div>
							<div class="col-md-6 col-sm-12">
								<div class="form-group">
									<label>Tel&eacute;fonos:</label>
									{{ form.telefonos }}{{ form.errors.telefonos }}
								</div>
							</div>
						</div>
						<div class="row">
							<div id="id_campos_direccion" class="col-md-12 col-sm-12">
								<div class="form-group">
									<label>Direcci&oacute;n:</label>
									{{ form.direccion }}{{ form.errors.direccion }}
								</div>
							</div>
						</div>
					</div>
					<div class="col-md-6 col-sm-12">
						<div class="panel panel-default">
							<div class="panel-heading ">
								<h6 class="panel-title">Rol de la Persona</h6>
							</div>
							<div class="panel-body">
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_cliente }} Es Cliente</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_empleado }} Es Empleado</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_linea_naviera }} Es Linea Naviera</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_agencia_carga }} Es Agencia de Carga/Consolidadora</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_transportista }} Es Transportista</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_funcionario_aduana }} Es Funcionario de Aduana</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_aseguradora }} Es Aseguradora</label>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class="form-group">
											<label>{{ form.es_chofer }} Es Chofer</label>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- /informacion general -->
			<!-- personas contacto -->
			<div class="tab-pane has-padding" id="personas_contacto">
				<div class="table-responsive">
					<table class="table table-togglable table-hover tabla-menos-padding">
						<thead>
							<tr class="bg-slate">
								<th class="text-center">Notificar</th>
								<th>Sufijo</th>
								<th>Cargo</th>
								<th>Area</th>
								<th>Nombres</th>
								<th>Apellidos</th>
								<th>Email</th>
								<th width="80">Celular</th>
								<th width="80">Trabajo</th>
								<th class="text-center"><i class="icon-cog5"></i></th>
							</tr>
						</thead>
						<tbody id="tdetalle_personacontacto">
							<tr id="dtemplate_personacontacto" class="hide">
								<td class="text-center">{{ form.template_detalle_personacontacto.notificar }}</td>
								<td>{{ form.template_detalle_personacontacto.sufijo }}</td>
								<td>{{ form.template_detalle_personacontacto.cargo }}</td>
								<td>{{ form.template_detalle_personacontacto.area }}</td>
								<td>{{ form.template_detalle_personacontacto.nombres }}</td>
								<td>{{ form.template_detalle_personacontacto.apellidos }}</td>
								<td>{{ form.template_detalle_personacontacto.email }}</td>
								<td>{{ form.template_detalle_personacontacto.celular }}</td>
								<td>{{ form.template_detalle_personacontacto.trabajo }}</td>
								<td class="text-center"><a class="text-danger" href="javascript:;" onclick="javascript:persona_contacto.eliminarDetalle(this);"><span class="icon-trash"></span></a></td>
							</tr>
							{% for d in form.detalle_personacontacto %}
								<tr>
									<td class="text-center">{{ d.id }}{{ d.notificar }}{{ d.errors.notificar }}</td>
									<td>{{ d.sufijo }}{{ d.errors.sufijo }}</td>
									<td>{{ d.cargo }}{{ d.errors.cargo }}</td>
									<td>{{ d.area }}{{ d.errors.area }}</td>
									<td>{{ d.nombres }}{{ d.errors.nombres }}</td>
									<td>{{ d.apellidos }}{{ d.errors.apellidos }}</td>
									<td>{{ d.email }}{{ d.errors.email }}</td>
									<td>{{ d.celular }}{{ d.errors.celular }}</td>
									<td>{{ d.trabajo }}{{ d.errors.trabajo }}</td>
									<td class="text-center"><a class="text-danger" href="javascript:;" onclick="javascript:persona_contacto.eliminarDetalle(this);"><span class="icon-trash"></span></a></td>
								</tr>
							{% endfor %}
						</tbody>
						<tfoot>
							<tr>
								<td colspan="10"><a class="btn btn-xs btn-flat" href="javascript:;" onclick="agregarPersonaContacto(this);"><i class="icon-plus-circle2"></i> Agregar Contacto</a></td>
							</tr>
						</tfoot>
					</table>
				</div>
			</div>
			<!-- /personas contacto -->
			<!-- personas destino -->
			<div class="tab-pane has-padding" id="personas_destino">
				<div class="table-responsive">
					<table class="table table-togglable table-hover tabla-menos-padding">
						<thead>
							<tr class="bg-slate">
								<th class="text-center">Nombres</th>
								<th >Apellidos</th>
								<th  >Email</th>
								<th  width="80">Celular</th>
								<th  width="80">Trabajo</th>
								<th  width="80">Direccion</th>
								<th  width="80">Ubicaci&oacute;n</th>
								<th class="text-center" ><i class="icon-cog5"></i></th>
							</tr>
						</thead>
						<tbody id="tdetalle_personadestino">
							<tr id="dtemplate_personadestino" class="hide">
								<td>{{ form.template_detalle_personadestino.nombres }}</td>
								<td>{{ form.template_detalle_personadestino.apellidos }}</td>
								<td>{{ form.template_detalle_personadestino.email }}</td>
								<td>{{ form.template_detalle_personadestino.celular }}</td>
								<td>{{ form.template_detalle_personadestino.trabajo }}</td>
								<td>{{ form.template_detalle_personadestino.direccion }}</td>
								<td class="text-center">
									{{ form.template_detalle_personadestino.latitud }}{{ form.template_detalle_personadestino.longitud }}
									<a class="btn btn-link btn-xs btn-agregar-ubicacion text-muted" href="javascript:;" onclick="mostrarMapa(this);"><i class="icon-location4"></i></a>
								</td>
								<td class="text-center"><a class="text-danger" href="javascript:;" onclick="javascript:persona_destino.eliminarDetalle(this);"><span class="icon-trash"></span></a></td>
							</tr>
							{% for d in form.detalle_personadestino %}
								<tr>
									<td>{{ d.id }}{{ d.nombres }}{{ d.errors.nombres }}</td>
									<td>{{ d.apellidos }}{{ d.errors.apellidos }}</td>
									<td>{{ d.email }}{{ d.errors.email }}</td>
									<td>{{ d.celular }}{{ d.errors.celular }}</td>
									<td>{{ d.trabajo }}{{ d.errors.trabajo }}</td>
									<td>{{ d.direccion }}{{ d.errors.direccion }}</td>
									<td class="text-center">
										{% if d.errors.latitud or d.errors.longitud %}
											<ul class="errorlist"><li>Este campo es obligatorio.</li></ul>
										{% endif %}
										{{ d.latitud }}{{ d.longitud }}
										<a class="btn btn-link btn-xs btn-agregar-ubicacion {% if d.tiene_ubicacion %}text-success{% endif %}" href="javascript:;" onclick="mostrarMapa(this);"><i class="icon-location4"></i></a>
									</td>
									<td class="text-center"><a class="text-danger" href="javascript:;" onclick="javascript:persona_destino.eliminarDetalle(this);"><span class="icon-trash"></span></a></td>
								</tr>
							{% endfor %}
						</tbody>
						<tfoot>
							<tr>
								<td colspan="10"><a class="btn btn-xs btn-flat" href="javascript:;" onclick="agregarPersonaDestino(this);"><i class="icon-plus-circle2"></i> Agregar Destino</a></td>
							</tr>
						</tfoot>
					</table>
				</div>
			</div>
			<!-- /personas destino -->
			<!-- personas chofer -->
			<div class="tab-pane has-padding" id="persona_chofer">
				<div class="row">
					<div class="col-md-12 col-sm-12">
						<div class="row">
							<div class="col-md-3 col-sm-6">
								<div class="form-group has-feedback has-feedback-left">
									<label>Fecha de Vencimiento de Licencia:</label>
									{{ form.fecha_vencimiento_licencia }}{{ form.errors.fecha_vencimiento_licencia }}
									<div class="form-control-feedback">
										<i class="icon-calendar"></i>
									</div>
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-md-4 col-sm-12">
								<div class="form-group">
									<div class="panel panel-default">
			  							<div class="panel-heading">
											<label class="">Foto de Licencia:</label>
			  							</div>
			  							<div id="img_panel_licencia" class="panel-body text-center">
											{% if persona and persona.chofer_licencia_imagen %}
												<img alt="licencia" src="{% thumbnail persona.chofer_licencia_imagen 200x200 crop %}">
											{% else %}
												<img src="/static/all/assets/images/placeholder.jpg" alt="" class="file-preview-image">
											{% endif %}
										</div>
			  							<div class="panel-footer panel-footer-upload">
			  								{{ form.chofer_licencia_imagen }}{{ form.errors.chofer_licencia_imagen }}
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-4 col-sm-12">
								<div class="form-group">
									<div class="panel panel-default">
			  							<div class="panel-heading">
											<label>Foto de C&eacute;dula:</label>
			  							</div>
			  							<div id="img_panel_cedula" class="panel-body text-center">
											{% if persona and persona.chofer_cedula_imagen %}
												<img alt="cedula" src="{% thumbnail persona.chofer_cedula_imagen 200x200 crop %}">
											{% else %}
												<img src="/static/all/assets/images/placeholder.jpg" alt="" class="file-preview-image">
											{% endif %}
										</div>
			  							<div class="panel-footer panel-footer-upload">
											{{ form.chofer_cedula_imagen }}{{ form.errors.chofer_cedula_imagen }}
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-4 col-sm-12">
								<div class="form-group">
									<div class="panel panel-default">
			  							<div class="panel-heading">
											<label>Foto de Papeleta de Votaci&oacute;n:</label>
			  							</div>
			  							<div id="img_panel_votacion" class="panel-body text-center">
											{% if persona and persona.chofer_votacion_imagen %}
												<img alt="votacion" src="{% thumbnail persona.chofer_votacion_imagen 200x200 crop %}">
											{% else %}
												<img src="/static/all/assets/images/placeholder.jpg" alt="" class="file-preview-image">
											{% endif %}
										</div>
			  							<div class="panel-footer panel-footer-upload">
											{{ form.chofer_votacion_imagen }}{{ form.errors.chofer_votacion_imagen }}
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- /personas chofer -->
		</div>
	</form>
</div>
<div class="row">
	<div class="col-sm-12">
		<br>
		<button class="btn btn-success btn-sm" onclick="registrarPersona(this);"><span class="icon-floppy-disk text-size-base"></span> Guardar</button>
	</div>
</div>
<div id="modalMapa" class="modal fade" style="">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">×</button>
				<h5 class="modal-title text-center text-primary">Click para Agregar Ubicaci&oacute;n</h5>
			</div>
			<div class="modal-body" style="padding:0px;">
				<input id="pac-input" class="controls" type="text" placeholder="Busqueda de Lugar">
				<div id="map-canvas">///</div>
			</div>
			<div class="modal-footer" style="padding:10px;">
				<!-- <button type="button" class="btn btn-link btn-xs" data-dismiss="modal">Close</button> -->
				<button type="button" class="btn btn-success btn-xs" onclick="guardarUbicacionMapa();">Guardar Ubicacion</button>
			</div>
		</div>
	</div>
</div>
{% endblock %}

{% block footer_js %}
	{% load staticfiles %}
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/persona' folder='media' %}js/persona_contacto.js?v={{settings.JS_VERSION}}"></script>
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/persona' folder='media' %}js/persona_destino.js?v={{settings.JS_VERSION}}"></script>
	<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBS53fWEJGaH9ZaAzzZRjDXyyQMbgQWOUw&libraries=places"></script>
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/persona' folder='media' %}js/mapa_destino.js?v={{settings.JS_VERSION}}"></script>
	<script type="text/javascript">
		var persona_contacto = null;
		var img_licencia_tmp = $('#img_panel_licencia').html();
		var img_cedula_tmp = $('#img_panel_cedula').html();
		var img_votacion_tmp = $('#img_panel_votacion').html();
		
		function registrarPersona(el){
			$(el).prop('disabled', true);
			$(el).html('<i class="icon-spinner4 text-size-base spinner"></i>&nbsp;Guardando...');
			document.forms.registrar_persona_form.submit();
		}
		
		function agregarPersonaContacto(el){
			persona_contacto.agregarDetalle();
		}
		
		function agregarPersonaDestino(el){
			persona_destino.agregarDetalle();
		}
		
		function mostrarMensajeInfoImagen(){
			swal({
	            title: "Informacion",
	            text: "No se puede subir cualquier tipo de archivo, solo se permiten imagenes.",
	            confirmButtonColor: "#2196F3",
	            type: "info",
	            allowOutsideClick: true
	        });
		}
		
		//setear tipo juridica
		function ponerJuridica(){
			$('#id_tipo').val("J");
		}

		//setear tipo natural
		function ponerNatural(){
			$('#id_tipo').val("N");
		}
		//setear tipo a ninguna
		function quitarTipo(){
			$('#id_tipo').val("");
		}
		
		//quita la pestana de destinos
		function quitarDestinos(){
			$('.class_campos_destinos').hide();
		}
		//pone la pestana de destinos
		function ponerDestinos(){
			$('.class_campos_destinos').show();
		}
		
		//quita la pestana de contactos
		function quitarContactos(){
			$('.class_campos_contactos').hide();
		}
		//pone la pestana de contactos
		function ponerContactos(){
			$('.class_campos_contactos').show();
		}
		
		//quita la cedula del form
		function quitarCedula(){
			$('#id_campos_cedula').hide();
		}
		//pone la cedula en el form
		function ponerCedula(){
			$('#id_campos_cedula').show();
		}
		
		//quita el ruc del form
		function quitarRuc(){
			$('#id_campos_ruc').hide();
		}
		//pone el ruc en el form
		function ponerRuc(){
			$('#id_campos_ruc').show();
		}
		
		//quita la direccion del form
		function quitarDireccion(){
			$('#id_campos_direccion').hide();
		}
		//pone la direccion en el form
		function ponerDireccion(){
			$('#id_campos_direccion').show();
		}
		
		//setea los nombres y apellidos
		function setearNombres(){
			$('#label_razon_social').text('Nombres:');
			$('#label_nombre_comercial').text('Apellidos:');
		}
		//quita los nombres y apellidos
		function quitarNombres(){
			$('#label_razon_social').text('Razon Social:');
			$('#label_nombre_comercial').text('Nombre Comercial:');
		}
		
		$(function(){
			persona_contacto = new MasterDetail({ 
				'templateDetalle': $('#dtemplate_personacontacto'),
				'tableDetalle': $('#tdetalle_personacontacto'),
				'prefixDetalle': 'template',
				'funcCompDetalle': PersonaContactoForm.sonIguales,
				'klassDetalle': PersonaContactoForm 		
			});

			persona_destino = new MasterDetail({ 
				'templateDetalle': $('#dtemplate_personadestino'),
				'tableDetalle': $('#tdetalle_personadestino'),
				'prefixDetalle': 'template',
				'funcCompDetalle': PersonaDestinoForm.sonIguales,
				'klassDetalle': PersonaDestinoForm 		
			});
			
			//para el mapa
			$('#modalMapa').on('shown.bs.modal', function(e){
				ubicacionInicial();
				addSearchInput($('#pac-input')[0]);
	    	});
			//se oculta el modal del mapa
	        $('#modalMapa').on('hidden.bs.modal', function(e){
	    	  	ubicacionInicial();
	    	  	deleteMarker();
	    	});

			//para los input type file
		    $('.file-input-chofer').fileinput({
		    	showCaption: false,
		    	showPreview: true,
		        browseLabel: 'Seleccionar Imagen',
		        browseClass: 'btn btn-primary btn-icon',
		        removeLabel: '',
		        showUpload: false,
		        uploadLabel: '',
		        uploadClass: 'btn btn-default btn-icon',
		        browseIcon: '<i class="icon-upload"></i> ',
		        uploadIcon: '<i class="icon-file-upload"></i> ',
		        removeClass: 'btn btn-danger btn-icon',
		        removeIcon: '<i class="icon-trash"></i> ',
		        allowedFileExtensions: ["jpg", "gif", "png"],
		        allowedFileTypes: ["image"],
		        msgInvalidFileExtension: 'El archivo {name} debe ser un tipo de imagen permitido [jpg, png, gif]',
		        msgInvalidFileType: 'El archivo {name} ingresado no es una imagen valida',
		    });
		    //licencia
		    $('#id_chofer_licencia_imagen').on('fileloaded', function(event, file, previewId, index, reader) {
	        	$('#img_panel_licencia').html($('#'+previewId).find('img.file-preview-image')[0]);
		    });
		    $('#id_chofer_licencia_imagen').on('fileclear', function(event, file, previewId, index, reader) {
		        $('#img_panel_licencia').html(img_licencia_tmp);
		    });
		    $('#id_chofer_licencia_imagen').on('fileerror', function(event, data) {
		    	$(this).fileinput('clear');
		    	$(this).fileinput('reset');
		    	$(this).fileinput('refresh');
		    	mostrarMensajeInfoImagen();
	    	});
		    //cedula
		    $('#id_chofer_cedula_imagen').on('fileloaded', function(event, file, previewId, index, reader) {
		        $('#img_panel_cedula').html($('#'+previewId).find('img.file-preview-image')[0]);
		    });
		    $('#id_chofer_cedula_imagen').on('fileclear', function(event, file, previewId, index, reader) {
		        $('#img_panel_cedula').html(img_cedula_tmp);
		    });
		    $('#id_chofer_cedula_imagen').on('fileerror', function(event, data) {
		    	$(this).fileinput('clear');
		    	$(this).fileinput('reset');
		    	$(this).fileinput('refresh');
		    	mostrarMensajeInfoImagen();
	    	});
		    //votacion
		    $('#id_chofer_votacion_imagen').on('fileloaded', function(event, file, previewId, index, reader) {
		        $('#img_panel_votacion').html($('#'+previewId).find('img.file-preview-image')[0]);
		    });
		    $('#id_chofer_votacion_imagen').on('fileclear', function(event, file, previewId, index, reader) {
		        $('#img_panel_votacion').html(img_votacion_tmp);
		    });
		    $('#id_chofer_votacion_imagen').on('fileerror', function(event, data) {
		    	$(this).fileinput('clear');
		    	$(this).fileinput('reset');
		    	$(this).fileinput('refresh');
		    	mostrarMensajeInfoImagen();
	    	});
		    
		    //esconder cedula y destino cuando es agencia de carga
		    $("#id_es_agencia_carga").bind('change', function(){
		    	if($(this).is(':checked')){
		    		quitarCedula();
		    		quitarDestinos();
		    		ponerJuridica();
		    	}else{
		    		ponerCedula();
		    		ponerDestinos();
		    		quitarTipo();
		    	}
		    });
		    {% if form.data.es_agencia_carga %}
			if($("#id_es_agencia_carga").is(':checked')){
	    		quitarCedula();
	    		quitarDestinos();
	    		ponerJuridica();
	    	}else{
	    		ponerCedula();
	    		ponerDestinos();
	    		quitarTipo();
	    	}
			{% endif %}
		    //esconder destino cuando es transportista
		    $("#id_es_transportista").bind('change', function(){
		    	if($(this).is(':checked')){
		    		quitarDestinos();
		    		ponerContactos();
		    	}else{
		    		ponerDestinos();
		    		quitarContactos();
		    	}
		    });
	    	{% if form.data.es_transportista %}
		   	if($("#id_es_transportista").is(':checked')){
	    		quitarDestinos();
	    	}else{
	    		ponerDestinos();
	    	}
		   	{% endif %}
		    //esconder destino, contactos cuando es funcionario
		    $("#id_es_funcionario_aduana").bind('change', function(){
		    	if($(this).is(':checked')){
		    		quitarContactos();
		    		quitarDestinos();
		    		quitarRuc();
		    		quitarDireccion();
		    		ponerNatural();
		    		setearNombres();
		    	}else{
		    		ponerContactos();
		    		ponerDestinos();
		    		ponerRuc();
		    		ponerDireccion();
		    		quitarTipo();
		    		quitarNombres();
		    	}
		    });
		    {% if form.data.es_funcionario_aduana %}
		    if($("#id_es_funcionario_aduana").is(':checked')){
		    	quitarContactos();
		    	quitarDestinos();
	    		quitarRuc();
	    		quitarDireccion();
	    		ponerNatural();
	    		setearNombres();
	    	}else{
	    		ponerContactos();
	    		ponerDestinos();
	    		ponerRuc();
	    		ponerDireccion();
	    		quitarTipo();
	    		quitarNombres();
	    	}
		    {% endif %}
		  	//esconder destino cuando es aseguradora
		    $("#id_es_aseguradora").bind('change', function(){
		    	if($(this).is(':checked')){
		    		quitarDestinos();
		    	}else{
		    		ponerDestinos();
		    	}
		    });
		    {% if form.data.es_aseguradora %}
		    if($("#id_es_aseguradora").is(':checked')){
	    		quitarDestinos();
	    		ponerContactos();
	    	}else{
	    		ponerDestinos();
	    		quitarContactos();
	    	}
		    {% endif %}
		  	//esconder destino, contactos cuando es chofer
		    $("#id_es_chofer").bind('change', function(){
		    	if($(this).is(':checked')){
		    		quitarContactos();
		    		quitarDestinos();
		    		quitarRuc();
		    		ponerNatural();
		    		setearNombres();
		    		$('.tab-chofer').removeClass('hide');
		    	}else{
		    		ponerContactos();
		    		ponerDestinos();
		    		ponerRuc();
		    		quitarTipo();
		    		quitarNombres();
		    		$('.tab-chofer').addClass('hide');
		    	}
		    });
		    {% if form.data.es_chofer %}
		  	if($("#id_es_chofer").is(':checked')){
		    	quitarContactos();
		    	quitarDestinos();
	    		quitarRuc();
	    		ponerNatural();
	    		setearNombres();
	    		$('.tab-chofer').removeClass('hide');
	    	}else{
	    		ponerContactos();
	    		ponerDestinos();
	    		ponerRuc();
	    		quitarTipo();
	    		quitarNombres();
	    		$('.tab-chofer').addClass('hide');
	    	}
		  	{% endif %}
		});
	</script>
{% endblock %}