[gnome-shell/wip/fmuellner/notification-redux+sass: 105/141] dateMenu: Freeze popup size while browsing

[Florian Müllner <fmuellner src gnome org>]

commit 8070aef92310a4632dc12e6b4410c89ae633dbb6
Author: Florian Müllner <fmuellner gnome org>
Date:   Fri Feb 13 16:25:21 2015 +0100

    dateMenu: Freeze popup size while browsing
    
    As the popup's height depends on its content, which itself varies
    depending on the selected day, browsing the calendar can result
    in distracting size changes. To avoid this, the design calls for
    the height to be frozen to the previous one in that case.
    As the popup will always open with the current day selected, we
    don't have to be very sophisticated and can just lock the popup
    to the height corresponding to that day.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=744817

 js/ui/dateMenu.js |   57 ++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 48 insertions(+), 9 deletions(-)
---
diff --git a/js/ui/dateMenu.js b/js/ui/dateMenu.js
index 60d29ce..4e88411 100644
--- a/js/ui/dateMenu.js
+++ b/js/ui/dateMenu.js
@@ -21,6 +21,13 @@ const PanelMenu = imports.ui.panelMenu;
 const PopupMenu = imports.ui.popupMenu;
 const Calendar = imports.ui.calendar;
 
+function _isToday(date) {
+    let now = new Date();
+    return now.getYear() == date.getYear() &&
+           now.getMonth() == date.getMonth() &&
+           now.getDate() == date.getDate();
+}
+
 const TodayButton = new Lang.Class({
     Name: 'TodayButton',
 
@@ -52,7 +59,7 @@ const TodayButton = new Lang.Class({
             function(calendar, date) {
                 // Make the button reactive only if the selected date is not the
                 // current date.
-                this.actor.can_focus = this.actor.reactive = !this._isToday(date)
+                this.actor.can_focus = this.actor.reactive = !_isToday(date)
             }));
     },
 
@@ -71,13 +78,6 @@ const TodayButton = new Lang.Class({
          */
         let dateFormat = Shell.util_translate_time_string (N_("%A %B %e %Y"));
         this.actor.accessible_name = date.toLocaleFormat(dateFormat);
-    },
-
-    _isToday: function(date) {
-        let now = new Date();
-        return now.getYear() == date.getYear() &&
-               now.getMonth() == date.getMonth() &&
-               now.getDate() == date.getDate();
     }
 });
 
@@ -220,6 +220,40 @@ const WorldClocksSection = new Lang.Class({
     }
 });
 
+const FreezableBinLayout = new Lang.Class({
+    Name: 'FreezableBinLayout',
+    Extends: Clutter.BinLayout,
+
+    _init: function() {
+        this.parent();
+
+        this._frozen = false;
+        this._savedWidth = [NaN, NaN];
+        this._savedHeight = [NaN, NaN];
+    },
+
+    set frozen(v) {
+        if (this._frozen == v)
+            return;
+
+        this._frozen = v;
+        if (!this._frozen)
+            this.layout_changed();
+    },
+
+    vfunc_get_preferred_width: function(container, forHeight) {
+        if (!this._frozen || this._savedWidth.some(isNaN))
+            this._savedWidth = this.parent(container, forHeight);
+        return this._savedWidth;
+    },
+
+    vfunc_get_preferred_height: function(container, forWidth) {
+        if (!this._frozen || this._savedHeight.some(isNaN))
+            this._savedHeight = this.parent(container, forWidth);
+        return this._savedHeight;
+    }
+});
+
 const DateMenuButton = new Lang.Class({
     Name: 'DateMenuButton',
     Extends: PanelMenu.Button,
@@ -239,12 +273,17 @@ const DateMenuButton = new Lang.Class({
         this.actor.add_actor(this._clockDisplay);
         this.actor.add_style_class_name ('clock-display');
 
+        let layout = new FreezableBinLayout();
+        let bin = new St.Widget({ layout_manager: layout });
+        this.menu.box.add_child(bin);
+
         hbox = new St.BoxLayout({ name: 'calendarArea' });
-        this.menu.box.add_child(hbox);
+        bin.add_actor(hbox);
 
         this._calendar = new Calendar.Calendar();
         this._calendar.connect('selected-date-changed',
                                Lang.bind(this, function(calendar, date) {
+                                   layout.frozen = !_isToday(date);
                                    this._messageList.setDate(date);
                                }));