Add checks for if sidebar exists (refined)

pull/5015/head
Daniel 2023-04-02 11:51:52 +05:30
parent 9625827c3a
commit 5d2ebcec02
2 changed files with 50 additions and 51 deletions

View File

@ -18,24 +18,23 @@ const distPath = (path != undefined) ? path : '../../../dist'
<!-- OPTIONAL SCRIPTS --> <!-- OPTIONAL SCRIPTS -->
<script is:inline> <script is:inline>
const SELECTOR_APP_SIDEBAR = '.app-sidebar'
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper' const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper'
const Default = { const Default = {
scrollbarTheme: 'os-theme-light', scrollbarTheme: 'os-theme-light',
scrollbarAutoHide: 'leave' scrollbarAutoHide: 'leave',
scrollbarClickScroll: true
} }
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
if (document.querySelector(SELECTOR_APP_SIDEBAR)) { const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER)
if (typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') { if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
OverlayScrollbarsGlobal.OverlayScrollbars(document.querySelector(SELECTOR_SIDEBAR_WRAPPER), { OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
scrollbars: { scrollbars: {
theme: Default.scrollbarTheme, theme: Default.scrollbarTheme,
autoHide: Default.scrollbarAutoHide, autoHide: Default.scrollbarAutoHide,
clickScroll: true clickScroll: Default.scrollbarClickScroll
} }
}) })
}
} }
}) })
</script> </script>

View File

@ -152,53 +152,53 @@ class PushMenu {
*/ */
domReady(() => { domReady(() => {
const sidebar = document.querySelector(SELECTOR_APP_SIDEBAR) const sidebar = document?.querySelector(SELECTOR_APP_SIDEBAR) as HTMLElement | undefined
if (sidebar) { if (sidebar) {
const data = new PushMenu(document.body, Defaults) const data = new PushMenu(sidebar, Defaults)
data.init() data.init()
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
data.init() data.init()
}) })
const sidebarOverlay = document.createElement('div')
sidebarOverlay.className = CLASS_NAME_SIDEBAR_OVERLAY
document.querySelector(SELECTOR_APP_WRAPPER)?.append(sidebarOverlay)
sidebarOverlay.addEventListener('touchstart', event => {
event.preventDefault()
const target = event.currentTarget as HTMLElement
const data = new PushMenu(target, Defaults)
data.collapse()
})
sidebarOverlay.addEventListener('click', event => {
event.preventDefault()
const target = event.currentTarget as HTMLElement
const data = new PushMenu(target, Defaults)
data.collapse()
})
const fullBtn = document.querySelectorAll(SELECTOR_SIDEBAR_TOGGLE)
fullBtn.forEach(btn => {
btn.addEventListener('click', event => {
event.preventDefault()
let button = event.currentTarget as HTMLElement | undefined
if (button?.dataset.lteToggle !== 'sidebar') {
button = button?.closest(SELECTOR_SIDEBAR_TOGGLE) as HTMLElement | undefined
}
if (button) {
event?.preventDefault()
const data = new PushMenu(button, Defaults)
data.toggle()
}
})
})
} }
const sidebarOverlay = document.createElement('div')
sidebarOverlay.className = CLASS_NAME_SIDEBAR_OVERLAY
document.querySelector(SELECTOR_APP_WRAPPER)?.append(sidebarOverlay)
sidebarOverlay.addEventListener('touchstart', event => {
event.preventDefault()
const target = event.currentTarget as HTMLElement
const data = new PushMenu(target, Defaults)
data.collapse()
})
sidebarOverlay.addEventListener('click', event => {
event.preventDefault()
const target = event.currentTarget as HTMLElement
const data = new PushMenu(target, Defaults)
data.collapse()
})
const fullBtn = document.querySelectorAll(SELECTOR_SIDEBAR_TOGGLE)
fullBtn.forEach(btn => {
btn.addEventListener('click', event => {
event.preventDefault()
let button = event.currentTarget as HTMLElement | undefined
if (button?.dataset.lteToggle !== 'sidebar') {
button = button?.closest(SELECTOR_SIDEBAR_TOGGLE) as HTMLElement | undefined
}
if (button) {
event?.preventDefault()
const data = new PushMenu(button, Defaults)
data.toggle()
}
})
})
}) })
export default PushMenu export default PushMenu