Javascript-форум - Таймер обратного отсчета на 6 дней

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Таймер обратного отсчета на 6 дней (https://javascript.ru/forum/misc/40828-tajjmer-obratnogo-otscheta-na-6-dnejj.html)

Таймер обратного отсчета на 6 дней

Добрый день знатоки Javascript , я в этом вообще не разбираюсь, просмотрел много таймеров, но так и не нашел решения для себя.
Нужен таймер что бы отсчитывал 6 дней и потом заново автоматически начинал снова отсчитывать опять таки на 6 дней, и так постоянно.

Цитата:

Сообщение от akella1900

что бы отсчитывал 6 дней

Для кого отсчитывал?

обыкновенный таймер обратного отсчета на сайте , только чтоб через 6 дней снова обновлялся еачинал отсчет и так все время

таки никого здесь нет))

Цитата:

Сообщение от domius

будет к 6 дням идти потом обнувлятса на 0.

при условии, что браузер будет запущен все 6 дней :)

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

Такая же тема совсем недавно открывалось. Невозможно сделать подобный таймер на javascript... Для этого надо делать связку из php+ajax+javascript. На сайте запущен некий php-таймер. Когда пользователь открывает страницу, javascript код на странице отправляет ajax-запрос к php-скрипту на сайте и запускает свой собственный setInterval. Каждую ну, допустим, минуту javascript-таймер сверяется с php-таймером (при помощи ajax), ибо setInterval, как я уже говорил, браузеры любят затормаживать.

Цитата:

Сообщение от Erolast

Невозможно сделать подобный таймер на javascript

я так не думаю. Если по условиям не требуется что-то выполнить в фоне по истечению времени, можно использовать кукисы или локальное хранилище плюс корректировка таймера при получении окном фокуса.

:write: а если надо просто отсчитывать срок до следующей шестидневки ...

Цитата:

Сообщение от BETEPAH

можно использовать кукисы или локальное хранилище

А если жена с моего компа зайдет и увидит что "ей осталось 2 дня"? :D

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

Цитата:

Сообщение от ksa

А если жена с моего компа зайдет и увидит что "ей осталось 2 дня"?

Жену пускать за свой комп нельзя! :agree:
Равно как и полицию. Мало ли, что они решат, что отсчитывает таймер. Вызовут собак-миноискателей еще, прости Господи

Вот, на всякий случай вытянул из своих сниппетов:

//проверка активна ли в настоящий момент вкладка браузера
var isActive = true;
function onBlur() {isActive = false;};
function onFocus() {isActive = true;};
if (/*@cc_on!@*/false) { // check for Internet Explorer
	document.onfocusin = onFocus;
	document.onfocusout = onBlur;
} else {
	window.onfocus = onFocus;
	window.onblur = onBlur;
}

таймер до конца дня осталось или таймер на шестидневку

:write: до 2 октября ... до 8 октября ... до 14 октября ...

<html>
<head>
<meta charset="utf-8" />
  <title></title>
</head>
<body><div id = 'show'></div>
<script type="text/javascript">
function two(a) {
    return (9 < a ? "" : "0") + a
}
function formatTime(a) {
    a = Math.floor(a / 1E3);
    var b = Math.floor(a / 60),
        c = Math.floor(b / 60),
        d = c / 24 | 0,
        c = c % 24;
    a %= 60;
    b %= 60;
    return d + " " + days(d) + " " + two(c) + " " + hours(c) + " " + two(b) + " " + minutes(b) + " " + two(a) + " " + seconds(a)
};

// функция для склонения слов ( (1)"день", (2)"дня", (5)"дней")

function plural(str1,str2,str5){
  return function ( n ) {return ((((n%10)==1)&&((n%100)!=11))?(str1):(((((n%10)>=2)&&((n%10)<=4))&&(((n%100)<10)||((n%100)>=20)))?(str2):(str5)))}
  }

var days =  plural('день', 'дня', 'дней'),
    hours = plural('час', 'часа', 'часов'),
    minutes = plural('минута', 'минуты', 'минут'),
    seconds = plural('секунда', 'секунды', 'секунд');

function Time() {
    var data = Date.parse('02/01/2014') // дата начала 1 шестидневки  строго "месяц/день/год"
    data = new Date(data);
    data.setMinutes((-180 - data.getTimezoneOffset()), 0, 0); //для коррекции   запустить в зоне акции alert((new Date).getTimezoneOffset()) и поменять число
    for (; (new Date).getTime() > data; )  {
    data.setDate(data.getDate()+6)//через сутки +1 , через 6 дней +6 
    }
    var a = data.getTime() -  (new Date).getTime();
    document.getElementById("show").innerHTML = "До " + data.toLocaleString() + " по Москве осталось: " + formatTime(a);
    window.setTimeout(Time, 1E3)
};
Time()
</script>
</body>
</html>

Два дня искал такой код))) Спасибо величайшее Рони!! :) :dance:

function plural(n,str1,str2,str5){
 var tst = (n%100); if(tst>20) tst =tst %10;
  if(!tst) return str5;
  if(tst==1) return str1;
  if(tst<5) return str2;
  if(tst>4) return str5;
}

