Add & use a global blog timezone

It’s time 🕙 for us to finally add proper timezone support to Ghost. The original main issue for this (with a great deal of discussion) is here: https://github.com/TryGhost/Ghost/issues/1265.

Other related issues which may or may not be helpful:

• Add timezone dropdown to settings #2360
• Determine the best list of time zones for use in Ghost #2359
• An ancient PR #2387

The timezone problem:

The problem we face with timezones revolves almost entirely around published dates.

Take the following scenario:

• A user in UTC-8 (San Fran) opens their post settings menu, and sets the published at date to be 8pm on Dec 31st 2015.
• Ghost correctly stores that as 4am Jan 1st 2016 UTC.
• The blog is set to use Casper, which doesn’t have localisation in the theme.
• They share their post straight away and all the readers see it marked as published in the future!

This gets more confusing when post scheduling comes into play. Take the example of a San Fran startup blog. They like to publish posts at lunchtime for their readership which is mostly also in San Fran. They hire a writer in Singapore, who is in UTC+8.

• The writer creates their post, and sets the published at date to be 12:30pm (lunchtime) on Feb 1st 2016 (a date that is in the future).
• Ghost correctly stores that as 4:30am Feb 1st 2016 UTC.
• The scheduler will publish the post at 4:30am Feb 1st 2016 UTC which lunchtime in Singapore, but for the San Fran readership, that’s 8:30pm on the previous day.
• Meanwhile the post itself will output on the frontend saying it was posted at 4:30am.

There are two underlying problems here:

1. There’s no way to tell Ghost what timezone to use when outputting a date in your theme (other than using localisation in the theme), or anywhere else that a date might be output.

2. When you set a date in the PSM, there’s no way to know whether that’s using your timezone, the server’s timezone, or the blog’s timezone (which doesn’t exist yet). It actually uses your own timezone, but then stores UTC, which makes things work sort of correctly, but is confusing.

We’re going to solve this the same way that Twitter, Tumblr, WP, Slack etc all do. Add a setting to the general settings, and use this to output all dates everywhere, including when setting the published at date.

The Timezone Setting

The timezone setting itself will take the form of a dropdown list, exactly the same as you see in Tumblr or Slack.

Tumblr:

• The setting should exist under general settings in the Ghost admin
• This setting should be a dropdown list
• The format should be (UTC<offset>) List, Of, Cities just like Tumblr
• The list should contain exactly the same entries as Tumblr
• The default should be GMT London (the closest real TZ to UTC and the middle of the list)
• The text under the dropdown should read “The local time here is currently HH:mm am/pm” - the time should reflect the TZ selected, and should ideally tick over each minute (like on Buffer)

The Post Settings Menu

In the post settings menu, the date picker needs to be updated to use the new global blog timezone instead of the user’s timezone.

That means, if I’m in UTC+2, and I login to my blog which is set to GMT, when I create a new draft the PSM should show me the time in GMT, not in UTC+2. Equally if I set a post to publish at 2pm, this should be 2pm GMT not 2pm UTC+2 i.e.12pm GMT.

The Date Helper

There are actually 2 date helpers in Ghost:

• /core/server/helpers/date.js -> used in themes
• /core/client/app/helpers/gh-format-timeago.js -> used in the admin panel

Both of the Date helpers need to be updated to take the timezone into account. As a result, the date output should always be correct according to the blog’s timezone.

[nuclearpengy]

this is going to be rad.

[acburdine]

@aileen that sounds good to me, but I’ll defer to @erisds 's judgement before merging the PR 😄