<?php ini_set('date.timezone','America/Lima'); ?>
<?php 
	$aac = date("Y");
	$mac = date("m"); 
	$dac = date("d"); 	$mes=array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
	$nes = $mes[date("n")-1];
?>
<?php 
	require_once("include/EntidadMod.php");
	require_once("include/UsuarioMod.php");
	if(isset($_SESSION["session_edgard"])){
		$obj_enu=new UsuarioEnt();
		$obj_mou=new UsuarioMod();
		$obj_enu->setIdusua($_SESSION["session_edgard"]);
		$valu=$obj_mou->mostrarUsuario($obj_enu);
		$sesiedgard=$valu->getIdusua();
		$nom_usuari=$valu->getNombreu(); //aun no esta en los otros
		$usu_usuari=$valu->getUsuario(); //aun no esta en los otros
		$cor_usuari=$valu->getCorreo(); //aun no esta en los otros
		$uso_usuari=$valu->getUso(); //aun no esta en los otros
		$est_usuari=$valu->getEstado();//aun no esta en los otros
		$fot_usuari=$valu->getFoto();
		$cel_usuari=$valu->getUcelular();
		$ane_usuari=$valu->getAnexo();
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US" dir="ltr">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<title>Perfil de usuario</title>
		<link href="css/asistenci.css"  rel="stylesheet" type="text/css">
		<link href="lib/hint-tootip.css" media="screen" rel="stylesheet" type="text/css" />
       	<link href="css/estilo_full.css" media="screen" rel="stylesheet" type="text/css" />
        <link href="lib/loaders.css" media="screen" rel="stylesheet" type="text/css" />
        <link href="lib/dropzone.css" type="text/css" rel="stylesheet" />
        <link href="lib/alertify.core.css" rel="stylesheet"  /><!--PARA EL AVISO O ALERTA-->
		<link href="lib/alertify.default.css" rel="stylesheet"/><!--PARA EL AVISO O ALERTA-->
        <link href="lib/jquery.simple-dtpicker_borrar.css" type="text/css" rel="stylesheet" />
        <link href="img/logo_icono.ico" rel="shortcut icon" type="image/x-icon"/>
		<link href="css/normalize.css"  rel="stylesheet" type="text/css">
		<link href="lib/iconos/style.css" rel="stylesheet" type="text/css" />
		<link href="lib/jquery-ui-1.12.1.custom/jquery-ui.css" rel="stylesheet"> 
		<link href="lib/jquery.mCustomScrollbar.css" rel="stylesheet" >
		<link href="css/inforega_full.css" rel="stylesheet" type="text/css"/>
		<style type="text/css">
			#pe{
				background-image: url(<?=$fot_usuari?>);
				background-repeat: no-repeat;
				background-position: 80px 0px;
				background-size: 50px 50px;
			}
			#snfo{
				position: fixed; 
				right:0.5%;
				top: 1.5%; 
				z-index: 9999;
				cursor: pointer;
				width: 55px;
				height: 55px;
			}
		</style>
		<!--crop de imagenes-->
		<link href="lib-crop/assets/css/main.css" rel="stylesheet">
		<link href="lib-crop/assets/css/croppic.css" rel="stylesheet">
		<script>
			(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
				(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
				m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
				})(window,document,'script','lib/analytics.js','ga');
				ga('create', 'UA-10627690-5', 'auto');
				ga('send', 'pageview');
		</script>
		<!--fin crop de imagenes-->   
    </head>
<body>

