File was renamed from jslib/app-menu/app-menu.js |
| | |
| | | this.init = function (url_prefix, mdesc, mtpl, mselector, mbreite) { |
| | | self._app_menu_selector = mselector; |
| | | self._app_menu_mbreite = mbreite; |
| | | /*document.querySelector( "#nav-toggle" ).addEventListener("click", function() { |
| | | app_menu_toggle(); |
| | | });*/ |
| | | var menu = document.querySelector(self._app_menu_selector); |
| | | menu.style.flexBasis = '0em'; |
| | | self._app_menu_url_prefix = url_prefix; |
| | | |
| | | /* |
| | | Die Menue-Vorlage wird einmal zu Beginn geladen und |
| | | waehrend dem Programmlauf immer wieder neu zum Rendern |
| | | einer dynamisch gelandenen Menuebeschreibung verwendet |
| | | */ |
| | | var request = new XMLHttpRequest(); |
| | | request.open("GET", mtpl); |
| | | request.addEventListener('load', function(event) { |
| | | if (request.status >= 200 && request.status < 300) { |
| | | //console.log(request.responseText); |
| | | self._app_menu_template = request.responseText; |
| | | Mustache.parse(self._app_menu_template); // optional, speeds up future uses |
| | | var menuDiv = document.createElement("div"); |
| | | menuDiv.classList.add('app-menu-content'); |
| | | menuDiv.style.position = 'relative'; |
| | | menuDiv.style.left = '-300px'; |
| | | menuDiv.style.right = '0px'; |
| | | menu.appendChild(menuDiv); |
| | | |
| | | self.app_menu_laden(mdesc); |
| | | } else { |
| | | console.warn(request.statusText, request.responseText); |
| | | } |
| | | }); |
| | | request.send(); |
| | | |
| | | }; |
| | | |
| | | this.app_menu_do_toggle = function(elem) { |
| | |
| | | |
| | | |
| | | /* |
| | | * Menuebeschreibung als JSON-Datei laden |
| | | * mdesc: der URL einer JSON-Datei mit einer Menuebeschreibung |
| | | * richtung: z.Zt. unbenutzt: Animationsrichtung |
| | | */ |
| | | this.app_menu_laden = function(mdesc, richtung) { |
| | | var xmlhttp = new XMLHttpRequest(); |
| | |
| | | xmlhttp.send(); |
| | | }; |
| | | |
| | | /* |
| | | Aus einer Menuebeschreibung im JSON-Format mit Hilfe |
| | | von Mustache und der zu Beginn geladenen HTML-Vorlage |
| | | ein div-Element zusammenbauen, das als Menue eingeblendet |
| | | werden kann und dem Element _app_menu_selector hinzufuegen |
| | | */ |
| | | this.app_menu_bauen = function(menuejs, richtung) { |
| | | |
| | | // neues Menue als div-Element zusammensetzen |
| | | var menuDiv = document.createElement("div"); |
| | | menuDiv.classList.add('app-menu-content'); |
| | | menuDiv.style.position = 'relative'; |
| | | menuDiv.innerHTML = Mustache.render(self._app_menu_template, menuejs); |
| | | |
| | | // altes Menue loeschen |
| | | self.app_menu_remove_event_listener_multi('.smenu', 'click', self.app_menu_klick_herunter); |
| | | self.app_menu_remove_event_listener_multi('.bitem', 'click', self.app_menu_klick_herauf); |
| | | self.app_menu_remove_event_listener_multi('.mitem', 'click', self.app_menu_ausfuehren); |
| | | |
| | | var menu = document.querySelector(self._app_menu_selector); |
| | | menu.innerHTML = ''; |
| | | menu.append(menuDiv); |
| | | |
| | | // neues Menue hinzufuegen |
| | | menu.append(menuDiv); |
| | | self.app_menu_add_event_listener_multi('.smenu', 'click', self.app_menu_klick_herunter); |
| | | self.app_menu_add_event_listener_multi('.bitem', 'click', self.app_menu_klick_herauf); |
| | | self.app_menu_add_event_listener_multi('.mitem', 'click', self.app_menu_ausfuehren); |
| | | |
| | | menuDiv = document.querySelector('.app-menu-content'); |
| | | menuDiv.classList.add('slidein-from-right'); |
| | | }; |
| | | |
| | | this.app_menu_klick_herunter = function() { |