Склонение слов в плагине JS

254
30 июня 2018, 23:00

есть вот такой JS плагин таймера:

(function ($) {
$.fn.downCount = function (options, callback) {
    var settings = $.extend({
            date: null,
            offset: null
        }, options);
    if (!settings.date) {
        $.error('Date is not defined.');
    }
    if (!Date.parse(settings.date)) {
        $.error('Incorrect date format, it should look like this, 12/24/2017 12:00:00.');
    }
    var container = this;
    var secCount = -1;
    var minCount = -1;
    var timeZone = +0;  
    if($('#timer').attr('data-date-timezone') && ($('#timer').attr('data-date-timezone') != '')){
        timeZone = $('#timer').attr('data-date-timezone');
    }
    var currentDate = function () {
        var date = new Date();
        var utc = date.getTime() + (date.getTimezoneOffset() * 60000) - (360000*100) +(360000*10)*timeZone;
        var new_date = new Date(utc + (3600000*settings.offset))
        return new_date;
    };
    function countdown () {
        var target_date = new Date(settings.date),
            current_date = currentDate();
        var difference = target_date - current_date;
        if (difference < 0) {
            clearInterval(interval);
            if (callback && typeof callback === 'function') callback();
            return;
        }
        var _second = 1000,
            _minute = _second * 60,
            _hour = _minute * 60,
            _day = _hour * 24;
        var _centi = _second / 100;
        var days = Math.floor(difference / _day),
            hours = Math.floor((difference % _day) / _hour),
            minutes = Math.floor((difference % _hour) / _minute),
            seconds = Math.floor((difference % _minute) / _second),
            centis = Math.floor((difference % _minute) / _centi );
            days = (String(days).length >= 2) ? days : '0' + days;
            hours = (String(hours).length >= 2) ? hours : '0' + hours;
            minutes = (String(minutes).length >= 2) ? minutes : '0' + minutes;
            seconds = (String(seconds).length >= 2) ? seconds : '0' + seconds;
        var ref_days = (days === 1) ? 'day' : 'days',
            ref_hours = (hours === 1) ? 'hour' : 'hours',
            ref_minutes = (minutes === 1) ? 'minute' : 'minutes',
            ref_seconds = (seconds === 1) ? 'second' : 'seconds';
        if(centis == 0){
            centis = 6000;
        }
        if(seconds == 0){
            seconds = 60;
        }
        if(seconds%60 == 0){                
            secCount--;
        }
        if(minutes == 0){
            minutes = 60;
        }
        if((minutes%60 == 0) && (seconds == 59)){                
            minCount--;
        }
        container.find('#days').text(days);
        container.find('#hours').text(hours);
        container.find('#minutes').text(minutes);
        container.find('#seconds').text(seconds);
    };
    var interval = setInterval(countdown, 333.333);
};
})(jQuery);

Есть HTML разметка:

<ul class="timer" id="timer" data-date="2018-06-06 18:00:00" data-date-timezone="+3">
    <li><span id="hours">00</span>Часы</li>
    <li class="dots">:</li>
    <li><span id="minutes">00</span>Минуты</li>
    <li class="dots">:</li>
    <li><span id="seconds">00</span>Секунды</li>
</ul>

И есть функция вызова:

$(function() {
    $('#timer').downCount({
        date: $('#timer').attr('data-date'),
        offset: +10
    });
});

Я полагаю в этом плагине уже реализована функция склонения слов.

К примеру: 1 день, 2 дня или 2 часа, 11 часов

Помогите разобраться как ее подключить к HTML. Сам таймер работает а вот с клонением слов возникли проблемы!

Answer 1

Ну да, функция реализована, но англоязычная и нужно было дописать вывод в ваш элемент. Вообще для решения таких задач я бы посоветовал использовать moment.js и не писать лишний раз велосипед со своими костылями в колёсах, к нему также можно подключить множество локалей, включая и русскую.

