100 lines
2.4 KiB
JavaScript
100 lines
2.4 KiB
JavaScript
import ctEvents from 'ct-events'
|
|
import { getCurrentScreen } from '../helpers/current-screen'
|
|
|
|
const loadMenuEntry = () => import('../header/menu')
|
|
|
|
const onlyWithSubmenus = (menu) =>
|
|
menu.querySelector('.menu-item-has-children') ||
|
|
menu.querySelector('.page_item_has_children')
|
|
|
|
export const menuEntryPoints = [
|
|
{
|
|
els: () =>
|
|
[
|
|
...document.querySelectorAll(
|
|
'header [data-device="desktop"] [data-id*="menu"] > .menu'
|
|
),
|
|
...document.querySelectorAll('.ct-header-account > ul'),
|
|
].filter((menu) => onlyWithSubmenus(menu)),
|
|
load: () => import('../header/sub-menu-open-logic'),
|
|
events: ['ct:header:refresh-menu-submenus'],
|
|
},
|
|
|
|
{
|
|
els: () => [
|
|
...document.querySelectorAll(
|
|
'header [data-device="desktop"] [data-id^="menu"][data-responsive]'
|
|
),
|
|
],
|
|
load: () => import('../header/responsive-desktop-menu'),
|
|
events: ['ct:header:responsive-menu:refresh'],
|
|
condition: () => {
|
|
if (getCurrentScreen() !== 'desktop') {
|
|
return false
|
|
}
|
|
|
|
return [
|
|
...document.querySelectorAll(
|
|
'header [data-device="desktop"] [data-id^="menu"][data-responsive]'
|
|
),
|
|
].some((menu) => {
|
|
if (!menu.firstElementChild) {
|
|
return false
|
|
}
|
|
|
|
const menuRect = menu.firstElementChild.getBoundingClientRect()
|
|
|
|
const allEls = [
|
|
...menu
|
|
.closest('[data-row]')
|
|
.querySelectorAll('[data-items] > [data-id]'),
|
|
]
|
|
.filter((el) => el !== menu)
|
|
.filter((el) => {
|
|
const elRect = el.getBoundingClientRect()
|
|
|
|
return [
|
|
menuRect,
|
|
|
|
...[...menu.firstElementChild.children].map(
|
|
(child) => child.getBoundingClientRect()
|
|
),
|
|
].some((rect) => {
|
|
const intersectsLeftEdge =
|
|
elRect.left < rect.left &&
|
|
elRect.right > rect.left
|
|
|
|
const intersectsRightEdge =
|
|
elRect.right > rect.right &&
|
|
elRect.left < rect.right
|
|
|
|
const isInside =
|
|
elRect.left > rect.left &&
|
|
elRect.right < rect.right
|
|
|
|
return (
|
|
intersectsLeftEdge ||
|
|
intersectsRightEdge ||
|
|
isInside
|
|
)
|
|
})
|
|
})
|
|
|
|
const parentRect = menu.parentElement.getBoundingClientRect()
|
|
|
|
const fitsLeftSide = menuRect.left > parentRect.left
|
|
const fitsRightSide = menuRect.right < parentRect.right
|
|
|
|
const fits =
|
|
fitsLeftSide && fitsRightSide && allEls.length === 0
|
|
|
|
if (fits) {
|
|
menu.dataset.responsive = 'yes'
|
|
}
|
|
|
|
return !fits
|
|
})
|
|
},
|
|
},
|
|
]
|