| function AppVorlage() { | 
|   var self = this; | 
|   var appMenu; | 
|   var vorlagen; | 
|   | 
|   this.init = function() { | 
|     self.vorlagen = new Vorlagen(); | 
|     self.appMenu = new AppMenu(); | 
|     self.appMenu.init( | 
|       "data/menu/", | 
|       "hauptmenue.json", | 
|       "data/tpl/app-menu.tpl", | 
|       ".west", | 
|       "8em"); | 
|   | 
|     document.querySelector('.hamburger').addEventListener('click', function(e) { | 
|       self.menue_umschalten(); | 
|     }); | 
|   | 
|   }; | 
|   | 
|   this.menue_umschalten = function() { | 
|     var ham = document.querySelector(".hamburger"); | 
|     ham.classList.toggle("is-active"); // hamburger-icon umschalten | 
|     self.appMenu.toggle(); // menue oeffnen/schliessen | 
|   }; | 
|   | 
|   this.info_dialog_zeigen = function() { | 
|     self.dialog_laden_und_zeigen('data/tpl/dlg-info.tpl', ''); | 
|     self.menue_umschalten(); | 
|   }; | 
|   | 
|   this.seitenleiste_umschalten = function() { | 
|     var ostDiv = document.querySelector('.ost'); | 
|     if(ostDiv.classList.contains('ost-open')) { | 
|       ostDiv.classList.remove('ost-open'); | 
|         ostDiv.style.flexBasis = '0em'; | 
|     } else { | 
|         ostDiv.classList.add('ost-open'); | 
|         ostDiv.style.flexBasis = '6em'; | 
|     } | 
|     self.menue_umschalten(); | 
|   }; | 
|   | 
|   this.fusszeile_umschalten = function() { | 
|     var suedDiv = document.querySelector('.sued'); | 
|     if(suedDiv.classList.contains('sued-open')) { | 
|       suedDiv.classList.remove('sued-open'); | 
|         suedDiv.style.height = '0'; | 
|     } else { | 
|       suedDiv.classList.add('sued-open'); | 
|         suedDiv.style.height = '1.5em'; | 
|     } | 
|     self.menue_umschalten(); | 
|   }; | 
|   | 
|   this.menu_message = function(msg) { | 
|     self.meldung_mit_timeout(msg, 1500); | 
|     var suedDiv = document.querySelector('.sued'); | 
|     if(suedDiv.classList.contains('sued-open')) { | 
|     } else { | 
|       suedDiv.classList.add('sued-open'); | 
|         suedDiv.style.height = '1.5em'; | 
|     } | 
|     self.menue_umschalten(); | 
|   }; | 
|   | 
|   this.message_1 = function() { | 
|     self.menu_message('Eine Mitteilung.'); | 
|   }; | 
|   | 
|   this.message_2 = function() { | 
|     self.menu_message('Was wir schon immer sagen wollten.'); | 
|   }; | 
|   | 
|   this.message_3 = function(text) { | 
|     self.menu_message(text); | 
|   }; | 
|   | 
|   this.meldung_mit_timeout = function(meldung, timeout) { | 
|     var s = document.querySelector('.sued'); | 
|     s.textContent = meldung; | 
|     setTimeout(function() { | 
|       s.textContent = 'Bereit.'; | 
|       setTimeout(function() { | 
|         var suedDiv = document.querySelector('.sued'); | 
|         if(suedDiv.classList.contains('sued-open')) { | 
|               suedDiv.classList.remove('sued-open'); | 
|               suedDiv.style.height = '0'; | 
|         } | 
|       }, 500); | 
|     }, timeout); | 
|   }; | 
|   | 
|   /* Dialog-Funktionen */ | 
|   | 
|   /* | 
|     Einen Dialog aus Vorlagen erzeugen | 
|   | 
|     vurl - URL zur Dialogvorlage | 
|     msgTpl - URL mit einer Vorlage eines Mitteilungstextes (optional) | 
|   */ | 
|   this.dialog_laden_und_zeigen = function(vurl, msgTpl) { | 
|     if(msgTpl !== '') { | 
|       fetch(msgTpl) | 
|         .then(data => { | 
|           // Handle data | 
|           self.dialog_zeigen(vurl, data); | 
|         }).catch(error => { | 
|           // Handle error | 
|         }); | 
|     } else { | 
|       self.dialog_zeigen(vurl, ''); | 
|     } | 
|   }; | 
|   | 
|   this.dialog_zeigen = function(vurl, inhalt) { | 
|     var dlg = document.querySelector(".dialog"); | 
|     self.vorlagen.html_erzeugen( | 
|       vurl, | 
|       inhalt, | 
|       function(html) { | 
|         //dlg.html(html); | 
|         dlg.style.height = '5em'; | 
|         dlg.innerHTML = html; | 
|         document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen); | 
|         //dlg.slideDown(300); | 
|     }); | 
|   }; | 
|   | 
|   self.dialog_schliessen = function() { | 
|     document.querySelector('.close-btn').removeEventListener('click', self.dialog_schliessen); | 
|     //$('.dialog').slideUp(300); | 
|     var dlg = document.querySelector('.dialog'); | 
|     //dlg.style.display = "none"; | 
|     dlg.style.height = '0'; | 
|     dlg.innerHTML = ''; | 
|   }; | 
|   | 
|   | 
| } |