[UX] timezone drop-down should group timezones by continent

[jenlampton]

Describe your issue or idea

The Drupal 8 timezone selector seems easier to use to me. I mean, selecting timezones is never what I'd call a "good user experience", but I think grouping the timezones by region, and then alphabetically makes it seem easier to find your timezone. What do others think?

Backdrop:

Drupal 8:

[jlfranklin]

There are a number of ways to do a timezone picker. Grouped select is better than what we have, but not really all that different. The Backdrop one is grouped already, by virtue of all the timezone names starting with the name of a region, but the D8 style is less busy and more readable. Using multiple selects, one for region and a one that updates via AJAX to show the region's timezones is another way to group the options. Given the number of options, an autocomplete text field would be a good option. OSX uses a map of the world, which I think is one of the nicest timezone pickers I've seen. Any of these options could add an "autoset" button that updates the widget based on the user's location.

I'm tempted to suggest we add a #timezone FAPI type to make it easier to override in contrib. The core implementation can be a wrapper for the select list we have now or the D8-style grouped select, and contrib modules can override the widget for #timezone fields to be something more innovative.

I say "tempted", because I'm not thrilled about the precedent it sets. Sure, contrib modules can define niche field types, but most core FAPI field types are simple fields, such as text, radio, and checkboxes. A few of them are more data-type centric, notably date, machine_name, and password. If we add one for timezones, would we also do the same for #language? How about for #font?

[laryn]

I like the cleaned-up grouping idea and personally think it would also be helpful to have a "Select2" or "Chosen" style dropdown widget that you can start typing into.

[klonos]

As already mentioned in #3032, I'm in favour of using Select 2 for this too (and use its search-as-you-type and grouping features):