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

overview: overview as boxlayouts

Browse Source 
https://bugzilla.gnome.org/show_bug.cgi?id=682286
This commit is contained in:
Tanner Doshier 2012-12-10 15:39:15 -05:00 committed by Cosimo Cecchi
parent 5308d12239
commit 04d68c6e36
4 changed files with 62 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -616,6 +616,10 @@ StScrollBar StButton#vhandle:active {
spacing: 40px; spacing: 40px;
} }
#overview-group {
spacing: 32px;
}
.window-caption { .window-caption {
spacing: 25px; spacing: 25px;
} }

117
js/ui/overview.js
View File

@ -23,9 +23,6 @@ const WorkspaceThumbnail = imports.ui.workspaceThumbnail;
// Time for initial animation going into Overview mode // Time for initial animation going into Overview mode
const ANIMATION_TIME = 0.25; const ANIMATION_TIME = 0.25;
// XXX -- grab this automatically. Hard to do.
const DASH_MAX_WIDTH = 96;
const DND_WINDOW_SWITCH_TIMEOUT = 1250; const DND_WINDOW_SWITCH_TIMEOUT = 1250;
const GLSL_DIM_EFFECT_DECLARATIONS = ''; const GLSL_DIM_EFFECT_DECLARATIONS = '';
@ -136,23 +133,15 @@ const Overview = new Lang.Class({
this._desktopFade = new St.Bin(); this._desktopFade = new St.Bin();
global.overlay_group.add_actor(this._desktopFade); global.overlay_group.add_actor(this._desktopFade);
this._spacing = 0;
/* Translators: This is the main view to select /* Translators: This is the main view to select
activities. See also note for "Activities" string. */ activities. See also note for "Activities" string. */
this._group = new St.Widget({ name: 'overview', this._overview = new St.BoxLayout({ name: 'overview',
accessible_name: _("Overview"), accessible_name: _("Overview"),
reactive: true }); reactive: true,
this._group._delegate = this; vertical: true });
this._group.connect('style-changed', this._overview._delegate = this;
Lang.bind(this, function() {
let node = this._group.get_theme_node(); this._group = new St.BoxLayout({ name: 'overview-group' });
let spacing = node.get_length('spacing');
if (spacing != this._spacing) {
this._spacing = spacing;
this._relayout();
}
}));
this._capturedEventId = 0; this._capturedEventId = 0;
this._buttonPressId = 0; this._buttonPressId = 0;
@ -169,12 +158,11 @@ const Overview = new Lang.Class({
// Dash elements, or mouseover handlers in the workspaces. // Dash elements, or mouseover handlers in the workspaces.
this._coverPane = new Clutter.Rectangle({ opacity: 0, this._coverPane = new Clutter.Rectangle({ opacity: 0,
reactive: true }); reactive: true });
this._group.add_actor(this._coverPane); this._overview.add_actor(this._coverPane);
this._coverPane.connect('event', Lang.bind(this, function (actor, event) { return true; })); this._coverPane.connect('event', Lang.bind(this, function (actor, event) { return true; }));
this._overview.hide();
this._group.hide(); global.overlay_group.add_actor(this._overview);
global.overlay_group.add_actor(this._group);
this._coverPane.hide(); this._coverPane.hide();
@ -213,6 +201,13 @@ const Overview = new Lang.Class({
this._shellInfo = new ShellInfo(); this._shellInfo = new ShellInfo();
// Add a clone of the panel to the overview so spacing and such is
// automatic
this._panelGhost = new St.Bin({ child: new Clutter.Clone({ source: Main.panel.actor }),
reactive: false,
opacity: 0 });
this._overview.add_actor(this._panelGhost);
this._searchEntry = new St.Entry({ name: 'searchEntry', this._searchEntry = new St.Entry({ name: 'searchEntry',
/* Translators: this is the text displayed /* Translators: this is the text displayed
in the search entry when no search is in the search entry when no search is
@ -221,16 +216,13 @@ const Overview = new Lang.Class({
hint_text: _("Type to search..."), hint_text: _("Type to search..."),
track_hover: true, track_hover: true,
can_focus: true }); can_focus: true });
this._group.add_actor(this._searchEntry); this._searchEntryBin = new St.Bin({ child: this._searchEntry,
x_align: St.Align.MIDDLE });
this._dash = new Dash.Dash(); this._overview.add_actor(this._searchEntryBin);
this._viewSelector = new ViewSelector.ViewSelector(this._searchEntry,
this._dash.showAppsButton);
this._group.add_actor(this._viewSelector.actor);
this._group.add_actor(this._dash.actor);
// TODO - recalculate everything when desktop size changes // TODO - recalculate everything when desktop size changes
this._dash.actor.add_constraint(this._viewSelector.constrainHeight); this._dash = new Dash.Dash();
this._group.add_actor(this._dash.actor);
this.dashIconSize = this._dash.iconSize; this.dashIconSize = this._dash.iconSize;
this._dash.connect('icon-size-changed', this._dash.connect('icon-size-changed',
Lang.bind(this, function() { Lang.bind(this, function() {
@ -241,6 +233,23 @@ const Overview = new Lang.Class({
// the left of the overview // the left of the overview
Main.ctrlAltTabManager.addGroup(this._dash.actor, _("Dash"), 'user-bookmarks-symbolic'); Main.ctrlAltTabManager.addGroup(this._dash.actor, _("Dash"), 'user-bookmarks-symbolic');
this._viewSelector = new ViewSelector.ViewSelector(this._searchEntry,
this._dash.showAppsButton);
this._group.add(this._viewSelector.actor, { x_fill: true,
expand: true });
// Add our same-line elements after the search entry
this._overview.add(this._group, { y_fill: true,
expand: true });
// Then account for message tray
this._messageTrayGhost = new St.Bin({ child: new Clutter.Clone({ source: Main.messageTray.actor }),
reactive: false,
opacity: 0,
x_fill: true,
y_fill: true });
this._overview.add_actor(this._messageTrayGhost);
Main.layoutManager.connect('monitors-changed', Lang.bind(this, this._relayout)); Main.layoutManager.connect('monitors-changed', Lang.bind(this, this._relayout));
this._relayout(); this._relayout();
}, },
@ -337,7 +346,7 @@ const Overview = new Lang.Class({
if (this.isDummy) if (this.isDummy)
return; return;
this._group.add_action(action); this._overview.add_action(action);
}, },
_getDesktopClone: function() { _getDesktopClone: function() {
@ -363,41 +372,15 @@ const Overview = new Lang.Class({
this.hide(); this.hide();
let primary = Main.layoutManager.primaryMonitor; let primary = Main.layoutManager.primaryMonitor;
let rtl = (Clutter.get_default_text_direction() == Clutter.TextDirection.RTL);
let contentY = Main.panel.actor.height; let contentY = Main.panel.actor.height;
let contentHeight = primary.height - contentY - Main.messageTray.actor.height; let contentHeight = primary.height - contentY - Main.messageTray.actor.height;
this._group.set_position(primary.x, primary.y); this._overview.set_position(primary.x, primary.y);
this._group.set_size(primary.width, primary.height); this._overview.set_size(primary.width, primary.height);
this._coverPane.set_position(0, contentY); this._coverPane.set_position(0, contentY);
this._coverPane.set_size(primary.width, contentHeight); this._coverPane.set_size(primary.width, contentHeight);
let searchWidth = this._searchEntry.get_width();
let searchHeight = this._searchEntry.get_height();
let searchX = (primary.width - searchWidth) / 2;
let searchY = contentY + this._spacing;
let dashWidth = DASH_MAX_WIDTH;
let dashY = searchY + searchHeight + this._spacing;
let dashX;
if (rtl) {
this._dash.actor.set_anchor_point_from_gravity(Clutter.Gravity.NORTH_EAST);
dashX = primary.width;
} else {
dashX = 0;
}
let viewX = rtl ? 0 : dashWidth + this._spacing;
let viewY = searchY + searchHeight + this._spacing;
let viewWidth = primary.width - dashWidth - this._spacing;
let viewHeight = contentHeight - this._spacing - viewY;
this._searchEntry.set_position(searchX, searchY);
this._dash.actor.set_position(dashX, dashY);
this._viewSelector.actor.set_position(viewX, viewY);
this._viewSelector.actor.set_size(viewWidth, viewHeight);
}, },
//// Public methods //// //// Public methods ////
@ -481,12 +464,12 @@ const Overview = new Lang.Class({
// Disable unredirection while in the overview // Disable unredirection while in the overview
Meta.disable_unredirect_for_screen(global.screen); Meta.disable_unredirect_for_screen(global.screen);
global.window_group.hide(); global.window_group.hide();
this._group.show(); this._overview.show();
this._background.show(); this._background.show();
this._viewSelector.show(); this._viewSelector.show();
this._group.opacity = 0; this._overview.opacity = 0;
Tweener.addTween(this._group, Tweener.addTween(this._overview,
{ opacity: 255, { opacity: 255,
transition: 'easeOutQuad', transition: 'easeOutQuad',
time: ANIMATION_TIME, time: ANIMATION_TIME,
@ -578,7 +561,7 @@ const Overview = new Lang.Class({
if (this._shown) { if (this._shown) {
if (!this._modal) { if (!this._modal) {
if (Main.pushModal(this._group, if (Main.pushModal(this._overview,
{ keybindingMode: Main.KeybindingMode.OVERVIEW })) { keybindingMode: Main.KeybindingMode.OVERVIEW }))
this._modal = true; this._modal = true;
else else
@ -586,13 +569,13 @@ const Overview = new Lang.Class({
} }
} else if (this._shownTemporarily) { } else if (this._shownTemporarily) {
if (this._modal) { if (this._modal) {
Main.popModal(this._group); Main.popModal(this._overview);
this._modal = false; this._modal = false;
} }
global.stage_input_mode = Shell.StageInputMode.FULLSCREEN; global.stage_input_mode = Shell.StageInputMode.FULLSCREEN;
} else { } else {
if (this._modal) { if (this._modal) {
Main.popModal(this._group); Main.popModal(this._overview);
this._modal = false; this._modal = false;
} }
else if (global.stage_input_mode == Shell.StageInputMode.FULLSCREEN) else if (global.stage_input_mode == Shell.StageInputMode.FULLSCREEN)
@ -610,7 +593,7 @@ const Overview = new Lang.Class({
this._viewSelector.zoomFromOverview(); this._viewSelector.zoomFromOverview();
// Make other elements fade out. // Make other elements fade out.
Tweener.addTween(this._group, Tweener.addTween(this._overview,
{ opacity: 0, { opacity: 0,
transition: 'easeOutQuad', transition: 'easeOutQuad',
time: ANIMATION_TIME, time: ANIMATION_TIME,
@ -652,7 +635,7 @@ const Overview = new Lang.Class({
this._viewSelector.hide(); this._viewSelector.hide();
this._desktopFade.hide(); this._desktopFade.hide();
this._background.hide(); this._background.hide();
this._group.hide(); this._overview.hide();
this.visible = false; this.visible = false;
this.animationInProgress = false; this.animationInProgress = false;

11
js/ui/viewSelector.js
View File

@ -138,17 +138,6 @@ const ViewSelector = new Lang.Class({
} }
})); }));
// Public constraints which may be used to tie actors' height or
// vertical position to the current tab's content; as the content's
// height and position depend on the view selector's style properties
// (e.g. font size, padding, spacing, ...) it would be extremely hard
// and ugly to get these from the outside. While it would be possible
// to use position and height properties directly, outside code would
// need to ensure that the content is properly allocated before
// accessing the properties.
this.constrainHeight = new Clutter.BindConstraint({ source: this._pageArea,
coordinate: Clutter.BindCoordinate.HEIGHT });
Main.wm.addKeybinding('toggle-application-view', Main.wm.addKeybinding('toggle-application-view',
new Gio.Settings({ schema: SHELL_KEYBINDINGS_SCHEMA }), new Gio.Settings({ schema: SHELL_KEYBINDINGS_SCHEMA }),
Meta.KeyBindingFlags.NONE, Meta.KeyBindingFlags.NONE,

19
js/ui/workspacesView.js
View File

@ -129,11 +129,10 @@ const WorkspacesView = new Lang.Class({
continue; continue;
let ws = new Workspace.Workspace(null, i); let ws = new Workspace.Workspace(null, i);
let overviewSpacing = Main.overview._spacing; ws.setGeometry(monitors[i].x,
ws.setGeometry(monitors[i].x + overviewSpacing/2, monitors[i].y,
monitors[i].y + overviewSpacing/2, monitors[i].width,
monitors[i].width - overviewSpacing, monitors[i].height);
monitors[i].height - overviewSpacing);
global.overlay_group.add_actor(ws.actor); global.overlay_group.add_actor(ws.actor);
this._extraWorkspaces.push(ws); this._extraWorkspaces.push(ws);
} }
@ -854,9 +853,7 @@ const WorkspacesDisplay = new Lang.Class({
let clipX = rtl ? x + controlsVisible : x; let clipX = rtl ? x + controlsVisible : x;
let clipY = y + (fullHeight - clipHeight) / 2; let clipY = y + (fullHeight - clipHeight) / 2;
let overviewSpacing = Main.overview._spacing;
let widthAdjust = this._zoomOut ? controlsNatural : controlsVisible; let widthAdjust = this._zoomOut ? controlsNatural : controlsVisible;
widthAdjust += overviewSpacing;
width -= widthAdjust; width -= widthAdjust;
if (rtl) if (rtl)
x += widthAdjust; x += widthAdjust;
@ -874,10 +871,10 @@ const WorkspacesDisplay = new Lang.Class({
monitors[i].y, monitors[i].y,
monitors[i].width, monitors[i].width,
monitors[i].height); monitors[i].height);
this._workspacesViews[m].setGeometry(monitors[i].x + overviewSpacing/2, this._workspacesViews[m].setGeometry(monitors[i].x,
monitors[i].y + overviewSpacing/2, monitors[i].y,
monitors[i].width - overviewSpacing, monitors[i].width,
monitors[i].height - overviewSpacing); monitors[i].height);
m++; m++;
} }
} }