/* * die nachfolgenden Funktionen steuern das ein- und * ausblenden des menues */ function app_menu_init(url_prefix, mdesc, mtpl, mselector, mbreite) { _app_menu_selector = mselector; _app_menu_mbreite = mbreite; /*document.querySelector( "#nav-toggle" ).addEventListener("click", function() { app_menu_toggle(); });*/ $(_app_menu_selector).css("flex-basis", "0em"); _app_menu_url_prefix = url_prefix; $.get(mtpl, function(template) { _app_menu_template = template; Mustache.parse(_app_menu_template); // optional, speeds up future uses var menuDiv = $("
"); $(menuDiv).addClass('app-menu-content'); $(menuDiv).css('position', "relative"); $(menuDiv).css('left', '-300px'); $(menuDiv).css('right', '0px'); $(_app_menu_selector).append(menuDiv); app_menu_laden(mdesc); }); } function app_menu_do_toggle(elem) { /*document.querySelector( "#nav-toggle" ).classList.toggle( "active" ); document.querySelector( "#nav-toggle" ).blur();*/ app_menu_toggle(); } function app_menu_toggle() { /*document.querySelector( "#nav-toggle" ).classList.toggle( "active" ); document.querySelector( "#nav-toggle" ).blur();*/ var westDiv = $(_app_menu_selector); if($(westDiv).hasClass('app-menu-open')) { $(westDiv).removeClass('app-menu-open'); $(westDiv).css("flex-basis", "0em"); } else { $(westDiv).addClass('app-menu-open'); $(westDiv).css("flex-basis", _app_menu_mbreite); // z.B. "16em" } } /* * ab hier Steuerung des Menueinhalts */ var _app_menu_url_prefix = ""; var _app_menu_template; var _app_menu_selector; var _app_menu_mbreite; /* * mdesc: der URL einer JSON-Datei mit einer Menuebeschreibung */ function app_menu_laden(mdesc, richtung) { $.ajax({ url: _app_menu_url_prefix + mdesc, type: "GET", dataType : "json" }).done(function( json ) { app_menu_bauen(json, richtung); }); } function app_menu_bauen(menuejs, richtung) { // Endposition des bestehenden Menues beim Wechsel herauf var linksEndeAlt = "500px"; var rechtsEndeAlt = "600px"; // Anfangsposition des neuen Menues beim Wechsel herauf var linksAnfangNeu = "-300px"; var rechtsAnfangNeu = "-1px"; // Endposition des neuen Menues beim Wechsel herauf var linksEndeNeu = "0px"; var rechtsEndeNeu = "300px"; if(richtung === 'herunter') { // Endposition des bestehenden Menues beim Wechsel herunter linksEndeAlt = "-300px"; rechtsEndeAlt = "-1px"; // Anfangsposition des neuen Menues beim Wechsel herunter linksAnfangNeu = "500px"; rechtsAnfangNeu = "600px"; // Endposition des neuen Menues beim Wechsel herunter linksEndeNeu = "0px"; rechtsEndeNeu = "300px"; } var menuDiv = $(""); $(menuDiv).addClass('app-menu-content'); $(menuDiv).css('position', "relative"); $(menuDiv).css('left', linksAnfangNeu); $(menuDiv).css('right', rechtsAnfangNeu); $(menuDiv).html(Mustache.render(_app_menu_template, menuejs)); $('.app-menu-content').delay(100).animate( {left: linksEndeAlt }, 100, function() { $('.smenu').attr('onclick','').unbind('click'); $('.bitem').attr('onclick','').unbind('click'); $('.mitem').attr('onclick','').unbind('click'); $(_app_menu_selector).empty(); $(_app_menu_selector).append(menuDiv); $('.smenu').on('click', app_menu_klick_herunter); $('.bitem').on('click', app_menu_klick_herauf); $('.mitem').on('click', app_menu_ausfuehren); $('.app-menu-content').delay(100).animate({left: linksEndeNeu }); $('.app-menu-content').animate({right: rechtsEndeNeu }); } ); $('.app-menu-content').animate({right: rechtsEndeAlt }); } function app_menu_klick_herunter() { app_menu_laden($(this).attr('data-verweis'), 'herunter'); } function app_menu_klick_herauf() { app_menu_laden($(this).attr('data-verweis'), 'herauf'); } function app_menu_ausfuehren() { var functionName = $(this).attr('data-verweis'); eval(functionName + "(this)"); } function app_menu_test() { alert("Test"); } function app_menu_test_2() { alert("Test 2"); }