From 738fc375c03fd59000207688cd158d6e409c248c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Florian=20M=C3=BCllner?= Date: Thu, 22 Jul 2010 17:49:43 +0200 Subject: [PATCH] overview: Replace InfoBar with message tray notifications The layout of recent mockups occupies the space previously reserved for the info bar with the view selector. As the bar's purpose is mainly to provide the user with feedback, it makes sense to use the existing message tray facility instead of moving the bar elsewhere. https://bugzilla.gnome.org/show_bug.cgi?id=634948 --- data/theme/gnome-shell.css | 17 ------ js/ui/appFavorites.js | 4 +- js/ui/overview.js | 114 ++++++++++++++++++------------------- js/ui/placeDisplay.js | 2 +- js/ui/workspacesView.js | 4 +- 5 files changed, 59 insertions(+), 82 deletions(-) diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index f736a4974..0a62039c8 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -261,23 +261,6 @@ StTooltip StLabel { background-color: #111; } -.info-bar { - color: #fff; - font-size: 14px; - spacing: 20px; -} - -.info-bar-link-button { - background-color: #2d2d2d; - padding: 2px 14px; - border-radius: 10px; - border: 1px solid #181818; -} - -.info-bar-link-button:hover { - border: 1px solid #666666; -} - .new-workspace-area { border: 2px solid rgba(255, 255, 255, 0.8); border-radius: 10px; diff --git a/js/ui/appFavorites.js b/js/ui/appFavorites.js index 2a20123da..9c050ee4a 100644 --- a/js/ui/appFavorites.js +++ b/js/ui/appFavorites.js @@ -85,7 +85,7 @@ AppFavorites.prototype = { let app = Shell.AppSystem.get_default().get_app(appId); - Main.overview.infoBar.setMessage(_("%s has been added to your favorites.").format(app.get_name()), Lang.bind(this, function () { + Main.overview.shellInfo.setMessage(_("%s has been added to your favorites.").format(app.get_name()), Lang.bind(this, function () { this._removeFavorite(appId); })); }, @@ -104,7 +104,7 @@ AppFavorites.prototype = { if (!this._removeFavorite(appId)) return; - Main.overview.infoBar.setMessage(_("%s has been removed from your favorites.").format(app.get_name()), + Main.overview.shellInfo.setMessage(_("%s has been removed from your favorites.").format(app.get_name()), Lang.bind(this, function () { this._addFavorite(appId); })); diff --git a/js/ui/overview.js b/js/ui/overview.js index abf595352..bec99c707 100644 --- a/js/ui/overview.js +++ b/js/ui/overview.js @@ -11,6 +11,7 @@ const _ = Gettext.gettext; const GenericDisplay = imports.ui.genericDisplay; const Lightbox = imports.ui.lightbox; const Main = imports.ui.main; +const MessageTray = imports.ui.messageTray; const Panel = imports.ui.panel; const Dash = imports.ui.dash; const Tweener = imports.ui.tweener; @@ -71,41 +72,45 @@ const SHADOW_WIDTH = 6; const NUMBER_OF_SECTIONS_IN_SEARCH = 2; -const INFO_BAR_HIDE_TIMEOUT = 10; +const SHELL_INFO_HIDE_TIMEOUT = 10; let wideScreen = false; let displayGridColumnWidth = null; let displayGridRowHeight = null; -function InfoBar() { +function Source() { this._init(); } -InfoBar.prototype = { +Source.prototype = { + __proto__: MessageTray.Source.prototype, + _init: function() { - this.actor = new St.Bin({ style_class: 'info-bar-panel', - x_fill: true, - y_fill: false }); - this._label = new St.Label(); - this._undo = new St.Button({ style_class: 'info-bar-link-button' }); + MessageTray.Source.prototype._init.call(this, + "System Information"); + this._setSummaryIcon(this.createNotificationIcon()); + }, - let bin = new St.Bin({ x_fill: false, - y_fill: false, - x_align: St.Align.MIDDLE, - y_align: St.Align.MIDDLE }); - this.actor.set_child(bin); + createNotificationIcon: function() { + return new St.Icon({ icon_name: 'info', + icon_type: St.IconType.FULLCOLOR, + icon_size: this.ICON_SIZE }); + }, - let box = new St.BoxLayout({ style_class: 'info-bar' }); - bin.set_child(box); + _notificationClicked: function() { + this.destroy(); + } +} + +function ShellInfo() { + this._init(); +} + +ShellInfo.prototype = { + _init: function() { + this._source = null; this._timeoutId = 0; - - box.add(this._label, {'y-fill' : false, 'y-align' : St.Align.MIDDLE}); - box.add(this._undo); - - this.actor.set_opacity(0); - this._undoCallback = null; - this._undo.connect('clicked', Lang.bind(this, this._onUndoClicked)); }, _onUndoClicked: function() { @@ -114,27 +119,16 @@ InfoBar.prototype = { if (this._undoCallback) this._undoCallback(); - this.actor.set_opacity(0); this._undoCallback = null; - }, - _hideDone: function() { - this._undoCallback = null; - }, - - _hide: function() { - Tweener.addTween(this.actor, - { opacity: 0, - transition: 'easeOutQuad', - time: ANIMATION_TIME, - onComplete: this._hideDone, - onCompleteScope: this - }); + if (this._source) + this._source.destroy(); }, _onTimeout: function() { this._timeoutId = 0; - this._hide(); + if (this._source) + this._source.destroy(); return false; }, @@ -142,28 +136,33 @@ InfoBar.prototype = { if (this._timeoutId) Mainloop.source_remove(this._timeoutId); - this._timeout = false; + this._timeoutId = Mainloop.timeout_add_seconds(SHELL_INFO_HIDE_TIMEOUT, + Lang.bind(this, this._onTimeout)); - this._label.text = text; + if (this._source == null) { + this._source = new Source(); + this._source.connect('destroy', Lang.bind(this, + function() { + this._source = null; + })); + Main.messageTray.add(this._source); + } - Tweener.addTween(this.actor, - { opacity: 255, - transition: 'easeOutQuad', - time: ANIMATION_TIME - }); - - this._timeoutId = Mainloop.timeout_add_seconds(INFO_BAR_HIDE_TIMEOUT, Lang.bind(this, this._onTimeout)); - - if (undoLabel) - this._undo.label = undoLabel; + let notification = this._source.notification; + if (notification == null) + notification = new MessageTray.Notification(this._source, text, null); else - this._undo.label = _("Undo"); + notification.update(text, null, { clear: true }); this._undoCallback = undoCallback; - if (undoCallback) - this._undo.show(); - else - this._undo.hide(); + if (undoCallback) { + notification.addButton('system-undo', + undoLabel ? undoLabel : _("Undo")); + notification.connect('action-invoked', + Lang.bind(this, this._onUndoClicked)); + } + + this._source.notify(notification); } }; @@ -183,8 +182,7 @@ Overview.prototype = { } })); - this.infoBar = new InfoBar(); - this._group.add_actor(this.infoBar.actor); + this.shellInfo = new ShellInfo(); this._workspacesManager = null; this._lightbox = null; @@ -311,10 +309,6 @@ Overview.prototype = { this._dash.sectionArea.height = this._workspacesHeight; this._dash.searchResults.actor.height = this._workspacesHeight; - this.infoBar.actor.set_position(displayGridColumnWidth, Panel.PANEL_HEIGHT); - this.infoBar.actor.set_size(primary.width - displayGridColumnWidth, this._workspacesY - Panel.PANEL_HEIGHT); - this.infoBar.actor.raise_top(); - // place the 'Add Workspace' button in the bottom row of the grid this._workspacesBarX = this._workspacesX; this._workspacesBarWidth = this._workspacesWidth; diff --git a/js/ui/placeDisplay.js b/js/ui/placeDisplay.js index 88d25dabb..fb96149c9 100644 --- a/js/ui/placeDisplay.js +++ b/js/ui/placeDisplay.js @@ -109,7 +109,7 @@ PlaceDeviceInfo.prototype = { this._mount.unmount_finish(res); } catch (e) { let message = _("Failed to unmount '%s'").format(o.get_name()); - Main.overview.infoBar.setMessage(message, + Main.overview.shellInfo.setMessage(message, Lang.bind(this, this.remove), _("Retry")); } diff --git a/js/ui/workspacesView.js b/js/ui/workspacesView.js index 5c958829b..34945d776 100644 --- a/js/ui/workspacesView.js +++ b/js/ui/workspacesView.js @@ -226,7 +226,7 @@ GenericWorkspacesView.prototype = { addWorkspace: function() { if (!this.canAddWorkspace()) { - Main.overview.infoBar.setMessage(_("Can't add a new workspace because maximum workspaces limit has been reached.")); + Main.overview.shellInfo.setMessage(_("Can't add a new workspace because maximum workspaces limit has been reached.")); return null; } @@ -243,7 +243,7 @@ GenericWorkspacesView.prototype = { removeWorkspace: function() { if (!this.canRemoveWorkspace()) { - Main.overview.infoBar.setMessage(_("Can't remove the first workspace.")); + Main.overview.shellInfo.setMessage(_("Can't remove the first workspace.")); return; } let index = this._getWorkspaceIndexToRemove();