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

Replace all remaining BigBoxes with StBoxLayouts or StBins

Browse Source 
Also, remove a lot of cruft from genericDisplay.js leftover from
previous St-ifications, and remove the pre-gtk-2.16 hacks from the
status tray in panel.js (which are much less needed with the
nearly-all-black panel anyway).

https://bugzilla.gnome.org/show_bug.cgi?id=614516
This commit is contained in:
Dan Winship 2010-03-31 16:40:32 -04:00
parent 887f0f554b
commit 2320c393c9
7 changed files with 52 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -145,6 +145,14 @@ StTooltip {
spacing: 4px; spacing: 4px;
} }
#statusTray {
spacing: 14px;
}
#statusTray:compact {
spacing: 8px;
}
/* Overview */ /* Overview */
.overview { .overview {
@ -404,6 +412,10 @@ StTooltip {
background-color: #1e1e1e; background-color: #1e1e1e;
} }
.dash-results-container {
spacing: 4px;
}
/* GenericDisplay */ /* GenericDisplay */
.generic-display-container { .generic-display-container {
@ -606,6 +618,11 @@ StTooltip {
spacing: 4px; spacing: 4px;
} }
#LookingGlassDialog StBoxLayout#ResultsArea
{
spacing: 4px;
}
#lookingGlassExtensions { #lookingGlassExtensions {
padding: 4px; padding: 4px;
} }

8
js/ui/appDisplay.js
View File

