[gnome-shell] calendar: Ensure clicked calendar item retains key focus

[Jasper St. Pierre <jstpierre src gnome org>]

commit 31478e9fb441d8cb8d2b45bfd84a02091b9ea4d1
Author: Tanner Doshier <doshitan gmail com>
Date:   Tue Apr 30 17:32:43 2013 -0500

    calendar: Ensure clicked calendar item retains key focus
    
    The date actors get destroyed and recreated on every date change which drops
    key focus for the selected date. Restore key focus in such a case, but only
    when the selected date was actually clicked. Whenever the next/prev month
    buttons code is used (for scrolling, mouse click, or keyboard click), have
    the corresponding button grab focus. Changing months currently causes the
    calendar to update twice as the eventSource gets changed, so key focus gets
    lost if it is on a date when the month changes.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=667434

 js/ui/calendar.js |   40 ++++++++++++++++++++++++++--------------
 1 files changed, 26 insertions(+), 14 deletions(-)
---
diff --git a/js/ui/calendar.js b/js/ui/calendar.js
index f182fe2..8b665d6 100644
--- a/js/ui/calendar.js
+++ b/js/ui/calendar.js
@@ -443,18 +443,18 @@ const Calendar = new Lang.Class({
         this.actor.add(this._topBox,
                        { row: 0, col: 0, col_span: offsetCols + 7 });
 
-        let back = new St.Button({ style_class: 'calendar-change-month-back',
-                                   can_focus: true });
-        this._topBox.add(back);
-        back.connect('clicked', Lang.bind(this, this._onPrevMonthButtonClicked));
+        this._backButton = new St.Button({ style_class: 'calendar-change-month-back',
+                                           can_focus: true });
+        this._topBox.add(this._backButton);
+        this._backButton.connect('clicked', Lang.bind(this, this._onPrevMonthButtonClicked));
 
         this._monthLabel = new St.Label({style_class: 'calendar-month-label'});
         this._topBox.add(this._monthLabel, { expand: true, x_fill: false, x_align: St.Align.MIDDLE });
 
-        let forward = new St.Button({ style_class: 'calendar-change-month-forward',
-                                      can_focus: true });
-        this._topBox.add(forward);
-        forward.connect('clicked', Lang.bind(this, this._onNextMonthButtonClicked));
+        this._forwardButton = new St.Button({ style_class: 'calendar-change-month-forward',
+                                              can_focus: true });
+        this._topBox.add(this._forwardButton);
+        this._forwardButton.connect('clicked', Lang.bind(this, this._onNextMonthButtonClicked));
 
         // Add weekday labels...
         //
@@ -513,10 +513,12 @@ const Calendar = new Lang.Class({
             }
         }
 
+        this._backButton.grab_key_focus();
+
         this.setDate(newDate, false);
-   },
+    },
 
-   _onNextMonthButtonClicked: function() {
+    _onNextMonthButtonClicked: function() {
         let newDate = new Date(this._selectedDate);
         let oldMonth = newDate.getMonth();
         if (oldMonth == 11) {
@@ -535,7 +537,9 @@ const Calendar = new Lang.Class({
             }
         }
 
-       this.setDate(newDate, false);
+        this._forwardButton.grab_key_focus();
+
+        this.setDate(newDate, false);
     },
 
     _onSettingsChange: function() {
@@ -601,8 +605,12 @@ const Calendar = new Lang.Class({
 
             let iterStr = iter.toUTCString();
             button.connect('clicked', Lang.bind(this, function() {
+                this._shouldDateGrabFocus = true;
+
                 let newlySelectedDate = new Date(iterStr);
                 this.setDate(newlySelectedDate, false);
+
+                this._shouldDateGrabFocus = false;
             }));
 
             let hasEvents = this._eventSource.hasEvents(iter);
@@ -627,9 +635,6 @@ const Calendar = new Lang.Class({
             else if (iter.getMonth() != this._selectedDate.getMonth())
                 styleClass += ' calendar-other-month-day';
 
-            if (_sameDay(this._selectedDate, iter))
-                button.add_style_pseudo_class('active');
-
             if (hasEvents)
                 styleClass += ' calendar-day-with-events'
 
@@ -639,6 +644,13 @@ const Calendar = new Lang.Class({
             this.actor.add(button,
                            { row: row, col: offsetCols + (7 + iter.getDay() - this._weekStart) % 7 });
 
+            if (_sameDay(this._selectedDate, iter)) {
+                button.add_style_pseudo_class('active');
+
+                if (this._shouldDateGrabFocus)
+                    button.grab_key_focus();
+            }
+
             if (this._useWeekdate && iter.getDay() == 4) {
                 let label = new St.Label({ text: _getCalendarWeekForDate(iter).toString(),
                                            style_class: 'calendar-day-base calendar-week-number'});