mirror of https://github.com/ColorlibHQ/AdminLTE
Add checks for if sidebar exists (refined)
parent
9625827c3a
commit
5d2ebcec02
|
@ -18,24 +18,23 @@ const distPath = (path != undefined) ? path : '../../../dist'
|
|||
|
||||
<!-- OPTIONAL SCRIPTS -->
|
||||
<script is:inline>
|
||||
const SELECTOR_APP_SIDEBAR = '.app-sidebar'
|
||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper'
|
||||
const Default = {
|
||||
scrollbarTheme: 'os-theme-light',
|
||||
scrollbarAutoHide: 'leave'
|
||||
scrollbarAutoHide: 'leave',
|
||||
scrollbarClickScroll: true
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
if (document.querySelector(SELECTOR_APP_SIDEBAR)) {
|
||||
if (typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
||||
OverlayScrollbarsGlobal.OverlayScrollbars(document.querySelector(SELECTOR_SIDEBAR_WRAPPER), {
|
||||
scrollbars: {
|
||||
theme: Default.scrollbarTheme,
|
||||
autoHide: Default.scrollbarAutoHide,
|
||||
clickScroll: true
|
||||
}
|
||||
})
|
||||
}
|
||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER)
|
||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
||||
scrollbars: {
|
||||
theme: Default.scrollbarTheme,
|
||||
autoHide: Default.scrollbarAutoHide,
|
||||
clickScroll: Default.scrollbarClickScroll
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
|
|
@ -152,53 +152,53 @@ class PushMenu {
|
|||
*/
|
||||
|
||||
domReady(() => {
|
||||
const sidebar = document.querySelector(SELECTOR_APP_SIDEBAR)
|
||||
const sidebar = document?.querySelector(SELECTOR_APP_SIDEBAR) as HTMLElement | undefined
|
||||
|
||||
if (sidebar) {
|
||||
const data = new PushMenu(document.body, Defaults)
|
||||
const data = new PushMenu(sidebar, Defaults)
|
||||
data.init()
|
||||
|
||||
window.addEventListener('resize', () => {
|
||||
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
|
||||
|
|
Loading…
Reference in New Issue