[gnome-shell/gnome-40] WorkspaceBackground: Fully take care of workarea geometry on allocation

[Florian Müllner <fmuellner src gnome org>]

commit a019b6ff48b8d837374564996bb4c5f1d37b68ea
Author: Marco Trevisan (Treviño) <mail 3v1n0 net>
Date:   Fri Jun 18 19:11:34 2021 +0200

    WorkspaceBackground: Fully take care of workarea geometry on allocation
    
    The background group is currently allocated taking care of the workarea
    x, y offset but not of its width/height and this may lead to building a
    wrongly sized workspace view when the workarea size is not matching the
    monitor size (like when there are struts set).
    
    So, take care of the difference between the workarea and monitor
    absolute end coordinates to allocate the background scaled content box.
    
    Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1892>
    (cherry picked from commit f30fa1adc77265cbaff2497c7abc7eed310fde72)

 js/ui/workspace.js | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)
---
diff --git a/js/ui/workspace.js b/js/ui/workspace.js
index 75efe4d992..fafa368ce7 100644
--- a/js/ui/workspace.js
+++ b/js/ui/workspace.js
@@ -1012,13 +1012,21 @@ class WorkspaceBackground extends St.Widget {
 
         const [contentWidth, contentHeight] = contentBox.get_size();
         const monitor = Main.layoutManager.monitors[this._monitorIndex];
-        const xOff = (contentWidth / this._workarea.width) *
-            (this._workarea.x - monitor.x);
-        const yOff = (contentHeight / this._workarea.height) *
-            (this._workarea.y - monitor.y);
-
-        contentBox.set_origin(-xOff, -yOff);
-        contentBox.set_size(xOff + contentWidth, yOff + contentHeight);
+        const [mX1, mX2] = [monitor.x, monitor.x + monitor.width];
+        const [mY1, mY2] = [monitor.y, monitor.y + monitor.height];
+        const [wX1, wX2] = [this._workarea.x, this._workarea.x + this._workarea.width];
+        const [wY1, wY2] = [this._workarea.y, this._workarea.y + this._workarea.height];
+        const xScale = contentWidth / this._workarea.width;
+        const yScale = contentHeight / this._workarea.height;
+        const leftOffset = wX1 - mX1;
+        const topOffset = wY1 - mY1;
+        const rightOffset = mX2 - wX2;
+        const bottomOffset = mY2 - wY2;
+
+        contentBox.set_origin(-leftOffset * xScale, -topOffset * yScale);
+        contentBox.set_size(
+            contentWidth + (leftOffset + rightOffset) * xScale,
+            contentHeight + (topOffset + bottomOffset) * yScale);
         this._backgroundGroup.allocate(contentBox);
     }