Корректировка часового пояса в часах (на МСК)
Часы показывают время по UTC, а нужно чтобы показывали московское время (UTC +3). Задал по образцу корректировку часового пояса, но часы не показывают время вообще. (сам код - это код шорткода Wordpress, построенный на javascript, поэтому время берется с сервера, а отсчет идет скриптом).
add_shortcode ( 'w_my_shortcode_liveclockserver', 'w_my_shortcode_liveclockserver_func' );
function w_my_shortcode_liveclockserver_func($attr, $content = null)
{
static $form_num;
$form_num++;
$time = getdate();
return <<<HTML
<style>
.w_polein {
min-width: 168px;
height: 28px;
line-height: 28px;
background: #c0de7c;
padding: 5px;
border: none;
font-size: 1.28em;
font-family: Verdana, sans-serif;
font-weight: bold;
text-align: center;
outline: none;
}
</style>
<form name='lcs_$form_num'><p><i class='fa fa-clock-o fa-lg' aria-hidden='true'></i> <strong>Точное время: </strong><input type='text' class='w_polein' name='lcs2_$form_num'></p></form>
<!--suppress JSAnnotator -->
<script>
document.addEventListener("DOMContentLoaded", function() {
Date.prototype.setTimezoneOffset = function(minutes) {
var _minutes;
if (this.timezoneOffset == _minutes) {
_minutes = this.getTimezoneOffset();
} else {
_minutes = this.timezoneOffset;
}
if (arguments.length) {
this.timezoneOffset = minutes;
} else {
this.timezoneOffset = minutes = this.getTimezoneOffset();
}
return this.setTime(this.getTime() + (_minutes - minutes) * 6e4);
};
var second={$time['seconds']};
second.setTimezoneOffset(-180);
second = second.getDate();
var minute={$time['minutes']};
minute.setTimezoneOffset(-180);
minute = minute.getDate();
var hour={$time['hours']};
hour.setTimezoneOffset(-180);
hour = hour.getDate();
document.lcs_$form_num.lcs2_$form_num.value='0';
function display(){
second++;
if (second>=60){ second=0; minute++ }
if (minute>=60){ minute=0; hour++ }
if (hour>23){ hour=0; minute=0; second=0 }
var cHour = hour;
cHour.setTimezoneOffset(-180);
cHour = cHour.getDate();
var cMinute = minute;
cMinute.setTimezoneOffset(-180);
cMinute = cMinute.getDate();
var cSecond = second;
cSecond.setTimezoneOffset(-180);
cSecond = cSecond.getDate();
if (second < 10) cSecond = '0' + second;
if (minute < 10) cMinute = '0' + minute;
if (hour < 10) cHour = '0' + hour;
document.lcs_$form_num.lcs2_$form_num.value=cHour+':'+cMinute+':'+cSecond;
setTimeout('display()',1000)
}
display()
</script>
HTML;
}
код ещё можно посмотреть здесь - https://jsfiddle.net/jurvrn/jyhdt52f/5/ |
часы по москве
jurvrn,
проверяйте
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<span id="txt"></span>
<script type="text/javascript">
function moscowTime() {
var d = new Date();
d.setHours( d.getHours() + 3, d.getMinutes() + d.getTimezoneOffset() );
var reg = d.getSeconds()%2;
var time = d.toTimeString().substring(0,5)
reg && (time = time.replace(':',' '))
return time;
}
onload = function () {
setInterval(function () {
document.getElementById("txt").innerHTML = moscowTime();
}, 100);
}
</script>
</body>
</html>
|
Цитата:
А время изначально откуда берется в javascript? в php оно считывается с сервера. |
jurvrn,
время из компа, если синхронизация не отключена, то комп корректирует время самостоятельно, согласно выбранному поясу, запросом с серверов точного времени. |
рони,
а если на компьютере время не правильное? Тогда хотелось бы получить сразу нужное число часа с сервера (по МСК, то есть UTC+3) Но это уже не javascript. Можно конечно просто прибавить три часа...
var hour={$time['hours']};
var hour = hour + 3;
|
jurvrn,
? |
Цитата:
$time = getdate(); время берется с сервера и у нас получается массив, который в моем первом сообщении разбиваем на переменные
var second={$time['seconds']};
var minute={$time['minutes']};
var hour={$time['hours']};
и в скрипте можно было бы просто прибавить к часам + 3.
var hour={$time['hours']};
var hour = hour + 3;
Задавая время через php мы исключаем показ неверного времени, если у пользователя время на компьютере неправильное, не синхронизировано. Потому что время берется с сервера. Но ваш код мне тоже нравится, есть где использовать, например в мобильной версии. Но хотелось бы прикрутить к нему функцию из php - $time = getdate(); То есть вместо var d = new Date();использовать в скрипте что-то вроде <?php $time = getdate(); <script> var d = $time; .... |
jurvrn,
медитировать тут https://javascript.ru/forum/misc/594...tml#post395951 |
рони,
Ваш код в этой теме больше подходит ( часы и минуты с мигающим двоеточием). Если есть техническая возможность прикрутить к нему время сервера было бы здорово. |
время с сервера с мигающим разделителем
jurvrn,
:-?
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.time{
color: rgb(102, 255, 255);
background-color: rgb(0, 0, 255);
padding: 2px 4px;
border-radius: 4px;
display: flex;
width: 50px;
justify-content: space-between;
}
.time span{
margin: 2px;
font-weight: bold;
text-align: center;
}
.time .sp, .time .spl{
color: rgb(255, 255, 255);
font-size: 20px;
}
.sec {
color: rgb(255, 255, 0);
}
.time .sp{
margin: -1px;
}
</style>
</head>
<body>
<span class="time"></span><br>
<script>
function fn(f, a) {
var c = {
cls: ["hour", "sp", "min"],
formatTime: function(b) {
b = Math.floor(b / 1E3);
var a = Math.floor(b / 60),
d = Math.floor(a / 60);
b %= 60;
a %= 60;
var t = b % 2 ? ":" : "\u200A";
return [c.two(d % 24), t, c.two(a)]
},
two: function(b) {
return (9 < b ? "" : "0") + b
},
timer: function(b) {
var a = performance.now();
requestAnimationFrame(function g(e) {
e -= a;
e = c.formatTime(b + e);
c.cls.forEach(function(a, b) {
a.innerHTML = e[b]
});
requestAnimationFrame(g)
})
},
init: function() {
a = a.split(":");
a = 36E5 * a[0] + 6E4 * a[1] + 1E3 * a[2];
c.cls = c.cls.map(function(a) {
var d = document.createElement("span");
d.classList.add(a);
f.appendChild(d);
return d
});
c.timer(a)
}
};
c.init()
};
var span = document.querySelector('.time') ;
fn(span, '02:08:41');// fn(span, '%uptime%');
//fn(span, '<?php echo date("G").":".date("i").":".date("s"); ?>');
</script>
</body>
</html>
|
рони,
11 строк кода против 40... Двоточие не мигает, секунды не нужны... Цитата:
|
Цитата:
Цитата:
|
Цитата:
всё таки первый ваш вариант был "изящнее" скриншот - https://nimb.ws/EoXU0m |
Цитата:
|
Цитата:
fn(span, '02:08:41');
fn(span, '%uptime%');
fn(span, '<?php echo date("G").":".date("i").":".date("s"); ?>');
другие показывают 0NaN |
|
jurvrn,
на всякий случай мск
fn(span, '<?php echo (date("G")+3).":".date("i").":".date("s"); ?>');
|
рони,
все равно 0NaN 0NaN. А откуда в этом коде php переменные "G", "i", "s". Из функции php? тогда получается что она просто не срабатывает |
jurvrn,
настройте ваш сервер. а пока можно проверить код здесь https://wtools.io/php-sandbox/b43W нажать кнопку EXECUTE и открыть вкладку HTML в Result of php executing |
рони,
Про переменные понял, это формируется часы, минуты и секунды php. Когда из js убираю секунды - та же ошибка. Но почему ? Ведь секунды не выводятся. У меня сайт WordPress , то есть на php. Все даты выводятся. Мне кажется что этот скрипт нагружает компьютер своей анимацией. Вижу что код работает. .... Значит ошибка где-то выше (так как дату вывожу через шорткод) |
Цитата:
Цитата:
заменив a.innerHTML = e[b] на if(a.innerHTML != e[b]) a.innerHTML = e[b] |
рони,
разобрался - с учетом того что это шорткод окончание кода будет таким
var span = document.querySelector(".time");
TIMELITE
." fn(span, '". (date("G")+3).":".date("i") .":".date("s") ."');
</script>
";
а это на что повлияло? if(a.innerHTML != e[b]) a.innerHTML = e[b] |
Цитата:
|
рони,
а здесь у вас вообще не было анимации для перезаписи?
function moscowTime() {
var d = new Date();
d.setHours( d.getHours() + 3, d.getMinutes() + d.getTimezoneOffset() );
var reg = d.getSeconds()%2;
var time = d.toTimeString().substring(0,5)
reg && (time = time.replace(':',' '))
return time;
}
onload = function () {
setInterval(function () {
document.getElementById("txt").innerHTML = moscowTime();
}, 100);
}
|
Цитата:
|
рони, просто в первом случае у вас был setInterval, а во втором requestAnimationFrame.
|
jurvrn,
requestAnimationFrame оба метода имеют плюсы и минусы. |
рони,
Мне больше важно меньше нагрузка на сайт, на браузер. И точность, чтобы не было зависаний. Какой тогда лучше? |
jurvrn,
setInterval может затормозить на неактивной вкладке, а потом "выстрелить" очередью без промежутков, всё зависит от мощности компа и браузера, может пройти незаметно. на данном этапе можно считать оба метода одинаковы, но если есть возможность отказаться от setInterval, то лучше его не использовать, от слова совсем. |
jurvrn,
почитайте внимательно всю статью и выводы внизу settimeout-setinterval |
рони,
Все понял, Тема решена. Спасибо! |
| Часовой пояс GMT +3, время: 01:25. |