Таймер, который помнит

Что-то жалко стало этого файла из "мусорницы", речь в нём шла о том, как без выполнения серверного кода ограничить общее время, проведённое пользователем на странице, неважно, закрывал он браузер на пару часов или суток. Оставшееся время должно было быть видимо и считаться таймером обратного отсчёта.

Раз без сервера - остаются только Cookie и Javascript. Увы, куки придётся ставить каждую секунду, раз нужна была точность до секунды :) Если достаточно минуты, пожалуй, можно просто в функции showtime() поставить повторный вызов с интервалом "минута":

window.setTimeout('showtime();',60000);

ну и не показывать тогда секунд:

document.getElementById(elementName).innerHTML =  form2(hour0)+':'+form2(min0);

(не проверено).

Код для сохранения и чтения cookie, вроде бы, вполне надёжен, работает со времён Internet Explorer 3 и до наших дней.

Не спешите только выполнять этот файл со своего жёсткого диска из "Хрома" - Google Chrome, в отличие от всех остальных браузеров, не сохраняет Cookie для локальных страниц, точней, даже не локальных, а открытых по протоколу file://. Для страницы с локалхоста кукизы, думаю, успешно сохранятся. Такой уж это го**обраузер :)

Следует понимать, что если Cookie и Javascript у клиента отключены - то ничего не выйдет. Но тогда и авторизации на сайте не выйдет, и многого другого. В другом браузере или другом профиле операционки время тоже будет считаться отдельно, куки браузеро- и профиле-зависимы. Также уточню, что способ ни в коем случае нельзя отнести к надёжным, правильно - считать и ограничивать время сессии на стороне сервера, PHP в помощь :)

<script type="text/javascript">
 var cookieName = 'name'; //Имя куки
 var elementName = 'clock1'; //Имя элемента, в котором показывается таймер

 function setCookie (name, value, expires) {
  var curCookie = name+"="+escape(value)+(expires?"; expires="+expires.toGMTString():"");
  document.cookie = curCookie;
 }
 
 function getCookie (name) {
  var prefix = name + "=";
  var cookieStartIndex = document.cookie.indexOf(prefix);
  if (cookieStartIndex == -1) return null;
  var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length);
  if (cookieEndIndex == -1) cookieEndIndex = document.cookie.length;
  return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex));
 }
 
 var TimeoutID; //ID
 var Timeout; //время
 
 function form2 (v) { return (v<10?'0'+v:v); }
 
 function showtime () {
  var t=Timeout/1000;
  if (t>0) {
   sec0=t%60; t-=sec0;
   min0=(t%3600)/60; t-=min0*60;
   hour0=t/3600;
   document.getElementById(elementName).innerHTML =  form2(hour0)+':'+form2(min0)+':'+form2(sec0);
   Timeout-=1000;
   var n=Timeout;
   var now = new Date();
   now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
   setCookie(cookieName, n, now);
   window.setTimeout('showtime();',1000);
  }
  else if (t<1) {
   document.getElementById(elementName).innerHTML = ''; //Убрать строку - счётчик не будет исчезать
   window.clearTimeout (TimeoutID);
   var now = new Date();
   setCookie(cookieName, '', now-1000);  
   //Если что-то нужно делать по истечении времени - код ставить сюда
  }
 }
 
 function inittime (hour,min,sec) { //Число часов, минут, секунд работы
  hour0=Math.max(hour,0); min0=Math.max(min,0); sec0=Math.max(sec,0);
  var t=(hour*3600+min*60+sec)*1000;
  if (t>0) {
   TimeoutID=window.setTimeout('showtime()', 1000);
   Timeout=t;
  }
 }
 document.writeln ('<div align="center">&nbsp;<span id="'+elementName+'" style="font-size:10px"></span>&nbsp;</div>');
 var h,m,s;
 var c=getCookie (cookieName);
 if (c!=null) {
  var t=parseInt(c)/1000;
  if (t>0) { s=t%60; t-=s; m=(t%3600)/60; t-=m*60; h=t/3600; }
 }
 else { h=1; m=0; s=0; } //Здесь ставятся часы, минуты и секунды обратного отсчёта, назначенные по умолчанию
 inittime (h,m,s);
</script>

10.10.2013, 00:40 [12888 просмотров]