Nutzerverwaltung
view | history | commit | commitdiff
undisclosed
2020-05-14 ab2b54c221c5be0fd7ee12c0cecf2951265ba050
commit | author | age
3d5fe0 1 function NutzerApp() {
002c44 2   var self = this;
U 3   var appMenu;
4   var vorlagen;
5   var api;
6   var userid;
7   var pfad = '';
8   var loc;
9   var modus = 'kacheln';
10
11   this.datei_neuer_text = function () {
12     self.meldung_mit_timeout("Neuer Text", 1500);
13   };
f9d0c4 14   
U 15   /* Nutzerverwaltung */
16   
17   this.nutzerliste_klick = function(event) {
18     var target = event.target;
19     var gewaehlterNutzer = document.querySelector(".nutzer-gewaehlt");
20     if(gewaehlterNutzer !== null) {
21       gewaehlterNutzer.classList.remove("nutzer-gewaehlt");
22     }
23     target.classList.add("nutzer-gewaehlt");
c995b7 24     var nutzerId = target.innerHTML;
U 25     self.rollen_dialog_zeigen(nutzerId);
f9d0c4 26   };
d1b8b2 27   
U 28   this.nutzer_speichern = function() {
29     var user = self.nutzer_dialog_lesen();
30     var kww = document.getElementById('nutzer-wkw').value;
31     if(user.pw !== kww) {
32       self.meldung_mit_timeout("Kennworte stimmen nicht ueberein.", 1500);
33     } else {
34       self.neuen_nutzer_speichern('p=' + self.serialisieren(user));
35     }
36   };
37   
38   this.nutzer_dialog_lesen = function() {
39     var id = document.getElementById('nutzer-id').value;
40     var vname = document.getElementById('nutzer-vorname').value;
41     var nname = document.getElementById('nutzer-name').value;
42     var email = document.getElementById('nutzer-email').value;
43     var kw = document.getElementById('nutzer-kw').value;
44     var user = new User(id, kw, vname, nname, email);
45     return user;
46   };
002c44 47
U 48   /* Funktionen aus App-Vorlage */
49
50   this.init = function () {
51     self.vorlagen = new Vorlagen();
52     self.appMenu = new AppMenu();
53     self.appMenu.init(
54             "data/menu/",
55             "hauptmenue.json",
56             "data/tpl/app-menu.tpl",
57             ".west",
58             "8em");
59     document.querySelector('.hamburger').addEventListener('click', function (e) {
60       self.menue_umschalten();
61     });
e86f3c 62     var dlg = document.querySelector(".dialog");
U 63     dlg.style.flexBasis = '0em';
64     self.seitenleiste_umschalten();
d1b8b2 65     self.get_login();
U 66     self.get_user_list();
002c44 67     self.loc = window.location.protocol + '//' + window.location.host;
U 68   };
69
70   this.login_zeigen = function() {
71     self.meldung_mit_timeout("Benutzer: " + self.userid, 1500);
72   };
73   
74   this.menue_umschalten = function () {
75     var ham = document.querySelector(".hamburger");
76     ham.classList.toggle("is-active"); // hamburger-icon umschalten
77     self.appMenu.toggle(); // menue oeffnen/schliessen
78   };
79
c995b7 80   this.rollen_dialog_zeigen = function(nutzerId) {
U 81     var m = 'getUserRoleNames';
82     var u = '../svc/' + m + '?p=' + nutzerId;
83     self.http_get(u, function (antwort) {
84       self.vorlagen.html_erzeugen(
85         'data/tpl/nutzer-rollen-dlg.tpl',
86         JSON.parse(antwort),
87         function (html) {
88           document.querySelector("#nutzer").innerHTML = html;
ab2b54 89           document.querySelector("#nutzer-id").textContent = nutzerId;          
U 90           self.addEvtListener('.granted-role-btn', 'click', self.revoke_role_klick);
c995b7 91           var m = 'getRoleNamesGranted';
U 92           var u = '../svc/' + m;
93           self.http_get(u, function (antwort2) {
94             self.vorlagen.html_erzeugen(
95               'data/tpl/alle-rollen.tpl',
96               JSON.parse(antwort2),
97               function (html) {
98                 document.querySelector(".alle-rollen-behaelter").innerHTML = html;
ab2b54 99                 document.querySelector('.zurueck-btn').addEventListener('click', function (e) {
U 100                   self.get_user_list();
101                 });
102                 self.addEvtListener('.avl-role-btn', 'click', self.grant_role_klick);
c995b7 103               });
U 104           });
105         });
106     });      
ab2b54 107   };
U 108   
109   this.grant_role_klick = function(event) {
110     self.alter_role(event, 'grantRole', function(roleId) {
111       var btn = document.createElement("button");
112       btn.type = "button";
113       btn.classList.add("granted-role-btn");
114       btn.id = roleId;
115       btn.textContent = roleId;
116       document.querySelector('.rollen-behaelter').appendChild(btn);
117     });
118   };
119   
120   this.revoke_role_klick = function(event) {
121     self.alter_role(event, 'revokeRole', function(roleId) {
122       var btn = document.querySelector("#" + roleId);
123       btn.parentNode.removeChild(btn);
124     });
125   };
126   
127   this.alter_role = function(event, method, updateCallback) {
128     var target = event.target;
129     var nutzerId = document.querySelector("#nutzer-id").textContent;
130     var roleId = target.textContent;
131     var u = '../svc/' + method;
132     var data = "p=" + self.serialisieren(new UserRole(nutzerId, roleId));
133     self.http_post(u, data, function (antwort) {  
134       updateCallback(roleId);
135     });        
c995b7 136   };
U 137   
002c44 138   this.info_dialog_zeigen = function () {
14cc29 139     self.dialog_zeigen('data/tpl/dlg-info.tpl', '');
3d5fe0 140     self.menue_umschalten();
U 141   };
142
143   this.nutzer_neu_dialog_zeigen = function () {
14cc29 144     self.dialog_zeigen('data/tpl/dlg-nutzer-neu.tpl', '', function(){
U 145       var btn = document.getElementById('nutzer-speichern-btn');
146       if(btn !== null) {
147         btn.addEventListener('click', self.nutzer_speichern);                         
148       }                      
149     });
002c44 150     self.menue_umschalten();
U 151   };
152
153   this.seitenleiste_umschalten = function () {
154     var ostDiv = document.querySelector('.ost');
155     if (ostDiv.classList.contains('ost-open')) {
156       ostDiv.classList.remove('ost-open');
157       ostDiv.style.flexBasis = '0em';
158     } else {
159       ostDiv.classList.add('ost-open');
160       ostDiv.style.flexBasis = '6em';
161     }
c995b7 162     //self.menue_umschalten();
002c44 163   };
U 164
165   this.fusszeile_umschalten = function () {
166     var suedDiv = document.querySelector('.sued');
167     if (suedDiv.classList.contains('sued-open')) {
168       suedDiv.classList.remove('sued-open');
169       suedDiv.style.height = '0';
170     } else {
171       suedDiv.classList.add('sued-open');
172       suedDiv.style.height = '1.5em';
173     }
174     self.menue_umschalten();
175   };
176
177   this.meldung_mit_timeout = function (meldung, timeout) {
178     var s = document.querySelector('.sued');
179     s.textContent = meldung;
d1b8b2 180     if (!s.classList.contains('sued-open')) {
U 181       s.classList.add('sued-open');
182       s.style.height = '1.5em';
183     }
002c44 184     setTimeout(function () {
U 185       s.textContent = 'Bereit.';
186       setTimeout(function () {
187         var suedDiv = document.querySelector('.sued');
188         if (suedDiv.classList.contains('sued-open')) {
189           suedDiv.classList.remove('sued-open');
190           suedDiv.style.height = '0';
191         }
192       }, 500);
193     }, timeout);
194   };
195
196   /* Dialog-Funktionen */
197
198   /*
14cc29 199    * Einen Dialog erzeugen
U 200    * 
201    * Die Vorlage, auf die im Parameter vurl verwiesen wird, wird geladen, 
202    * wenn sie noch nicht benutzt wurde
203    * 
204    * @param {String} vurl - der URL mit der Dialogvorlage
205    * @param {JSON-Objekt} inhalt - was im Dialog an dynamischem Inhalt angezeigt werden soll
206    * @param {function} renderCallback - 
207    *     Funktion, die aufgerufen wird nachdem der Dialog gerendert wurde 
208    * @returns {undefined}
002c44 209    */
14cc29 210   this.dialog_zeigen = function (vurl, inhalt, renderCallback) {
002c44 211     var dlg = document.querySelector(".dialog");
U 212     self.vorlagen.html_erzeugen(
213             vurl,
214             inhalt,
215             function (html) {
3d5fe0 216               dlg.style.flexBasis = '14em';
e86f3c 217               setTimeout(function () {
U 218                 dlg.innerHTML = html;
14cc29 219                 document.querySelector('.close-btn').addEventListener(
U 220                         'click', self.dialog_schliessen);
221                 if(renderCallback !== undefined) {
222                   renderCallback();
223                 }
e86f3c 224               }, 300);
002c44 225             });
U 226   };
227
228   this.dialog_schliessen = function () {
14cc29 229     document.querySelector('.close-btn').removeEventListener(
U 230             'click', self.dialog_schliessen);
002c44 231     var dlg = document.querySelector('.dialog');
U 232     dlg.innerHTML = '';
e86f3c 233     dlg.style.flexBasis = '0em';
002c44 234   };
U 235
236   /* API functions */
237   
d1b8b2 238   this.get_user_list = function() {
b73bb6 239     //var m = 'getUserNameList';
002c44 240     var m = 'getUserNameList';
U 241     var u = '../svc/' + m;
d1b8b2 242     self.http_get(u, function (antwort) {
b73bb6 243     self.vorlagen.html_erzeugen(
U 244       'data/tpl/inhalt.tpl',
245       JSON.parse(antwort),
246       function (h) {
247         var elem = document.getElementById('nutzer');
248         elem.innerHTML = h;
ab2b54 249         self.addEvtListener('p.nutzer-liste-eintrag', 'click', self.nutzerliste_klick);
b73bb6 250       });
002c44 251     });
b73bb6 252   };
d1b8b2 253   
U 254   this.neuen_nutzer_speichern = function(u) {
255     var url = '../svc/createUser';
256     self.http_post(url, u, function (antwort) {
257       self.get_user_list();
14cc29 258       document.getElementById('nutzer-speichern-btn').removeEventListener(
U 259         'click', self.nutzer_speichern);
d1b8b2 260       self.dialog_schliessen();
U 261     });
262   };
002c44 263
U 264   /* -------- An- und Abmelden ------------- */
265
d1b8b2 266   this.get_login = function() {
002c44 267     var m = '?c=de.uhilger.um.pub.SessionManager&m=getSessionUser';
U 268     var u = '../pub' + m;
d1b8b2 269     self.http_get(u, function (resp) {
002c44 270       self.userid = resp;
U 271       self.login_zeigen();
272       //document.querySelector("#userMenu").textContent = resp;
273     });
274   };
275
276   this.um_logout = function() {
277     var m = '?c=de.uhilger.um.pub.SessionManager&m=expireSession';
278     var u = '../pub' + m;
d1b8b2 279     self.http_get(u, function (resp) {
002c44 280       //$('#userMenu').text('nicht angemeldet');
U 281       window.location.href = '../logout.html';
282     });
283   };
284
285   /* -------- ajax helper functions ----------- */
286
d1b8b2 287   this.http_get = function (u, scallback) {    
002c44 288     var xmlhttp = new XMLHttpRequest();
U 289     var url = u;
290     xmlhttp.onreadystatechange = function() {
d1b8b2 291       if (this.readyState === 4 && this.status === 200) {
002c44 292         scallback(this.responseText);
U 293       }
294     };
295     xmlhttp.open("GET", url, true);
296     xmlhttp.send();
297   };
3d5fe0 298   
d1b8b2 299   this.http_post = function (url, data, callback) {
U 300     var xhr = new XMLHttpRequest();
301     xhr.onreadystatechange = function() {
302       if (this.readyState === 4 && this.status === 200) {
303         callback(this.responseText);
304       }
305     };
306     xhr.open("POST", url, true);
307     xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
308     xhr.send(data);
309   };
310   
3d5fe0 311 /* ----- Hilfsfunktionen ----- */
U 312
313   this.serialisieren = function(obj) {
314     return '{"' + obj.constructor.name + '":' + JSON.stringify(obj) + '}';
315   };
ab2b54 316   
U 317   this.addEvtListener = function(selector, eventName, func) {
318     var elems = document.querySelectorAll(selector);
319     var index;
320     for (index = 0; index < elems.length; index++) {
321       elems[index].addEventListener(eventName, func);
322     }
323   };
002c44 324
U 325 }
3d5fe0 326
U 327
328 /* ----- Objekte ----- */
329
330 function User(i, p, fn, ln, em) {
331   this.id = i;
332   this.pw = p;
333   this.firstName = fn;
334   this.lastName = ln;
335   this.email = em;
336 }
337
ab2b54 338 function UserRole(u, r) {
U 339   this.userId = u;
340   this.role = r;
341 }