Рони, подскажите как в ваш код добавить элементам скрипта классы, чтобы можно было стили прописать

Kasper28,
нарисуйте свои элементы с классами

Что вы имеете ввиду "нарисуйте"?

Kasper28,
html код -- какие классы то вы хотите куда -- в коде всего 1 элемент присвойте ему класс какой вам нужен.

а если выставить на два дня, или даже 5, то он считает неправильно... или я что-то делаю не так?

Nyako,
дата начала выставлена?

да, дата начала не изменяется

Nyako,
строка 36 -- 240 заменить на 180 почему читать тут http://javascript.ru/forum/dom-windo...tml#post237541

если опять что-то не так -- то приведите пример конкретный что должно что выдаёт.

А мне помогите, пожалуйста! :) :)
Сейчас счетчик отсчитывает время до вписанной даты в первом файле. Нужно чтобы он от этой даты и времени отсчитывал заданные циклы, например, если в этом файле ставим параметр 3, то он считает обратно 3 дня каждый раз при достижении 0:0:0:0, и после обнуления, снова три дня считал.
Заранее спасибо кто поможет.

/scripts/custom.js

if ($('div').is('.countdown')) {
        $('.countdown').jCounter({
            date: "20 july 2016 12:00:00", // Deadline date
            timezone: "Europe/Bucharest",
            format: "dd:hh:mm:ss",
            twoDigits: 'on',
            fallback: function () {
                console.log("count finished!")
            }
        });
    }

Есть еще файл, целиком не уместился в сообщение: /scripts/jquery.jCounter-0.1.4.js

;(function($,document,window,undefined) {
	//once upon a time...
	$.fn.jCounter = function(options,callback) {
		var jCounterDirection = 'down'; // points out whether it should count down or up | handled via customRange setting
		
		var customRangeDownCount; //if true, it will tell countdown_proc() it's a down count and not an up count
		var days,hours,minutes,seconds;
		var endCounter = false; //stops jCounter if true
		var eventDate; //time target (holds a number of seconds)
		var pausedTime; //stores the time (in seconds) when pausing
		var thisEl = this; //custom 'this' selector
		var thisLength = this.length; //number of multiple elements per selector

		var pluralLabels = new Array('Дней','Часов','Минут','Секунд'); //plural labels - used for localization
		var singularLabels = new Array('DA1Y','HOUR','MINUTE','SECOND');	//singular labels - used for localization

		this.options = options; //stores jCounter's options parameter to verify against specified methods
		this.version = '0.1.4';

		//default settings
		var settings = {
			animation: null,
			callback: null,
			customDuration: null,
			customRange: null,
			date: null,
			debugLog: false,
			serverDateSource: 'scripts/dateandtime.php', //path to dateandtime.php file (i.e. [url]http://my-domain.com/dateandtime.php[/url])
			format: 'dd:hh:mm:ss',
			timezone: 'Europe/London',
			twoDigits: 'on'
		};

		//merge the settings with the options values
		if (typeof options === 'object') {
			$.extend(settings,options);
			thisEl.data("userOptions", settings); //push the settings to applied elements (they're used by methods)
		}

		if(thisEl.data('userOptions').debugLog == true &&  window['console'] !== undefined ) {
			var consoleLog = true;	//shows debug messages via console.log() if true
		}

		//METHODS
		var jC_methods = {
			//initialize
			init : function() {
				thisEl.each(function(i,el) {
					initCounter(el);
				});
			},
			//pause method: $.jCounter('pause')
			pause : function() {
				if(consoleLog) { console.log("(jC) Activity: Counter paused."); }
				endCounter = true;
				return thisEl.each(function(i,el) {
					clearInterval($(el).data("jC_interval"));
				});
			},
			//stop method: $.jCounter('stop')
			stop : function() {
				if(consoleLog) { console.log("(jC) Activity: Counter stopped."); }
				endCounter = true;
				return thisEl.each(function(i,el) {
					clearInterval($(el).data("jC_interval"));
					$(el).removeData("jC_pausedTime");
					resetHTMLCounter(el);
				});
			},
			//reset method: $.jCounter('reset')
			reset : function() {
				if(consoleLog) { console.log("(jC) Activity: Counter reset."); }
				return thisEl.each(function(i,el) {
					clearInterval($(el).data("jC_interval"));
					resetHTMLCounter(el);
					initCounter(el);
				});
			},
			//start method: $.jCounter('start')
			
			start : function() {
				if(consoleLog) { console.log("(jC) Activity: Counter started."); }
				return thisEl.each(function(i,el) {
					pausedTime = $(el).data("jC_pausedTime");
					endCounter = false;
					clearInterval($(el).data("jC_interval"));
					initCounter(el);
				});
			}
		}
		
		//checks whether customDuration is used
		if(thisEl.data("userOptions").customDuration) {
			if(!isNaN(thisEl.data("userOptions").customDuration)) {
				var customDuration = true;
			} else {
				var customDuration = false;
				if(consoleLog) { console.log("(jC) Error: The customDuration value is not a number! NOTE: 'customDuration' accepts a number of seconds."); }
			}
		}
....