Timeless

It's been a while since I made a pointless technical demo. For most of the last 10 years I was working with Flash. Prior to that, I'd learnt how to write basic procedural JavaScript (at the same time as teaching myself HTML and CSS), but I'd never really fully got to grips with design patterns and more structured or object-based JS.

And more recently, when not busy writing emails or sitting in meetings, I've been more focused on back-end stuff: PHP frameworks, and fumbling around on Linux servers (with the help of much Googling). So my JavaScript abilities have become quite rusty.

I had the idea of making a broken 7-segment display clock after walking past one every morning, getting off my train at London bridge. There's something interesting about the unfamiliar symbols, and it's vaguely reminiscent of the self-destruct device in Predator.

A couple of weeks ago I was fortunate enough to have ten hours to kill, on a flight. I had my laptop with me so decided to have a crack at building the clock with JavaScript, CSS and a few PNGs. It took me around 4 hours, including the Photoshop bit.

This is the result. It is kind of pointless but it looks quite cool in my biased opinion. Clicking on the clock gives you the real time, which is arguably more useful.

Feel free to download the source code. Sorry it's not on GitHub, I'm not down with the cool kids yet.

UPDATED: You can find the code here on GitHub