Problema con método temporizador setInterval();

Citar

Escrito el 13 Oct 2016 09:05 pm

Buenos dias/tardes/noches antes que todo, bueno hoy vengo por un poco de ayuda :'c tengo ya mas de dos dias con un problema que la verdad no entiendo el por que no me funciona... pasa que estoy haciendo un contador regresivo ( un reloj que cuenta hacia atras para saber cuanto tiempo falta para que llegue un evento ). pasa que todo el codigo JS esta correcto ( a mi parecer ) pero el método setInterval(); no esta haciendo lo que debe, es la primera vez que le utilizo y bueno no se si hay algún problema de compatibilidad o una mala definicion del mismo.

Código :

var horaEv, horas, minutos, segundos, tServidor, tEvento;

var fecha = new Date();

   function obtenerDia(){
      var dia = fecha.getUTCDay();
         return dia;
   }

   function obtenerHora(){
      horas = fecha.getUTCHours();
      minutos = fecha.getUTCMinutes();
      segundos = fecha.getUTCSeconds();
      horas -= 4;
   }

   function evento(horaEvento){
      horaEv = horaEvento.split(":");
      for(var i = 0; i < horaEv.length; i++){
         horaEv[i] = parseInt(horaEv[i]);
      }
   }

   function convertirASegundos(horas, minutos, segundos){
      var tiempo;

      tiempo = ((horas*3600) + (minutos*60)) + segundos;
      return tiempo;
   }

   function convertirAHoras(tiempo, contenedor){
      var h, m, s, aux;

      h = Math.trunc(tiempo/3600);
      m = Math.trunc((tiempo - (h*3600))/60);
      s = Math.trunc(tiempo - ((h*3600) + (m*60)));
      document.getElementById(contenedor).textContent = h+":"+m+":"+s;
   }

   function evaluarTiempos(tiempoServidor, tiempoEvento){
      var eval;

      if(tiempoServidor > tiempoEvento){
         eval = false;
      }
      else{
         eval = true;
      }

      return eval;
   }

   function tw(dia){
      var bool, tEspera;

      if(dia >= 0){
         
         evento('13:30:00');
         tServidor = convertirASegundos(horas, minutos, segundos);
         tEvento = convertirASegundos(horaEv[0], horaEv[1], horaEv[2]);
         tEspera = tEvento - tServidor;
         bool = evaluarTiempos(tServidor, tEvento);

         if(bool == false){
            
            evento('17:00:00');
            tServidor = convertirASegundos(horas, minutos, segundos);
            tEvento = convertirASegundos(horaEv[0], horaEv[1], horaEv[2]);
            tEspera = tEvento - tServidor;
            bool = evaluarTiempos(tServidor, tEvento);

            if(bool == false){

               evento('21:00:00');
               tServidor = convertirASegundos(horas, minutos, segundos);
               tEvento = convertirASegundos(horaEv[0], horaEv[1], horaEv[2]);
               tEspera = tEvento - tServidor;
               bool = evaluarTiempos(tServidor, tEvento);
            }
            else{
               convertirAHoras(tEspera, "hora");
            }

         }else{
            convertirAHoras(tEspera, "hora");
         }

      }
   }

   function relojes(){
      var dia = obtenerDia();
      obtenerHora();
      tw(dia);
      var timer = setInterval(relojes, 1000);
   }
   document.addEventListener("DOMContentLoaded", relojes, false);

Código :

<html>
<head>
   <meta charset="utf-8"/>
   <link href="https://fonts.googleapis.com/css?family=Audiowide" rel="stylesheet">
   <script src= "reloj1.2.js"></script>

   <style type="text/css">
      
      #hora{
         font-family: 'Audiowide', cursive;
      }
   </style>
</head>

<body>
   <div id="hora"></div>
</body>
</html>

de antemano gracias por la ayuda que me puedan dar.

NOTA: solo conosco el metodo setInterval para hacer lo que quiero, si alguien conoce alguna otra manera, pues estoy abierto a nuevas ideas

Por brilos

1 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 18 Oct 2016 04:00 pm

estoy viendo el codigo y espero tu me ayudes!!

en la funcion convertirAHoras, el parametro que pasas en la varaible "tiempo"m no cambia y supongo que deberia cambiar... el timer ta bien, pero ese detalle lo veo ahi

