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

overviewControls: Incorporate ActivitiesContainer

Browse Source 
Move AppDisplay, WorkspacesDisplay, and ThumbnailsBox from ViewSelector to
ControlsManager. This allows to always allocate the correct size for AppDisplay,
and will enable for a plethora of further improvements. The end goal is to
completely remove ViewSelector, and let ControlsManager handle the layout of
everything that's visible in the overview.

For now, replace the apps page with a dummy actor in ViewSelector.

Adjust various callers around the codebase to not access the ViewSelector
directly from the overview anymore.

Bind the opacity of the primary workspace to WorkspaceDisplay's opacity. This
allows removing the parent opacity hack in place, which will be done by the
next commit.

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1624>
This commit is contained in:
Georges Basile Stavracas Neto 2021-01-14 20:23:15 -03:00 committed by Marge Bot
parent 83127bf805
commit c09c070b15
5 changed files with 280 additions and 193 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
js/ui/overview.js
View File

@ -138,10 +138,6 @@ var Overview = class {
return this.dash.iconSize;
}
get viewSelector() {
return this._overview.viewSelector;
}
get animationInProgress() {
return this._animationInProgress;
}
@ -240,11 +236,11 @@ var Overview = class {
}
addSearchProvider(provider) {
this.viewSelector.addSearchProvider(provider);
this._overview.viewSelector.addSearchProvider(provider);
}
removeSearchProvider(provider) {
this.viewSelector.removeSearchProvider(provider);
this._overview.viewSelector.removeSearchProvider(provider);
}
//
@ -578,7 +574,6 @@ var Overview = class {
// Re-enable unredirection
Meta.enable_unredirect_for_display(global.display);
this.viewSelector.hide();
this._desktopFade.hide();
this._coverPane.hide();

284
js/ui/overviewControls.js
View File

@ -3,11 +3,17 @@
const { Clutter, Gio, GObject, Meta, Shell, St } = imports.gi;
const AppDisplay = imports.ui.appDisplay;
const Dash = imports.ui.dash;
const Main = imports.ui.main;
const Overview = imports.ui.overview;
const Util = imports.misc.util;
const ViewSelector = imports.ui.viewSelector;
const WindowManager = imports.ui.windowManager;
const WorkspaceThumbnail = imports.ui.workspaceThumbnail;
const WorkspacesView = imports.ui.workspacesView;
const SMALL_WORKSPACE_RATIO = 0.15;
var SIDE_CONTROLS_ANIMATION_TIME = Overview.ANIMATION_TIME;
@ -19,9 +25,13 @@ var ControlsState = {
var ControlsManagerLayout = GObject.registerClass(
class ControlsManagerLayout extends Clutter.BoxLayout {
_init(searchEntry, viewSelector, dash, stateAdjustment) {
_init(searchEntry, appDisplay, workspacesDisplay, workspacesThumbnails,
viewSelector, dash, stateAdjustment) {
super._init({ orientation: Clutter.Orientation.VERTICAL });
this._appDisplay = appDisplay;
this._workspacesDisplay = workspacesDisplay;
this._workspacesThumbnails = workspacesThumbnails;
this._stateAdjustment = stateAdjustment;
this._searchEntry = searchEntry;
this._viewSelector = viewSelector;
@ -30,6 +40,35 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
stateAdjustment.connect('notify::value', () => this.layout_changed());
}
_getWorkspacesBoxForState(state, box, searchHeight, dashHeight, thumbnailsHeight) {
const workspaceBox = box.copy();
const [width, height] = workspaceBox.get_size();
const { spacing } = this;
switch (state) {
case ControlsState.HIDDEN:
break;
case ControlsState.WINDOW_PICKER:
workspaceBox.set_origin(0,
searchHeight + spacing +
(thumbnailsHeight > 0 ? thumbnailsHeight + spacing : 0));
workspaceBox.set_size(width,
height -
dashHeight - spacing -
searchHeight - spacing -
(thumbnailsHeight > 0 ? thumbnailsHeight + spacing : 0));
break;
case ControlsState.APP_GRID:
workspaceBox.set_origin(0, searchHeight + spacing);
workspaceBox.set_size(
width,
Math.round(Math.max(height * SMALL_WORKSPACE_RATIO)));
break;
}
return workspaceBox;
}
vfunc_set_container(container) {
this._container = container;
this.hookup_style(container);
@ -59,19 +98,55 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
availableHeight -= dashHeight + spacing;
// ViewSelector
const initialBox = new Clutter.ActorBox();
initialBox.set_origin(0, 0);
initialBox.set_size(width, height);
// Workspace Thumbnails
let thumbnailsHeight = 0;
if (this._workspacesThumbnails.visible) {
[thumbnailsHeight] =
this._workspacesThumbnails.get_preferred_height(width);
thumbnailsHeight = Math.min(
thumbnailsHeight,
height * WorkspaceThumbnail.MAX_THUMBNAIL_SCALE);
childBox.set_origin(0, searchHeight + spacing);
childBox.set_size(width, thumbnailsHeight);
this._workspacesThumbnails.allocate(childBox);
}
// Workspaces
const params = [box, searchHeight, dashHeight, thumbnailsHeight];
const transitionParams = this._stateAdjustment.getStateTransitionParams();
let workspacesBox;
if (!transitionParams.transitioning) {
workspacesBox =
this._getWorkspacesBoxForState(transitionParams.currentState, ...params);
} else {
const initialBox =
this._getWorkspacesBoxForState(transitionParams.initialState, ...params);
const finalBox =
this._getWorkspacesBoxForState(transitionParams.finalState, ...params);
workspacesBox = initialBox.interpolate(finalBox, transitionParams.progress);
}
this._workspacesDisplay.allocate(workspacesBox);
// AppDisplay
const workspaceAppGridBox =
this._getWorkspacesBoxForState(ControlsState.APP_GRID, ...params);
childBox.set_origin(0, searchHeight + spacing + workspaceAppGridBox.get_height());
childBox.set_size(width,
height -
searchHeight - spacing -
workspaceAppGridBox.get_height() - spacing -
dashHeight);
this._appDisplay.allocate(childBox);
// ViewSelector
childBox.set_origin(0, searchHeight + spacing);
childBox.set_size(width, availableHeight);
const page = this._viewSelector.getActivePage();
const progress = page === ViewSelector.ViewPage.SEARCH
? 1 : Math.min(this._stateAdjustment.value, 1);
const viewSelectorBox = initialBox.interpolate(childBox, progress);
this._viewSelector.allocate(viewSelectorBox);
this._viewSelector.allocate(childBox);
}
});
@ -164,26 +239,65 @@ class ControlsManager extends St.Widget {
});
this._stateAdjustment = new OverviewAdjustment(this);
this._stateAdjustment.connect('notify::value', this._update.bind(this));
this._nWorkspacesNotifyId =
workspaceManager.connect('notify::n-workspaces',
this._updateAdjustment.bind(this));
this.viewSelector = new ViewSelector.ViewSelector(this._searchEntry,
this.dash.showAppsButton);
this.viewSelector.connect('page-empty', this._onPageEmpty.bind(this));
this._thumbnailsBox =
new WorkspaceThumbnail.ThumbnailsBox(this._workspaceAdjustment);
this._workspacesDisplay = new WorkspacesView.WorkspacesDisplay(
this._workspaceAdjustment,
this.dash.showAppsButton,
this._stateAdjustment);
this._appDisplay = new AppDisplay.AppDisplay();
this.add_child(searchEntryBin);
this.add_child(this._appDisplay);
this.add_child(this.dash);
this.add_child(this.viewSelector);
this.add_child(this._thumbnailsBox);
this.add_child(this._workspacesDisplay);
this.layout_manager = new ControlsManagerLayout(searchEntryBin,
this.viewSelector, this.dash, this._stateAdjustment);
this._appDisplay,
this._workspacesDisplay,
this._thumbnailsBox,
this.viewSelector,
this.dash,
this._stateAdjustment);
this.dash.showAppsButton.connect('notify::checked',
this._onShowAppsButtonToggled.bind(this));
Main.ctrlAltTabManager.addGroup(
this.appDisplay,
_('Applications'),
'view-app-grid-symbolic', {
proxy: this,
focusCallback: () => {
this.dash.showAppsButton.checked = true;
this.appDisplay.navigate_focus(
null, St.DirectionType.TAB_FORWARD, false);
},
});
Main.ctrlAltTabManager.addGroup(
this._workspacesDisplay,
_('Windows'),
'focus-windows-symbolic', {
proxy: this,
focusCallback: () => {
this.dash.showAppsButton.checked = false;
this._workspacesDisplay.navigate_focus(
null, St.DirectionType.TAB_FORWARD, false);
},
});
Main.wm.addKeybinding(
'toggle-application-view',
new Gio.Settings({ schema_id: WindowManager.SHELL_KEYBINDINGS_SCHEMA }),
@ -192,6 +306,136 @@ class ControlsManager extends St.Widget {
this._toggleAppsPage.bind(this));
this.connect('destroy', this._onDestroy.bind(this));
this._update();
}
_getFitModeForState(state) {
switch (state) {
case ControlsState.HIDDEN:
case ControlsState.WINDOW_PICKER:
return WorkspacesView.FitMode.SINGLE;
case ControlsState.APP_GRID:
return WorkspacesView.FitMode.ALL;
default:
return WorkspacesView.FitMode.SINGLE;
}
}
_getThumbnailsBoxParams() {
const { initialState, finalState, progress } =
this._stateAdjustment.getStateTransitionParams();
const paramsForState = s => {
let opacity, scale, translationY;
switch (s) {
case ControlsState.HIDDEN:
case ControlsState.WINDOW_PICKER:
opacity = 255;
scale = 1;
translationY = 0;
break;
case ControlsState.APP_GRID:
opacity = 0;
scale = 0.5;
translationY = this._thumbnailsBox.height / 2;
break;
default:
opacity = 255;
scale = 1;
translationY = 0;
break;
}
return { opacity, scale, translationY };
};
const initialParams = paramsForState(initialState);
const finalParams = paramsForState(finalState);
return [
Util.lerp(initialParams.opacity, finalParams.opacity, progress),
Util.lerp(initialParams.scale, finalParams.scale, progress),
Util.lerp(initialParams.translationY, finalParams.translationY, progress),
];
}
_updateThumbnailsBox(animate = false) {
const page = this.viewSelector.getActivePage();
const searching = page === ViewSelector.ViewPage.SEARCH;
const [opacity, scale, translationY] = this._getThumbnailsBoxParams();
const thumbnailsBoxVisible = !searching && opacity !== 0;
if (thumbnailsBoxVisible) {
this._thumbnailsBox.opacity = 0;
this._thumbnailsBox.visible = thumbnailsBoxVisible;
}
const params = {
opacity: searching ? 0 : opacity,
duration: animate ? SIDE_CONTROLS_ANIMATION_TIME : 0,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => (this._thumbnailsBox.visible = thumbnailsBoxVisible),
};
if (!searching) {
params.scale_x = scale;
params.scale_y = scale;
params.translation_y = translationY;
}
this._thumbnailsBox.ease(params);
}
_update() {
const params = this._stateAdjustment.getStateTransitionParams();
const fitMode = Util.lerp(
this._getFitModeForState(params.initialState),
this._getFitModeForState(params.finalState),
params.progress);
const { fitModeAdjustment } = this._workspacesDisplay;
fitModeAdjustment.value = fitMode;
this._updateThumbnailsBox();
}
_onPageEmpty() {
const page = this.viewSelector.getActivePage();
const isActivities = page === ViewSelector.ViewPage.ACTIVITIES;
if (isActivities) {
this._appDisplay.show();
this._workspacesDisplay.reactive = true;
this._workspacesDisplay.setPrimaryWorkspaceVisible(true);
} else {
this.viewSelector.show();
}
this._updateThumbnailsBox(true);
this._appDisplay.ease({
opacity: isActivities ? 255 : 0,
duration: SIDE_CONTROLS_ANIMATION_TIME,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => (this._appDisplay.visible = isActivities),
});
this._workspacesDisplay.ease({
opacity: isActivities ? 255 : 0,
duration: SIDE_CONTROLS_ANIMATION_TIME,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => {
this._workspacesDisplay.reactive = isActivities;
this._workspacesDisplay.setPrimaryWorkspaceVisible(isActivities);
},
});
this.viewSelector.ease({
opacity: isActivities ? 0 : 255,
duration: SIDE_CONTROLS_ANIMATION_TIME,
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
onComplete: () => (this.viewSelector.visible = !isActivities),
});
}
_onShowAppsButtonToggled() {
@ -235,10 +479,18 @@ class ControlsManager extends St.Widget {
this._workspaceAdjustment.value = activeIndex;
}
vfunc_unmap() {
this._workspacesDisplay.hide();
super.vfunc_unmap();
}
animateToOverview(state, callback) {
this._ignoreShowAppsButtonToggle = true;
this.viewSelector.prepareToEnterOverview();
this._workspacesDisplay.prepareToEnterOverview();
if (!this._workspacesDisplay.activeWorkspaceHasMaximizedWindows())
Main.overview.fadeOutDesktop();
this._stateAdjustment.value = ControlsState.HIDDEN;
this._stateAdjustment.ease(state, {
@ -259,7 +511,9 @@ class ControlsManager extends St.Widget {
animateFromOverview(callback) {
this._ignoreShowAppsButtonToggle = true;
this.viewSelector.prepareToLeaveOverview();
this._workspacesDisplay.prepareToLeaveOverview();
if (!this._workspacesDisplay.activeWorkspaceHasMaximizedWindows())
Main.overview.fadeInDesktop();
this._stateAdjustment.ease(ControlsState.HIDDEN, {
duration: Overview.ANIMATION_TIME,
@ -277,4 +531,8 @@ class ControlsManager extends St.Widget {
get searchEntry() {
return this._searchEntry;
}
get appDisplay() {
return this._appDisplay;
}
});

2
js/ui/shellDBus.js
View File

@ -101,7 +101,7 @@ var GnomeShell = class {
FocusApp(id) {
this.ShowApplications();
Main.overview.viewSelector.appDisplay.selectApp(id);
Main.overview.appDisplay.selectApp(id);
}
ShowApplications() {

176
js/ui/viewSelector.js
View File

@ -3,14 +3,10 @@
const { Clutter, GObject, Shell, St } = imports.gi;
const AppDisplay = imports.ui.appDisplay;
const Main = imports.ui.main;
const OverviewControls = imports.ui.overviewControls;
const Search = imports.ui.search;
const ShellEntry = imports.ui.shellEntry;
const Util = imports.misc.util;
const WorkspaceThumbnail = imports.ui.workspaceThumbnail;
const WorkspacesView = imports.ui.workspacesView;
var ViewPage = {
ACTIVITIES: 1,
@ -36,126 +32,13 @@ function getTermsForSearchString(searchString) {
return terms;
}
var ActivitiesContainer = GObject.registerClass(
class ActivitiesContainer extends St.Widget {
_init(thumbnailsBox, workspacesDisplay, appDisplay, overviewAdjustment) {
super._init();
// 0 for window picker, 1 for app grid
this._adjustment = new St.Adjustment({
actor: this,
value: 0,
lower: 0,
upper: 1,
});
this._adjustment.connect('notify::value', () => {
this._update();
this.queue_relayout();
});
overviewAdjustment.connect('notify::value', () => {
const { ControlsState } = OverviewControls;
const overviewState = overviewAdjustment.value;
this._appDisplay.visible =
overviewState >= ControlsState.WINDOW_PICKER;
this._adjustment.value = Math.max(0,
overviewAdjustment.value - ControlsState.WINDOW_PICKER);
});
this._thumbnailsBox = thumbnailsBox;
this.add_child(thumbnailsBox);
this._appDisplay = appDisplay;
this.add_child(appDisplay);
this._workspacesDisplay = workspacesDisplay;
this.add_child(workspacesDisplay);
this.connect('notify::mapped', () => {
workspacesDisplay.setPrimaryWorkspaceVisible(this.mapped);
});
this._update();
}
_update() {
const progress = this._adjustment.value;
this._appDisplay.opacity = progress * 255;
this._thumbnailsBox.set({
scale_x: Util.lerp(1, 0.5, progress),
scale_y: Util.lerp(1, 0.5, progress),
translation_y: Util.lerp(0, this._thumbnailsBox.height, progress),
opacity: Util.lerp(0, 255, 1 - progress),
visible: (1 - progress) !== 0,
});
const { fitModeAdjustment } = this._workspacesDisplay;
fitModeAdjustment.value = Util.lerp(
WorkspacesView.FitMode.SINGLE,
WorkspacesView.FitMode.ALL,
progress);
}
_getWorkspacesBoxes(box, thumbnailsHeight) {
const initialBox = box.copy();
initialBox.y1 += thumbnailsHeight;
const finalBox = box.copy();
finalBox.set_size(
box.get_width(),
Math.round(box.get_height() * 0.15));
return [initialBox, finalBox];
}
vfunc_allocate(box) {
this.set_allocation(box);
// Workspace Thumbnails
let thumbnailsHeight = 0;
if (this._thumbnailsBox.visible) {
const maxThumbnailScale = WorkspaceThumbnail.MAX_THUMBNAIL_SCALE;
const primaryMonitor = Main.layoutManager.primaryMonitor;
const [width, height] = box.get_size();
[, thumbnailsHeight] =
this._thumbnailsBox.get_preferred_height(width);
thumbnailsHeight = Math.min(
thumbnailsHeight,
(primaryMonitor ? primaryMonitor.height : height) * maxThumbnailScale);
const thumbnailsBox = new Clutter.ActorBox();
thumbnailsBox.set_origin(0, 0);
thumbnailsBox.set_size(width, thumbnailsHeight);
this._thumbnailsBox.allocate(thumbnailsBox);
}
const progress = this._adjustment.value;
const [initialBox, finalBox] =
this._getWorkspacesBoxes(box, thumbnailsHeight);
const workspacesBox = initialBox.interpolate(finalBox, progress);
this._workspacesDisplay.allocate(workspacesBox);
if (this._appDisplay.visible) {
const appDisplayBox = box.copy();
appDisplayBox.y1 += Math.ceil(finalBox.get_height());
this._appDisplay.allocate(appDisplayBox);
}
}
});
var ViewSelector = GObject.registerClass({
Signals: {
'page-changed': {},
'page-empty': {},
},
}, class ViewSelector extends Shell.Stack {
_init(searchEntry, workspaceAdjustment, showAppsButton, overviewAdjustment) {
_init(searchEntry, showAppsButton) {
super._init({
name: 'viewSelector',
x_expand: true,
@ -200,45 +83,9 @@ var ViewSelector = GObject.registerClass({
this._iconClickedId = 0;
this._capturedEventId = 0;
this._thumbnailsBox =
new WorkspaceThumbnail.ThumbnailsBox(workspaceAdjustment);
this._workspacesDisplay =
new WorkspacesView.WorkspacesDisplay(workspaceAdjustment, overviewAdjustment);
this.appDisplay = new AppDisplay.AppDisplay();
const activitiesContainer = new ActivitiesContainer(
this._thumbnailsBox,
this._workspacesDisplay,
this.appDisplay,
overviewAdjustment);
const dummy = new St.Widget();
this._activitiesPage =
this._addPage(activitiesContainer, _('Activities'), 'view-app-grid-symbolic');
Main.ctrlAltTabManager.addGroup(
this.appDisplay,
_('Applications'),
'edit-find-symbolic', {
proxy: this,
focusCallback: () => {
this._showPage(this._activitiesPage);
this._showAppsButton.checked = true;
this.appDisplay.navigate_focus(
null, St.DirectionType.TAB_FORWARD, false);
},
});
Main.ctrlAltTabManager.addGroup(
this._workspacesDisplay,
_('Windows'),
'focus-windows-symbolic', {
proxy: this,
focusCallback: () => {
this._showPage(this._activitiesPage);
this._showAppsButton.checked = false;
this._workspacesDisplay.navigate_focus(
null, St.DirectionType.TAB_FORWARD, false);
},
});
this._addPage(dummy, _('Activities'), 'view-app-grid-symbolic');
this._searchResults = new Search.SearchResultsView();
this._searchPage = this._addPage(this._searchResults);
@ -269,28 +116,15 @@ var ViewSelector = GObject.registerClass({
}
prepareToEnterOverview() {
this.show();
this.reset();
this._workspacesDisplay.prepareToEnterOverview();
this._activePage = null;
this._showPage(this._activitiesPage);
if (!this._workspacesDisplay.activeWorkspaceHasMaximizedWindows())
Main.overview.fadeOutDesktop();
}
prepareToLeaveOverview() {
this._workspacesDisplay.prepareToLeaveOverview();
if (!this._workspacesDisplay.activeWorkspaceHasMaximizedWindows())
Main.overview.fadeInDesktop();
}
vfunc_hide() {
vfunc_unmap() {
this.reset();
this._workspacesDisplay.hide();
super.vfunc_hide();
super.vfunc_unmap();
}
_addPage(actor) {

2
js/ui/workspacesView.js
View File

@ -503,7 +503,6 @@ var WorkspacesDisplay = GObject.registerClass(
class WorkspacesDisplay extends St.Widget {
_init(scrollAdjustment, overviewAdjustment) {
super._init({
visible: false,
clip_to_allocation: true,
layout_manager: new Clutter.BinLayout(),
});
@ -776,6 +775,7 @@ class WorkspacesDisplay extends St.Widget {
if (i === this._primaryIndex) {
view.visible = this._primaryVisible;
this.bind_property('opacity', view, 'opacity', GObject.BindingFlags.SYNC_CREATE);
this.add_child(view);
} else {
const { x, y, width, height } =