service2.js: Mind horizontal scrolling, padding and margins too

This commit is contained in:
Simon Rozman 2024-05-23 11:12:46 +02:00
parent 06513cab05
commit 273c96b78c

View File

@ -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`
}
}