From ee378724076ae6917f9c75c329d7ff7c390b8f03 Mon Sep 17 00:00:00 2001
From: ulrich <undisclosed>
Date: Fri, 13 Dec 2019 17:26:19 +0000
Subject: [PATCH] jQuery entfernen weiter in Arbeit
---
jslib/app-menu/app-menu.js | 144 +++++++++++++++++++++++-------------------------
1 files changed, 69 insertions(+), 75 deletions(-)
diff --git a/jslib/app-menu/app-menu.js b/jslib/app-menu/app-menu.js
index 1d1a0ce..62c4760 100644
--- a/jslib/app-menu/app-menu.js
+++ b/jslib/app-menu/app-menu.js
@@ -15,38 +15,45 @@
/*document.querySelector( "#nav-toggle" ).addEventListener("click", function() {
app_menu_toggle();
});*/
- $(self._app_menu_selector).css("flex-basis", "0em");
+ var menu = document.querySelector(self._app_menu_selector);
+ menu.style.flexBasis = '0em';
self._app_menu_url_prefix = url_prefix;
- $.get(mtpl, function(template) {
- self._app_menu_template = template;
- Mustache.parse(self._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');
- $(self._app_menu_selector).append(menuDiv);
- self.app_menu_laden(mdesc);
+ 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) {
- /*document.querySelector( "#nav-toggle" ).classList.toggle( "active" );
- document.querySelector( "#nav-toggle" ).blur();*/
self.toggle();
};
this.toggle = function() {
- /*document.querySelector( "#nav-toggle" ).classList.toggle( "active" );
- document.querySelector( "#nav-toggle" ).blur();*/
- var menuDiv = $(self._app_menu_selector);
- if($(menuDiv).hasClass('app-menu-open')) {
- $(menuDiv).removeClass('app-menu-open');
- $(menuDiv).css("flex-basis", "0em");
+ var menuDiv = document.querySelector(self._app_menu_selector);
+ if(menuDiv.classList.contains('app-menu-open')) {
+ menuDiv.classList.remove('app-menu-open');
+ menuDiv.style.flexBasis = '0em';
} else {
- $(menuDiv).addClass('app-menu-open');
- $(menuDiv).css("flex-basis", self._app_menu_mbreite); // z.B. "16em"
+ menuDiv.classList.add('app-menu-open');
+ menuDiv.style.flexBasis = self._app_menu_mbreite;
}
};
@@ -59,66 +66,34 @@
* mdesc: der URL einer JSON-Datei mit einer Menuebeschreibung
*/
this.app_menu_laden = function(mdesc, richtung) {
- $.ajax({
- url: self._app_menu_url_prefix + mdesc,
- type: "GET",
- dataType : "json"
- }).done(function( json ) {
- self.app_menu_bauen(json, richtung);
- });
+ var xmlhttp = new XMLHttpRequest();
+ var url = self._app_menu_url_prefix + mdesc;
+ xmlhttp.onreadystatechange = function() {
+ if (this.readyState == 4 && this.status == 200) {
+ self.app_menu_bauen(JSON.parse(this.responseText), richtung);
+ }
+ };
+ xmlhttp.open("GET", url, true);
+ xmlhttp.send();
};
this.app_menu_bauen = function(menuejs, richtung) {
+ var menuDiv = document.createElement("div");
+ menuDiv.classList.add('app-menu-content');
+ menuDiv.style.position = 'relative';
+ menuDiv.innerHTML = Mustache.render(self._app_menu_template, menuejs);
- // 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";
+ 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);
- 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 menu = document.querySelector(self._app_menu_selector);
+ menu.innerHTML = '';
+ menu.append(menuDiv);
- var menuDiv = $("<div/>");
- $(menuDiv).addClass('app-menu-content');
-
- $(menuDiv).css('position', "relative");
- $(menuDiv).css('left', linksAnfangNeu);
- $(menuDiv).css('right', rechtsAnfangNeu);
- $(menuDiv).html(Mustache.render(self._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');
- $(self._app_menu_selector).empty();
-
- $(self._app_menu_selector).append(menuDiv);
- $('.smenu').on('click', self.app_menu_klick_herunter);
- $('.bitem').on('click', self.app_menu_klick_herauf);
- $('.mitem').on('click', self.app_menu_ausfuehren);
-
- $('.app-menu-content').delay(100).animate({left: linksEndeNeu });
- $('.app-menu-content').animate({right: rechtsEndeNeu });
- }
- );
- $('.app-menu-content').animate({right: rechtsEndeAlt });
+ 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);
};
this.app_menu_klick_herunter = function() {
@@ -134,4 +109,23 @@
eval(functionName + "(this)");
};
+ /* --- Helferlein ---*/
+ /*
+ sel - '.smenu'
+ evt - 'click' fuer onclick
+ func - der verweis auf die funktion
+ */
+ this.app_menu_remove_event_listener_multi = function(sel, evt, func) {
+ var elem = document.querySelectorAll(sel);
+ for (var index = 0; index < elem.length; index++) {
+ elem[index].removeEventListener(evt, func);
+ }
+ };
+
+ this.app_menu_add_event_listener_multi = function(sel, evt, func) {
+ var elem = document.querySelectorAll(sel);
+ for (var index = 0; index < elem.length; index++) {
+ elem[index].addEventListener(evt, func);
+ }
+ };
}
--
Gitblit v1.9.3