Difficult to edit directly text field with date/time picker

[Jun Omae]

The date/time picker on Trac has some issues. It is difficult to edit directly caused by the following issue.

1. Restore immediately the value after removing end of the text field with backspace key
2. Move the cursor to end of the text field after removing hours part
3. Fill the text field with today after focusing even if it's empty

See ​https://groups.google.com/d/msg/trac-users/1Xi8cz-m1KY/7E8ZgU6WjKgJ.

[Jun Omae]

I've tried the latest of jquery-ui-addons.js, v1.4.3. But it isn't fixed.

I investigated it and noticed that timezone list must have default timezone even if the timezone is not used. The default timezone is at tags/trac-1.0.1/trac/htdocs/js/jquery-ui-i18n.js@:42#L28​.

trac/web/chrome.py

@@ -1141 +1141 @@
             'first_week_day': get_first_week_day_jquery_ui(req),
             'timepicker_separator': 'T' if is_iso8601 else ' ',
             'show_timezone': is_iso8601,
+            # default timezone must be included
             'timezone_list': get_timezone_list_jquery_ui() \
-                             if is_iso8601 else [],
+                             if is_iso8601 else ['Z'],
             'timezone_iso8601': is_iso8601,
         })
         add_script(req, 'common/js/jquery-ui-i18n.js')

The patch would fix the issues. However, even with the patch, the cursor is moved to end when invalid hours is typed.

[Jun Omae]

Committed with tests in [12370] and merged in [12371].

[Ryan J Ollos]

Replying to Jun Omae:

I've tried the latest of jquery-ui-addons.js, v1.4.3. But it isn't fixed.

It wasn't clear to me if the fix committed is a workaround that may someday not be needed. Anyway, confirmed the fix is still needed with v1.5.5 of the jQuery UI Timepicker (upgraded in #11019).

[Jun Omae]

Hmmm. It seems the spec of timezoneList option has been changed and Z in format has been added. However, this patch still doesn't fix the difficulty of direct editing when selected format is iso8601.

trac/util/datefmt.py

@@ -353 +353 @@
 def get_time_format_jquery_ui(locale):
     """Get the time format for the jQuery UI timepicker addon."""
     if locale == 'iso8601':
-        return 'HH:mm:ssz'  # XXX timepicker doesn't support 'ISO_8601'
+        return 'HH:mm:ssZ'
     if babel and locale:
         values = {'h': 'h', 'hh': 'hh', 'H': 'H', 'HH': 'HH',
                   'm': 'm', 'mm': 'mm', 's': 's', 'ss': 'ss'}
@@ -374 +374 @@
 
 def get_timezone_list_jquery_ui(t=None):
     """Get timezone list for jQuery timepicker addon"""
+    def utcoffset(tz, t):  # in minutes
+        offset = t.astimezone(get_timezone(tz)).utcoffset()
+        return offset.days * 24 * 60 + offset.seconds // 60
+    def label(offset):
+        if offset == 0:
+            return 'Z'
+        if offset < 0:
+            offset = -offset
+            sign = '-'
+        else:
+            sign = '+'
+        return '%s%02d:%02d' % (sign, offset // 60, offset % 60)
     t = datetime.now(utc) if t is None else utc.localize(t)
-    zones = set(t.astimezone(get_timezone(tz)).strftime('%z')
-                for tz in all_timezones)
-    return [{'value': 'Z', 'label': '+00:00'} \
-            if zone == '+0000' else zone[:-2] + ':' + zone[-2:]
-            for zone in sorted(zones, key=lambda tz: int(tz))]
+    offsets = set(utcoffset(tz, t) for tz in all_timezones)
+    return [{'value': offset, 'label': label(offset)}
+            for offset in sorted(offsets)]
 
 def get_first_week_day_jquery_ui(req):
     """Get first week day for jQuery date picker"""

trac/web/chrome.py

@@ -1379 +1379 @@
             # default timezone must be included
             'timezone_list': get_timezone_list_jquery_ui()
                              if is_iso8601
-                             else [{'value': 'Z', 'label': '+00:00'}],
+                             else [{'value': 0, 'label': 'Z'}],
             'timezone_iso8601': is_iso8601,
         })
         add_script(req, 'common/js/jquery-ui-i18n.js')

[Jun Omae]

​Timezone examples of timepicker have the same issue….

[Ryan J Ollos]

I hadn't noticed the issue with the timezone list being incorrect, displaying [object Object] for the utc entry. The patch seems to provide a minor improvement for editing the timepicker even for ISO8601 format. After the patch the cursor only moves to the end of the line when editing the timezone or entering an out-of-range value, such as 90 for the seconds field. Previously it would move the cursor to the end of the line on any edit. I made a new ticket for the issue: #12220.