From 31478e9fb441d8cb8d2b45bfd84a02091b9ea4d1 Mon Sep 17 00:00:00 2001
From: Tanner Doshier <doshitan@gmail.com>
Date: Tue, 30 Apr 2013 17:32:43 -0500
Subject: [PATCH] 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 | 42 +++++++++++++++++++++++++++---------------
 1 file changed, 27 insertions(+), 15 deletions(-)

diff --git a/js/ui/calendar.js b/js/ui/calendar.js
index f182fe27c..8b665d62d 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.setDate(newDate, false);
-   },
+        this._backButton.grab_key_focus();
 
-   _onNextMonthButtonClicked: function() {
+        this.setDate(newDate, false);
+    },
+
+    _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'});