Amebis/BesService
2
2
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Simon Rozman 2024-05-23 11:12:46 +02:00
parent 06513cab05
commit 273c96b78c
1 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
service2.js
View File

@ -236,12 +236,17 @@ class BesService {
*/ */
setCorrectionPanelSize() { setCorrectionPanelSize() {
const styles = window.getComputedStyle(this.hostElement) 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 = const totalHeight =
parseFloat(styles.height) +
parseFloat(styles.marginTop) +
parseFloat(styles.marginBottom) +
parseFloat(styles.paddingTop) + parseFloat(styles.paddingTop) +
parseFloat(styles.marginTop) +
parseFloat(styles.height) +
parseFloat(styles.marginBottom) +
parseFloat(styles.paddingBottom) parseFloat(styles.paddingBottom)
this.correctionPanel.style.width = `${totalWidth}px` this.correctionPanel.style.width = `${totalWidth}px`
this.correctionPanel.style.height = `${totalHeight}px` this.correctionPanel.style.height = `${totalHeight}px`
@ -292,8 +297,9 @@ class BesService {
*/ */
setStatusDivPosition() { setStatusDivPosition() {
const rect = this.hostElement.getBoundingClientRect() const rect = this.hostElement.getBoundingClientRect()
const scrollLeft = window.scrollX || document.documentElement.scrollLeft
const scrollTop = window.scrollY || document.documentElement.scrollTop 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` this.statusDiv.style.top = `${rect.top + rect.height - 30 + scrollTop}px`
} }
@ -898,8 +904,9 @@ class BesCKService extends BesTreeService {
setStatusDivPosition() { setStatusDivPosition() {
// TODO: New position needs to be tested on better displays (4K, etc.) // TODO: New position needs to be tested on better displays (4K, etc.)
const rect = this.hostElement.getBoundingClientRect() const rect = this.hostElement.getBoundingClientRect()
const scrollLeft = window.scrollX || document.documentElement.scrollLeft
const scrollTop = window.scrollY || document.documentElement.scrollTop 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` this.statusDiv.style.top = `${rect.top + rect.height - 120 + scrollTop}px`
} }
} }