[gnome-shell] Simplify Button class by using ShellButtonBox
- From: Owen Taylor <otaylor src gnome org>
- To: svn-commits-list gnome org
- Cc:
- Subject: [gnome-shell] Simplify Button class by using ShellButtonBox
- Date: Sat, 29 Aug 2009 19:32:42 +0000 (UTC)
commit 5803aa7e65a586a4b5c90004acf1b7819f863cbd
Author: Owen W. Taylor <otaylor fishsoup net>
Date: Sat Aug 29 07:23:28 2009 -0400
Simplify Button class by using ShellButtonBox
Make Button class purely about adding visuals, and use ShellButtonBox
for behavior. API equivalences:
shell.button => shell.actor [for consistency]
staysPressed parameter to constructor => replaced by manually setting
the 'active' property of button.actor as appropriate
pressIn/release => button.actor.active = true/false
enter-event/leave-event signals => button.actor notify::hover
Along the way, this fixes a bug with the user status menu where it was
not getting set to active because the button was getting a leave
(triggered by the menu popping up and grabbing the pointer) before for
button release, which disabled the staysPressed behavior.
Reported by Michael Meeks
http://bugzilla.gnome.org/show_bug.cgi?id=593471
js/ui/button.js | 90 +++++++++++++------------------------------------------
js/ui/dash.js | 33 +++++++++-----------
js/ui/panel.js | 59 +++++++++++++++++++-----------------
3 files changed, 67 insertions(+), 115 deletions(-)
---
diff --git a/js/ui/button.js b/js/ui/button.js
index 24f897a..3cc5570 100644
--- a/js/ui/button.js
+++ b/js/ui/button.js
@@ -22,12 +22,12 @@ const DEFAULT_FONT = 'Sans Bold 16px';
// Padding on the left and right side of the button.
const SIDE_PADDING = 14;
-function Button(widget, buttonColor, pressedButtonColor, textColor, staysPressed, font) {
- this._init(widget, buttonColor, pressedButtonColor, textColor, staysPressed, font);
+function Button(widget, buttonColor, pressedButtonColor, textColor, font) {
+ this._init(widget, buttonColor, pressedButtonColor, textColor, font);
}
Button.prototype = {
- _init : function(widgetOrText, buttonColor, pressedButtonColor, textColor, staysPressed, font) {
+ _init : function(widgetOrText, buttonColor, pressedButtonColor, textColor, font) {
let me = this;
this._buttonColor = buttonColor
@@ -42,27 +42,20 @@ Button.prototype = {
if (textColor == null)
this._textColor = DEFAULT_TEXT_COLOR;
- this._staysPressed = staysPressed
- if (staysPressed == null)
- this._staysPressed = false;
-
this._font = font;
if (font == null)
this._font = DEFAULT_FONT;
- // if this._staysPressed is true, this._active will be true past the first release of a button, until a subsequent one (the button
- // is unpressed) or until release() is called explicitly
- this._active = false;
this._isBetweenPressAndRelease = false;
this._mouseIsOverButton = false;
- this.button = new Big.Box({ reactive: true,
- corner_radius: 5,
- padding_left: SIDE_PADDING,
- padding_right: SIDE_PADDING,
- orientation: Big.BoxOrientation.HORIZONTAL,
- y_align: Big.BoxAlignment.CENTER
- });
+ this.actor = new Shell.ButtonBox({ reactive: true,
+ corner_radius: 5,
+ padding_left: SIDE_PADDING,
+ padding_right: SIDE_PADDING,
+ orientation: Big.BoxOrientation.HORIZONTAL,
+ y_align: Big.BoxAlignment.CENTER
+ });
if (typeof widgetOrText == 'string') {
this._widget = new Clutter.Text({ font_name: this._font,
color: this._textColor,
@@ -71,61 +64,20 @@ Button.prototype = {
this._widget = widgetOrText;
}
- this.button.append(this._widget, Big.BoxPackFlags.EXPAND);
-
- this.button.connect('button-press-event',
- function(o, event) {
- me._isBetweenPressAndRelease = true;
- me.button.backgroundColor = me._pressedButtonColor;
- return false;
- });
- this.button.connect('button-release-event',
- function(o, event) {
- me._isBetweenPressAndRelease = false;
- if (!me._staysPressed || me._active) {
- me.release();
- } else {
- me._active = true;
- }
- return false;
- });
- this.button.connect('enter-event',
- function(o, event) {
- me._mouseIsOverButton = true;
- if (!me._active) {
- me.button.backgroundColor = me._buttonColor;
- }
- me.emit('enter-event');
- return false;
- });
- this.button.connect('leave-event',
- function(o, event) {
- me._isBetweenPressAndRelease = false;
- me._mouseIsOverButton = false;
- if (!me._active) {
- me.button.backgroundColor = null;
- }
- me.emit('leave-event');
- return false;
- });
- },
+ this.actor.append(this._widget, Big.BoxPackFlags.EXPAND);
- pressIn : function() {
- if (!this._isBetweenPressAndRelease && this._staysPressed) {
- this._active = true;
- this.button.backgroundColor = this._pressedButtonColor;
- }
+ this.actor.connect('notify::hover', Lang.bind(this, this._updateColors));
+ this.actor.connect('notify::pressed', Lang.bind(this, this._updateColors));
+ this.actor.connect('notify::active', Lang.bind(this, this._updateColors));
},
- release : function() {
- if (!this._isBetweenPressAndRelease && this._staysPressed) {
- this._active = false;
- if (this._mouseIsOverButton) {
- this.button.backgroundColor = this._buttonColor;
- } else {
- this.button.backgroundColor = null;
- }
- }
+ _updateColors : function() {
+ if (this.actor.active || this.actor.pressed)
+ this.actor.backgroundColor = this._pressedButtonColor;
+ else if (this.actor.hover)
+ this.actor.backgroundColor = this._buttonColor;
+ else
+ this.actor.backgroundColor = null;
}
};
diff --git a/js/ui/dash.js b/js/ui/dash.js
index b422d42..8854e39 100644
--- a/js/ui/dash.js
+++ b/js/ui/dash.js
@@ -460,24 +460,23 @@ SearchSectionHeader.prototype = {
this._showTooltip = true;
let button = new Button.Button(box, PRELIGHT_COLOR, BACKGROUND_COLOR,
- TEXT_COLOR, false, null);
- button.button.height = box.height;
- button.button.padding_left = DEFAULT_PADDING;
- button.button.padding_right = DEFAULT_PADDING;
-
- button.button.connect('button-release-event', onClick);
- button.connect('enter-event', Lang.bind(this, this._onButtonEntered));
- button.connect('leave-event', Lang.bind(this, this._onButtonLeft));
- this.actor = button.button;
+ TEXT_COLOR);
+ button.actor.height = box.height;
+ button.actor.padding_left = DEFAULT_PADDING;
+ button.actor.padding_right = DEFAULT_PADDING;
+
+ button.actor.connect('activate', onClick);
+ button.actor.connect('notify::hover', Lang.bind(this, this._updateTooltip));
+ this.actor = button.actor;
},
- _onButtonEntered : function() {
- if (this._showTooltip)
- this.tooltip.show();
- },
-
- _onButtonLeft : function() {
- this.tooltip.hide();
+ _updateTooltip : function(actor) {
+ if (actor.hover) {
+ if (this._showTooltip)
+ this.tooltip.show();
+ } else {
+ this.tooltip.hide();
+ }
},
setShowTooltip : function(showTooltip) {
@@ -683,7 +682,6 @@ Dash.prototype = {
Lang.bind(this,
function () {
this._toggleOnlyAppSearchShown();
- return true;
}));
this._searchResultsSection.content.append(this._appSearchHeader.actor, Big.BoxPackFlags.NONE);
this._appSearchResultArea = new ResultArea(AppDisplay.AppDisplay, false);
@@ -695,7 +693,6 @@ Dash.prototype = {
Lang.bind(this,
function () {
this._toggleOnlyDocSearchShown();
- return true;
}));
this._searchResultsSection.content.append(this._docSearchHeader.actor, Big.BoxPackFlags.NONE);
this._docSearchResultArea = new ResultArea(DocDisplay.DocDisplay, false);
diff --git a/js/ui/panel.js b/js/ui/panel.js
index 4a75056..7e3b9dc 100644
--- a/js/ui/panel.js
+++ b/js/ui/panel.js
@@ -269,10 +269,10 @@ Panel.prototype = {
/* left side */
this.button = new Button.Button(_("Activities"), PANEL_BUTTON_COLOR, PRESSED_BUTTON_BACKGROUND_COLOR,
- PANEL_FOREGROUND_COLOR, true, DEFAULT_FONT);
- this.button.button.height = PANEL_HEIGHT;
+ PANEL_FOREGROUND_COLOR, DEFAULT_FONT);
+ this.button.actor.height = PANEL_HEIGHT;
- this._leftBox.append(this.button.button, Big.BoxPackFlags.NONE);
+ this._leftBox.append(this.button.actor, Big.BoxPackFlags.NONE);
// We use this flag to mark the case where the user has entered the
// hot corner and has not left both the hot corner and a surrounding
@@ -374,43 +374,46 @@ Panel.prototype = {
let statusbutton = new Button.Button(statusbox,
PANEL_BUTTON_COLOR,
PRESSED_BUTTON_BACKGROUND_COLOR,
- PANEL_FOREGROUND_COLOR,
- true);
- statusbutton.button.height = PANEL_HEIGHT;
- statusbutton.button.connect('button-press-event', function (b, e) {
- statusmenu.toggle(e);
- return false;
- });
- // If popping up the menu failed (because there was already a grab in
- // effect from Mutter or another app), then we'll never get a ::deactivated
- // signal because the menu was never activated, so we need to unhighlight
- // separately when the user releases the mouse button.
- //
- // We depend on connection ordering; this needs to be called after Button's
- // ::button-release-event handler; that will set the active flag for this
- // stays-pressed button, then we unset the active flag by calling release().
- statusbutton.button.connect('button-release-event', function (b, e) {
- if (!statusmenu.is_active())
- statusbutton.release();
- return false;
+ PANEL_FOREGROUND_COLOR);
+ statusbutton.actor.height = PANEL_HEIGHT;
+ statusbutton.actor.connect('button-press-event', function (b, e) {
+ if (e.get_button() == 1 && e.get_click_count() == 1) {
+ statusmenu.toggle(e);
+ // The statusmenu might not pop up if it couldn't get a pointer grab
+ if (statusmenu.is_active())
+ statusbutton.actor.active = true;
+ return true;
+ } else {
+ return false;
+ }
});
- this._rightBox.append(statusbutton.button, Big.BoxPackFlags.NONE);
+ this._rightBox.append(statusbutton.actor, Big.BoxPackFlags.NONE);
// We get a deactivated event when the popup disappears
this._statusmenu.connect('deactivated', function (sm) {
- statusbutton.release();
+ statusbutton.actor.active = false;
});
// TODO: decide what to do with the rest of the panel in the Overview mode (make it fade-out, become non-reactive, etc.)
// We get into the Overview mode on button-press-event as opposed to button-release-event because eventually we'll probably
// have the Overview act like a menu that allows the user to release the mouse on the activity the user wants
// to switch to.
- this.button.button.connect('button-press-event',
- Lang.bind(Main.overview, Main.overview.toggle));
+ this.button.actor.connect('button-press-event', function(b, e) {
+ if (e.get_button() == 1 && e.get_click_count() == 1) {
+ Main.overview.toggle();
+ return true;
+ } else {
+ return false;
+ }
+ });
// In addition to pressing the button, the Overview can be entered and exited by other means, such as
// pressing the System key, Alt+F1 or Esc. We want the button to be pressed in when the Overview is entered
// and to be released when it is exited regardless of how it was triggered.
- Main.overview.connect('showing', Lang.bind(this.button, this.button.pressIn));
- Main.overview.connect('hiding', Lang.bind(this.button, this.button.release));
+ Main.overview.connect('showing', Lang.bind(this, function() {
+ this.button.actor.active = true;
+ }));
+ Main.overview.connect('hiding', Lang.bind(this, function() {
+ this.button.actor.active = false;
+ }));
Main.chrome.addActor(this.actor);
Main.chrome.setVisibleInOverview(this.actor, true);
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
