/*
|
* die nachfolgenden Funktionen steuern das ein- und
|
* ausblenden des menues
|
*/
|
function app_menu_init(url_prefix, mdesc, mtpl, mselector) {
|
_app_menu_selector = mselector;
|
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 = $("<div/>");
|
$(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", "16em");
|
}
|
}
|
|
/*
|
* ab hier Steuerung des Menueinhalts
|
*/
|
|
var _app_menu_url_prefix = "";
|
var _app_menu_template;
|
var _app_menu_selector;
|
|
/*
|
* 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 = $("<div/>");
|
$(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");
|
}
|
