Author: julien Date: 2011-10-21 20:38:10 -0700 (Fri, 21 Oct 2011) New Revision: 17021
Modified: django/trunk/django/contrib/admin/static/admin/css/widgets.css django/trunk/django/contrib/admin/static/admin/js/admin/DateTimeShortcuts.js Log: Fixed #17064 -- Improved the UX for the admin's time and date picker widgets by brushing up the 'Cancel' button's visual feedback and by allowing the popups to get closed by pressing the 'Escape' key. Modified: django/trunk/django/contrib/admin/static/admin/css/widgets.css =================================================================== --- django/trunk/django/contrib/admin/static/admin/css/widgets.css 2011-10-21 23:38:52 UTC (rev 17020) +++ django/trunk/django/contrib/admin/static/admin/css/widgets.css 2011-10-22 03:38:10 UTC (rev 17021) @@ -379,15 +379,19 @@ .calendar-cancel { margin: 0 !important; - padding: 0; + padding: 0 !important; font-size: 10px; background: #e1e1e1 url(../img/nav-bg.gif) 0 50% repeat-x; border-top: 1px solid #ddd; } +.calendar-cancel:hover { + background: #e1e1e1 url(../img/nav-bg-reverse.gif) 0 50% repeat-x; +} + .calendar-cancel a { - padding: 2px; - color: #999; + color: black; + display: block; } ul.timelist, .timelist li { Modified: django/trunk/django/contrib/admin/static/admin/js/admin/DateTimeShortcuts.js =================================================================== --- django/trunk/django/contrib/admin/static/admin/js/admin/DateTimeShortcuts.js 2011-10-21 23:38:52 UTC (rev 17020) +++ django/trunk/django/contrib/admin/static/admin/js/admin/DateTimeShortcuts.js 2011-10-22 03:38:10 UTC (rev 17021) @@ -79,17 +79,24 @@ addEvent(clock_box, 'click', DateTimeShortcuts.cancelEventPropagation); quickElement('h2', clock_box, gettext('Choose a time')); - time_list = quickElement('ul', clock_box, ''); + var time_list = quickElement('ul', clock_box, ''); time_list.className = 'timelist'; - time_format = get_format('TIME_INPUT_FORMATS')[0]; + var time_format = get_format('TIME_INPUT_FORMATS')[0]; quickElement("a", quickElement("li", time_list, ""), gettext("Now"), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date().strftime('" + time_format + "'));"); quickElement("a", quickElement("li", time_list, ""), gettext("Midnight"), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date(1970,1,1,0,0,0,0).strftime('" + time_format + "'));"); quickElement("a", quickElement("li", time_list, ""), gettext("6 a.m."), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date(1970,1,1,6,0,0,0).strftime('" + time_format + "'));"); quickElement("a", quickElement("li", time_list, ""), gettext("Noon"), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date(1970,1,1,12,0,0,0).strftime('" + time_format + "'));"); - cancel_p = quickElement('p', clock_box, ''); + var cancel_p = quickElement('p', clock_box, ''); cancel_p.className = 'calendar-cancel'; quickElement('a', cancel_p, gettext('Cancel'), 'href', 'javascript:DateTimeShortcuts.dismissClock(' + num + ');'); + django.jQuery(document).bind('keyup', function(event) { + if (event.which == 27) { + // ESC key closes popup + DateTimeShortcuts.dismissClock(num); + event.preventDefault(); + } + }); }, openClock: function(num) { var clock_box = document.getElementById(DateTimeShortcuts.clockDivName+num) @@ -195,6 +202,13 @@ var cancel_p = quickElement('p', cal_box, ''); cancel_p.className = 'calendar-cancel'; quickElement('a', cancel_p, gettext('Cancel'), 'href', 'javascript:DateTimeShortcuts.dismissCalendar(' + num + ');'); + django.jQuery(document).bind('keyup', function(event) { + if (event.which == 27) { + // ESC key closes popup + DateTimeShortcuts.dismissCalendar(num); + event.preventDefault(); + } + }); }, openCalendar: function(num) { var cal_box = document.getElementById(DateTimeShortcuts.calendarDivName1+num) -- You received this message because you are subscribed to the Google Groups "Django updates" group. To post to this group, send email to django-updates@googlegroups.com. To unsubscribe from this group, send email to django-updates+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/django-updates?hl=en.