@ -1,6 +1,5 @@
/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ /* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
const Big = imports.gi.Big;
const Clutter = imports.gi.Clutter; const Clutter = imports.gi.Clutter;
const Pango = imports.gi.Pango; const Pango = imports.gi.Pango;
const GLib = imports.gi.GLib; const GLib = imports.gi.GLib;
@ -1000,15 +999,12 @@ AppWell.prototype = {
this._favorites = []; this._favorites = [];
this.actor = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, this._grid = new WellGrid();
x_align: Big.BoxAlignment.CENTER }); this.actor = this._grid.actor;
this.actor._delegate = this; this.actor._delegate = this;
this._workId = Main.initializeDeferredWork(this.actor, Lang.bind(this, this._redisplay)); this._workId = Main.initializeDeferredWork(this.actor, Lang.bind(this, this._redisplay));
this._grid = new WellGrid();
this.actor.append(this._grid.actor, Big.BoxPackFlags.EXPAND);
this._tracker = Shell.WindowTracker.get_default(); this._tracker = Shell.WindowTracker.get_default();
this._appSystem = Shell.AppSystem.get_default(); this._appSystem = Shell.AppSystem.get_default();

13
js/ui/dash.js
View File

@ -1,6 +1,5 @@
/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ /* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
const Big = imports.gi.Big;
const Clutter = imports.gi.Clutter; const Clutter = imports.gi.Clutter;
const Gtk = imports.gi.Gtk; const Gtk = imports.gi.Gtk;
const Mainloop = imports.mainloop; const Mainloop = imports.mainloop;
@ -23,8 +22,6 @@ const Search = imports.ui.search;
// 25 search results (per result type) should be enough for everyone // 25 search results (per result type) should be enough for everyone
const MAX_RENDERED_SEARCH_RESULTS = 25; const MAX_RENDERED_SEARCH_RESULTS = 25;
const DEFAULT_PADDING = 4;
const DOCS = "docs"; const DOCS = "docs";
const PLACES = "places"; const PLACES = "places";
@ -116,14 +113,12 @@ function ResultArea(displayType, flags) {
ResultArea.prototype = { ResultArea.prototype = {
_init : function(displayType, flags) { _init : function(displayType, flags) {
this.actor = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL }); this.actor = new St.BoxLayout({ vertical: true });
this.resultsContainer = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL, this.resultsContainer = new St.BoxLayout({ style_class: 'dash-results-container' });
spacing: DEFAULT_PADDING this.actor.add(this.resultsContainer, { expand: true });
});
this.actor.append(this.resultsContainer, Big.BoxPackFlags.EXPAND);
this.display = _createDisplay(displayType, flags); this.display = _createDisplay(displayType, flags);
this.resultsContainer.append(this.display.actor, Big.BoxPackFlags.EXPAND); this.resultsContainer.add(this.display.actor, { expand: true });
this.display.load(); this.display.load();
} }
}; };

36
js/ui/genericDisplay.js
View File

@ -1,6 +1,5 @@
/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ /* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
const Big = imports.gi.Big;
const Clutter = imports.gi.Clutter; const Clutter = imports.gi.Clutter;
const Gio = imports.gi.Gio; const Gio = imports.gi.Gio;
const Gdk = imports.gi.Gdk; const Gdk = imports.gi.Gdk;
@ -21,25 +20,9 @@ const RedisplayFlags = { NONE: 0,
SUBSEARCH: 1 << 2, SUBSEARCH: 1 << 2,
IMMEDIATE: 1 << 3 }; IMMEDIATE: 1 << 3 };
const ITEM_DISPLAY_DESCRIPTION_COLOR = new Clutter.Color(); // Used by subclasses
ITEM_DISPLAY_DESCRIPTION_COLOR.from_pixel(0xffffffbb);
const DISPLAY_CONTROL_SELECTED_COLOR = new Clutter.Color();
DISPLAY_CONTROL_SELECTED_COLOR.from_pixel(0x112288ff);
const PREVIEW_BOX_BACKGROUND_COLOR = new Clutter.Color();
PREVIEW_BOX_BACKGROUND_COLOR.from_pixel(0xADADADf0);
const DEFAULT_PADDING = 4;
const ITEM_DISPLAY_ICON_SIZE = 48; const ITEM_DISPLAY_ICON_SIZE = 48;
const DEFAULT_COLUMN_GAP = 6;
const PREVIEW_ICON_SIZE = 96; const PREVIEW_ICON_SIZE = 96;
const PREVIEW_BOX_PADDING = 6;
const PREVIEW_BOX_SPACING = DEFAULT_PADDING;
const PREVIEW_BOX_CORNER_RADIUS = 10;
// how far relative to the full item width the preview box should be placed
const PREVIEW_PLACING = 3/4;
const PREVIEW_DETAILS_MIN_WIDTH = PREVIEW_ICON_SIZE * 2;
/* This is a virtual class that represents a single display item containing /* This is a virtual class that represents a single display item containing
* a name, a description, and an icon. It allows selecting an item and represents * a name, a description, and an icon. It allows selecting an item and represents
@ -117,11 +100,10 @@ GenericDisplayItem.prototype = {
*/ */
createDetailsActor: function() { createDetailsActor: function() {
let details = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, let details = new St.BoxLayout({ style_class: 'generic-display-container',
spacing: PREVIEW_BOX_SPACING }); vertical: true });
let mainDetails = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL, let mainDetails = new St.BoxLayout({ style_class: 'generic-display-container' });
spacing: PREVIEW_BOX_SPACING });
// Inner box with name and description // Inner box with name and description
let textDetails = new St.BoxLayout({ style_class: 'generic-display-details', let textDetails = new St.BoxLayout({ style_class: 'generic-display-details',
@ -135,21 +117,19 @@ GenericDisplayItem.prototype = {
this._detailsDescriptions.push(detailsDescription); this._detailsDescriptions.push(detailsDescription);
mainDetails.append(textDetails, Big.BoxPackFlags.EXPAND); mainDetails.add(textDetails, { expand: true });
let previewIcon = this._createPreviewIcon(); let previewIcon = this._createPreviewIcon();
let largePreviewIcon = this._createLargePreviewIcon(); let largePreviewIcon = this._createLargePreviewIcon();
if (previewIcon != null && largePreviewIcon == null) { if (previewIcon != null && largePreviewIcon == null) {
mainDetails.prepend(previewIcon, Big.BoxPackFlags.NONE); mainDetails.insert_actor(previewIcon, 0);
} }
details.append(mainDetails, Big.BoxPackFlags.NONE); details.add(mainDetails);
if (largePreviewIcon != null) { if (largePreviewIcon != null) {
let largePreview = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL }); details.add(largePreviewIcon);
largePreview.append(largePreviewIcon, Big.BoxPackFlags.NONE);
details.append(largePreview, Big.BoxPackFlags.NONE);
} }
return details; return details;

20
js/ui/lookingGlass.js
View File

@ -1,6 +1,5 @@
/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ /* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
const Big = imports.gi.Big;
const Clutter = imports.gi.Clutter; const Clutter = imports.gi.Clutter;
const Gio = imports.gi.Gio; const Gio = imports.gi.Gio;
const Pango = imports.gi.Pango; const Pango = imports.gi.Pango;
@ -148,21 +147,21 @@ Result.prototype = {
this.index = index; this.index = index;
this.o = o; this.o = o;
this.actor = new Big.Box(); this.actor = new St.BoxLayout({ vertical: true });
let cmdTxt = new St.Label({ text: command }); let cmdTxt = new St.Label({ text: command });
cmdTxt.ellipsize = Pango.EllipsizeMode.END; cmdTxt.ellipsize = Pango.EllipsizeMode.END;
this.actor.append(cmdTxt, Big.BoxPackFlags.NONE); this.actor.add(cmdTxt);
let resultTxt = new St.Label({ text: "r(" + index + ") = " + o }); let resultTxt = new St.Label({ text: "r(" + index + ") = " + o });
resultTxt.ellipsize = Pango.EllipsizeMode.END; resultTxt.ellipsize = Pango.EllipsizeMode.END;
this.actor.append(resultTxt, Big.BoxPackFlags.NONE); this.actor.add(resultTxt);
let line = new Clutter.Rectangle({ name: "Separator", let line = new Clutter.Rectangle({ name: "Separator",
height: 1 }); height: 1 });
let padBin = new St.Bin({ name: "Separator", x_fill: true, y_fill: true }); let padBin = new St.Bin({ name: "Separator", x_fill: true, y_fill: true });
padBin.add_actor(line); padBin.add_actor(line);
this.actor.append(padBin, Big.BoxPackFlags.NONE); this.actor.add(padBin);
} }
}; };
@ -514,15 +513,14 @@ LookingGlass.prototype = {
this._evalBox = new St.BoxLayout({ name: "EvalBox", vertical: true }); this._evalBox = new St.BoxLayout({ name: "EvalBox", vertical: true });
notebook.appendPage('Evaluator', this._evalBox); notebook.appendPage('Evaluator', this._evalBox);
this._resultsArea = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, this._resultsArea = new St.BoxLayout({ name: "ResultsArea", vertical: true });
spacing: 4 });
this._evalBox.add(this._resultsArea, { expand: true }); this._evalBox.add(this._resultsArea, { expand: true });
let entryArea = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL }); let entryArea = new St.BoxLayout({ name: "EntryArea" });
this._evalBox.add_actor(entryArea); this._evalBox.add_actor(entryArea);
let label = new St.Label({ text: 'js>>> ' }); let label = new St.Label({ text: 'js>>> ' });
entryArea.append(label, Big.BoxPackFlags.NONE); entryArea.add(label);
this._entry = new St.Entry(); this._entry = new St.Entry();
/* unmapping the edit box will un-focus it, undo that */ /* unmapping the edit box will un-focus it, undo that */
@ -530,7 +528,7 @@ LookingGlass.prototype = {
if (child == this._evalBox) if (child == this._evalBox)
global.stage.set_key_focus(this._entry); global.stage.set_key_focus(this._entry);
})); }));
entryArea.append(this._entry, Big.BoxPackFlags.EXPAND); entryArea.add(this._entry, { expand: true });
this._hierarchy = new ActorHierarchy(); this._hierarchy = new ActorHierarchy();
notebook.appendPage('Hierarchy', this._hierarchy.actor); notebook.appendPage('Hierarchy', this._hierarchy.actor);
@ -628,7 +626,7 @@ LookingGlass.prototype = {
let index = this._results.length + this._offset; let index = this._results.length + this._offset;
let result = new Result('>>> ' + command, obj, index); let result = new Result('>>> ' + command, obj, index);
this._results.push(result); this._results.push(result);
this._resultsArea.append(result.actor, Big.BoxPackFlags.NONE); this._resultsArea.add(result.actor);
this._propInspector.setTarget(obj); this._propInspector.setTarget(obj);
if (this._borderPaintTarget != null) { if (this._borderPaintTarget != null) {
this._borderPaintTarget.disconnect(this._borderPaintId); this._borderPaintTarget.disconnect(this._borderPaintId);

47
js/ui/panel.js
View File

@ -1,6 +1,5 @@
/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ /* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
const Big = imports.gi.Big;
const Clutter = imports.gi.Clutter; const Clutter = imports.gi.Clutter;
const Gtk = imports.gi.Gtk; const Gtk = imports.gi.Gtk;
const Lang = imports.lang; const Lang = imports.lang;
@ -24,19 +23,6 @@ const DEFAULT_PADDING = 4;
const PANEL_ICON_SIZE = 24; const PANEL_ICON_SIZE = 24;
// See comments around _recomputeTraySize
const TRAY_SPACING = 14;
const TRAY_SPACING_MIN = 8;
// Used for the tray icon container with gtk pre-2.16, which doesn't
// fully support tray icon transparency
const TRAY_BACKGROUND_COLOR = new Clutter.Color();
TRAY_BACKGROUND_COLOR.from_pixel(0x0b0b0bff);
const TRAY_BORDER_COLOR = new Clutter.Color();
TRAY_BORDER_COLOR.from_pixel(0x00000033);
const TRAY_CORNER_RADIUS = 5;
const TRAY_BORDER_WIDTH = 0;
const HOT_CORNER_ACTIVATION_TIMEOUT = 0.5; const HOT_CORNER_ACTIVATION_TIMEOUT = 0.5;
const STANDARD_TRAY_ICON_ORDER = ['keyboard', 'volume', 'bluetooth', 'network', 'battery']; const STANDARD_TRAY_ICON_ORDER = ['keyboard', 'volume', 'bluetooth', 'network', 'battery'];
@ -458,28 +444,15 @@ Panel.prototype = {
// The tray icons live in trayBox within trayContainer. // The tray icons live in trayBox within trayContainer.
// The trayBox is hidden when there are no tray icons. // The trayBox is hidden when there are no tray icons.
let trayContainer = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, let trayContainer = new St.Bin({ y_align: St.Align.MIDDLE });
y_align: Big.BoxAlignment.CENTER });
this._rightBox.add(trayContainer); this._rightBox.add(trayContainer);
let trayBox = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL, let trayBox = new St.BoxLayout({ name: 'statusTray' });
height: PANEL_ICON_SIZE,
spacing: TRAY_SPACING });
this._trayBox = trayBox; this._trayBox = trayBox;
// gtk+ < 2.16 doesn't have fully-working icon transparency,
// so we want trayBox to be opaque in that case (the icons
// will at least pick up its background color).
if (Gtk.MAJOR_VERSION == 2 && Gtk.MINOR_VERSION < 16) {
trayBox.background_color = TRAY_BACKGROUND_COLOR;
trayBox.corner_radius = TRAY_CORNER_RADIUS;
trayBox.border = TRAY_BORDER_WIDTH;
trayBox.border_color = TRAY_BORDER_COLOR;
}
trayBox.hide(); trayBox.hide();
trayContainer.append(trayBox, Big.BoxPackFlags.NONE); trayContainer.add_actor(trayBox);
this._traymanager = new Shell.TrayManager({ bg_color: TRAY_BACKGROUND_COLOR }); this._traymanager = new Shell.TrayManager();
this._traymanager.connect('tray-icon-added', Lang.bind(this, this._onTrayIconAdded)); this._traymanager.connect('tray-icon-added', Lang.bind(this, this._onTrayIconAdded));
this._traymanager.connect('tray-icon-removed', this._traymanager.connect('tray-icon-removed',
Lang.bind(this, function(o, icon) { Lang.bind(this, function(o, icon) {
@ -555,10 +528,12 @@ Panel.prototype = {
}, },
_onTrayIconAdded: function(o, icon, wmClass) { _onTrayIconAdded: function(o, icon, wmClass) {
icon.height = PANEL_ICON_SIZE;
let role = STANDARD_TRAY_ICON_IMPLEMENTATIONS[wmClass]; let role = STANDARD_TRAY_ICON_IMPLEMENTATIONS[wmClass];
if (!role) { if (!role) {
// Unknown icons go first in undefined order // Unknown icons go first in undefined order
this._trayBox.prepend(icon, Big.BoxPackFlags.NONE); this._trayBox.insert_actor(icon, 0);
} else { } else {
icon._role = role; icon._role = role;
// Figure out the index in our well-known order for this icon // Figure out the index in our well-known order for this icon
@ -571,13 +546,13 @@ Panel.prototype = {
for (i = children.length - 1; i >= 0; i--) { for (i = children.length - 1; i >= 0; i--) {
let rolePosition = children[i]._rolePosition; let rolePosition = children[i]._rolePosition;
if (!rolePosition || position > rolePosition) { if (!rolePosition || position > rolePosition) {
this._trayBox.insert_after(icon, children[i], Big.BoxPackFlags.NONE); this._trayBox.insert_actor(icon, i + 1);
break; break;
} }
} }
if (i == -1) { if (i == -1) {
// If we didn't find a position, we must be first // If we didn't find a position, we must be first
this._trayBox.prepend(icon, Big.BoxPackFlags.NONE); this._trayBox.insert_actor(icon, 0);
} }
} }
@ -592,9 +567,9 @@ Panel.prototype = {
// http://bugzilla.gnome.org/show_bug.cgi?id=590495 // http://bugzilla.gnome.org/show_bug.cgi?id=590495
_recomputeTraySize: function () { _recomputeTraySize: function () {
if (this._trayBox.get_children().length > 6) if (this._trayBox.get_children().length > 6)
this._trayBox.spacing = TRAY_SPACING_MIN; this._trayBox.add_style_pseudo_class('compact');
else else
this._trayBox.spacing = TRAY_SPACING; this._trayBox.remove_style_pseudo_class('compact');
}, },
_updateClock: function() { _updateClock: function() {

3
src/shell-tray-manager.c
View File

@ -51,8 +51,7 @@ G_DEFINE_TYPE (ShellTrayManager, shell_tray_manager, G_TYPE_OBJECT);
static guint shell_tray_manager_signals [LAST_SIGNAL] = { 0 }; static guint shell_tray_manager_signals [LAST_SIGNAL] = { 0 };
/* Sea Green - obnoxious to force people to set the background color */ static const ClutterColor default_color = { 0x00, 0x00, 0x00, 0xff };
static const ClutterColor default_color = { 0xbb, 0xff, 0xaa };
static void na_tray_icon_added (NaTrayManager *na_manager, GtkWidget *child, gpointer manager); static void na_tray_icon_added (NaTrayManager *na_manager, GtkWidget *child, gpointer manager);
static void na_tray_icon_removed (NaTrayManager *na_manager, GtkWidget *child, gpointer manager); static void na_tray_icon_removed (NaTrayManager *na_manager, GtkWidget *child, gpointer manager);