[gnome-shell] panelMenu: add a gap between the panel and its menus

[Dan Winship <danw src gnome org>]

commit 2403fd06804d8748938c85ef87eb6e9f361bc350
Author: Dan Winship <danw gnome org>
Date:   Sat Jul 30 13:24:24 2011 -0400

    panelMenu: add a gap between the panel and its menus
    
    The specs call for a 2 pixel gap between the panel and its menus,
    though we need to specify this as 4 pixels, since it's relative to the
    bottom of the icon/title, not the bottom of the panel (up until now,
    the point of the menu arrow was actually overlapping the menu's
    highlight underline).
    
    Also, move the gap specification into the CSS, since it makes more
    sense there.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=655627

 data/theme/gnome-shell.css |    4 ++++
 js/ui/appDisplay.js        |    2 +-
 js/ui/boxpointer.js        |   12 +++++++-----
 js/ui/panelMenu.js         |    3 ++-
 js/ui/popupMenu.js         |    5 ++---
 5 files changed, 16 insertions(+), 10 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 89fbbec..4199e54 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -321,6 +321,10 @@ StTooltip StLabel {
     icon-shadow: black 0px 2px 2px;
 }
 
+.panel-menu {
+    -boxpointer-gap: 4px
+}
+
 /* The rounded panel corners we draw don't
  * support transitions, so disable transitions
  * for the buttons at the left/right edges
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index 992a954..811695d 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -609,7 +609,7 @@ AppIconMenu.prototype = {
         if (St.Widget.get_default_direction() == St.TextDirection.RTL)
             side = St.Side.RIGHT;
 
-        PopupMenu.PopupMenu.prototype._init.call(this, source.actor, 0.5, side, 0);
+        PopupMenu.PopupMenu.prototype._init.call(this, source.actor, 0.5, side);
 
         // We want to keep the item hovered while the menu is up
         this.blockSourceEvents = true;
diff --git a/js/ui/boxpointer.js b/js/ui/boxpointer.js
index 7051848..1523ef6 100644
--- a/js/ui/boxpointer.js
+++ b/js/ui/boxpointer.js
@@ -180,7 +180,7 @@ BoxPointer.prototype = {
         this.bin.allocate(childBox, flags);
 
         if (this._sourceActor && this._sourceActor.mapped)
-            this._reposition(this._sourceActor, this._gap, this._alignment);
+            this._reposition(this._sourceActor, this._alignment);
     },
 
     _drawBorder: function(area) {
@@ -306,19 +306,18 @@ BoxPointer.prototype = {
         cr.stroke();
     },
 
-    setPosition: function(sourceActor, gap, alignment) {
+    setPosition: function(sourceActor, alignment) {
         // We need to show it now to force an allocation,
         // so that we can query the correct size.
         this.actor.show();
 
         this._sourceActor = sourceActor;
-        this._gap = gap;
         this._alignment = alignment;
 
-        this._reposition(sourceActor, gap, alignment);
+        this._reposition(sourceActor, alignment);
     },
 
-    _reposition: function(sourceActor, gap, alignment) {
+    _reposition: function(sourceActor, alignment) {
         // Position correctly relative to the sourceActor
         let sourceNode = sourceActor.get_theme_node();
         let sourceContentBox = sourceNode.get_content_box(sourceActor.get_allocation_box());
@@ -338,6 +337,9 @@ BoxPointer.prototype = {
         let margin = (4 * borderRadius + borderWidth + arrowBase);
         let halfMargin = margin / 2;
 
+        let themeNode = this.actor.get_theme_node();
+        let gap = themeNode.get_length('-boxpointer-gap');
+
         let resX, resY;
 
         switch (this._arrowSide) {
diff --git a/js/ui/panelMenu.js b/js/ui/panelMenu.js
index dd559ca..6cb96e2 100644
--- a/js/ui/panelMenu.js
+++ b/js/ui/panelMenu.js
@@ -23,7 +23,8 @@ Button.prototype = {
         this.actor._delegate = this;
         this.actor.connect('button-press-event', Lang.bind(this, this._onButtonPress));
         this.actor.connect('key-press-event', Lang.bind(this, this._onSourceKeyPress));
-        this.menu = new PopupMenu.PopupMenu(this.actor, menuAlignment, St.Side.TOP, 0);
+        this.menu = new PopupMenu.PopupMenu(this.actor, menuAlignment, St.Side.TOP);
+        this.menu.actor.add_style_class_name('panel-menu');
         this.menu.connect('open-state-changed', Lang.bind(this, this._onOpenStateChanged));
         this.menu.actor.connect('key-press-event', Lang.bind(this, this._onMenuKeyPress));
         Main.chrome.addActor(this.menu.actor, { affectsStruts: false });
diff --git a/js/ui/popupMenu.js b/js/ui/popupMenu.js
index 9e256b5..9ee304d 100644
--- a/js/ui/popupMenu.js
+++ b/js/ui/popupMenu.js
@@ -985,12 +985,11 @@ function PopupMenu() {
 PopupMenu.prototype = {
     __proto__: PopupMenuBase.prototype,
 
-    _init: function(sourceActor, alignment, arrowSide, gap) {
+    _init: function(sourceActor, alignment, arrowSide) {
         PopupMenuBase.prototype._init.call (this, sourceActor, 'popup-menu-content');
 
         this._alignment = alignment;
         this._arrowSide = arrowSide;
-        this._gap = gap;
 
         this._boxPointer = new BoxPointer.BoxPointer(arrowSide,
                                                      { x_fill: true,
@@ -1048,7 +1047,7 @@ PopupMenu.prototype = {
 
         this.isOpen = true;
 
-        this._boxPointer.setPosition(this.sourceActor, this._gap, this._alignment);
+        this._boxPointer.setPosition(this.sourceActor, this._alignment);
         this._boxPointer.show(animate);
 
         this.emit('open-state-changed', true);