El objetivo es hacer un proceso sencillo para poder controlar eventos de teclado y raton en input o cjas que necesitemos. Una idea similar como Shortcut.js.
Nosotros creamos lib teclado.js, que utilizamos en nuestro proyecto tpvfox, donde pretendemos controlar eventos de teclado y raton de un forma mas sencilla, creo que lo hemos conseguido :-)
¿Como empezar?
Lo primero añadir nuestra librería al proyecto, por ejemplo:
<script src="/lib/js/teclado.js" type="text/javascript"></script>
Luego añadir JS los Objetos queremos controlar, variables globales en JS en el head
var idInput = {
id_input : 'idInput', // Este se añade ante construir ya que el id input es Unidad_Fila_1
acciones : {
13 : 'accion_realizar_pulsar_intro', // Pulso intro
40 : 'accion_realizar_pulsar_abajo', // Pulso abajo.
38 : 'accion_realizar_pulsar_arriba', // Pulso arriba pero va para abajo.
},
parametros : {
dedonde : 'nombre_pantalla'
// Los parametros que podemos necesitar
}
}
Esto nosotros en tpvfox, no los añadimos directamente, lo generamos con el fichero parametros.xml, pero eso es otra historia a contar en otro momento.
Luego en nuestro html , en nuestro input debemos porne el atributo data-obj="Nombre_objeto_global". También tenemos que llamar a la funcion controlEventos(event) en el atributo html del evento queramos controlar.
En esta parte tienes que tener en cuenta que las funciones que necesita y utiliza son:
- function controladorAcciones(caja,accion)
- function after_constructor(padre_caja,event)
- function before_constructor(caja)
¿Que hace la funcion controladorAcciones ?
Esta funcion puede ser un switch o simple if donde comprobamos si existe la accion que le tenemos objeto global.
Llegamos a la funcion cuando pulso una tecla o un evento que tengamos definido en el objeto global, realizar la accion que le indiquemos
¿Que hace la funcion after_constructor(padre_caja,event)?
Antes de montar el objecto con la tecla y realizar accion, se ejecuta.
¿Que hace la funcion before_constructor(caja)?
Despues de montar la caja y antes de hacer la funcion que asignamos, se ejecuta.
Nota:
La definicion de esta dos ultimas funciones, debería se al contrario, pero como ya teníamos proyectos con ella, de momento no la cambiamos.