[gnome-shell] ControlsManagerLayout: Allocate respecting the work area

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

commit 81a1e294f8bd161410233961d2cae4f87304d577
Author: Marco Trevisan (Treviño) <mail 3v1n0 net>
Date:   Fri Jun 18 19:51:02 2021 +0200

    ControlsManagerLayout: Allocate respecting the work area
    
    We build controls layout using the whole monitor vertical space as
    available, however extensions or external apps in X11 may reduce the
    workarea size horizontally and the shell should always take care of it.
    
    Given that we're already assuming that the allocation is monitor-based
    and that we're adjusting it to the workarea, we can just make it more
    explicit by using a workarea box that is used as the allocation area.
    
    As per this, we also apply the same logic of applied to the vertical
    dimension to the horizontal one.
    
    Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1892>

 js/ui/overviewControls.js | 45 +++++++++++++++++++++++++--------------------
 1 file changed, 25 insertions(+), 20 deletions(-)
---
diff --git a/js/ui/overviewControls.js b/js/ui/overviewControls.js
index 66424bdab5..6cbaa22ba9 100644
--- a/js/ui/overviewControls.js
+++ b/js/ui/overviewControls.js
@@ -47,8 +47,9 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
         stateAdjustment.connect('notify::value', () => this.layout_changed());
     }
 
-    _computeWorkspacesBoxForState(state, box, startY, searchHeight, dashHeight, thumbnailsHeight) {
-        const workspaceBox = box.copy();
+    _computeWorkspacesBoxForState(state, workAreaBox, searchHeight, dashHeight, thumbnailsHeight) {
+        const workspaceBox = workAreaBox.copy();
+        const [startX, startY] = workAreaBox.get_origin();
         const [width, height] = workspaceBox.get_size();
         const { spacing } = this;
         const { expandFraction } = this._workspacesThumbnails;
@@ -57,7 +58,7 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
         case ControlsState.HIDDEN:
             break;
         case ControlsState.WINDOW_PICKER:
-            workspaceBox.set_origin(0,
+            workspaceBox.set_origin(startX,
                 startY + searchHeight + spacing +
                 thumbnailsHeight + spacing * expandFraction);
             workspaceBox.set_size(width,
@@ -67,7 +68,7 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
                 thumbnailsHeight - spacing * expandFraction);
             break;
         case ControlsState.APP_GRID:
-            workspaceBox.set_origin(0, startY + searchHeight + spacing);
+            workspaceBox.set_origin(startX, startY + searchHeight + spacing);
             workspaceBox.set_size(
                 width,
                 Math.round(height * SMALL_WORKSPACE_RATIO));
@@ -77,18 +78,19 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
         return workspaceBox;
     }
 
-    _getAppDisplayBoxForState(state, box, startY, searchHeight, dashHeight, appGridBox) {
-        const [width, height] = box.get_size();
+    _getAppDisplayBoxForState(state, workAreaBox, searchHeight, dashHeight, appGridBox) {
+        const [startX, startY] = workAreaBox.get_origin();
+        const [width, height] = workAreaBox.get_size();
         const appDisplayBox = new Clutter.ActorBox();
         const { spacing } = this;
 
         switch (state) {
         case ControlsState.HIDDEN:
         case ControlsState.WINDOW_PICKER:
-            appDisplayBox.set_origin(0, box.y2);
+            appDisplayBox.set_origin(startX, workAreaBox.y2);
             break;
         case ControlsState.APP_GRID:
-            appDisplayBox.set_origin(0,
+            appDisplayBox.set_origin(startX,
                 startY + searchHeight + spacing + appGridBox.get_height());
             break;
         }
@@ -126,34 +128,37 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
         return [0, 0];
     }
 
-    vfunc_allocate(container, box) {
+    vfunc_allocate(_container, _box) {
         const childBox = new Clutter.ActorBox();
 
         const { spacing } = this;
 
         const monitor = Main.layoutManager.findMonitorForActor(this._container);
         const workArea = Main.layoutManager.getWorkAreaForMonitor(monitor.index);
+        const startX = workArea.x - monitor.x;
         const startY = workArea.y - monitor.y;
-        box.y1 += startY;
-        box.y2 -= (monitor.height - workArea.height) - startY;
-        const [width, height] = box.get_size();
+        const workAreaBox = new Clutter.ActorBox();
+        workAreaBox.set_origin(startX, startY);
+        workAreaBox.set_size(workArea.width, workArea.height);
+        const [width, height] = workAreaBox.get_size();
         let availableHeight = height;
+        const availableWidth = width;
 
         // Search entry
         let [searchHeight] = this._searchEntry.get_preferred_height(width);
-        childBox.set_origin(0, startY);
+        childBox.set_origin(startX, startY);
         childBox.set_size(width, searchHeight);
         this._searchEntry.allocate(childBox);
 
         availableHeight -= searchHeight + spacing;
 
         // Dash
-        const maxDashHeight = Math.round(box.get_height() * DASH_MAX_HEIGHT_RATIO);
+        const maxDashHeight = Math.round(workAreaBox.get_height() * DASH_MAX_HEIGHT_RATIO);
         this._dash.setMaxSize(width, maxDashHeight);
 
         let [, dashHeight] = this._dash.get_preferred_height(width);
         dashHeight = Math.min(dashHeight, maxDashHeight);
-        childBox.set_origin(0, startY + height - dashHeight);
+        childBox.set_origin(startX, startY + height - dashHeight);
         childBox.set_size(width, dashHeight);
         this._dash.allocate(childBox);
 
@@ -168,13 +173,13 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
             thumbnailsHeight = Math.min(
                 thumbnailsHeight * expandFraction,
                 height * WorkspaceThumbnail.MAX_THUMBNAIL_SCALE);
-            childBox.set_origin(0, startY + searchHeight + spacing);
+            childBox.set_origin(startX, startY + searchHeight + spacing);
             childBox.set_size(width, thumbnailsHeight);
             this._workspacesThumbnails.allocate(childBox);
         }
 
         // Workspaces
-        let params = [box, startY, searchHeight, dashHeight, thumbnailsHeight];
+        let params = [workAreaBox, searchHeight, dashHeight, thumbnailsHeight];
         const transitionParams = this._stateAdjustment.getStateTransitionParams();
 
         // Update cached boxes
@@ -199,7 +204,7 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
             const workspaceAppGridBox =
                 this._cachedWorkspaceBoxes.get(ControlsState.APP_GRID);
 
-            params = [box, startY, searchHeight, dashHeight, workspaceAppGridBox];
+            params = [workAreaBox, searchHeight, dashHeight, workspaceAppGridBox];
             let appDisplayBox;
             if (!transitionParams.transitioning) {
                 appDisplayBox =
@@ -217,8 +222,8 @@ class ControlsManagerLayout extends Clutter.BoxLayout {
         }
 
         // Search
-        childBox.set_origin(0, startY + searchHeight + spacing);
-        childBox.set_size(width, availableHeight);
+        childBox.set_origin(startX, startY + searchHeight + spacing);
+        childBox.set_size(availableWidth, availableHeight);
 
         this._searchController.allocate(childBox);