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