Live server datetime golfing...

serverDateTime

<span id="serverDT"></span>
<script>
var nDT = <?php echo time()*1000; ?>;
setInterval(function(){
  var s=(new Date(nDT+=1e3)+'').split(' '),
    d=s[2]*1,
    t=s[4].split(':'),
    p=t[0]>11?'pm':'am',
    e=d%20==1|d>30?'st':d%20==2?'nd':d%20==3?'rd':'th';
  t[0]=--t[0]%12+1;
  document.getElementById('serverDT').innerHTML=[s[0],d+e,s[1],s[3],t.join(':')+p].join(' ');
},1000);
</script>

You might be able to cache the string 'slice' and use that to save some bytes.

@qfox
Thats exactly it. Kind of showing the 'server time' without any server callbacks. I'm setting the server time to begin with, then updating the DOM elem every second.

• Will the timer really desync? Maybe better on setInterval somehow as I think that keeps sync perfectly.
• Fixed num in setTimeout so no longer a string.
• Would ideally like to keep that format if possible

@mathiasbynens Not sure I quite follow. I can cache lines 10 & 11 somehow?

I'm afraid there is no better way to do date formating in JavaScript. It gets dirty very fast (check this JSON date formatter by @crhallberg). Why not do it in PHP using strftime?

@maettig Thats what I was thinking. Would like to just split(' ') a datetime string, but am not 100% sure if there is a format thats the same across all browsers? :/

If there is an absolutely consistent format, I can go that route and in doing so reduce the bytes to around half.

In case it matters, you could use a function declaration rather than var serverDT = function...

Could you maybe specify the format in less-cryptic form? ;)

if (h>12) {h-=12}; should obviously be something like h>12 && (h-=12) or at least drop the curlies. But since there's more stuff like this (long var names etc) I don't really wanna pester you with that ;)

Actually, you're doing

h>=12 ? hE="pm" : hE="am";
if (h>12) {h-=12};

You sould probably combine those... :)

@qfox I guess a few bytes could be saved here and there, but am sure there's a better solution that'd save a lot more bytes.

The format I'm aiming for is:
Sat 9rd Jun 2012 1:56:42pm

I think @maettig is thinking along the same lines as me: output the date in this format with PHP. This can then be picked up with JS, split on the whitespaces & modified.

Just saved 95 chars by removing the 2 x name arrays and instead chopping the 1st & 2nd values from the date (lines 7 & 9), changing to setInterval and removing those 2 curlies @qfox mentioned :D

Month names could be more efficient: "JanFebMarAprMayJunJulAugSepOctNovDec".match(/(.{3})/g). Oh but I see you removed that entirely

(Note that foreign browsers could end up with foreign day/month names)

@qfox I don't mind if it outputs the local language, in fact thats a benefit. :)

Saved another 165 bytes now by changing the date provided by JS to a string and splitting that into an array. I think I can't improve this anymore without reducing var names or removing whitespace.

Now just 505 chars. I'm calling this done.

There is still a lot you can do to make this shorter including dropping the PHP part (this will display the client time instead of the server time).

<span id="serverDT"></span>
<script>
var nDT = <?php echo time() * 1000; ?>;
setInterval(function(){
  var s=(new Date(nDT+=1e3)+'').split(' '),
    d=s[2]*1,
    t=s[4].split(':'),
    p=t[0]>11?'pm':'am',
    e=d%20==1|d>30?'st':d%20==2?'nd':d%20==3?'rd':'th';
  t[0]=--t[0]%12+1;
  document.getElementById('serverDT').innerHTML=[s[0],d+e,s[1],s[3],t.join(':')+p].join(' ');
},1000);
</script>

Edit: Bugfix. Displays server time again. Saved 2 bytes.

@maettig Excellent. Now under the 500 mark at 489 chars (from your suggestion plus removing unncessary brackets on line 7 and whitespace on line 11).

468 chars now, but I've only really achieved that by removing whitespace. Apart from reducing var names, putting everything onto 1 line, removing indents or semicolons at line end I think this is it?

3 more chars saved by using dS=String(date).split(' ');
(instead of using toString)

@maettig It's the server DT I'm really looking to display but a lot of those changes could be used for that I believe?

Sure. I did an update to my code above.

377 chars now thanks to @maettig. Some v good changes, only drawback I can see is getting rid of the function so you see nothing for the first 1 sec and am I right in thinking those vars leak to global?

(As I understand it.... var a=1,b=2 ...b leaks to global? Or is it nothing escapes from anon functions?)

No, var a=1,b=2 does not leak. To fix the delay you can put something like <?php echo strftime("..."); ?> in the <span>. Edit: I saved another two bytes in the code above.

@maettig Mmmm OK, I'm sure someone told me doing that leaks? Oh well, learnt something as well then :)

Don't mind the delay (gives the appearance of actually linking in with the server) ;)

Am integrating this as a final solution into ICEcoder today. Many thanks!

I know you're aiming for a specific format but why not let the end user in control and use the locale Date format ?

<span id="serverDT"></span>
<script>
var nDT = <?php echo time() * 1000; ?>;
setInteval("document.getElementById('serverDT').textContent=new Date(nDT+=1e3).toLocaleString()",1000);
</script>

@p01 Good point. I chose that format because it looks a little nicer than the regular Date output. In the bigger scheme of things I don't mind the extra 100 bytes or so on my IDE to have this format.

@maettig Good spot, updated.