From 70d6da1fb28dffe54a4bbc8b09097485875da4e3 Mon Sep 17 00:00:00 2001 From: ulrich Date: Sat, 16 May 2020 08:36:18 +0000 Subject: [PATCH] Nicht mehr benoetigte Abhaengigkeiten entfernt, Stile verfeinert --- web/ui2/js/app.js | 111 ++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 85 insertions(+), 26 deletions(-) diff --git a/web/ui2/js/app.js b/web/ui2/js/app.js index 6013ed8..6c407e7 100644 --- a/web/ui2/js/app.js +++ b/web/ui2/js/app.js @@ -1,12 +1,8 @@ function NutzerApp() { var self = this; - //var appMenu; var vorlagen; - //var api; var userid; - //var pfad = ''; var loc; - //var modus = 'kacheln'; this.init = function () { self.vorlagen = new Vorlagen(); @@ -20,10 +16,6 @@ self.loc = window.location.protocol + '//' + window.location.host; }; - this.datei_neuer_text = function () { - self.meldung_mit_timeout("Neuer Text", 1500); - }; - /* Nutzerverwaltung */ this.nutzer_neu_dialog_zeigen = function () { @@ -33,7 +25,6 @@ btn.addEventListener('click', self.nutzer_speichern); } }); - //self.menue_umschalten(); }; this.nutzerliste_klick = function(event) { @@ -44,7 +35,7 @@ } target.classList.add("nutzer-gewaehlt"); var nutzerId = target.innerHTML; - self.rollen_dialog_zeigen(nutzerId); + self.rollen_zeigen(nutzerId); }; this.nutzer_speichern = function() { @@ -69,34 +60,45 @@ /* Rollen erteilen und entziehen */ - this.rollen_dialog_zeigen = function(nutzerId) { + this.rollen_zeigen = function(nutzerId) { var m = 'getUserRoleNames'; var u = '../svc/' + m + '?p=' + nutzerId; self.http_get(u, function (antwort) { + var jsonAntwort = JSON.parse(antwort); + var rollen = jsonAntwort.List[0]; + if(typeof rollen === 'object') { + rollen = jsonAntwort; + } else { + rollen = 'keine'; + } self.vorlagen.html_erzeugen( 'data/tpl/nutzer-rollen-dlg.tpl', - JSON.parse(antwort), + rollen, function (html) { document.querySelector("#nutzer").innerHTML = html; document.querySelector("#nutzer-id").textContent = nutzerId; self.addEvtListener('.granted-role-btn', 'click', self.revoke_role_klick); - var m = 'getRoleNamesGranted'; - var u = '../svc/' + m; - self.http_get(u, function (antwort2) { - self.vorlagen.html_erzeugen( - 'data/tpl/alle-rollen.tpl', - JSON.parse(antwort2), - function (html) { - document.querySelector(".alle-rollen-behaelter").innerHTML = html; - document.querySelector('.zurueck-btn').addEventListener('click', function (e) { - self.get_user_list(); - }); - self.addEvtListener('.avl-role-btn', 'click', self.grant_role_klick); - }); - }); + self.alle_rollen_zeigen(); }); }); document.querySelector('.zurueck-btn').style.color = 'black'; + }; + + this.alle_rollen_zeigen = function() { + var m = 'getRoleNamesGranted'; + var u = '../svc/' + m; + self.http_get(u, function (antwort2) { + self.vorlagen.html_erzeugen( + 'data/tpl/alle-rollen.tpl', + JSON.parse(antwort2), + function (html) { + document.querySelector(".alle-rollen-behaelter").innerHTML = html; + document.querySelector('.zurueck-btn').addEventListener('click', function (e) { + self.get_user_list(); + }); + self.addEvtListener('.avl-role-btn', 'click', self.grant_role_klick); + }); + }); }; this.grant_role_klick = function(event) { @@ -314,6 +316,63 @@ } +/* ----- Vorlagen ----- */ + +function Vorlagen() { + var self = this; + this.cache = {}; // mustache templates + + /* + Das HTML erzeugen, das entsteht, wenn eine Vorlage mit Inhalt + gefüllt wird + + Das Füllen erfolgt asynchron, d.h. der Programmlauf geht nach dem + Aufruf weiter ohne auf das Laden und Füllen der Vorlage zu warten. + Das fertige HTML wird der Callback-Funktion übergeben + sobald die Vorlage geladen und gefüllt ist, unabhängig davon, wo der + Programmlauf zu diesem Zeitpunkt mittlerweile ist. + + vurl - URL zur Vorlagendatei + inhalt - die JSON-Struktur, deren Inhalt in die + Vorlage gefüllt werden soll + cb - Callback-Funktion, die gerufen wird, wenn die Vorlage gefüllt ist. + Dieser Callback-Funktion wird das fertige HTML übergeben + */ + this.html_erzeugen = function(vurl, inhalt, cb) { + var vorlage = self.cache[vurl]; + if(vorlage === undefined) { + self.vorlage_laden_und_fuellen(vurl, inhalt, cb); + } else { + self.vorlage_fuellen(vurl, inhalt, cb); + } + }; + + this.vorlage_fuellen = function(vurl, inhalt, cb) { + cb(Mustache.render(self.cache[vurl], inhalt)); + }; + + /* + Eine Vorlage vom Server in den lokalen Speicher laden + vurl - der URL unter dem die Vorlage zu finden ist + inhalt - die JSON-Struktur, deren Inhalt in die + Vorlage gefüllt werden soll + cb - callback: Diese Funktion wird gerufen, wenn die Vorlage mit dem + Inhalt gefüllt ist + */ + this.vorlage_laden_und_fuellen = function(vurl, inhalt, cb) { + var xmlhttp = new XMLHttpRequest(); + xmlhttp.onreadystatechange = function() { + if (this.readyState == 4 && this.status == 200) { + self.cache[vurl] = this.responseText; + self.vorlage_fuellen(vurl, inhalt, cb); + } + }; + xmlhttp.open("GET", vurl, true); + xmlhttp.send(); + }; + +} + /* ----- Objekte ----- */ -- Gitblit v1.9.3