Здравствуй, уважаемый друг!

Кажется, ты используешь AdBlock. Этот проект развивается и существует за счет доходов от рекламы.
Добавь, пожалуйста, нас в исключения.

Спасибо за понимание.

Создание сайтов Харьков

Склонение названия величин времени в дате

1 декабря 2014 в 18:16 Автор: Nikita_Sp в категории Статьи о JavaScript 2 комментария

При создании таймеров и счетчиков обратного отсчета часто указывают величину времени после каждого значения. Например 2 дня 12 часов 24 минуты 42 секунды. В английском языке все просто, проверил значение величины, и если оно не равно единице, то добавил «s» — 2 days 12 hours 01 minute. Но что делать с русским языком?

Склонение названий секций в формате даты

Многие с такой проблемой часто борятся при помощи «хитрых скобочек», например 2 минут(ы), но это не профессионально и не красиво, да и строка увеличивается за счет лишних символов.

При разработке сайта с подобным счетчиком я разработал небольшой скрипт, который помогает определить какое же склонение необходимо использовать для того или иного значения.

Работа скрипта основывается на значении последней цифры каждого из значений счетчика: т.е. если значение минут 26, то последняя цифра 6. Таким образом выбирается необходимый падеж.

Я приведу исходный код простого таймера обратного отсчета который использовал также в модуле отсчета времени до конца акции OpenCart и модуле Акции категорий со счетчиком для OpenCart, который вы можете переделать под свои нужды.


function countdown(){
	var names = {days:		{1:"день", 2:"дня", 3: "дней"},
				 hours:		{1:"час", 2: "часа", 3: "часов"},
				 minutes:	{1:"минута", 2: "минуты", 3: "минут"},
				 seconds:	{1:"секунда", 2: "секунды", 3: "секунд"},
	};
	var day_name = names['days'][3];
	var hur_name = names['hours'][3];
	var min_name = names['minutes'][3];
	var sec_name = names['seconds'][3];


	var today = new Date();
	var BigDay = new Date(2014, 11, 31, 15, 00, 00);
	var timeLeft = (BigDay.getTime() - today.getTime());

	var e_daysLeft = timeLeft / 86400000;
	var daysLeft = Math.floor(e_daysLeft);

	var slice_day = String(daysLeft).slice(-1);
	if(parseInt(slice_day) == 1 && (parseInt(daysLeft) < 10 || parseInt(daysLeft) > 20)){
		day_name = names['days'][1];
	}else if((parseInt(slice_day) == 2 || parseInt(slice_day) == 3 || parseInt(slice_day) == 4) && (parseInt(daysLeft) < 10 || parseInt(daysLeft) > 20)){
		day_name = names['days'][2];
	}else{
		day_name = names['days'][3];
	}

	var e_hrsLeft = (e_daysLeft - daysLeft)*24;
	var hrsLeft = Math.floor(e_hrsLeft);
	if(hrsLeft < 10){
		hrsLeft = '0'+hrsLeft;
	}
	var slice_hours = String(hrsLeft).slice(-1);
	if(parseInt(slice_hours) == 1 && (parseInt(hrsLeft) < 10 || parseInt(hrsLeft) > 20)){
		hur_name = names['hours'][1];
	}else if((parseInt(slice_hours) == 2 || parseInt(slice_hours) == 3 || parseInt(slice_hours) == 4)  && (parseInt(hrsLeft) < 10 || parseInt(hrsLeft) > 20)){
		hur_name = names['hours'][2];
	}else{
		hur_name = names['hours'][3];
	}

	var e_minsLeft = (e_hrsLeft - hrsLeft)*60;
	var minsLeft = Math.floor(e_minsLeft);
	if(minsLeft < 10){
		minsLeft = '0'+minsLeft;
	}
	var slice_min = String(minsLeft).slice(-1);
	if(parseInt(slice_min) == 1 && (parseInt(minsLeft) < 10 || parseInt(minsLeft) > 20)){
		min_name = names['minutes'][1];
	}else if((parseInt(slice_min) == 2 || parseInt(slice_min) == 3 || parseInt(slice_min) == 4) && (parseInt(minsLeft) < 10 || parseInt(minsLeft) > 20)){
		min_name = names['minutes'][2];
	}else{
		min_name = names['minutes'][3];
	}

	var seksLeft = Math.floor((e_minsLeft - minsLeft)*60);
	if(seksLeft < 10){
		seksLeft = '0'+seksLeft;
	}
	var slice_sec = String(seksLeft).slice(-1);
	if(parseInt(slice_sec) == 1 && (parseInt(seksLeft) < 10 || parseInt(seksLeft) > 20)){
		sec_name = names['seconds'][1];
	}else if((parseInt(slice_sec) == 2 || parseInt(slice_sec) == 3 || parseInt(slice_sec) == 4) && (parseInt(seksLeft) < 10 || parseInt(seksLeft) > 20)){
		sec_name = names['seconds'][2];
	}else{
		sec_name = names['seconds'][3];
	}

	if (BigDay.getTime() > today.getTime() ){
		document.getElementById("countdown").innerHTML = daysLeft+" "+day_name+" "+hrsLeft+" "+hur_name+" "+minsLeft+" "+min_name+" "+seksLeft+" "+sec_name;
	}
}

Как видите для каждой позиции формата часов определяется последняя цифра и устанавливается соответствующий падеж. В случае если последняя цифра равна единице — минута, если 2, 3, 4 — минуты, 5-0 — минут. При этом величины от 10 до 20 имеют все значение — минут.

Данное решение нуждается в доработке в случае если в одной из позиций (одно из значений) таймера будет число, превышающее 100, т.к. необходимо будет брать последние две цифры для выполнения последнего условия с величинами от 10 до 20.

2 комментария

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вверх!

Меню блога

Категории блога

Облако тегов