/* - - - - - - - - - - - - - - - - - - - - -

Título		: 	Teclado virtual
Autor		: 	Alvaro Talavera (alvarotala@gmail.com) - Puntopy
GRACIAS MAN, ya te choreamos el script :) muy bueno

Descripción : 	Teclado virtual para interbanco

Creado 		:	11 de marzo, 2008
Modificado	:	11 de marzo, 2008

- - - - - - - - - - - - - - - - - - - - - */

var interval;
var release = true;

var tecladoVirtual = Class.create({	
  
  initialize: function(contenedor, intevalo, salida, accion) {
	this.botones = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
    this.contenedor = contenedor;
	this.accion = accion;
	this.numeros = "";
    this.numeros_tmp = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
	this.opciones = "";
	this.intevalo = intevalo;
	this.salida = $(salida);
	this.iniciar_numeros();
  },

  ramdomizar: function() {
	this.botones.sort(function (a, b) { i = Math.round((Math.random() * 100 - 50)); return i; });
  },

  iniciar_numeros: function() {
	this.ramdomizar();
	var tmpl =  new Template("<div id=\"#{contenedor}\"><ul class=\"numeros\" onmouseup=\"activar()\"></ul><ul class=\"opciones\"><li><a href=\"javascript:void(0)\" class=\"teclado_borrar\" onmouseup=\"activar()\">Borrar</a></li></ul></div>");
	document.write(tmpl.evaluate({contenedor: this.contenedor}));
	this.numeros = $(this.contenedor).down("ul.numeros", 0);
  
	this.opciones = $(this.contenedor).down("ul.opciones", 0);
	var obj = this;
    this.numeros.observe('mouseover',function(event){
      if (obj.numeros[0].down("a", 0).innerHTML == "*") return;
      for(i=0; i<10; i++) {
        obj.numeros_tmp[i] = obj.numeros[i].down("a", 0).innerHTML;
        obj.numeros[i].down("a", 0).innerHTML = "*";
      }
    });
    this.numeros.observe('mouseout',function(event){
      if (release){
        for(i=0; i<10; i++) {
          obj.numeros[i].down("a", 0).innerHTML = obj.numeros_tmp[i];
        }
      }
    });
	for(i=0; i<10; i++) {
		var html = "<li><a href='#' id='"+i+"' >"+this.botones[i]+"</a></li>";
        this.numeros_tmp[i] = this.botones[i];
		this.numeros.insert({ bottom: html })		
		var elements = this.numeros.childElements();
		var element = elements[i].down("a", 0);
		element.observe('mousedown', function(event){
	//		obj.elegir(this.innerHTML);
           obj.elegir(obj.numeros_tmp[this.id]);
      
		});	
	}
	
	this.opciones.down("a.teclado_borrar", 0).observe('mousedown', function(event){
		obj.borrar();
	});
	
	this.numeros = this.numeros.childElements();
  },

  establecer_numeros: function() {
	this.ramdomizar();
	for(i=0; i<10; i++) {
		this.numeros[i].down("a", 0).innerHTML = this.botones[i];
        this.numeros_tmp[i] = this.botones[i];
	}
	clearInterval(interval);
	release = true;
  },
    
  restablecer: function() {
  if(release){
		for(i=0; i<10; i++) {
			this.numeros[i].down("a", 0).innerHTML = "*";
		}
		release = false;
		var tmp = this;
		interval = setInterval(function(){tmp.establecer_numeros()}, this.intevalo)
	}
  },

  elegir: function(numero) {
	if(release){
		var valor = this.salida.value;
		var salida = valor + numero;

		this.salida.value = salida;
		this.restablecer();
	}
  },

  borrar: function() {
	this.salida.value = "";
	this.restablecer();
    this.mostrar();
  },
  
  borrarUno: function(){
    var out = this.salida.value;
    this.salida.value = out.substr(0,out.length-1);
  },
  
  mostrar: function() {
    var obj = this;
    for(i=0; i<10; i++) {
      obj.numeros[i].down("a", 0).innerHTML = obj.numeros_tmp[i];
    }
  }
	
}) // termina clase