isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

messageTray: Add notification close button inside notification

Browse Source 
And remove the old close button outside it.
This commit is contained in:
Jasper St. Pierre 2014-06-03 14:55:57 -04:00
parent fa350bf41e
commit ef1ab043a3
2 changed files with 27 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
data/theme/gnome-shell.css
View File

@ -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);
}

56
js/ui/messageTray.js
View File

@ -493,12 +493,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 |
@ -516,7 +516,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;
@ -525,8 +525,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();
@ -803,7 +812,6 @@ const Notification = new Lang.Class({
expand: function(animate) {
this.expanded = true;
this._sync();
this.emit('expanded');
},
collapseCompleted: function() {
@ -820,6 +828,10 @@ const Notification = new Lang.Class({
this.destroy();
},
_onCloseClicked: function() {
this.destroy();
},
_onDestroy: function() {
if (this._destroyed)
return;
@ -1522,11 +1534,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();
@ -1557,7 +1564,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;
@ -1581,7 +1587,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));
@ -1733,14 +1738,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);
},
@ -2397,10 +2394,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;
@ -2436,7 +2429,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;
@ -2451,10 +2443,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);
@ -2463,10 +2451,6 @@ const MessageTray = new Lang.Class({
this._ensureNotificationFocused();
},
_onNotificationExpanded: function() {
this._closeButton.show();
},
_ensureNotificationFocused: function() {
this._notificationFocusGrabber.grabFocus();
},