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 = ''; }; }