Click here to go to the Network SouthEast Clock!


If you're too young or come from the wrong place to have ever seen one of these in action, here's a video!

About the HTML Network SouthEast Clock

The HTML Network SouthEast Clock is intended to be a reasonably-faithful rendition of the iconic mechanical-digital railway clocks used in the South East region of British Rail, which have slowly disappeared from the network since privatisation.

These are fondly remembered because they were huge; 1.5 metres wide and visible from enormous distances. If you have £750, you can actually buy one over here (the best part is that it will communicate with a computer with an RS-232 serial connection!). Failing that, please enjoy our Javascript re-creation for free!

Faithfulness

We've tried to keep this relatively faithful to the size, dimensions, and colours of the Network SouthEast clocks. True historical accuracy is made more difficult (and sometimes undesirable) by a couple of factors:

Implementation

This uses nothing but Javascript and CSS, plus one very small embedded image. (The embedded image gives the NSE colour stripes at the bottom of the clock; it was just the easiest way to do it.)

Audio is compressed in Ogg Theora and MP3 for browsers with native HTML5 <audio> support. This works in all modern desktop browsers, including Internet Explorer 9.

Bugs

Android renders borders quickly, rather than accurately. So the edges of the borders are jagged. This is impossible to solve, without rendering everything as an image (which would be no fun).

Sound in the Android browser is flaky, because its HTML5 audio support is flaky. It might work for you, or it might not.

The borders that make up the digits have a small radius (one or two rounded corners) in browsers that support it. This looks great in all browsers except Opera, where it looks weird; a check for Opera disables these on page load. We'd like to make it look exactly the same in all browsers, but sometimes that just isn't possible.

The iOS (iPhone, iPad) browser won't allow sounds to play except in response to (further down the call stack than) a user-generated event. This stops audio from playing uninvited, which is good, but it also means you cannot have a sound play every second, as we do here. So the clicking sound is disabled on iOS devices.

Credits

The clicking sound was recorded by John Piper from a real Network SouthEast clock, rescued from London Bridge railway station by the Network SouthEast Railway Society.

The ambient sound is a combination of this (which was recorded, appropriately, at Liverpool Street Station) and this (which was not).

The train horn sound is this.

Copyright

Copyright © 2012 AJ Computing and others.

Permission is granted to copy and/or modify this code for any purpose, provided a link is given back to this page where possible.

Comments or questions

Do email us; we'd love to hear your comments and questions.

Plug

We do a lot of other things, most of them more serious than this, such as web development and computer support. Do contact us for more information.