From 273c96b78c5697ccc7471fc86a31b820c6448b0d Mon Sep 17 00:00:00 2001
From: Simon Rozman <simon@rozman.si>
Date: Thu, 23 May 2024 11:12:46 +0200
Subject: [PATCH] service2.js: Mind horizontal scrolling, padding and margins
 too

---
 service2.js | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/service2.js b/service2.js
index af439f4..c554ac4 100644
--- a/service2.js
+++ b/service2.js
@@ -236,12 +236,17 @@ class BesService {
    */
   setCorrectionPanelSize() {
     const styles = window.getComputedStyle(this.hostElement)
-    const totalWidth = parseFloat(styles.width)
+    const totalWidth =
+      parseFloat(styles.paddingLeft) +
+      parseFloat(styles.marginLeft) +
+      parseFloat(styles.width) +
+      parseFloat(styles.marginRight) +
+      parseFloat(styles.paddingRight)
     const totalHeight =
-      parseFloat(styles.height) +
-      parseFloat(styles.marginTop) +
-      parseFloat(styles.marginBottom) +
       parseFloat(styles.paddingTop) +
+      parseFloat(styles.marginTop) +
+      parseFloat(styles.height) +
+      parseFloat(styles.marginBottom) +
       parseFloat(styles.paddingBottom)
     this.correctionPanel.style.width = `${totalWidth}px`
     this.correctionPanel.style.height = `${totalHeight}px`
@@ -292,8 +297,9 @@ class BesService {
    */
   setStatusDivPosition() {
     const rect = this.hostElement.getBoundingClientRect()
+    const scrollLeft = window.scrollX || document.documentElement.scrollLeft
     const scrollTop = window.scrollY || document.documentElement.scrollTop
-    this.statusDiv.style.left = `${rect.right - 40}px`
+    this.statusDiv.style.left = `${rect.right - 40 + scrollLeft}px`
     this.statusDiv.style.top = `${rect.top + rect.height - 30 + scrollTop}px`
   }
 
@@ -898,8 +904,9 @@ class BesCKService extends BesTreeService {
   setStatusDivPosition() {
     // TODO: New position needs to be tested on better displays (4K, etc.)
     const rect = this.hostElement.getBoundingClientRect()
+    const scrollLeft = window.scrollX || document.documentElement.scrollLeft
     const scrollTop = window.scrollY || document.documentElement.scrollTop
-    this.statusDiv.style.left = `${rect.right - 50}px`
+    this.statusDiv.style.left = `${rect.right - 50 + scrollLeft}px`
     this.statusDiv.style.top = `${rect.top + rect.height - 120 + scrollTop}px`
   }
 }