forked from Simnation/Main
78 lines
No EOL
2.7 KiB
JavaScript
78 lines
No EOL
2.7 KiB
JavaScript
class NavMenu{
|
|
|
|
constructor(navigation, cursystem){
|
|
this.navid = "main_navigation";
|
|
|
|
let navEl = document.getElementById(this.navid);
|
|
|
|
Array.from(navEl.getElementsByTagName("li")).forEach(function(itm){
|
|
if(!itm.classList.contains("noremoveonrebuild")){
|
|
itm.remove();
|
|
}
|
|
|
|
});
|
|
Array.from(navEl.querySelectorAll(".divider")).forEach(function(itm){
|
|
itm.remove();
|
|
});
|
|
|
|
if(!navigation[cursystem]){
|
|
cursystem = "default";
|
|
}
|
|
|
|
if(navigation[cursystem]){
|
|
|
|
navigation = navigation[cursystem]
|
|
Object.keys(navigation).forEach(key=>{
|
|
|
|
if(key !== "none"){
|
|
navEl.innerHTML+=`<div class="divider no-translation nav-checkfor-nextelements mt-1 mb-1" data-tkey="${key}">{{${key}}}</div>`
|
|
}
|
|
|
|
Object.keys(navigation[key]).forEach(subKey=>{
|
|
let skeyname = navigation[key][subKey].key;
|
|
let destination = navigation[key][subKey].destination;
|
|
let forceReload = navigation[key][subKey].forceReload;
|
|
navEl.innerHTML+=`
|
|
<li id="menuItem-li-${skeyname}" class="nav-checkrights divier-${key}" data-rightkey="${navigation[key][subKey].rightkey ?? ""}">
|
|
<a id="menuitem-${skeyname}" class="font-normal no-translation is-navigation-link" data-iconclasses="${navigation[key][subKey].img}" data-tkey="${destination}" data-destination="${destination}", data-forceReload="${forceReload}">
|
|
<i class="${navigation[key][subKey].img}"></i>
|
|
{{${skeyname}}}
|
|
</a>
|
|
</li>
|
|
`;
|
|
});
|
|
});
|
|
}
|
|
|
|
|
|
|
|
Array.from(document.getElementById(this.navid).querySelectorAll(".is-navigation-link")).forEach(function(item){
|
|
|
|
item.onclick=function(){
|
|
handleMenuItemClick(this);
|
|
}
|
|
});
|
|
|
|
Array.from(document.getElementById(this.navid).querySelectorAll(".no-translation")).forEach(function(item){
|
|
let icon = "";
|
|
if(item.getAttribute("data-iconclasses") !== null){
|
|
icon = `<i class="${item.getAttribute("data-iconclasses")}"></i> `;
|
|
}
|
|
|
|
item.innerHTML = icon + Translations[locale][item.getAttribute("data-tkey")];
|
|
item.classList.remove("no-translation");
|
|
|
|
});
|
|
|
|
}
|
|
|
|
setItemActive(item){
|
|
Array.from(document.getElementById(this.navid).querySelectorAll(".bordered")).forEach(function(currentitem){
|
|
currentitem.classList.remove("bordered");
|
|
});
|
|
item.parentElement.classList.add("bordered");
|
|
|
|
setCurrentPageHeadLine(item.innerText);
|
|
}
|
|
|
|
} |