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

Resolve overflow on X-axis issue and reimplement onScroll event listener

Browse Source
This commit is contained in:
Aljaž Grilc 2024-05-24 10:13:12 +02:00
parent 033b56329f
commit 76ba7788c0
1 changed files with 5 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
service2.js
View File

@ -8,6 +8,10 @@
*/ */
let besServices = [] let besServices = []
window.addEventListener('scroll', () =>
besServices.forEach(service => service.onScroll())
)
// TODO: Window resize may cause host element(s) to move. That needs correction panel and status icon // TODO: Window resize may cause host element(s) to move. That needs correction panel and status icon
// repositioning. Also, should any parent element of our service host element move, we should reposition // repositioning. Also, should any parent element of our service host element move, we should reposition
// correction panel and status icon. How to do this? Alas there is no PlacementObserver to monitor host // correction panel and status icon. How to do this? Alas there is no PlacementObserver to monitor host
@ -262,20 +266,14 @@ class BesService {
*/ */
setCorrectionPanelSize() { setCorrectionPanelSize() {
const styles = window.getComputedStyle(this.hostElement) const styles = window.getComputedStyle(this.hostElement)
const totalWidth =
parseFloat(styles.paddingLeft) +
parseFloat(styles.marginLeft) +
parseFloat(styles.width) +
parseFloat(styles.marginRight) +
parseFloat(styles.paddingRight)
const totalHeight = const totalHeight =
parseFloat(styles.paddingTop) + parseFloat(styles.paddingTop) +
parseFloat(styles.marginTop) + parseFloat(styles.marginTop) +
parseFloat(styles.height) + parseFloat(styles.height) +
parseFloat(styles.marginBottom) + parseFloat(styles.marginBottom) +
parseFloat(styles.paddingBottom) parseFloat(styles.paddingBottom)
this.correctionPanel.style.width = `${totalWidth}px`
this.correctionPanel.style.height = `${totalHeight}px` this.correctionPanel.style.height = `${totalHeight}px`
this.correctionPanel.style.width = styles.width
this.correctionPanel.style.marginLeft = styles.marginLeft this.correctionPanel.style.marginLeft = styles.marginLeft
this.correctionPanel.style.marginRight = styles.marginRight this.correctionPanel.style.marginRight = styles.marginRight
this.correctionPanel.style.paddingLeft = styles.paddingLeft this.correctionPanel.style.paddingLeft = styles.paddingLeft