$.fn.downCount = function(options, callback) { 
  var settings = $.extend({ 
    date: null, 
    offset: null 
  }, options); 
 
  if (!settings.date) { 
    $.error('Date is not defined.'); 
  } 
 
  if (!Date.parse(settings.date)) { 
    $.error('Incorrect date format, it should look like this, 12/24/2017 12:00:00.'); 
  } 
 
  var container = this; 
 
  var secCount = -1; 
  var minCount = -1; 
 
  var timeZone = +0; 
  if ($('#timer').attr('data-date-timezone') && ($('#timer').attr('data-date-timezone') != '')) { 
    timeZone = $('#timer').attr('data-date-timezone'); 
  } 
 
  var currentDate = function() { 
 
    var date = new Date(); 
 
    var utc = date.getTime() + (date.getTimezoneOffset() * 60000) - (360000 * 100) + (360000 * 10) * timeZone; 
 
    var new_date = new Date(utc + (3600000 * settings.offset)) 
 
    return new_date; 
  }; 
 
  function countdown() { 
    var target_date = new Date(settings.date), 
      current_date = currentDate(); 
 
    var difference = target_date - current_date; 
 
    if (difference < 0) { 
 
      clearInterval(interval); 
 
      if (callback && typeof callback === 'function') callback(); 
 
      return; 
    } 
 
    var _second = 1000, 
      _minute = _second * 60, 
      _hour = _minute * 60, 
      _day = _hour * 24; 
    var _centi = _second / 100; 
 
    var days = Math.floor(difference / _day), 
      hours = Math.floor((difference % _day) / _hour), 
      minutes = Math.floor((difference % _hour) / _minute), 
      seconds = Math.floor((difference % _minute) / _second), 
      centis = Math.floor((difference % _minute) / _centi); 
 
    days = (String(days).length >= 2) ? days : '0' + days; 
    hours = (String(hours).length >= 2) ? hours : '0' + hours; 
    minutes = (String(minutes).length >= 2) ? minutes : '0' + minutes; 
    seconds = (String(seconds).length >= 2) ? seconds : '0' + seconds; 
 
    var ref_days = (days === 1) ? 'day' : 'days', 
      ref_hours = (hours === 1) ? 'hour' : 'hours', 
      ref_minutes = (minutes === 1) ? 'minute' : 'minutes', 
      ref_seconds = (seconds === 1) ? 'second' : 'seconds'; 
    if (centis == 0) { 
      centis = 6000; 
    } 
    if (seconds == 0) { 
      seconds = 60; 
    } 
    if (seconds % 60 == 0) { 
      secCount--; 
    } 
 
    if (minutes == 0) { 
      minutes = 60; 
    } 
    if ((minutes % 60 == 0) && (seconds == 59)) { 
      minCount--; 
    } 
 
    container.find('#days').text(days + ref_days); 
    container.find('#hours').text(hours + ref_hours); 
    container.find('#minutes').text(minutes + ref_minutes); 
    container.find('#seconds').text(seconds + ref_seconds); 
 
  }; 
 
  var interval = setInterval(countdown, 333.333); 
 
}; 
 
$(function() { 
 
  $('#timer').downCount({ 
    date: $('#timer').attr('data-date'), 
    offset: +10 
  }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<ul class="timer" id="timer" data-date="2018-06-06 18:00:00" data-date-timezone="+3"> 
  <li><span id="hours"></span></li> 
  <li class="dots">:</li> 
  <li><span id="minutes"></span></li> 
  <li class="dots">:</li> 
  <li><span id="seconds"></span></li> 
</ul>

READ ALSO
Функция даты, метод getSeconds()

Функция даты, метод getSeconds()

Нужна функция, которая выводит текущее значение секунд, через методgetSeconds(), но в формате 2 цифр

180
Как сделать поиск двух одинаковых чисел подряд в массиве?

Как сделать поиск двух одинаковых чисел подряд в массиве?

Дан массив с числамиПроверьте, есть ли в нём два одинаковых числа подряд

240
Как закрыть окно формы?JS

Как закрыть окно формы?JS

Как закрыть окно сайта,на который я отправил форму,сайт открывается в новом окневот мой код

190