Better Timezone Selection interface

[Otto42]

As matt mentioned in #3962, the new timezone selection interface is not the best. It was simply the easiest, and I never intended for it to be finalized like that.

So I'm starting this ticket for ideas/implementations of better UI's. I'll start. :)

One of the ideas by sambauers in #3962 was an autocomplete type in interface. I have no real problems with that idea, it was the implementation that I disliked. Maintaining our own list of cities? Horrifying. I also didn't like that you put in a city and had to save it before you found out whether or not it would work. Even with autocomplete, you're shooting in the dark here.

My idea is to use Google and Geonames webservices to figure out the timezone via an AJAX method. Without Javascript, we can fall back to some other approach.

There's lots of possible ways to do this interface with these APIs. Geonames is capable of converting a lat/long into a valid timezone easily enough, while Google could be used to look up placenames, to display a map to click on, or even to simply make an educated guess as to where the user currently is located based on IP. If Gears is available, that location information can be made more accurate. Alternatively, the new Location awareness functionality in Firefox 3.5 could be used to figure out the current location (this functionality is identical to Gears location, as they use the same Google services).

I'm attaching a simplistic HTML/Javascript example. This example uses one of two methods to determine the users timezone. The automatic "guess my location" method, and the manually entered placename method. Both use jQuery and Google and Geonames webservices (via JSON callbacks).

[Otto42]

Timezone Javascript demo

[jamierumbelow]

Having the interface try to guess the user's timezone would be nice, but as far as the actual input goes, I think it would be a lot easier, more standardised and overall better if we used the Zoneinfo database specification for timezones.

A full list can be found here: ​http://en.wikipedia.org/wiki/List_of_tz_zones_by_name - as you can see, the "TZ" field is a readable, descriptive specification of timezones. There could be an internal config file that contains all the timezones on that document and their relative offset.

[Otto42]

Replying to jamierumbelow:

Having the interface try to guess the user's timezone would be nice, but as far as the actual input goes, I think it would be a lot easier, more standardised and overall better if we used the Zoneinfo database specification for timezones.

That's what we already have right now, a dropdown with the zoneinfo zone list, generated by PHP itself.

[naomi86]

Timezone using automatic detection

[naomi86]

I used php to detect the user ip and then get the information using a zoneinfo database. The area and gmt is put into the timezone combobox and selected as the default value.

[sambauers]

See #10660

First phase is getting suggestion happening through the WordPress.org API (via a local ip2location DB and GeoNames). Later phases may include text searching for your location and some map based feedback/selection.

[TECannon]

See also: #9759

[rmccue]

I've put a new patch up on #10660, which does IP geolocation and suggests a TZ (but does not autofill it for you).

Nikolay ​came up with a cool <canvas> map implementation, but I'm not sure how much use this is going to be to users. It seems like a lot of manual work for no real gain. There is, however, ​this database, which I'm taking a look at adapting.

[koopersmith]

​Discussed in IRC today.

[Otto42]

I come back around to this about once every 6 months and see if the state of the web has gotten any better for doing this in a nice manner. I have yet to find a good approach. More services are available now, and it's easier to do it with something like Google's APIs, but there's still not a good widely supported DIY method for it.

[rmccue]

Replying to Otto42:

I come back around to this about once every 6 months and see if the state of the web has gotten any better for doing this in a nice manner. I have yet to find a good approach. More services are available now, and it's easier to do it with something like Google's APIs, but there's still not a good widely supported DIY method for it.

The patch from #10660 is probably still good, as api.wordpress.org still appears to work.

One improvement that could be made is using new Date().getTimezoneOffset() in JS and cross-referencing the offset with the offsets in PHP/Olson form. There's an ​existing JS library which is MIT licensed that can do this.

[Otto42]

That library seems to be much simpler than your approach suggests, actually. Not that it wouldn't work too, perhaps.

​https://bitbucket.org/pellepim/jstimezonedetect/src/e265c8eddec7/detect_timezone.js

[rmccue]

Replying to Otto42:

That library seems to be much simpler than your approach suggests, actually. Not that it wouldn't work too, perhaps.

Yep, and I think it's a better implementation than using the IP with GeoNames. It also avoids another api.wordpress.org endpoint that has to be maintained and updated.

Nikolay also had a canvas-based solution for manual selection that was pretty awesome (it was similar to the OS X timezone picker), but I feel like having both might be a bit of overkill in this situation.

[nacin]

HTML5 Geolocation might be cool.

[ocean90]

#22078 was marked as a duplicate.

[Otto42]

Duplicate of #10660.