Правильний годинник на javascript для сайта, історія одного інтерфейсу

Якось одного разу на сайті vashkivtsi.com.ua я примітив годинник в шапці сторінок. Годинник класний, зроблений на флеш, ідея мені сподобалась, я спочатку думав що це відображається час який зараз у Вашківцях, але все виявилось дуже печально після того як мене зацікавило звідки береться час для годинника. Виявилося що час на годиннику відображається такий же як і на комп’ютері. А якщо я проживаю в Росії, Італії, США чи Польщі або година на моєму ПК буде не налаштована то і відображатись буде «лобода» якась на такому годиннику. Оскільки до мене заходять в місяць більше 50 людей із за кордону, то толку з такої цяцьки, на сайті нуль. Мені прийшла в голову ідея зробити на своєму сайті реальний годинник, який би не залежно від комп’ютера користувача відображав реальну годину по Київському часу. Діючий годинник ви можете подивитись на головній сторінці цього сайту.

І так я задумав зробити годинник для сайту на javascript.

Так як мій сервер знаходиться за кордоном то година і часовий пояс там теж свій, то я став використовувати свою систему лічення часу яку застосовую на всіх своїх сайтах. А полягає все в наступному. Я отримую на php функцією time() час і добавляю до нього якесь число щоб отримати час по Києву в Unix форматі. Прилизно такий шматок коду є в мене в конфігураційному php-файлі.

$korectirovka=7200;
$time_ua=time()+$korectirovka;

$korectirovka – це число секунд для того щоб відкорегувати поточний час на сервері, воно задає зміщення відносно часу сервера. Може бути і мінусовим значенням. $time_ua – це час у UNIX форматі, число секунд від початку ери UNIX яке відповідає реальному часу по Києву. Я час від часу перевіряю коли змінюють літній і зимній час і підкореговую перемінну $korectirovka.

На сторінці створюю такий блок html-коду:

А далі я пишу таку функцію:

function time_now(){
	if(typeof real_time == 'undefined') real_time=time_ua;// при першому запуску функції ініціюю real_time
	real_time++;// добавляю 1 секунду при кожному запуску функції
	real_time_mil=real_time*1000;//перетворюю в мікросекунди
	dateObj = new Date(real_time_mil);//получаю дату javascript з Unix формату
	Y=dateObj.getFullYear();//рік
	month=dateObj.getMonth();//міс
	data=dateObj.getDate();//число
	tujd=dateObj.getDay()//день тижня
	hour=dateObj.getUTCHours();//година
	if(hour<10) hour='0'+hour;// щоб 1-9 година відображалась як 01-09
	min=dateObj.getUTCMinutes();//мінути
	if(min<10) min='0'+min;// аналогічно годинам
	sec=dateObj.getSeconds();//секунди
	
	document.getElementById('ua_hour').innerHTML=hour;//заприсую час в блок ua_hour на сторінці
	document.getElementById('ua_min').innerHTML=min;//аналогічно
		
	timerID = setTimeout("time_now()", 1000);// запускаю цю ж функцію через 1 секнду

}

В низу сторінки сторінки я вивантажую javascript код, який передає в javascript час в секундах з PHP. Де 1323434398 це число time_ua виведений php-скриптом.

time_ua=1323434398;
time_now();// запускаю після того як блок ua_hour і ua_min виведені на сторінку

Але якщо компютер користувача підвисне, то і час на сторінці яка довго не оновлюється також зібється, або користувач наприклад вимкне компютер в сплячий режим. Тому я трохи переписав функцію, тепер вона не збільшує що секунди значення перемінної real_time на одиницю, а один раз при першому запуску функції вираховує різницю між часом на сервері і часом на компютері і при наступних щосекундних запусках функції бере системний час і робить відносно нього поправку яка записана у перемінну riznutsia. А ось і власне нова версія функції

function time_now(){
	// Получаю дату на компі
	datacomp = new Date;
	timestamp = datacomp.valueOf();
	timestamp=Math.floor(timestamp/1000);
	
	if(typeof riznutsia == 'undefined') riznutsia=time_ua-timestamp;// вираховую різницю між часом сервера і компа

	real_time=timestamp+riznutsia;// коректую час, роблю поправку
	real_time_mil=real_time*1000;
	dateObj = new Date(real_time_mil);
	Y=dateObj.getFullYear();//рік
	month=dateObj.getMonth();//міс
	data=dateObj.getDate();//число
	tujd=dateObj.getDay()//день тижня
	hour=dateObj.getUTCHours();//година
	if(hour<10) hour='0'+hour;
	min=dateObj.getUTCMinutes();//мінути
	if(min<10) min='0'+min;
	sec=dateObj.getSeconds();//секунди
	
	get('ua_hour').innerHTML=hour;
	get('ua_min').innerHTML=min;
		
	timerID = setTimeout("time_now()", 1000);

}