<?php
 include ("conexion.php");
 
$s_id = $_GET['id'];

$imagen1 = "imagenes/pacientes/".$s_id.".jpg";
 
 if (file_exists($imagen1)) {
      $imagen=$imagen1;
 } else {
     $imagen="imagenes/pacientes/foto.png";
 }

?>
<!DOCTYPE html>
<html lang='es'>
<head>
  <title>FOTOGRAFIA</title>
  <meta charset='utf-8'>
   <link rel="stylesheet" href="estilos.css">
  <link rel="stylesheet" href="styles/style.css">
  <link rel="stylesheet" href="fonts/styleFont.css">
  <link rel="stylesheet" href="iconmoon/style.css">
  <style>
     #c{display:none;}
  </style>
</head>

<body>
  <div align="center">
  <img src="" id='img' width="300">
  <video id='v' width="300"></video>
  <canvas id="c" width="300" ></canvas>
  <button id='t' style='width:150px; height:35px'>Tomar una Foto</button>
  </div>
  <!--<button id='g'>Guardar Foto</button>-->
  <script>
    window.addEventListener('load',init);
    function init(){
    	var video  = document.querySelector('#v'),canvas = document.querySelector('#c'),btn= document.querySelector('#t'),img   = document.querySelector('#img');

    	    navigator.getUserMedia = (navigator.getUserMedia  ||
    	              navigator.webkitGetUserMedia ||  
    	              navigator.mozGetUserMedia ||
    	              navigator.msGetUserMedia);
    	    //if(navigator.getUserMedia){
    	    	navigator.getUserMedia({video:true}, function(stream){
    	    		video.src = window.URL.createObjectURL(stream);
    	    		video.play();
    	    	},function(e){console.log(e);})
    	    //}
    	    //else alert('El navegador no es compatible con la aplicacion');
    	    video.addEventListener('loadedmetadata', function(){canvas.width = video.videoWidth, canvas.height = video.videoHeight;},false);
    	    btn.addEventListener('click',function(){
    	    	canvas.getContext('2d').drawImage(video,0,0);
    	    	var imgData = canvas.toDataURL("image/jpeg", 0.5);
    	    	//alert (imgData);
    	    	img.setAttribute('src', imgData);
    	    });
    }

  </script>
</body>
  
   <table border="1" width="950" align="center" cellpadding="0">
     <tr>
       <td height="30" class="subtutulosTabla" colspan="3" align="left">
         NUMERO DE IDENTIFICACION: <?=$s_id?> 
       </td>
     </tr>
       
     
     <tr>
       <td colspan ="3" class="titulosTabla">Reuerde que el nombre del archivo a subir debe ser el n&uacute;mero de identificaci&oacute;n del paciente, ejemplo: 79600600.jpg </td>
     </tr>
     <tr>
       <td colspan ="3" align="center" class="titulosTabla"> SELECCIONE EL ARCHIVO JPG CON LA FOTOGRAFIA A SUBIR</td>
     </tr>
  </table> 
    
    <form action="firmaSubir.php" method="post" enctype="multipart/form-data" target="_blank">
      <table border="1" width="950" align="center" cellpadding="0" style="border-radius:5px;">
       <tr>
         <td width="30%">
          <table>
            <tr>  
              <td align = "left">
                <input type="file" name="fileToUpload" id="fileToUpload" /> 
              </td>
            </tr>
            <tr>
              <td align = "left">     
               <input type="submit" name="submit" onclick = "this.form.action = 'fotoSubir.php'"value="Subir Foto" style='width:150px; height:35px'/>
              </td>
            </tr>
            <tr>  
              <td align = "left">
                <input type="submit" onclick = "this.form.action = 'fotoEliminar.php?foto=<?=$s_id?>'" value="Eliminar Foto" style='width:150px; height:35px'/> 
              </td>      
            </tr>
            <tr>  
              <td align = "left">
                 <input type="button" style='width:150px; height:35px' value="Verificar Foto" onclick="window.location.reload()"
                
              </td>      
            </tr>
          </table>
         </td>  
         <td align="center" width="70%">
           <img src=<?=$imagen?> width="150" height="150"/>
         </td>
       </tr>
       
       <tr>  
          <td><input type=button value="Cerrar" style='width:150px; height:35px' onclick="javascript:top.window.close()"> </td>
      </tr>
       
      </table> 
      
      <input style="visibility:hidden" name="s_nitEmpresa" id="s_nitEmpresa" value="<?=$s_nitEmpresa?>"/>
      <input style="visibility:hidden" name="s_codSede" id="s_codSede" value="<?=$s_codSede?>"/>
      <input style="visibility:hidden" name="s_idUsuario" id="s_idUsuario" value="<?=$s_idUsuario?>"/>
      <input style="visibility:hidden" name="s_usuario" id="s_usuario" value="<?=$s_usuaUrlCode?>"/>
      <input style="visibility:hidden" name="s_empresa" id="s_empresa" value="<?=$s_empresaUrlCode?>"/>
      <input style="visibility:hidden" name="s_cargo" id="s_cargo" value="<?=$s_cargoUrlCode?>"/>
      <input style="visibility:hidden" name="s_vengoDe" id="s_vengoDe" value="<?=$s_vengoDe?>"/>
      
    </form>

</body>
</html> 
  