Простенький таймер на Javascript

    Привет всем рылся у себя в архиве полугодовалой давности и обнаружил один интересный скриптик который должен был выполнять функцию таймера обратного отсчета времени в маленькой системе тестирования, прошу покритиковать, но не сильно :) вот собственно код, надеюсь кому-нибудь будет полезен


    // конструктор принимает 4 параметра
    // 1 - количество секунд
    // 2 - id элемента в котором будет отображаться обратьный отсчет
    // 3 - функция которая будет вызвана по истечении времени
    // 4 - функция которая предназначена для того чтобы
    // отслеживать прогресс и в случае необнодимости
    // контролировать поведение таймера
    function Timer(seconds, element, callback, stopcallback) {
      this.total = parseInt(seconds) || 3600;
    
      if (typeof callback != 'function')
        throw new Error('Third argument was expecting function callback');
    
      this.callback = callback;
    
      // в качестве параметра element нужно передать id элемента
      this.element = document.getElementById(element) || null;
    
      this.stopcallback = stopcallback;
    }
    
    Timer.prototype = {
      hours : 0,
      minutes : 0,
      seconds : 0,
      // эта переменная будет 
      // хранить наш таймер
      t : null,
      init : function () {
        this.tick();
      },
      tick : function () {
        self = this;
    
        // запускаем таймер
        this.t = setTimeout(self.tick(), 1000);
        // преобразовываем секунды в формат ЧЧ/ММ/СС
        this.convert();
        this.total -= 1;
      },
      convert : function () {
        this.hours = parseInt(this.total / 3600);
        this.minutes = parseInt((this.total % 3600) / 60);
        this.seconds = parseInt((this.total % 3600) % 60);
    
        if (this.hours < 10)
          this.hours = '0' + this.hours;
    
        if (this.minutes < 10)
          this.minutes = '0' + this.minutes;
    
        if (this.seconds < 0)
          this.seconds = 0;
    
        if (this.seconds < 10)
          this.seconds = '0' + this.seconds;
    
        this.stopcallback.apply(this);
    
        // отображаем наше время
        if (this.element) {
          this.element.innerHTML = '';
          this.element.innerHTML = this.hours + ':' + this.minutes + ':' + this.seconds;
        }
    
        // если время истекло вызываем функцию обратного вызова
        // которая будет выполнять нечто что вам надо
        if (this.total <= 0 || this.total < 0) {
          this.total = 0;
          this.callback.call();
    
          clearTimeout(this.t);
    
          return;
        }
      },
      stop : function() {
        clearTimeout(this.t);
      }
    }
    
    
    // пример
    var countDown = new Timer(130, 'someElement', doSomeActions, stopTimer);
    
    countDown.init();
    



    With best,
    sultan
    Ads
    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More

    Comments 7

      0
      1. хотя бы один пример использования не помешал бы.
      2. а в чем смысл этой строчки?
      if (this.total
        –1
        просто иногда таймер уходил в минус не помню почему вот и прилепил это :)
          0
          это понятно, просто первое условие включает в себя и второе ;)
        0
        Приветствую. На вскидку.
        1) Запятые.
        2) Строки для setTimeout|setInterval — неявный eval, чем плоха передача функции?
        3) Указывайте контекст. Тот же window.setTimeout(), window.clearTimeout() — меньше будет поиска в стеке контекстов.
        4) Зачем последнее условие в конструкторе?
        5) Почему в Timer::convert() вывод и работа с таймером?
        6) Зачем Timer::stop()?
          0
          Спасибо за комментарии многое увидел иду редактировать :)
          0
          Мой таймер тоже как-то так выглядел.
          Вот скажите, есть ли в js что-то типа функции sprintf, чтобы выводить 01 02 03… 10 11 итд без гемороя?

        Only users with full accounts can post comments. Log in, please.