[gnome-shell] messageTray: Put the notification widget in the center

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

commit d721fc2c17c480c38608540f61b4c34a399dda16
Author: Jasper St. Pierre <jstpierre mecheye net>
Date:   Mon Aug 20 16:32:10 2012 -0400

    messageTray: Put the notification widget in the center
    
    Rather than stretching the entire screen length
    
    https://bugzilla.gnome.org/show_bug.cgi?id=682253

 data/theme/gnome-shell.css |    5 ++++-
 js/ui/messageTray.js       |   17 ++++++++++-------
 2 files changed, 14 insertions(+), 8 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 03ca095..cfdefd8 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -1183,12 +1183,15 @@ StButton.popup-menu-item:insensitive {
 }
 
 .notification {
-    font-size: 11pt;
     border-radius: 10px 10px 0px 0px;
     background: rgba(0,0,0,0.8);
     padding: 8px 8px 4px 8px;
     spacing-rows: 10px;
     spacing-columns: 10px;
+}
+
+.notification, #notification-container {
+    font-size: 11pt;
     width: 34em;
 }
 
diff --git a/js/ui/messageTray.js b/js/ui/messageTray.js
index c59f6e2..95044a1 100644
--- a/js/ui/messageTray.js
+++ b/js/ui/messageTray.js
@@ -1352,9 +1352,11 @@ const MessageTray = new Lang.Class({
         this.actor = new St.Widget({ name: 'message-tray',
                                      reactive: true,
                                      track_hover: true });
+        this.actor.connect('style-changed', Lang.bind(this, this._onStyleChanged));
         this.actor.connect('notify::hover', Lang.bind(this, this._onTrayHoverChanged));
 
-        this._notificationWidget = new St.Widget({ layout_manager: new Clutter.BinLayout() });
+        this._notificationWidget = new St.Widget({ name: 'notification-container',
+                                                   layout_manager: new Clutter.BinLayout() });
         this.actor.add_actor(this._notificationWidget);
 
         this._notificationBin = new St.Bin();
@@ -1455,11 +1457,11 @@ const MessageTray = new Lang.Class({
         Main.layoutManager.trackChrome(this._notificationWidget);
         Main.layoutManager.trackChrome(this._closeButton);
 
-        Main.layoutManager.connect('monitors-changed', Lang.bind(this, this._setSizePosition));
+        Main.layoutManager.connect('monitors-changed', Lang.bind(this, function() {
+            this.actor.style_changed();
+        }));
         Main.layoutManager.connect('primary-fullscreen-changed', Lang.bind(this, this._onFullscreenChanged));
 
-        this._setSizePosition();
-
         Main.overview.connect('showing', Lang.bind(this,
             function() {
                 this._overviewVisible = true;
@@ -1499,10 +1501,11 @@ const MessageTray = new Lang.Class({
         this._updateState();
     },
 
-    _setSizePosition: function() {
+    _onStyleChanged: function() {
         let monitor = Main.layoutManager.bottomMonitor;
-        this._notificationWidget.x = 0;
-        this._notificationWidget.width = monitor.width;
+
+        let width = this._notificationWidget.get_width();
+        this._notificationWidget.x = Math.floor((monitor.width - width) / 2);
         this._summaryBin.x = 0;
         this._summaryBin.width = monitor.width;