[gnome-shell/wip/message-tray: 2/33] messageTray: remove the labels of the items in the message tray
- From: Jasper St. Pierre <jstpierre src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell/wip/message-tray: 2/33] messageTray: remove the labels of the items in the message tray
- Date: Thu, 16 Aug 2012 17:57:17 +0000 (UTC)
commit d9322a84177f9a79d4ff2b445de5e4826d56c283
Author: Ana Risteska <a risteska gmail com>
Date: Fri Aug 10 20:24:22 2012 +0200
messageTray: remove the labels of the items in the message tray
According to the new visual style for the message tray we no longer
show the title of the source in the message tray.
https://bugzilla.gnome.org/show_bug.cgi?id=677213
data/theme/gnome-shell.css | 62 ++-----------
js/ui/messageTray.js | 218 +-------------------------------------------
2 files changed, 10 insertions(+), 270 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index c3a0fe9..602edf4 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -48,7 +48,6 @@ stage {
.dash-label,
.window-caption,
.switcher-list,
-.source-title,
.app-well-app > .overview-icon,
.remove-favorite > .overview-icon,
.search-result-content > .overview-icon {
@@ -1386,19 +1385,6 @@ StButton.popup-menu-item:insensitive {
border-radius: 4px;
}
-/* The spacing and padding on the summary is tricky; we want to keep
- * the icons from touching each other or the edges of the screen, but
- * we also want them to be "Fitts"-y with respect to the edges, so the
- * summary area's bottom and right padding must actually be part of
- * the icons. However, we can't put *all* of the padding into the
- * icons, because then the summary would be 0x0 when there were no
- * icons in it, and so you wouldn't be able to hover over it to
- * activate it.
- *
- * Also, the spacing between a summary-source's icon and title is
- * actually specified as padding-left in source-title, because we
- * want the spacing to collapse along with the title.
- */
#summary-mode {
padding: 2px 0px 0px 4px;
height: 36px;
@@ -1409,45 +1395,22 @@ StButton.popup-menu-item:insensitive {
}
.summary-source-button {
- text-shadow: black 0px 2px 2px;
-}
-
-.summary-source-button:ltr {
- padding-right: 12px;
-}
-
-.summary-source-button:selected .summary-source {
- background-image: url("panel-button-highlight-narrow.svg");
- background-size: contain;
- border-image: url("source-button-border.svg") 10 10 0 1;
+ transition-duration: 100;
}
-.summary-source-button:expanded:selected .summary-source {
- background-image: none;
- border-image: none;
+.summary-source-button:hover {
+ background-color: rgba(255,255,255,0.1);
+ border-radius: 4px;
}
-.summary-source-button:expanded:selected {
- background-image: url("panel-button-highlight-wide.svg");
+.summary-source-button:selected {
+ background-image: url("running-indicator.svg");
background-size: contain;
- border-image: url("source-button-border.svg") 10 10 0 1;
-}
-
-.summary-source-button:rtl {
- padding-left: 12px;
-}
-
-.summary-source-button:last-child:ltr {
- padding-right: 12px;
-}
-
-.summary-source-button:last-child:rtl {
- padding-left: 12px;
}
.summary-source {
- padding-right: 4px;
- padding-left: 4px;
+ padding-right: 6px;
+ padding-left: 6px;
}
.summary-source-counter {
@@ -1460,15 +1423,6 @@ StButton.popup-menu-item:insensitive {
min-width: 1em;
}
-.source-title {
- padding-left: 4px;
-}
-
-.source-title:rtl {
- padding-left: 0px;
- padding-right: 4px;
-}
-
/* App Switcher */
#altTabPopup {
padding: 8px;
diff --git a/js/ui/messageTray.js b/js/ui/messageTray.js
index 618a403..7d49f1d 100644
--- a/js/ui/messageTray.js
+++ b/js/ui/messageTray.js
@@ -31,7 +31,6 @@ const LONGER_SUMMARY_TIMEOUT = 4;
const HIDE_TIMEOUT = 0.2;
const LONGER_HIDE_TIMEOUT = 0.6;
-const MAX_SOURCE_TITLE_WIDTH = 180;
// We delay hiding of the tray if the mouse is within MOUSE_LEFT_ACTOR_THRESHOLD
// range from the point where it left the tray.
@@ -1271,22 +1270,7 @@ const SummaryItem = new Lang.Class({
this._sourceBox = new St.BoxLayout({ style_class: 'summary-source' });
this._sourceIcon = source.getSummaryIcon();
- this._sourceTitleBin = new St.Bin({ y_align: St.Align.MIDDLE,
- x_fill: true,
- clip_to_allocation: true });
- this._sourceTitle = new St.Label({ style_class: 'source-title',
- text: source.title });
- this._sourceTitle.clutter_text.ellipsize = Pango.EllipsizeMode.NONE;
- this._sourceTitleBin.child = this._sourceTitle;
- this._sourceTitleBin.width = 0;
-
- this.source.connect('title-changed',
- Lang.bind(this, function() {
- this._sourceTitle.text = source.title;
- }));
-
this._sourceBox.add(this._sourceIcon, { y_fill: false });
- this._sourceBox.add(this._sourceTitleBin, { expand: true, y_fill: false });
this.actor.child = this._sourceBox;
this.notificationStackView = new St.ScrollView({ style_class: source.isChat ? '' : 'summary-notification-stack-scrollview',
@@ -1342,30 +1326,6 @@ const SummaryItem = new Lang.Class({
focusManager.add_group(this.rightClickMenu);
},
- // getTitleNaturalWidth, getTitleWidth, and setTitleWidth include
- // the spacing between the icon and title (which is actually
- // _sourceTitle's padding-left) as part of the width.
-
- getTitleNaturalWidth: function() {
- let [minWidth, naturalWidth] = this._sourceTitle.get_preferred_width(-1);
-
- return Math.min(naturalWidth, MAX_SOURCE_TITLE_WIDTH);
- },
-
- getTitleWidth: function() {
- return this._sourceTitleBin.width;
- },
-
- setTitleWidth: function(width) {
- width = Math.round(width);
- if (width != this._sourceTitleBin.width)
- this._sourceTitleBin.width = width;
- },
-
- setEllipsization: function(mode) {
- this._sourceTitle.clutter_text.ellipsize = mode;
- },
-
prepareNotificationStackForShowing: function() {
if (this.notificationStack.get_n_children() > 0)
return;
@@ -1500,8 +1460,6 @@ const MessageTray = new Lang.Class({
this._clickedSummaryItem = null;
this._clickedSummaryItemMouseButton = -1;
this._clickedSummaryItemAllocationChangedId = 0;
- this._expandedSummaryItem = null;
- this._summaryItemTitleWidth = 0;
this._pointerBarrier = 0;
this._unseenNotifications = [];
@@ -1510,12 +1468,6 @@ const MessageTray = new Lang.Class({
this.idleMonitor = new Shell.IdleMonitor();
- // To simplify the summary item animation code, we pretend
- // that there's an invisible SummaryItem to the left of the
- // leftmost real summary item, and that it's expanded when all
- // of the other items are collapsed.
- this._imaginarySummaryItemTitleWidth = 0;
-
this._focusGrabber = new FocusGrabber();
this._focusGrabber.connect('focus-grabbed', Lang.bind(this,
function() {
@@ -1607,7 +1559,6 @@ const MessageTray = new Lang.Class({
// are items in this list once the notifications are done showing or once an item gets
// added to the summary without a notification being shown.
this._newSummaryItems = [];
- this._longestSummaryItem = null;
this._chatSummaryItemsCount = 0;
},
@@ -1658,14 +1609,6 @@ const MessageTray = new Lang.Class({
this._summary.insert_child_at_index(summaryItem.actor, this._chatSummaryItemsCount);
}
- let titleWidth = summaryItem.getTitleNaturalWidth();
- if (titleWidth > this._summaryItemTitleWidth) {
- this._summaryItemTitleWidth = titleWidth;
- if (!this._expandedSummaryItem)
- this._imaginarySummaryItemTitleWidth = titleWidth;
- this._longestSummaryItem = summaryItem;
- }
-
this._summaryItems.push(summaryItem);
// We keep this._newSummaryItems to track any new sources that were added to the
@@ -1690,11 +1633,6 @@ const MessageTray = new Lang.Class({
});
}));
- summaryItem.actor.connect('notify::hover', Lang.bind(this,
- function () {
- this._onSummaryItemHoverChanged(summaryItem);
- }));
-
summaryItem.actor.connect('clicked', Lang.bind(this,
function (actor, button) {
this._onSummaryItemClicked(summaryItem, button);
@@ -1731,26 +1669,6 @@ const MessageTray = new Lang.Class({
if (source.isChat)
this._chatSummaryItemsCount--;
- if (this._expandedSummaryItem == summaryItemToRemove)
- this._expandedSummaryItem = null;
-
- if (this._longestSummaryItem.source == source) {
- let newTitleWidth = 0;
- this._longestSummaryItem = null;
- for (let i = 0; i < this._summaryItems.length; i++) {
- let summaryItem = this._summaryItems[i];
- let titleWidth = summaryItem.getTitleNaturalWidth();
- if (titleWidth > newTitleWidth) {
- newTitleWidth = titleWidth;
- this._longestSummaryItem = summaryItem;
- }
- }
-
- this._summaryItemTitleWidth = newTitleWidth;
- if (!this._expandedSummaryItem)
- this._imaginarySummaryItemTitleWidth = newTitleWidth;
- }
-
let needUpdate = false;
if (this._notification && this._notification.source == source) {
@@ -1857,122 +1775,6 @@ const MessageTray = new Lang.Class({
this._updateState();
},
- _onSummaryItemHoverChanged: function(summaryItem) {
- if (summaryItem.actor.hover)
- this._setExpandedSummaryItem(summaryItem);
- },
-
- _setExpandedSummaryItem: function(summaryItem) {
- if (summaryItem == this._expandedSummaryItem)
- return;
-
- // We can't just animate individual summary items as the
- // pointer moves in and out of them, because if they don't
- // move in sync you get weird-looking wobbling. So whenever
- // there's a change, we have to re-tween the entire summary
- // area.
-
- // Turn off ellipsization for the previously expanded item that is
- // collapsing and for the item that is expanding because it looks
- // better that way.
- if (this._expandedSummaryItem) {
- // Ideally, we would remove 'expanded' pseudo class when the item
- // is done collapsing, but we don't track when that happens.
- this._expandedSummaryItem.actor.remove_style_pseudo_class('expanded');
- this._expandedSummaryItem.setEllipsization(Pango.EllipsizeMode.NONE);
- }
-
- this._expandedSummaryItem = summaryItem;
- if (this._expandedSummaryItem) {
- this._expandedSummaryItem.actor.add_style_pseudo_class('expanded');
- this._expandedSummaryItem.setEllipsization(Pango.EllipsizeMode.NONE);
- }
-
- // We tween on a "_expandedSummaryItemTitleWidth" pseudo-property
- // that represents the current title width of the
- // expanded/expanding item, or the width of the imaginary
- // invisible item if we're collapsing everything.
- Tweener.addTween(this,
- { _expandedSummaryItemTitleWidth: this._summaryItemTitleWidth,
- time: ANIMATION_TIME,
- transition: 'easeOutQuad',
- onComplete: this._expandSummaryItemCompleted,
- onCompleteScope: this });
- },
-
- get _expandedSummaryItemTitleWidth() {
- if (this._expandedSummaryItem)
- return this._expandedSummaryItem.getTitleWidth();
- else
- return this._imaginarySummaryItemTitleWidth;
- },
-
- set _expandedSummaryItemTitleWidth(expansion) {
- expansion = Math.round(expansion);
-
- // Expand the expanding item to its new width
- if (this._expandedSummaryItem)
- this._expandedSummaryItem.setTitleWidth(expansion);
- else
- this._imaginarySummaryItemTitleWidth = expansion;
-
- // Figure out how much space the other items are currently
- // using, and how much they need to be shrunk to keep the
- // total width (including the width of the imaginary item)
- // constant.
- let excess = this._summaryItemTitleWidth - expansion;
- let oldExcess = 0, shrinkage;
- if (excess) {
- for (let i = 0; i < this._summaryItems.length; i++) {
- if (this._summaryItems[i] != this._expandedSummaryItem)
- oldExcess += this._summaryItems[i].getTitleWidth();
- }
- if (this._expandedSummaryItem)
- oldExcess += this._imaginarySummaryItemTitleWidth;
- }
- if (excess && oldExcess)
- shrinkage = excess / oldExcess;
- else
- shrinkage = 0;
-
- // Now shrink each one proportionately
- for (let i = 0; i < this._summaryItems.length; i++) {
- if (this._summaryItems[i] == this._expandedSummaryItem)
- continue;
-
- let oldWidth = this._summaryItems[i].getTitleWidth();
- let newWidth = Math.floor(oldWidth * shrinkage);
- excess -= newWidth;
- this._summaryItems[i].setTitleWidth(newWidth);
- }
- if (this._expandedSummaryItem) {
- let oldWidth = this._imaginarySummaryItemTitleWidth;
- let newWidth = Math.floor(oldWidth * shrinkage);
- excess -= newWidth;
- this._imaginarySummaryItemTitleWidth = newWidth;
- }
-
- // If the tray as a whole is fully-expanded, make sure the
- // left edge doesn't wobble during animation due to rounding.
- if (this._imaginarySummaryItemTitleWidth == 0 && excess != 0) {
- for (let i = 0; i < this._summaryItems.length; i++) {
- if (this._summaryItems[i] == this._expandedSummaryItem)
- continue;
-
- let oldWidth = this._summaryItems[i].getTitleWidth();
- if (oldWidth != 0) {
- this._summaryItems[i].setTitleWidth (oldWidth + excess);
- break;
- }
- }
- }
- },
-
- _expandSummaryItemCompleted: function() {
- if (this._expandedSummaryItem)
- this._expandedSummaryItem.setEllipsization(Pango.EllipsizeMode.END);
- },
-
_onSummaryItemClicked: function(summaryItem, button) {
if (summaryItem.source.handleSummaryClick())
this._unsetClickedSummaryItem();
@@ -2171,8 +1973,6 @@ const MessageTray = new Lang.Class({
let summarySummoned = this._pointerInSummary || this._overviewVisible || this._traySummoned;
let summaryPinned = this._summaryTimeoutId != 0 || this._pointerInTray || summarySummoned || this._locked;
let summaryHovered = this._pointerInTray || this._pointerInSummary;
- let summaryVisibleWithNoHover = (this._overviewVisible || this._locked) && !summaryHovered;
- let summaryNotificationIsForExpandedSummaryItem = (this._clickedSummaryItem == this._expandedSummaryItem);
let notificationsVisible = (this._notificationState == State.SHOWING ||
this._notificationState == State.SHOWN);
@@ -2191,16 +1991,8 @@ const MessageTray = new Lang.Class({
else if (this._newSummaryItems.length > 0)
this._showSummary(SUMMARY_TIMEOUT);
}
- } else if (this._summaryState == State.SHOWN) {
- if (!summaryPinned || mustHideSummary)
- this._hideSummary();
- else if (summaryVisibleWithNoHover && !summaryNotificationIsForExpandedSummaryItem)
- // If we are hiding the summary, we'll collapse the expanded summary item when we are done
- // so that there is no animation. However, we should collapse the expanded summary item
- // if the summary is visible, but not hovered over, and the summary notification for the
- // expanded summary item is not being shown.
- this._setExpandedSummaryItem(null);
- }
+ } else if (this._summaryState == State.SHOWN && (!summaryPinned || mustHideSummary))
+ this._hideSummary();
// Summary notification
let haveClickedSummaryItem = this._clickedSummaryItem != null;
@@ -2558,15 +2350,9 @@ const MessageTray = new Lang.Class({
{ opacity: 0,
time: ANIMATION_TIME,
transition: 'easeOutQuad',
- onComplete: this._hideSummaryCompleted,
- onCompleteScope: this,
});
},
- _hideSummaryCompleted: function() {
- this._setExpandedSummaryItem(null);
- },
-
_updateSeenSummaryItems: function() {
if (this._backFromAway) {
this._backFromAway = false;
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
