https://www.veringenstadt.de/fileadmin/templates/extensions/hw_menu/js/hw_submenu.js

1import * as hwMenu from './hw_menu__shared.js';
2
3export function generateSubMenuData(currentId) {
4	const hwMenuContainer = document.querySelector('.hw_menu');
5	let hw_menu__data__sub = hwMenu.getData(hwMenuContainer);
6	const activeElement = hwMenu.buildMenuData(hw_menu__data__sub, currentId);
7
8	hw_menu__data__sub[0].activeElement = activeElement;
9
10	return hw_menu__data__sub;
11}
12
13export function generateSubMenu(container, data, maxDepth) {
14	hwMenu.checkForExpanded(data[0]);
15
16	const activeElement = data[0].activeElement;
17	const parentAtDepth1 = hwMenu.getParentAtDepth(activeElement, 1);
18	const subMenuTitleHtml = `
19	    <div id="subnavi-wrap">
20			<div class="subnavi_sticky_wrap">
21				<button id="subnavi_open" data-text-open="Untermenü öffnen" data-text-close="Untermenü schließen" aria-pressed="false" title="Untermenü öffnen">
22					<span class="button_icon">
23						<span class="reader_icon sr-only">Untermenü öffnen</span>
24						<i class="fa-regular fa-arrow-right-long fa-xl"></i>
25					</span>
26					<span class="schrift" aria-hidden="true">Menü</span>
27				</button>
28
29				<nav class="hw_menu__secondary">
30					<span id="submenu_title">
31						<span class="sr-only">Sie befinden sich im folgenden Menüpunkt: </span>
32						<span>${parentAtDepth1.title} ${parentAtDepth1.subtitle}</span>
33					</span>
34				</nav>
35			</div>
36		</div>
37	`;
38
39	const htmlFragment = document.createRange().createContextualFragment(subMenuTitleHtml);
40
41	htmlFragment.querySelector('.hw_menu__secondary').append(buildSubMenu(data, 1, maxDepth, activeElement));
42	container.insertBefore(htmlFragment, container.firstChild);
43	hwMenu.initializeMenu(data, 'subMenu', 1);
44}
45
46function buildSubMenu(data, depth, maxDepth, activeElement) {
47	const subMenu = `
48				<ul class="hw_menu__list" data-depth="${depth}" aria-expanded="true">
49				</ul>
50			`;
51
52	const htmlFragment = document.createRange().createContextualFragment(subMenu);
53
54	hwMenu.getParentAtDepth(data[0].activeElement, depth).children.map(itemData => {
55		htmlFragment.querySelector('.hw_menu__list').append(hwMenu.buildMenuListElement(itemData, true, maxDepth, activeElement));
56	});
57
58	return htmlFragment;
59}
60
61