ed

resources/[jobs]/[mdt]/myEmergency/html/js/classes/menu.js

@@ -0,0 +1,78 @@
+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);
+    }
+
+}