/    Sign up×
Community /Pin to ProfileBookmark

Server Time

Copy linkTweet thisAlerts:
Jul 15.2014

Hello, I am quite new here so I am not sure if I am on the right section.
I would like to place a server time clock inside a wordpress widget.
Now I came up with this code, its all included with the style and I would like to keep this style but this clock doesn’t show the server time but the client time.

[CODE]<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
m = checkTime(m);
s = checkTime(s);
document.getElementById(‘txt’).innerHTML = h+”:”+m+”:”+s;
var t = setTimeout(function(){startTime()},500);
}

function checkTime(i) {
if (i<10) {i = “0” + i}; // add zero in front of numbers < 10
return i;
}
</script>
</head>

<body onload=”startTime()”>

<div id=”txt” style=”background-color:transparent; font-family: ‘courier’, Helvetica, Arial, sans-serif; font-size: 20pt; color: #FFF;”></div>

</body>
</html>[/CODE]

Someone can help me with this code to show the server time rather than client time?

Thank you in advance.

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@rootJul 15.2014 — Get the server time in PHP and have it written in to a time reference in a JavaScript.

I also see that you are using a method of gathering time data that is really out of the ark.

Write in the current server time with PHP

[code=php]<?php
date_default_timezone_set('America/Los_Angeles');
$rfc = date("r");
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>The Server Time</title>
<script>
timeSrv = new Date( "<?php echo $rfc;?>" ).getTime();
...
...
stringTime = new Date(timeSrv ).toUTCString().slice(17,25); // returns 00:00:00 format time

...
...
</script>
</head>
[/code]

You will need to sub the local timezone of your server here date_default_timezone_set('America/Los_Angeles');

What you then have is a date object returned by the server, set on the clients machine as milliseconds

the stringTime will be a string time representation already formatted

You will need to have other time functions if you want to have the time of this object advanced, because this is in milliseconds, you can incorporate other functions that return milliseconds so you can calculate what you need.

The JavaScript Date() object understands many different time formats, string dates such as RFC dats and ISO dates and times, milliseconds and d/m/y hⓂs formats.

Avoid using [B]setTimeout [/B]callbacks, they take time to set up and consume time, use the [B]setInterval[/B], it only needs to be set once and it will keep on calling the function until page is shut down or navigated away from.
Copy linkTweet thisAlerts:
@xelawhoJul 15.2014 — a js-only solution, in case that's required...

[CODE]
<body>

<div id="txt" style="background-color:transparent; font-family: 'courier', Helvetica, Arial, sans-serif; font-size: 20pt;"></div>
<script>
(function (){
var st=getDate();
var today = new Date(st);

function getDate(){
var xmlHttp = new XMLHttpRequest();
xmlHttp.open('HEAD',window.location.href.toString(),false);
xmlHttp.setRequestHeader("Content-Type", "text/html");
xmlHttp.send('');
return xmlHttp.getResponseHeader("Date");
}

function startTime() {
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
m = checkTime(m);
s = checkTime(s);
document.getElementById('txt').innerHTML = h+":"+m+":"+s;
today.setSeconds(today.getSeconds() + 1);
}

function checkTime(i) {
if (i<10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}

startTime();
setInterval(startTime,1000);
})();
</script>
</body>
[/CODE]
×

Success!

Help @tonystark spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.25,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...