<!--Cabecera-->
<div id="ca">
<div>
	<div id="ts">
		<span class="tl" style="font-size: 15px;margin-left: 87px;text-align: center;margin-top: 7px;color: #5C5FBC">Sistema de Atención al Cliente</span><br>

	</div>
	
	<!--herramientas dinamico-->
	<div id="herramientas">
		<div id="ps" class="herr" style="display: none">
			<span class="">
				&nbsp;
			</span>
		</div>
	</div>
	<div id="imgprincipal">
		<div id="pe">
			<span class="tl" style="font-size: 16px;"><?=$nom_usuari?></span><br>
			<span class="tl" style="font-size: 14px;"><?=$uso_usuari?></span><br>
			<a href="#" onClick="terminarLinea();" class="tl sb" style="font-size: 11px;">Salir <span class="icon-log-out"></span></a>
			<div id="snfo" onClick="cambiar_ImagenCrop();"></div>
			<div id="terminarLinea"></div>
		</div>
	</div>
	<div id="ti" style="margin-top: 6px;">
		<!--titulo dinamico-->
		<span class="tl" style="font-size: 19px;cursor: pointer" onclick="myFunction2();actiDesc2();">
			Perfil de usuario
		</span>
		
		<span class="tl" style="font-size: 17px;margin-top: 2px; cursor: pointer">
			<span class="icon-triangle-down" id="itd" onclick="myFunction2();actiDesc2();"></span>
		</span><br>
		<div id="myDropdown2" class="dropdown-content2" style="margin-top: 5px;">
			<a href="atenciones" target="_self" class="men" id="ad">Atenciones diarias</a><br>
			<a class="act">Perfil de usuario</a><br>
			<a class="men" onClick="cambiar_menu('iparch')" id="ip">Instaladores y parches</a><br>
			<a href="entidades" target="_self" class="men" id="en">Entidades</a><br>
			<a class="men" onClick="cambiar_menu('asiste')" id="as">Asistencias</a><br>
			<a class="men" onClick="cambiar_menu('rejecu')" id="re">Resumenes ejecutivos</a><br>
			<a href="asignaciones" target="_self" class="men" id="ag">Asignaciones</a><br>
			<a href="comentarios.php" target="_self" class="men" id="co">Comentarios</a><br>	
		</div>
		<span class="tl sb" style="font-size: 13px;">
		<?php 
        $dia=array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sábado");
        $mes = array("enero","febrero","marzo","abril","mayo","junio","julio","agosto","septiembre","octubre","noviembre","diciembre");
        echo($dia[date("w")]." ".date("d")." de ".$mes[date("n")-1]." de ".date("Y"));
        ?>
		</span>
	</div>
</div>
</div> 
      
<!--Barra del Chat -->
<div id="at">
	<div>
		<span id="listarLinea"></span>
	</div>
</div>    
 	
<div class="cnpusua" style="width: 100%; background-color: #9E9E9E;float: left;">
	<!--Cambio de clave -->
	<div class="contens">
		<h1><span class="icon-v-card"></span> &nbsp;&nbsp;Perfil de Usuario</h1>
		<h2>Datos de Acceso</h2>
			<table width="100%" border="0">
			  <tbody>
				<tr>
				  <td width="49%">Nombre de usuario:</td>
				  <td width="24%"><?=$usu_usuari?></td>
				  <td width="27%" align="center" style="color: #22960C"><span id="cambiarContrasena"></span></td>
				</tr>
				<tr>
				  <td>Contraseña :</td>
				  <td>********</td>
				  <td>
					<button style="cursor: pointer" id="cambiar" onClick="cambCont();">Cambiar</button>
					<script>
						var clic = 1;
						function cambCont(){ 
							if(clic==1){
								$('#cambios').css('display','block'); 
								$('#cambiar').html('Cancelar'); 
								$('#conante').focus();
								$('#cambiarContrasena').html('');
								clic = clic + 1;
							} else{
								$('#cambios').css('display','none');
								$('#cambiar').html('Cambiar');
								$('#conante').val('');
								$('#connue1').val('');
								$('#connue2').val('');
								clic = 1;
							} 
						}
					</script>
				  </td>
				</tr>
			  </tbody>
			</table>
			<div style="display: none" id="cambios">	
				<table width="100%" border="0">
					<tbody>
					<tr>
					  <td width="57%">Contraseña anterior:</td>
					  <td width="30%"><input type="password" id="conante"></td>
					  <td width="13%">&nbsp;</td>
					</tr>
					<tr>
					  <td>Nueva contraseña:</td>
					  <td><input type="password" id="connue1"></td>
					  <td>&nbsp;</td>
					</tr>
					<tr>
					  <td>Confirmar contraseña:</td>
					  <td><input type="password" id="connue2"></td>
					  <td>&nbsp;</td>
					</tr>
					<tr>
					  <td align="center">
					  <input type="button" value="Aceptar" style="cursor: pointer" onClick="cambiarContrasena('<?=$sesiedgard?>',$('#conante').val(),$('#connue1').val(),$('#connue2').val());"></td>
					  <td align="center">&nbsp;</td>
					  <td>&nbsp;</td>
					</tr>
					<tr>
						<td colspan="2" align="center">&nbsp;</td>
					  <td>&nbsp;</td>
					  </tr>
				  </tbody>			
			</table>		
			</div>
		<br>

		<h2>Datos del Usuario</h2>
		<table width="100%" border="0">
		  <tbody>
			<tr>
			  <td>Nombre:</td>
			  <td><?=$nom_usuari?></td>
			  <td>&nbsp;</td>
			</tr>
			<tr>
			  <td>Celular o telefono:</td>
			  <td><?=$cel_usuari?></td>
			  <td>&nbsp;</td>
			</tr>
			<tr>
			  <td>Anexo:</td>
			  <td><?=$ane_usuari?></td>
			  <td>&nbsp;</td>
			</tr>
			<tr>
			  <td width="41%">Correo:</td>
			  <td width="32%"><?=$cor_usuari?></td>
			  <td width="27%">&nbsp;</td>
			</tr>
			<tr>
			  <td>Tipo de usuario:</td>
			  <td><?=$uso_usuari?></td>
			  <td>&nbsp;</td>
			</tr>
			<tr>
			  <td>Estado de usuario:</td>
			  <td>
			  <?php if($est_usuari=='1'){echo '<span style="color: #4DFF7A">Activo</span>';}else{echo '<span style="color: #F9161A">Inactivo<span>';}?>
			  </td>
			  <td>&nbsp;</td>
			</tr>
		  </tbody>
		</table>
	</div>	

	<!--CAMBIO DE FOTO DE PERFIL-->
	<div class="contens" style="margin-top: 70px;">
		<h2>Foto de perfil</h2>
		<table width="100%" border="0">
			<tbody>
				<tr>
				  <td width="30%" align="left">
				 	<div id="imgincial">
				  		<img src="<?=$fot_usuari?>" style="margin-left: 30px;" width="50" height="50" alt=""/>
					</div>
				  </td>
				  <td width="31%">
					<input type="button" value="Cambiar" style="cursor: pointer" onClick="cambiar_ImagenCrop();">
				  </td>
				  <td width="39%">&nbsp;</td>
				</tr>
				<tr>
					<td align="left">&nbsp;</td>
				  <td>&nbsp;</td>
				  <td>&nbsp;</td>
			  </tr>
			</tbody>
		</table>
	</div>
                      
