mirror of
https://akkoma.dev/AkkomaGang/akkoma-fe.git
synced 2024-11-10 02:30:13 +00:00
handle multiple body scroll lockers
This commit is contained in:
parent
8db1fa506c
commit
093d785fbf
1 changed files with 33 additions and 22 deletions
|
@ -2,13 +2,18 @@ import * as bodyScrollLock from 'body-scroll-lock'
|
|||
|
||||
let previousNavPaddingRight
|
||||
let previousAppBgWrapperRight
|
||||
let lockerEls = []
|
||||
|
||||
const disableBodyScroll = (el) => {
|
||||
const scrollBarGap = window.innerWidth - document.documentElement.clientWidth
|
||||
bodyScrollLock.disableBodyScroll(el, {
|
||||
reserveScrollBarGap: true
|
||||
})
|
||||
if (!lockerEls.includes(el)) {
|
||||
lockerEls.push(el)
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (lockerEls.length <= 1) {
|
||||
// If previousNavPaddingRight is already set, don't set it again.
|
||||
if (previousNavPaddingRight === undefined) {
|
||||
const navEl = document.getElementById('nav')
|
||||
|
@ -22,11 +27,16 @@ const disableBodyScroll = (el) => {
|
|||
appBgWrapperEl.style.right = previousAppBgWrapperRight ? `calc(${previousAppBgWrapperRight} + ${scrollBarGap}px)` : `${scrollBarGap}px`
|
||||
}
|
||||
document.body.classList.add('scroll-locked')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const enableBodyScroll = (el) => {
|
||||
if (lockerEls.includes(el)) {
|
||||
lockerEls = lockerEls.filter(e => e !== el)
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!lockerEls.length) {
|
||||
if (previousNavPaddingRight !== undefined) {
|
||||
document.getElementById('nav').style.paddingRight = previousNavPaddingRight
|
||||
// Restore previousNavPaddingRight to undefined so disableBodyScroll knows it can be set again.
|
||||
|
@ -38,6 +48,7 @@ const enableBodyScroll = (el) => {
|
|||
previousAppBgWrapperRight = undefined
|
||||
}
|
||||
document.body.classList.remove('scroll-locked')
|
||||
}
|
||||
})
|
||||
bodyScrollLock.enableBodyScroll(el)
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue