[gnome-shell] workspacesView: Decrease workspaces size on external monitors

[Marge Bot <marge-bot src gnome org>]

commit 082eedd968b5964563c1b711e959a6cc40ea1d28
Author: Florian Müllner <fmuellner gnome org>
Date:   Sat Feb 20 13:34:39 2021 +0100

    workspacesView: Decrease workspaces size on external monitors
    
    Now that the backgrounds was moved into workspaces, the fullscreen
    views on secondary monitors are visually inconsistent with the
    primary view, as there's no dash or search entry that reduces the
    available height and allows adjacent workspaces to peek in.
    
    Address this by adding padding above and below the view, so that
    it is limited to 70% of the available height.
    
    Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1735>

 js/ui/workspacesView.js | 45 +++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 43 insertions(+), 2 deletions(-)
---
diff --git a/js/ui/workspacesView.js b/js/ui/workspacesView.js
index e604e73a3f..f9c7fcdccf 100644
--- a/js/ui/workspacesView.js
+++ b/js/ui/workspacesView.js
@@ -19,6 +19,8 @@ const WORKSPACE_MAX_SPACING = 80;
 
 const WORKSPACE_INACTIVE_SCALE = 0.94;
 
+const SECONDARY_WORKSPACE_SCALE = 0.70;
+
 var WorkspacesViewBase = GObject.registerClass({
     GTypeFlags: GObject.TypeFlags.ABSTRACT,
 }, class WorkspacesViewBase extends St.Widget {
@@ -616,13 +618,52 @@ class SecondaryMonitorDisplay extends St.Widget {
         this._updateWorkspacesView();
     }
 
+    _getWorkspacesBoxForState(state, box, padding) {
+        const { ControlsState } = OverviewControls;
+        const workspaceBox = box.copy();
+        const [width, height] = workspaceBox.get_size();
+
+        switch (state) {
+        case ControlsState.HIDDEN:
+            break;
+        case ControlsState.WINDOW_PICKER:
+        case ControlsState.APP_GRID:
+            workspaceBox.set_origin(0, padding);
+            workspaceBox.set_size(
+                width,
+                height - 2 * padding);
+            break;
+        }
+
+        return workspaceBox;
+    }
+
     vfunc_allocate(box) {
         this.set_allocation(box);
 
         const themeNode = this.get_theme_node();
         const contentBox = themeNode.get_content_box(box);
-
-        this._workspacesView.allocate(contentBox);
+        const [, height] = contentBox.get_size();
+        const padding =
+            Math.round((1 - SECONDARY_WORKSPACE_SCALE) * height / 2);
+
+        const {
+            currentState, initialState, finalState, transitioning, progress,
+        } = this._overviewAdjustment.getStateTransitionParams();
+
+        let workspacesBox;
+        const workspaceParams = [contentBox, padding];
+        if (!transitioning) {
+            workspacesBox =
+                this._getWorkspacesBoxForState(currentState, ...workspaceParams);
+        } else {
+            const initialBox =
+                this._getWorkspacesBoxForState(initialState, ...workspaceParams);
+            const finalBox =
+                this._getWorkspacesBoxForState(finalState, ...workspaceParams);
+            workspacesBox = initialBox.interpolate(finalBox, progress);
+        }
+        this._workspacesView.allocate(workspacesBox);
     }
 
     _onDestroy() {