<?php if(!$desactivaTeclado) { ?>

<?php

$fila_1_1=array('1','2','3','4','5','6','7','8','9','0');
$fila_1_2=array('Q','W','E','R','T','Y','U','I','O','P','/');
$fila_1_3=array('A','S','D','F','G','H','J','K','L','Ñ');
$fila_1_4=array('Z','X','C','V','B','N','M','.','-');

$fila_2_1=array('','@','#','$','%','&','(',')','=','+');
$fila_2_2=array('¿','?','€','¡','!','','Ø','','-','*','/');
$fila_2_3=array('@','','','','','','','','','Ç');
$fila_2_4=array('','','[',']','^',':',';',',','_');

?>
<div id="teclado" class="popup teclado" style="display:none;z-index:30000">
	<div class="popupContenidoSimple anchoTeclado">
    	<table class="teclado">
          <tr>
            <td colspan="2" align="center">
            	<input type="text" name="valor" id="valor" value="" class="campo campoTeclado" readonly/>
                <input type="hidden" name="valorOculto" id="valorOculto" value=""/>
            </td>
          </tr>
          <tr>
            <td colspan="2" align="center">
            	<table border="0" cellpadding="0" cellspacing="0"><tr>
				<?php
				$contador=0;
                foreach($fila_1_1 as $item) {
					?><td><input type="submit" name="fila_1_caracter_<?php echo $contador; ?>" id="fila_1_caracter_<?php echo $contador; ?>" value="<?php echo $item; ?>" class="botonTeclado botonTecladoStandard"/></td><?php
					$contador++;
                }
				?>
                <td><input type="submit" name="borrar" id="borrar" value="&lt;" class="botonTeclado botonTecladoStandard"/></td>
                </tr></table>
          </tr>
           <tr>
            <td colspan="2" align="center">
            	<table border="0" cellpadding="0" cellspacing="0"><tr>
				<?php
				$contador=0;
                foreach($fila_1_2 as $item) {
					?><td><input type="submit" name="fila_2_caracter_<?php echo $contador; ?>" id="fila_2_caracter_<?php echo $contador; ?>" value="<?php echo $item; ?>" class="botonTeclado botonTecladoStandard"/></td><?php
                    $contador++;
				}
				?>
                </tr></table>
             </td>
          </tr>
          <tr>
            <td align="center">
            	<table border="0" cellpadding="0" cellspacing="0"><tr>
				<?php
				$contador=0;
                foreach($fila_1_3 as $item) {
					?><td><input type="submit" name="fila_3_caracter_<?php echo $contador; ?>" id="fila_3_caracter_<?php echo $contador; ?>" value="<?php echo $item; ?>" class="botonTeclado botonTecladoStandard"/></td><?php
                    $contador++;
				}
				?>
                </tr></table>
              </td>
            <td rowspan="2" align="center"><input type="submit" name="enter" id="enter" value="OK" campovalor="" oculto="" formulario="" cambioFoco="" class="botonTeclado botonTecladoEnter botonTecladoStandard"/></td>
          </tr>
          <tr>
            <td align="center">
            	<table border="0" cellpadding="0" cellspacing="0"><tr>
            	<td><input type="submit" name="bloq" id="bloq" value="Bloq.Min" class="botonTeclado botonTecladoBloq botonTecladoStandard"/></td>
       	    	<?php
				$contador=0;
                foreach($fila_1_4 as $item) {
					?><td><input type="submit" name="fila_4_caracter_<?php echo $contador; ?>" id="fila_4_caracter_<?php echo $contador; ?>" value="<?php echo $item; ?>" class="botonTeclado botonTecladoStandard"/></td><?php
					$contador++;
                }
				?>
                </tr></table>
             </td>
          </tr>
          <tr>
            <td colspan="2" align="center">
            	<input type="submit" name="symbols" id="symbols" value="Symbols" class="botonTeclado botonTecladoSymbols botonTecladoStandard"/>
            	<input type="submit" name="espacio" id="espacio" value=" " class="botonTeclado botonTecladoEspacio botonTecladoStandard"/>
            </td>
          </tr>
        </table>
  </div>
</div>
<script>

$(document).ready(function() {

	var fila_1_1=Array(<?php foreach($fila_1_1 as $item) { echo "'".$item."',"; } ?>);
	var fila_1_2=Array(<?php foreach($fila_1_2 as $item) { echo "'".$item."',"; } ?>);
	var fila_1_3=Array(<?php foreach($fila_1_3 as $item) { echo "'".$item."',"; } ?>);
	var fila_1_4=Array(<?php foreach($fila_1_4 as $item) { echo "'".$item."',"; } ?>);
	
	var fila_2_1=Array(<?php foreach($fila_2_1 as $item) { echo "'".$item."',"; } ?>);
	var fila_2_2=Array(<?php foreach($fila_2_2 as $item) { echo "'".$item."',"; } ?>);
	var fila_2_3=Array(<?php foreach($fila_2_3 as $item) { echo "'".$item."',"; } ?>);
	var fila_2_4=Array(<?php foreach($fila_2_4 as $item) { echo "'".$item."',"; } ?>);
	
	var symbols=false;

	$('.botonTecladoStandard').on("click",function(e){
	
		e.preventDefault();
		
		var actual=$('#valor').val();
		var actualOculto=$('#valorOculto').val();
		
		var posicionCursorInicio = $('#valor')[0].selectionStart;
		var posicionCursorFin = $('#valor')[0].selectionEnd;
		
		if( $(this).val()=='<')	{
		
			if( posicionCursorInicio==posicionCursorFin ) {
				$('#valor').val( actual.substring(0,posicionCursorInicio-1) + actual.substring(posicionCursorFin,actual.length) );
				$('#valorOculto').val( actualOculto.substring(0,posicionCursorInicio-1) + actualOculto.substring(posicionCursorFin,actualOculto.length) );
				$('#valor').focus();
				if(posicionCursorInicio>0) $('#valor')[0].setSelectionRange(posicionCursorInicio-1,posicionCursorInicio-1);
				else $('#valor')[0].setSelectionRange(0,0);
			}
			else {
				$('#valor').val( actual.substring(0,posicionCursorInicio) + actual.substring(posicionCursorFin,actual.length) );
				$('#valorOculto').val( actualOculto.substring(0,posicionCursorInicio) + actualOculto.substring(posicionCursorFin,actualOculto.length) );
				$('#valor').focus();
				if(posicionCursorInicio>0) $('#valor')[0].setSelectionRange(posicionCursorInicio,posicionCursorInicio);
				else $('#valor')[0].setSelectionRange(0,0);
			}
			
			
		}
		else if( $(this).val()=='Bloq.Min') {
			$('.botonTecladoStandard').each(function(){
				if( $(this).val()!='Bloq.Min' && $(this).val()!='<' && $(this).val()!='OK' && $(this).val()!='Symbols' ) $(this).val( $(this).val().toLowerCase() );
			});
			$(this).val('Bloq.May');
		}
		else if( $(this).val()=='Bloq.May') {
			$('.botonTecladoStandard').each(function(){
				if( $(this).val()!='Bloq.May' && $(this).val()!='<' && $(this).val()!='OK' && $(this).val()!='Symbols' ) $(this).val( $(this).val().toUpperCase() );
			});
			$(this).val('Bloq.Min');
		}
		else if( $(this).val()=='Symbols') {
		
			if(symbols) {
		
				var contador=0;
				fila_1_1.forEach(function(valor){
					$('#fila_1_caracter_'+contador).val( fila_1_1[contador] );
					contador++;
				});
				
				var contador=0;
				fila_1_2.forEach(function(valor){
					$('#fila_2_caracter_'+contador).val( fila_1_2[contador] );
					contador++;
				});
				
				var contador=0;
				fila_1_3.forEach(function(valor){
					$('#fila_3_caracter_'+contador).val( fila_1_3[contador] );
					contador++;
				});
				
				var contador=0;
				fila_1_4.forEach(function(valor){
					$('#fila_4_caracter_'+contador).val( fila_1_4[contador] );
					contador++;
				});
				
				symbols=false;
				$('#bloq').val('Bloq.Min');
			
			}
			else {
			
				var contador=0;
				fila_1_1.forEach(function(valor){
					$('#fila_1_caracter_'+contador).val( fila_2_1[contador] );
					contador++;
				});
				
				var contador=0;
				fila_1_2.forEach(function(valor){
					$('#fila_2_caracter_'+contador).val( fila_2_2[contador] );
					contador++;
				});
				
				var contador=0;
				fila_1_3.forEach(function(valor){
					$('#fila_3_caracter_'+contador).val( fila_2_3[contador] );
					contador++;
				});
				
				var contador=0;
				fila_1_4.forEach(function(valor){
					$('#fila_4_caracter_'+contador).val( fila_2_4[contador] );
					contador++;
				});
				
				symbols=true;
			
			}
		
		}
		else if( $(this).val()=='OK' ) {
		
			campo=$(this).attr('campoValor');
			
			$('#'+campo).val( $('#valorOculto').val() );
			$('#'+campo).focus();
			$('#teclado').hide();
			
			if( $(this).attr('cambioFoco')!='' ) {
				$('#'+campo).trigger("change");
			}
			
			if( $(this).attr('forzarEnter')=='si' ) {
				$('#'+campo).trigger("change");
			}
			
			formulario=$(this).attr('formulario');
			if(formulario!='') $('#'+formulario).submit();
		}
		else {
			
			if($('#enter').attr('oculto')=='si') {
				$('#valor').val( actual+'*' );
			}
			else {
				$('#valor').val( actual.substring(0,posicionCursorInicio) + $(this).val() + actual.substring(posicionCursorFin,actual.length) );
				//$('#valor').val( actual+$(this).val() );
			}
			
			$('#valorOculto').val( actualOculto.substring(0,posicionCursorInicio) + $(this).val() + actualOculto.substring(posicionCursorFin,actualOculto.length) );
			//$('#valorOculto').val( actualOculto+$(this).val() );
			
			$('#valor').focus();
			$('#valor')[0].setSelectionRange(posicionCursorInicio+1,posicionCursorInicio+1);
		}		
		
		
		
	});
});
</script>

<?php } ?>