[gnome-shell/wip/notif-banner-relayout: 11/12] messageTray: Add notification close button inside notification
- From: Jasper St. Pierre <jstpierre src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell/wip/notif-banner-relayout: 11/12] messageTray: Add notification close button inside notification
- Date: Wed, 4 Jun 2014 18:28:25 +0000 (UTC)
commit 50421ede37eff25f0b595e4b461b49fdfe3a5cb1
Author: Jasper St. Pierre <jstpierre mecheye net>
Date: Tue Jun 3 14:55:57 2014 -0400
messageTray: Add notification close button inside notification
And remove the old close button outside it.
data/theme/gnome-shell.css | 8 +++++-
js/ui/messageTray.js | 56 +++++++++++++++----------------------------
2 files changed, 27 insertions(+), 37 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 33dc271..f626e08 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -1540,6 +1540,11 @@ StScrollBar StButton#vhandle:active {
spacing: 8px;
}
+.notification-close-button {
+ padding: 8px;
+ border-radius: 4px;
+}
+
.notification-action-area {
padding: 8px;
}
@@ -1555,7 +1560,8 @@ StScrollBar StButton#vhandle:active {
}
.notification-main-button:hover,
-.notification-button:hover {
+.notification-button:hover,
+.notification-close-button:hover {
background: rgba(100,100,100,0.9);
}
diff --git a/js/ui/messageTray.js b/js/ui/messageTray.js
index 692cc69..5de0808 100644
--- a/js/ui/messageTray.js
+++ b/js/ui/messageTray.js
@@ -494,12 +494,12 @@ const Notification = new Lang.Class({
// ,. this._iconBin ,. this._titleLabel
// | ,-- this._second|ryIconBin
// .----|--------|---------------|-----------.
- // | .----. | .----.-----------------------. |
- // | | | | | | |--- this._titleBox
- // | '....' | '....'.......................' |
- // | | |- this._hbox
- // | | this._bodyBin |-.
- // |________|________________________________| |- this.actor
+ // | .----. | .----.-------------------. | X |
+ // | | | | | | |-|----- this._titleBox
+ // | '....' | '....'...................' | |
+ // | | | |- this._hbox
+ // | | this._bodyBin | |-.
+ // |________|____________________________|___| |- this.actor
// | this._actionArea |-'
// |_________________________________________|
// | this._buttonBox |
@@ -517,7 +517,7 @@ const Notification = new Lang.Class({
this._mainButton.connect('clicked', Lang.bind(this, this._onClicked));
this.actor.add_child(this._mainButton);
- // Separates the icon and title/body
+ // Separates the icon, title/body and close button
this._hbox = new St.BoxLayout({ style_class: 'notification-main-content' });
this._mainButton.child = this._hbox;
@@ -526,8 +526,17 @@ const Notification = new Lang.Class({
this._titleBodyBox = new St.BoxLayout({ style_class: 'notification-title-body-box',
vertical: true });
+ this._titleBodyBox.set_x_expand(true);
this._hbox.add_child(this._titleBodyBox);
+ this._closeButton = new St.Button({ style_class: 'notification-close-button',
+ can_focus: true });
+ this._closeButton.set_y_align(Clutter.ActorAlign.START);
+ this._closeButton.set_y_expand(true);
+ this._closeButton.child = new St.Icon({ icon_name: 'window-close-symbolic', icon_size: 16 });
+ this._closeButton.connect('clicked', Lang.bind(this, this._onCloseClicked));
+ this._hbox.add_child(this._closeButton);
+
this._titleBox = new St.BoxLayout({ style_class: 'notification-title-box',
x_expand: true, x_align: Clutter.ActorAlign.START });
this._secondaryIconBin = new St.Bin();
@@ -804,7 +813,6 @@ const Notification = new Lang.Class({
expand: function(animate) {
this.expanded = true;
this._sync();
- this.emit('expanded');
},
collapseCompleted: function() {
@@ -821,6 +829,10 @@ const Notification = new Lang.Class({
this.destroy();
},
+ _onCloseClicked: function() {
+ this.destroy();
+ },
+
_onDestroy: function() {
if (this._destroyed)
return;
@@ -1523,11 +1535,6 @@ const MessageTray = new Lang.Class({
this._clickedSummaryItemMouseButton = -1;
this._clickedSummaryItemAllocationChangedId = 0;
- this._closeButton = Util.makeCloseButton();
- this._closeButton.hide();
- this._closeButton.connect('clicked', Lang.bind(this, this._closeNotification));
- this._notificationWidget.add_actor(this._closeButton);
-
this._userActiveWhileNotificationShown = false;
this.idleMonitor = Meta.IdleMonitor.get_core();
@@ -1558,7 +1565,6 @@ const MessageTray = new Lang.Class({
this._keyboardVisible = false;
this._notificationState = State.HIDDEN;
this._notificationTimeoutId = 0;
- this._notificationExpandedId = 0;
this._summaryBoxPointerState = State.HIDDEN;
this._summaryBoxPointerTimeoutId = 0;
this._desktopCloneState = State.HIDDEN;
@@ -1582,7 +1588,6 @@ const MessageTray = new Lang.Class({
Main.layoutManager.trayBox.add_actor(this._notificationWidget);
Main.layoutManager.trackChrome(this.actor);
Main.layoutManager.trackChrome(this._notificationWidget);
- Main.layoutManager.trackChrome(this._closeButton);
global.screen.connect('in-fullscreen-changed', Lang.bind(this, this._updateState));
Main.layoutManager.connect('hot-corners-changed', Lang.bind(this, this._hotCornersChanged));
@@ -1734,14 +1739,6 @@ const MessageTray = new Lang.Class({
this._updateState();
},
- _closeNotification: function() {
- if (this._notificationState == State.SHOWN) {
- this._closeButton.hide();
- this._notification.emit('done-displaying');
- this._notification.destroy();
- }
- },
-
contains: function(source) {
return this._sources.has(source);
},
@@ -2398,10 +2395,6 @@ const MessageTray = new Lang.Class({
_hideNotification: function(animate) {
this._notificationFocusGrabber.ungrabFocus();
- if (this._notificationExpandedId) {
- this._notification.disconnect(this._notificationExpandedId);
- this._notificationExpandedId = 0;
- }
if (this._notificationClickedId) {
this._notification.disconnect(this._notificationClickedId);
this._notificationClickedId = 0;
@@ -2437,7 +2430,6 @@ const MessageTray = new Lang.Class({
if (notification.isTransient)
notification.destroy(NotificationDestroyedReason.EXPIRED);
- this._closeButton.hide();
this._pointerInNotification = false;
this._notificationRemoved = false;
this._notificationBin.child = null;
@@ -2452,10 +2444,6 @@ const MessageTray = new Lang.Class({
},
_expandNotification: function(autoExpanding) {
- if (!this._notificationExpandedId)
- this._notificationExpandedId =
- this._notification.connect('expanded',
- Lang.bind(this, this._onNotificationExpanded));
// Don't animate changes in notifications that are auto-expanding.
this._notification.expand(!autoExpanding);
@@ -2464,10 +2452,6 @@ const MessageTray = new Lang.Class({
this._ensureNotificationFocused();
},
- _onNotificationExpanded: function() {
- this._closeButton.show();
- },
-
_ensureNotificationFocused: function() {
this._notificationFocusGrabber.grabFocus();
},
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]