Partial update for code review

This addresses some of the comments in

 https://bugzilla.gnome.org/show_bug.cgi?id=632109#c22

Signed-off-by: David Zeuthen <davidz@redhat.com>

data/Makefile.am

@@ -25,6 +25,8 @@ dist_images_DATA =				\
 themedir = $(pkgdatadir)/theme
 dist_theme_DATA =				\
 	theme/add-workspace.svg			\
+	theme/calendar-arrow-left.svg		\
+	theme/calendar-arrow-right.svg		\
 	theme/close-window.svg			\
 	theme/close.svg				\
 	theme/corner-ripple.png			\

js/ui/calendar.js

@@ -55,89 +55,53 @@ function _getDigitWidth(actor){
     return width;
 }
 
-function _getCalendarDayAbbreviation(day_number) {
+function _getCalendarDayAbbreviation(dayNumber) {
-    let ret;
+    let abbreviations = [
-    switch (day_number) {
+        /* Translators: Calendar grid abbreviation for Sunday.
-    case 0:
+         *
-        /* Translators: Abbreviation used in calendar grid
+         * NOTE: These abbreviations are always shown together and in
-         * widget. Note: all calendar abbreviations are always shown
+         * order, e.g. "S M T W T F S".
-         * together and in order, e.g. "S M T W T F S"
          */
-        ret = _("S");
+        _("S"),
-        break;
+        /* Translators: Calendar grid abbreviation for Monday */
-
+        _("M"),
-    case 1:
+        /* Translators: Calendar grid abbreviation for Tuesday */
-        /* Translators: Calendar abbreviation for Monday */
+        _("T"),
-        ret = _("M");
+        /* Translators: Calendar grid abbreviation for Wednesday */
-        break;
+        _("W"),
-
+        /* Translators: Calendar grid abbreviation for Thursday */
-    case 2:
+        _("T"),
-        /* Translators: Calendar abbreviation for Tuesday */
+        /* Translators: Calendar grid abbreviation for Friday */
-        ret = _("T");
+        _("F"),
-        break;
+        /* Translators: Calendar grid abbreviation for Saturday */
-
+        _("S")
-    case 3:
+    ];
-        /* Translators: Calendar abbreviation for Wednesday */
+    return abbreviations[dayNumber];
-        ret = _("W");
-        break;
-
-    case 4:
-        /* Translators: Calendar abbreviation for Thursday */
-        ret = _("T");
-        break;
-
-    case 5:
-        /* Translators: Calendar abbreviation for Friday */
-        ret = _("F");
-        break;
-
-    case 6:
-        /* Translators: Calendar abbreviation for Saturday */
-        ret = _("S");
-        break;
-    }
-    return ret;
 }
 
-function _getEventDayAbbreviation(day_number) {
+function _getEventDayAbbreviation(dayNumber) {
-    let ret;
+    let abbreviations = [
-    switch (day_number) {
+        /* Translators: Event list abbreviation for Sunday.
-    case 0:
+         *
-        /* Translators: Abbreviation used in event list for Sunday */
+         * NOTE: These abbreviations are normally not shown together
-        ret = _("Su");
+         * so they need to be unique (e.g. Tuesday and Thursday cannot
-        break;
+         * both be 'T').
-
+         */
-    case 1:
+        _("Su"),
-        /* Translators: Abbreviation used in event list for Monday */
+        /* Translators: Event list abbreviation for Monday */
-        ret = _("M");
+        _("M"),
-        break;
+        /* Translators: Event list abbreviation for Tuesday */
-
+        _("T"),
-    case 2:
+        /* Translators: Event list abbreviation for Wednesday */
-        /* Translators: Abbreviation used in event list for Tuesday */
+        _("W"),
-        ret = _("T");
+        /* Translators: Event list abbreviation for Thursday */
-        break;
+        _("Th"),
-
+        /* Translators: Event list abbreviation for Friday */
-    case 3:
+        _("F"),
-        /* Translators: Abbreviation used in event list for Wednesday */
+        /* Translators: Event list abbreviation for Saturday */
-        ret = _("W");
+        _("S")
-        break;
+    ];
-
+    return abbreviations[dayNumber];
-    case 4:
-        /* Translators: Abbreviation used in event list for Thursday */
-        ret = _("Th");
-        break;
-
-    case 5:
-        /* Translators: Abbreviation used in event list for Friday */
-        ret = _("F");
-        break;
-
-    case 6:
-        /* Translators: Abbreviation used in event list for Saturday */
-        ret = _("S");
-        break;
-    }
-    return ret;
 }
 
 // ------------------------------------------------------------------------
@@ -203,7 +167,7 @@ FakeEventSource.prototype = {
 
         // '10-oclock pow-wow' is an event occuring IN THE PAST every four days at 10am
         for(let n = 0; n < 10; n++) {
-            let t = new Date(now.getTime() - n*4*86400*1000);
+            let t = new Date(now.getTime() - n * 4 * 86400 * 1000);
             t.setHours(10);
             summary = '10-oclock pow-wow (n=' + n + ')';
             this._fake_tasks.push(new CalendarTask(t, summary));
@@ -211,7 +175,7 @@ FakeEventSource.prototype = {
 
         // '11-oclock thing' is an event occuring every three days at 11am
         for(let n = 0; n < 10; n++) {
-            let t = new Date(now.getTime() + n*3*86400*1000);
+            let t = new Date(now.getTime() + n * 3 * 86400 * 1000);
             t.setHours(11);
             summary = '11-oclock thing (n=' + n + ')';
             this._fake_tasks.push(new CalendarTask(t, summary));
@@ -219,7 +183,7 @@ FakeEventSource.prototype = {
 
         // 'Weekly Meeting' is an event occuring every seven days at 1:45pm (two days displaced)
         for(let n = 0; n < 5; n++) {
-            let t = new Date(now.getTime() + (n*7+2)*86400*1000);
+            let t = new Date(now.getTime() + (n * 7 + 2) * 86400 * 1000);
             t.setHours(13);
             t.setMinutes(45);
             summary = 'Weekly Meeting (n=' + n + ')';
@@ -227,10 +191,10 @@ FakeEventSource.prototype = {
         }
 
         // 'Get Married' is an event that actually reflects reality (Dec 4, 2010) :-)
-        this._fake_tasks.push(new CalendarTask(new Date(2010,11,4,16,0), 'Get Married'));
+        this._fake_tasks.push(new CalendarTask(new Date(2010, 11, 4, 16, 0), 'Get Married'));
 
         // ditto for 'NE Patriots vs NY Jets'
-        this._fake_tasks.push(new CalendarTask(new Date(2010,11,6,20,30), 'NE Patriots vs NY Jets'));
+        this._fake_tasks.push(new CalendarTask(new Date(2010, 11, 6, 20, 30), 'NE Patriots vs NY Jets'));
 
         // An event for tomorrow @6:30pm that is added/removed every five
         // seconds (to check that the ::changed signal works)
@@ -289,13 +253,13 @@ Signals.addSignalMethods(FakeEventSource.prototype);
 
 /* ------------------------------------------------------------------------ */
 
-// @event_source is an object implementing the EventSource API, e.g. the
+// Calendar:
+// @eventSource: is an object implementing the EventSource API, e.g. the
 // getTasks(), hasTasks() methods and the ::changed signal.
+// @eventList: is the EventList object to control
 //
-// @event_list is the EventList object to control
+function Calendar(eventSource, eventList) {
-//
+    this._init(eventSource, eventList);
-function Calendar(event_source, event_list) {
-    this._init(event_source, event_list);
 }
 
 Calendar.prototype = {
@@ -303,7 +267,7 @@ Calendar.prototype = {
         this._event_source = event_source;
         this._event_list = event_list;
 
-        this._event_source.connect('changed', Lang.bind(this, this._onEventSourceChanged));
+        this._event_source.connect('changed', Lang.bind(this, this._update));
 
         // FIXME: This is actually the fallback method for GTK+ for the week start;
         // GTK+ by preference uses nl_langinfo (NL_TIME_FIRST_WEEKDAY). We probably
@@ -390,7 +354,6 @@ Calendar.prototype = {
         // We need to figure out the abbreviated localized names for the days of the week;
         // we do this by just getting the next 7 days starting from right now and then putting
         // them in the right cell in the table. It doesn't matter if we add them in order
-        //
         let iter = new Date(this.selected_date);
         iter.setSeconds(0); // Leap second protection. Hah!
         iter.setHours(12);
@@ -464,10 +427,6 @@ Calendar.prototype = {
         this._update();
     },
 
-    _onEventSourceChanged: function() {
-        this._update();
-    },
-
     _update: function() {
         this._dateLabel.text = this.selected_date.toLocaleFormat(this._headerFormat);
 
@@ -487,13 +446,9 @@ Calendar.prototype = {
         let now = new Date();
 
         let row = 2;
-        let dayButtons = [];
-        this._dayButtons = dayButtons;
         while (true) {
             let button = new St.Button({ label: iter.getDate().toString() });
 
-            dayButtons.push(button);
-
             let iterStr = iter.toUTCString();
             button.connect('clicked', Lang.bind(this, function() {
                 let newly_selected_date = new Date(iterStr);
@@ -566,18 +521,20 @@ function EventsList(event_source) {
 EventsList.prototype = {
     _init: function(event_source) {
         this.actor = new St.BoxLayout({ vertical: true, style_class: 'events-header-vbox'});
-        // FIXME: Evolution backend is currently disabled
-        // this.evolutionTasks = new EvolutionEventsSource();
-
         this._event_source = event_source;
     },
 
     _addEvent: function(dayNameBox, timeBox, eventTitleBox, includeDayName, day, time, desc) {
         if (includeDayName) {
-            dayNameBox.add(new St.Label({ style_class: 'events-day-dayname', text: day}), {x_fill: false});
+            dayNameBox.add(new St.Label( { style_class: 'events-day-dayname',
+                                           text: day } ),
+                           { x_fill: false } );
         }
-        timeBox.add(new St.Label({ style_class: 'events-day-time', text: time}), {x_fill: false});
+        timeBox.add(new St.Label( { style_class: 'events-day-time',
-        eventTitleBox.add(new St.Label({ style_class: 'events-day-task', text: desc}));
+                                    text: time} ),
+                    { x_fill: false } );
+        eventTitleBox.add(new St.Label( { style_class: 'events-day-task',
+                                          text: desc} ));
     },
 
     _addPeriod: function(header, begin, end, includeDayName) {

js/ui/dateMenu.js

@@ -11,6 +11,7 @@ const St = imports.gi.St;
 const Gettext = imports.gettext.domain('gnome-shell');
 const _ = Gettext.gettext;
 
+const Util = imports.misc.util;
 const Main = imports.ui.main;
 const PanelMenu = imports.ui.panelMenu;
 const PopupMenu = imports.ui.popupMenu;
@@ -23,10 +24,6 @@ const CLOCK_FORMAT_KEY        = 'clock-format';
 const CLOCK_SHOW_DATE_KEY     = 'show-date';
 const CLOCK_SHOW_SECONDS_KEY  = 'show-seconds';
 
-function DateMenuButton() {
-    this._init();
-}
-
 function on_vert_sep_repaint (area)
 {
     let cr = area.get_context();
@@ -51,6 +48,10 @@ function on_vert_sep_repaint (area)
     cr.fill();
 };
 
+function DateMenuButton() {
+    this._init();
+}
+
 DateMenuButton.prototype = {
     __proto__: PanelMenu.Button.prototype,
 
@@ -72,7 +73,7 @@ DateMenuButton.prototype = {
         this.menu.addActor(hbox);
 
         // Fill up the first column
-        //
+
         vbox = new St.BoxLayout({vertical: true, name: 'calendarVBox1'});
         hbox.add(vbox);
 
@@ -88,7 +89,7 @@ DateMenuButton.prototype = {
         vbox.add(this._calendar.actor);
 
         // Add vertical separator
-        //
+
         item = new St.DrawingArea({ style_class: 'calendar-vertical-separator',
                                     pseudo_class: 'highlighted' });
         item.set_width(25); // TODO: don't hard-code the width
@@ -101,7 +102,6 @@ DateMenuButton.prototype = {
         hbox.add(this._event_list.actor);
 
         // Whenever the menu is opened, select today
-        //
         this.menu.connect('open-state-changed', Lang.bind(this, function(menu, is_open) {
             if (is_open) {
                 let now = new Date();
@@ -110,31 +110,25 @@ DateMenuButton.prototype = {
         }));
 
         // Done with hbox for calendar and event list
-        //
 
         // Add separator
         item = new PopupMenu.PopupSeparatorMenuItem();
         this.menu.addMenuItem(item);
 
         // Add button to get to the Date and Time settings
-        item = new PopupMenu.PopupImageMenuItem(_("Date and Time Settings"), 'gnome-shell-clock-preferences');
+        this.menu.addAction(_("Date and Time Settings"),
-        item.connect('activate', Lang.bind(this, this._onPreferencesActivate));
+                            Lang.bind(this, this._onPreferencesActivate));
-        this.menu.addMenuItem(item);
 
         // Track changes to clock settings
         this._desktopSettings = new Gio.Settings({ schema: 'org.gnome.desktop.interface' });
         this._clockSettings = new Gio.Settings({ schema: 'org.gnome.shell.clock' });
-        this._desktopSettings.connect('changed', Lang.bind(this, this._clockSettingsChanged));
+        this._desktopSettings.connect('changed', Lang.bind(this, this._updateClockAndDate));
-        this._clockSettings.connect('changed', Lang.bind(this, this._clockSettingsChanged));
+        this._clockSettings.connect('changed', Lang.bind(this, this._updateClockAndDate));
 
         // Start the clock
         this._updateClockAndDate();
     },
 
-    _clockSettingsChanged: function() {
-        this._updateClockAndDate();
-    },
-
     _updateClockAndDate: function() {
         let format = this._desktopSettings.get_string(CLOCK_FORMAT_KEY);
         let showDate = this._clockSettings.get_boolean(CLOCK_SHOW_DATE_KEY);
@@ -199,15 +193,6 @@ DateMenuButton.prototype = {
     },
 
     _onPreferencesActivate: function() {
-        Main.overview.hide();
+        Util.spawnDesktop('gnome-datetime-panel');
-        this._spawn(['gnome-control-center', 'datetime']);
     },
-
-    _spawn: function(args) {
-        // FIXME: once Shell.Process gets support for signalling
-        // errors we should pop up an error dialog or something here
-        // on failure
-        let p = new Shell.Process({'args' : args});
-        p.run();
-    }
 };

js/ui/panel.js

@@ -493,121 +493,6 @@ AppMenuButton.prototype = {
 
 Signals.addSignalMethods(AppMenuButton.prototype);
 
-function ClockButton() {
-    this._init();
-}
-
-ClockButton.prototype = {
-    _init: function() {
-        this.actor = new St.Bin({ style_class: 'panel-button',
-                                  reactive: true,
-                                  can_focus: true,
-                                  x_fill: true,
-                                  y_fill: false,
-                                  track_hover: true });
-        this.actor._delegate = this;
-        this.actor.connect('button-press-event',
-                           Lang.bind(this, this._toggleCalendar));
-
-        this._clock = new St.Label();
-        this.actor.set_child(this._clock);
-
-        this._calendarPopup = null;
-
-        this._desktopSettings = new Gio.Settings({ schema: 'org.gnome.desktop.interface' });
-        this._clockSettings = new Gio.Settings({ schema: 'org.gnome.shell.clock' });
-
-        this._desktopSettings.connect('changed', Lang.bind(this, this._updateClock));
-        this._clockSettings.connect('changed', Lang.bind(this, this._updateClock));
-
-        // Start the clock
-        this._updateClock();
-    },
-
-    closeCalendar: function() {
-        if (!this._calendarPopup || !this._calendarPopup.isOpen)
-            return;
-
-        this._calendarPopup.hide();
-
-        this.actor.remove_style_pseudo_class('pressed');
-    },
-
-    openCalendar: function() {
-        this._calendarPopup.show();
-
-        this.actor.add_style_pseudo_class('pressed');
-    },
-
-    _toggleCalendar: function() {
-        if (this._calendarPopup == null) {
-            this._calendarPopup = new CalendarPopup();
-            this._calendarPopup.actor.hide();
-        }
-
-        if (!this._calendarPopup.isOpen)
-            this.openCalendar();
-        else
-            this.closeCalendar();
-    },
-
-    _updateClock: function() {
-        let format = this._desktopSettings.get_string(CLOCK_FORMAT_KEY);
-        let showDate = this._clockSettings.get_boolean(CLOCK_SHOW_DATE_KEY);
-        let showSeconds = this._clockSettings.get_boolean(CLOCK_SHOW_SECONDS_KEY);
-
-        let clockFormat;
-        switch (format) {
-            case '24h':
-                if (showDate)
-	            /* Translators: This is the time format with date used
-                       in 24-hour mode. */
-                    clockFormat = showSeconds ? _("%a %b %e, %R:%S")
-                                              : _("%a %b %e, %R");
-                else
-	            /* Translators: This is the time format without date used
-                       in 24-hour mode. */
-                    clockFormat = showSeconds ? _("%a %R:%S")
-                                              : _("%a %R");
-                break;
-            case '12h':
-            default:
-                if (showDate)
-	            /* Translators: This is a time format with date used
-                       for AM/PM. */
-                    clockFormat = showSeconds ? _("%a %b %e, %l:%M:%S %p")
-                                              : _("%a %b %e, %l:%M %p");
-                else
-	            /* Translators: This is a time format without date used
-                       for AM/PM. */
-                    clockFormat = showSeconds ? _("%a %l:%M:%S %p")
-                                              : _("%a %l:%M %p");
-                break;
-        }
-
-        let displayDate = new Date();
-        let msecRemaining;
-        if (showSeconds) {
-            msecRemaining = 1000 - displayDate.getMilliseconds();
-            if (msecRemaining < 50) {
-                displayDate.setSeconds(displayDate.getSeconds() + 1);
-                msecRemaining += 1000;
-            }
-        } else {
-            msecRemaining = 60000 - (1000 * displayDate.getSeconds() +
-                                     displayDate.getMilliseconds());
-            if (msecRemaining < 500) {
-                displayDate.setMinutes(displayDate.getMinutes() + 1);
-                msecRemaining += 60000;
-            }
-        }
-
-        this._clock.set_text(displayDate.toLocaleFormat(clockFormat));
-        Mainloop.timeout_add(msecRemaining, Lang.bind(this, this._updateClock));
-        return false;
-    }
-};
-
 function Panel() {
     this._init();
 }