Like every other SaaS, we like to keep our server infrastructure at HR Partner nice and updated. However, doing that can interrupt your users, so it is polite to warn your users that there will be some sort of downtime during the maintenance window.

Almost every other online site does this, and so we use the excellent Tooltip.io service to post messages to our users from time to time.

One problem. On almost every message I’ve seen on other services - they will post the time of the outage in either GMT/UTC, or their local time zone. My first question is ALWAYS - “When will this actually impact ME, where I am right now??”.

Wouldn’t it be nice, I thought to myself, if there was a website out there where you could punch in the time in GMT… actually, not even punch it in, but pass a parameter to the website with the UTC time and get it to calculate what your local time will be based on your browser settings?

I hunted around Google, and I even asked on Twitter, and while there are a ton of sites our there that can do time conversion for you, not of them (a) are particularly easy (b) can accept URL parameters (c) are free to ad and other rubbish screen clutter making it impossible to work out how to use the site.

I just wanted something simple, that just worked.

So, I decided to build my own. LocalTimeZone (localtime.zone) was born. I spent about an hour whipping up a quick, simple, one page web site that could take an ISO8601 formatted date as a URL parameter, and display the local time based on the browser/PC settings of the person who called up that page. Try it out for yourself:

https://localtime.zone?utc=2020-05-23T14:30

This should show you what the 23rd of May 2020, 2:30pm will be in your local timezone. Try it with any ISO8601 formatted date ( YYYY-MM-DDTHH:MM ).

So now on our server messages, we include a little link which lets the user see what the outage time will be in their own timezone:

Clicking the link will instantly open up a new browser window showing them the outage time in their own timezone:

The page is a simple Tailwind CSS based document with a tiny bit of Javascript based on the Luxon time module. The whole thing (registering the domain name, creating the page, testing it, uploading it and setting up a CloudFront hosting with SSL certificate) took just over an hour.

Feel free to use it yourself ‘as is’ by pointing your server outage message links to this page, or else feel free to pinch the code and use it on your own hosting platform or within your website.

This is part 7 in the chronicles of building HR Partner, our latest web app.

A short one today. I was designing the 404 and 500 error screens for our Ruby framework, and decided to go outside the box a little.

Usually, the 404 error page is a fairly boring affair, telling the user that they have tried to load an invalid page. I thought to make it more interesting, I would incorporate an ever changing background for the error pages.

I am using a dynamic CSS background for the error pages, which links to unsplash.it to load up a random grayscale image as the background.

This way, every time that a user hits an error page, they will still get the large '404' or '500' error number, but overlaid on a different background each time. I have no control over what image gets shown, but I find myself just hitting invalid pages every now and then during my development routine - just to see what pretty landscapes show up.

The body style tag looks something like the following:

<body class='black-bg' style='height: 100%; background:url(https://unsplash.it/g/1000/800/?random) no-repeat fixed center center;'>
  ... rest of 404 error info
</body>

So as I said - error message certainly do not have to be boring!

The server upgrade is.... when??

Errors don't have to be boring