</div>
	

    
<!--Pie de la pagina--> 
<div id="pi">
<div>
	<span class="xh nb dot1" style="width:15%;">Cantidad de atenciones: <span id="mostrarCantAten"></span></span>
	<span class="xh nb dot1" style="width:15%">Atendidos: <span id="mostrarCantAtendidos"></span></span></span>
	<span class="xh nb dot1" style="width:12%">Pendientes: <span id="mostrarCantPendientes"></span></span>
	<span class="xh nb dot1" style="width:25%">
		Total de uso del Teamviewer : <span id="mostrarCantTeam"></span> &nbsp;<span class="icon-arrow-bold-right"></span>&nbsp;<span id="listarUsoTeam"></span>
	</span>
	<span class="xh nb" style="width:3%">&nbsp;</span>
	<span class="xh nb" style="width:3%">&nbsp;</span>
	<span class="xh nb" style="width:3%">&nbsp;</span>
	<span class="xh nb dot1" style="width:11%">Asignados: <span id="mostrarCantAsignados"></span></span>
	<span class="xh nb" style="width:4%">&nbsp;</span>
	<span class="xh nb" style="width:4%">&nbsp;</span>
	<span class="xh nb" style="width:3%">&nbsp;</span>
</div>
</div>      
 
<div id="cambiar_Image_crop" style="display: none">   
	<center>	
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tbody>
				<tr>
					<td width="49%" align="center"><div id="croppic"></div></td>
				  	<td width="3%">&nbsp;</td>
				  	<td width="48%" valign="bottom">
					  <table width="100%" border="0" cellspacing="5" cellpadding="0">
						  <tbody>
							<tr>
							  <td align="center"><span>Imagen Actual</span></td>
							</tr>
							<tr>
							  <td align="center">
								  <div id="imgprevio"><img src="<?=$fot_usuari?>" width="200" height="200"></div>
							  </td>
							</tr>
							<tr>
							  <td align="center"><span class="btn" id="cropContainerHeaderButton">Obtener imagen</span></td>
							</tr>
							<tr>
							  <td align="center">
							  <span class="agregarSlideButton" onClick="actualizarFoto('<?=$sesiedgard?>',$('.croppedImg').attr('src'));">
								Guardar Imagen
								</span>
							  </td>
							</tr>
						  </tbody>
						</table>
				  	</td>
				</tr>
		  	</tbody>
		</table>
	</center>
	<div id="cambiar_Image"></div>
</div>    


