Pull to refresh

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

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


// конструктор принимает 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
Tags:
Hubs:
Total votes 11: ↑2 and ↓9-7
Comments7

Articles