Por franqgeek

48 de clabLevel

Genero:Masculino

Envíale un mensaje privado Web

Desarrollador Web

@ImFranQ

Citar

Escrito el 18 Oct 2016 05:06 pm

Listo lo hice funcionar

Código :

   var horaEv, horas, minutos, segundos, tServidor, tEvento;

   function obtenerDia(fecha){
      var dia = fecha.getUTCDay();
         return dia;
   }

   function obtenerHora(fecha){
      horas = fecha.getUTCHours();
      minutos = fecha.getUTCMinutes();
      segundos = fecha.getUTCSeconds();
      horas -= 4;
   }

   function evento(horaEvento){
      horaEv = horaEvento.split(":");
      for(var i = 0; i < horaEv.length; i++){
         horaEv[i] = parseInt(horaEv[i]);
      }
   }

   function convertirASegundos(horas, minutos, segundos){
      var tiempo;

      tiempo = ((horas*3600) + (minutos*60)) + segundos;
      return tiempo;
   }

   function convertirAHoras(tiempo, contenedor){
      var h, m, s, aux;

      h = Math.trunc(tiempo/3600);
      m = Math.trunc((tiempo - (h*3600))/60);
      s = Math.trunc(tiempo - ((h*3600) + (m*60)));
      document.getElementById(contenedor).textContent = h+":"+m+":"+s;
   }

   function evaluarTiempos(tiempoServidor, tiempoEvento){
      var eval;

      if(tiempoServidor > tiempoEvento){
         eval = false;
      }
      else{
         eval = true;
      }

      return eval;
   }

   function tw(dia){
      var bool, tEspera;

      if(dia >= 0){
         
         evento('13:30:00');
         tServidor = convertirASegundos(horas, minutos, segundos);
         tEvento = convertirASegundos(horaEv[0], horaEv[1], horaEv[2]);
         tEspera = tEvento - tServidor;
         bool = evaluarTiempos(tServidor, tEvento);

         if(bool == false){
            
            evento('17:00:00');
            tServidor = convertirASegundos(horas, minutos, segundos);
            tEvento = convertirASegundos(horaEv[0], horaEv[1], horaEv[2]);
            tEspera = tEvento - tServidor;
            bool = evaluarTiempos(tServidor, tEvento);

            if(bool == false){

               evento('21:00:00');
               tServidor = convertirASegundos(horas, minutos, segundos);
               tEvento = convertirASegundos(horaEv[0], horaEv[1], horaEv[2]);
               tEspera = tEvento - tServidor;
               bool = evaluarTiempos(tServidor, tEvento);
            }
            else{
               convertirAHoras(tEspera, "hora");
            }

         }else{
            convertirAHoras(tEspera, "hora");
         }

      }
   }

   function relojes(){
      var fecha = new Date();
      var dia = obtenerDia(fecha);
      obtenerHora(fecha);
      tw(dia);
   }
   var timer = setInterval(relojes, 1000);
   document.addEventListener("DOMContentLoaded", relojes, false);

Bueno, te comento que fue lo que hice!!

1) tenias un error en la funcion relojes
tenias el setInterval andro de la funcion y esto hacia que se duplicara, eso en un periodo de tiempo explotaria tu naveagdor..

se ejecutaba 1,2,4,8,16...... veces

por tanto, el timer lo coloqué afuera de la funcion

2) la instancia de new Date() al momento de instanciarla afuera solo la instanciabas 1 vez y era el momento en que cargaba la web, por tanto la fecha no cambiaba

por tanto lo que hice fue meterla en la funcion relojes para que cada vez que pasaran los 1000 misilegundos trajera la hora nueva

y lo que hice fue pasarle por parametros la hora nueva a las funciones obtenerDia y obtenerHora

Saludos!!

Por franqgeek

48 de clabLevel

Genero:Masculino

Envíale un mensaje privado Web

Desarrollador Web

@ImFranQ

Citar

Escrito el 19 Oct 2016 02:43 pm

O: franqgeek muchas gracias franqgeek ya vi tu observación y bueno son cosas que se me pasaron mil gracias de verdad :C es la primera vez para mi usando el setinterval y todo eso... muchas gracias de verdad *-*

Por brilos

1 de clabLevel

Envíale un mensaje privado

Problema con método temporizador setInterval();

Escribe una respuesta rapida