<script src="lib/jquery-1.11.0.min.js"></script> 
<script src="lib/fancywebsocket.js"></script>
<script src="lib/jquery-1.11.3ui.js"></script>
<script src="lib/jquery.simple-dtpicker_borrar.js"></script>
<script src="lib/dropzone_subirclave.js"></script>
<script src="lib/js.cookie.js"></script>      
<script src="js/clave.js"></script>   
<script src="js/usuario.js"></script> 
<script src="js/entidad.js"></script>
<script src="js/persona.js"></script>
<script src="js/area.js"></script>
<script src="js/cargo.js"></script>
<script src="js/inforeg.js" language="javascript"></script>
<script src="js/agendadet.js"></script>
<script src="lib/alertify.js" type="text/javascript" ></script><!--PARA EL AVISO O ALERTA-->  
<script src="lib/jquery.dotdotdot.min.js"></script>
<script src="lib/jquery.mCustomScrollbar.concat.min.js"></script>

<!--crop de imagenes-->
<script src="lib-crop/assets/js/jquery.mousewheel.min.js"></script>
<script src="lib-crop/croppic.min.js"></script>
<script src="lib-crop/assets/js/main.js"></script>

<script>
$(window).resize(function() {
	altoContenedor($(window).height());
});
$(function(){
	listarInforegFull();
	altoContenedor($(window).height());
	main_crope();
});	
</script>

<script>
function altoContenedor(val){
	$(".cnpusua").css({'height':(val-123)+'px'});
}
</script>

<script>
	function cambiar_ImagenCrop(){
		$("#cambiar_Image_crop").dialog({
			title: "Cambiar foto de perfil",
			resizable: false,
			height: "auto",
			width: 540,
			modal: true,
			open: function (event, ui) {
				$('#cambiar_Image_mod').css('overflow', 'hidden'); //this line does the actual hiding
			}
		});
	}
</script> 

<script>
	function myFunction(){
	document.getElementById("myDropdown").classList.toggle("show");
}
</script>
<script>
function myFunction2() {
	document.getElementById("myDropdown2").classList.toggle("show");
}
</script>

<script>
var nom="<?=$nom_usuari?>";
var uso="<?=$uso_usuari?>";
function actualizarFoto(id,en){
	if(en===undefined){
		alert('Obtenga una imagen');
		return false;
	}else{
		var parametros={"id":id,"en":en};
		$.ajax({
			data:parametros,
			url:'core/actualizarFoto.php',
			type:'post',	
			success:  function (response) {
				//alert(response);
				$(".actualizarFoto").html(response);
				$("#imgprevio").html("<img src='"+response+"' width='200' height='200'></img>");
				$("#imgincial").html("<img src='"+response+"' style='margin-left: 30px;' width='50' height='50'></img>");
				$("#imgprincipal").html("<div id='pe' style='background-image: url("+response+");background-repeat: no-repeat;background-position: 80px 0px;background-size: 50px 50px;'><span class='tl' style='font-size: 16px;'>"+nom+"</span><br><span class='tl' style='font-size: 14px;'>"+uso+"</span><br><a href='#' onClick='terminarLinea();' class='tl sb' style='font-size: 11px;'>Salir <span class='icon-log-out'></span></a><div id='terminarLinea'></div></div>");
			}
		});	
	}
}
var croppicHeaderOptions = {
	cropData:{"dummyData":1,"dummyData2":"asdas"},
	cropUrl:'img_crop_to_file.php',
	customUploadButtonId:'cropContainerHeaderButton',
	modal:false,
	processInline:true,
	loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
	onBeforeImgUpload: function(){ console.log('onBeforeImgUpload') },
	onAfterImgUpload: function(){ console.log('onAfterImgUpload') },
	onImgDrag: function(){ console.log('onImgDrag') },
	onImgZoom: function(){ console.log('onImgZoom') },
	onBeforeImgCrop: function(){ console.log('onBeforeImgCrop') },
	onAfterImgCrop:function(){ console.log('onAfterImgCrop') },
	onReset:function(){ console.log('onReset') },
	onError:function(errormessage){console.log('onError:'+errormessage)}
}	
var croppic = new Croppic('croppic', croppicHeaderOptions);
		
