Tema: como hacer: Múltiples cuenta atrás
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 28/04/2009, 10:56
AlvaroG
Invitado
  
Mensajes: n/a
Puntos:
Respuesta: como hacer: Múltiples cuenta atrás
No suelo dar código hecho, pero el problema me resultó bastante interesante.
Básicamente lo que tienes que hacer es aprovechar las capacidades de POO que te da Javascript, y crear 2 objetos "cuenta regresiva" con similares características.

Este código funciona, supongo que sabrás adaptarlo pero cualquier duda andaré por acá


Saludos.

Código javascript: 
Ver original
  1. <script>
  2. /* código de Douglas Crockford, para crear un objeto que hereda de otro
  3.  http://javascript.crockford.com/prototypal.html
  4. */
  5. if (typeof Object.create !== 'function') {
  6.     Object.create = function (o) {
  7.         function F() {}
  8.         F.prototype = o;
  9.         return new F();
  10.     };
  11. }
  12.  
  13.  
  14. var cuentaAtras = {
  15.     intervalID : 0,
  16.     horas : 0,
  17.     minutos : 0,
  18.     segundos : 0,
  19.  
  20.     inicializar : function(horas, minutos, segundos) {
  21.         this.horas = horas;
  22.         this.minutos = minutos;
  23.         this.segundos = segundos;
  24.     },
  25.     
  26.     restar : function() {
  27.         if(this.segundos > 0) {
  28.             this.segundos--;
  29.         } else{
  30.             if (this.minutos > 0) {
  31.                 this.segundos = 59;
  32.                 this.minutos--;
  33.             } else {
  34.                 if(this.horas > 0) {
  35.                     this.minutos = 59;
  36.                     this.horas--;
  37.                 }
  38.             }
  39.         }
  40.     },
  41.  
  42.     mostrar : function(nodo) {
  43.         if ( (this.horas === this.minutos) && (this.minutos == this.segundos) && (this.segundos == 0) ) {
  44.             this.terminado(nodo);
  45.         } else {
  46.             var tiempo = [ this.horas, this.minutos, this.segundos ];
  47.             for (i=0; i < 3; i++) {
  48.                 if (tiempo[i] < 10) tiempo[i] = "0" + tiempo[i];
  49.             }
  50.             nodo.innerHTML = tiempo.join(':');
  51.         }
  52.     },
  53.  
  54.     terminado : function(nodo) {
  55.         nodo.innerHTML = 'TERMINADO!';
  56.         window.clearInterval(this.intervalID);
  57.     }
  58.  
  59. };
  60.  
  61.  
  62. var cuentaAtras1 = Object.create(cuentaAtras);
  63. var cuentaAtras2 = Object.create(cuentaAtras);
  64.  
  65. cuentaAtras1.inicializar(0, 0, 10);
  66. cuentaAtras2.inicializar(2, 45, 0);
  67.  
  68. cuentaAtras1.intervalID = setInterval(function() {
  69.     cuentaAtras1.mostrar(document.getElementById('coso1'));
  70.     cuentaAtras1.restar();
  71. }, 1000);
  72.  
  73. cuentaAtras2.intervalID = setInterval(function() {
  74.     cuentaAtras2.mostrar(document.getElementById('coso2'));
  75.     cuentaAtras2.restar();
  76. }, 1000);
  77.  
  78. </script>
  79.  
  80. <span id="coso1"></span><br />
  81. <span id="coso2"></span><br />