diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index 19645d70e..c0c6aa935 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -616,6 +616,10 @@ StScrollBar StButton#vhandle:active { spacing: 40px; } +#overview-group { + spacing: 32px; +} + .window-caption { spacing: 25px; } diff --git a/js/ui/overview.js b/js/ui/overview.js index 7780e8263..40f4acfd8 100644 --- a/js/ui/overview.js +++ b/js/ui/overview.js @@ -23,9 +23,6 @@ const WorkspaceThumbnail = imports.ui.workspaceThumbnail; // Time for initial animation going into Overview mode const ANIMATION_TIME = 0.25; -// XXX -- grab this automatically. Hard to do. -const DASH_MAX_WIDTH = 96; - const DND_WINDOW_SWITCH_TIMEOUT = 1250; const GLSL_DIM_EFFECT_DECLARATIONS = ''; @@ -136,23 +133,15 @@ const Overview = new Lang.Class({ this._desktopFade = new St.Bin(); global.overlay_group.add_actor(this._desktopFade); - this._spacing = 0; - /* Translators: This is the main view to select activities. See also note for "Activities" string. */ - this._group = new St.Widget({ name: 'overview', - accessible_name: _("Overview"), - reactive: true }); - this._group._delegate = this; - this._group.connect('style-changed', - Lang.bind(this, function() { - let node = this._group.get_theme_node(); - let spacing = node.get_length('spacing'); - if (spacing != this._spacing) { - this._spacing = spacing; - this._relayout(); - } - })); + this._overview = new St.BoxLayout({ name: 'overview', + accessible_name: _("Overview"), + reactive: true, + vertical: true }); + this._overview._delegate = this; + + this._group = new St.BoxLayout({ name: 'overview-group' }); this._capturedEventId = 0; this._buttonPressId = 0; @@ -169,12 +158,11 @@ const Overview = new Lang.Class({ // Dash elements, or mouseover handlers in the workspaces. this._coverPane = new Clutter.Rectangle({ opacity: 0, 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._group.hide(); - global.overlay_group.add_actor(this._group); + this._overview.hide(); + global.overlay_group.add_actor(this._overview); this._coverPane.hide(); @@ -213,6 +201,13 @@ const Overview = new Lang.Class({ 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', /* Translators: this is the text displayed in the search entry when no search is @@ -221,16 +216,13 @@ const Overview = new Lang.Class({ hint_text: _("Type to search..."), track_hover: true, can_focus: true }); - this._group.add_actor(this._searchEntry); - - this._dash = new Dash.Dash(); - this._viewSelector = new ViewSelector.ViewSelector(this._searchEntry, - this._dash.showAppsButton); - this._group.add_actor(this._viewSelector.actor); - this._group.add_actor(this._dash.actor); + this._searchEntryBin = new St.Bin({ child: this._searchEntry, + x_align: St.Align.MIDDLE }); + this._overview.add_actor(this._searchEntryBin); // 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._dash.connect('icon-size-changed', Lang.bind(this, function() { @@ -241,6 +233,23 @@ const Overview = new Lang.Class({ // the left of the overview 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)); this._relayout(); }, @@ -337,7 +346,7 @@ const Overview = new Lang.Class({ if (this.isDummy) return; - this._group.add_action(action); + this._overview.add_action(action); }, _getDesktopClone: function() { @@ -363,41 +372,15 @@ const Overview = new Lang.Class({ this.hide(); let primary = Main.layoutManager.primaryMonitor; - let rtl = (Clutter.get_default_text_direction() == Clutter.TextDirection.RTL); let contentY = Main.panel.actor.height; let contentHeight = primary.height - contentY - Main.messageTray.actor.height; - this._group.set_position(primary.x, primary.y); - this._group.set_size(primary.width, primary.height); + this._overview.set_position(primary.x, primary.y); + this._overview.set_size(primary.width, primary.height); this._coverPane.set_position(0, contentY); 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 //// @@ -481,12 +464,12 @@ const Overview = new Lang.Class({ // Disable unredirection while in the overview Meta.disable_unredirect_for_screen(global.screen); global.window_group.hide(); - this._group.show(); + this._overview.show(); this._background.show(); this._viewSelector.show(); - this._group.opacity = 0; - Tweener.addTween(this._group, + this._overview.opacity = 0; + Tweener.addTween(this._overview, { opacity: 255, transition: 'easeOutQuad', time: ANIMATION_TIME, @@ -578,7 +561,7 @@ const Overview = new Lang.Class({ if (this._shown) { if (!this._modal) { - if (Main.pushModal(this._group, + if (Main.pushModal(this._overview, { keybindingMode: Main.KeybindingMode.OVERVIEW })) this._modal = true; else @@ -586,13 +569,13 @@ const Overview = new Lang.Class({ } } else if (this._shownTemporarily) { if (this._modal) { - Main.popModal(this._group); + Main.popModal(this._overview); this._modal = false; } global.stage_input_mode = Shell.StageInputMode.FULLSCREEN; } else { if (this._modal) { - Main.popModal(this._group); + Main.popModal(this._overview); this._modal = false; } else if (global.stage_input_mode == Shell.StageInputMode.FULLSCREEN) @@ -610,7 +593,7 @@ const Overview = new Lang.Class({ this._viewSelector.zoomFromOverview(); // Make other elements fade out. - Tweener.addTween(this._group, + Tweener.addTween(this._overview, { opacity: 0, transition: 'easeOutQuad', time: ANIMATION_TIME, @@ -652,7 +635,7 @@ const Overview = new Lang.Class({ this._viewSelector.hide(); this._desktopFade.hide(); this._background.hide(); - this._group.hide(); + this._overview.hide(); this.visible = false; this.animationInProgress = false; diff --git a/js/ui/viewSelector.js b/js/ui/viewSelector.js index 060c885ea..868fab78c 100644 --- a/js/ui/viewSelector.js +++ b/js/ui/viewSelector.js @@ -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', new Gio.Settings({ schema: SHELL_KEYBINDINGS_SCHEMA }), Meta.KeyBindingFlags.NONE, diff --git a/js/ui/workspacesView.js b/js/ui/workspacesView.js index 31322380e..00f627ba4 100644 --- a/js/ui/workspacesView.js +++ b/js/ui/workspacesView.js @@ -129,11 +129,10 @@ const WorkspacesView = new Lang.Class({ continue; let ws = new Workspace.Workspace(null, i); - let overviewSpacing = Main.overview._spacing; - ws.setGeometry(monitors[i].x + overviewSpacing/2, - monitors[i].y + overviewSpacing/2, - monitors[i].width - overviewSpacing, - monitors[i].height - overviewSpacing); + ws.setGeometry(monitors[i].x, + monitors[i].y, + monitors[i].width, + monitors[i].height); global.overlay_group.add_actor(ws.actor); this._extraWorkspaces.push(ws); } @@ -854,9 +853,7 @@ const WorkspacesDisplay = new Lang.Class({ let clipX = rtl ? x + controlsVisible : x; let clipY = y + (fullHeight - clipHeight) / 2; - let overviewSpacing = Main.overview._spacing; let widthAdjust = this._zoomOut ? controlsNatural : controlsVisible; - widthAdjust += overviewSpacing; width -= widthAdjust; if (rtl) x += widthAdjust; @@ -874,10 +871,10 @@ const WorkspacesDisplay = new Lang.Class({ monitors[i].y, monitors[i].width, monitors[i].height); - this._workspacesViews[m].setGeometry(monitors[i].x + overviewSpacing/2, - monitors[i].y + overviewSpacing/2, - monitors[i].width - overviewSpacing, - monitors[i].height - overviewSpacing); + this._workspacesViews[m].setGeometry(monitors[i].x, + monitors[i].y, + monitors[i].width, + monitors[i].height); m++; } }