var croppicContainerModalOptions = {
	uploadUrl:'img_save_to_file.php',
	cropUrl:'img_crop_to_file.php',
	modal:true,
	imgEyecandyOpacity:0.4,
	loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
	onBeforeImgUpload: function(){ console.log('onBeforeImgUpload') },
	onAfterImgUpload: function(){ console.log('onAfterImgUpload') },
	onImgDrag: function(){ console.log('onImgDrag') },
	onImgZoom: function(){ console.log('onImgZoom') },
	onBeforeImgCrop: function(){ console.log('onBeforeImgCrop') },
	onAfterImgCrop:function(){ console.log('onAfterImgCrop') },
	onReset:function(){ console.log('onReset') },
	onError:function(errormessage){console.log('onError:'+errormessage)}
}
var cropContainerModal = new Croppic('cropContainerModal', croppicContainerModalOptions);
		
var croppicContaineroutputOptions = {
	uploadUrl:'img_save_to_file.php',
	cropUrl:'img_crop_to_file.php', 
	outputUrlId:'cropOutput',
	modal:false,
	loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
	onBeforeImgUpload: function(){ console.log('onBeforeImgUpload') },
	onAfterImgUpload: function(){ console.log('onAfterImgUpload') },
	onImgDrag: function(){ console.log('onImgDrag') },
	onImgZoom: function(){ console.log('onImgZoom') },
	onBeforeImgCrop: function(){ console.log('onBeforeImgCrop') },
	onAfterImgCrop:function(){ console.log('onAfterImgCrop') },
	onReset:function(){ console.log('onReset') },
	onError:function(errormessage){ console.log('onError:'+errormessage)}
}
var cropContaineroutput = new Croppic('cropContaineroutput', croppicContaineroutputOptions);
		
var croppicContainerEyecandyOptions = {
	uploadUrl:'img_save_to_file.php',
	cropUrl:'img_crop_to_file.php',
	imgEyecandy:false,				
	loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
	onBeforeImgUpload: function(){ console.log('onBeforeImgUpload') },
	onAfterImgUpload: function(){ console.log('onAfterImgUpload') },
	onImgDrag: function(){ console.log('onImgDrag') },
	onImgZoom: function(){ console.log('onImgZoom') },
	onBeforeImgCrop: function(){ console.log('onBeforeImgCrop') },
	onAfterImgCrop:function(){ console.log('onAfterImgCrop') },
	onReset:function(){ console.log('onReset') },
	onError:function(errormessage){ console.log('onError:'+errormessage)}
}
var cropContainerEyecandy = new Croppic('cropContainerEyecandy', croppicContainerEyecandyOptions);
		
var croppicContaineroutputMinimal = {
	uploadUrl:'img_save_to_file.php',
	cropUrl:'img_crop_to_file.php', 
	modal:false,
	doubleZoomControls:false,
	rotateControls: false,
	loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
	onBeforeImgUpload: function(){ console.log('onBeforeImgUpload') },
	onAfterImgUpload: function(){ console.log('onAfterImgUpload') },
	onImgDrag: function(){ console.log('onImgDrag') },
	onImgZoom: function(){ console.log('onImgZoom') },
	onBeforeImgCrop: function(){ console.log('onBeforeImgCrop') },
	onAfterImgCrop:function(){ console.log('onAfterImgCrop') },
	onReset:function(){ console.log('onReset') },
	onError:function(errormessage){console.log('onError:'+errormessage)}
}
var cropContaineroutput = new Croppic('cropContainerMinimal', croppicContaineroutputMinimal);
		
var croppicContainerPreloadOptions = {
	uploadUrl:'img_save_to_file.php',
	cropUrl:'img_crop_to_file.php',
	loadPicture:'assets/img/night.jpg',
	enableMousescroll:true,
	loaderHtml:'<div class="loader bubblingG"><span id="bubblingG_1"></span><span id="bubblingG_2"></span><span id="bubblingG_3"></span></div> ',
	onBeforeImgUpload: function(){ console.log('onBeforeImgUpload') },
	onAfterImgUpload: function(){ console.log('onAfterImgUpload') },
	onImgDrag: function(){ console.log('onImgDrag') },
	onImgZoom: function(){ console.log('onImgZoom') },
	onBeforeImgCrop: function(){ console.log('onBeforeImgCrop') },
	onAfterImgCrop:function(){ console.log('onAfterImgCrop') },
	onReset:function(){ console.log('onReset') },
	onError:function(errormessage){ console.log('onError:'+errormessage)}
}
var cropContainerPreload = new Croppic('cropContainerPreload', croppicContainerPreloadOptions);
</script> 

</body>
</html>
<?php 
	}else{ 
		header("Location: acceso");
	}
?>
