Dateiverwaltung für die WebBox
view | history | commit | commitdiff
ulrich
2021-01-17 b655126533976a98c2852dfb4016afab741982cc
commit | author | age
05e9c4 1 function AppVorlage() {
U 2   var self = this;
41ab37 3   this.appMenu;
4e450e 4   //this.vorlagen;
41ab37 5   this.api;
U 6   this.userid;
7   this.pfad = '';
8   this.loc;
9   this.modus = 'kacheln';
ebc1f3 10   this.cm;
4e450e 11   //this.tinymce;
U 12   this.ed;
13   this.tmo;
14   this.tmo2;
41ab37 15   this.PERS_DIR = "Persoenlich";
U 16   this.PUB_DIR = "Oeffentlich";
17   this.DAV_DIR = "Austausch";
18   this.BASE_DIR = "$basis";
19   this.DATA_DIR = "$daten";
20   this.WWW_DIR = "www";
f002d9 21   this.openEditor;
U 22   this.openFileName;
beb124 23   this.cutCopyOperation;
U 24   this.cutCopySrcDir;
25   this.cutCopyFiles;
41ab37 26   this.cache = {}; // mustache template cache
05e9c4 27
94b871 28   this.datei_neuer_text = function () {
ebc1f3 29     //self.meldung_mit_timeout("Neuer Text", 1500);
U 30     self.fm_text_edit('Neue Datei');
31   };
32   
05e9c4 33   /* Funktionen aus App-Vorlage */
94b871 34
4e450e 35   this.init = function () {    
f002d9 36     document.querySelector(".codeeditor-space").style.display = "none";
U 37     document.querySelector("#mce-editor").style.display = "none";
05e9c4 38     self.appMenu = new AppMenu();
U 39     self.appMenu.init(
94b871 40             "data/menu/",
U 41             "hauptmenue.json",
42             "data/tpl/app-menu.tpl",
43             ".west",
44             "8em");
45     document.querySelector('.hamburger').addEventListener('click', function (e) {
05e9c4 46       self.menue_umschalten();
U 47     });
58bcbd 48     self.fm_get_login();
41ab37 49     
U 50     var parsedUrl = new URL(window.location.href);
51     var wunschPfad = parsedUrl.searchParams.get("pfad");
52
53     if(wunschPfad !== null && wunschPfad.length > 0) {
54       self.pfad = wunschPfad;
55       self.fm_get_list(wunschPfad);
56     } else {
57       self.fm_get_list('');
58     }
ebc1f3 59     
U 60     self.seitenleiste_umschalten();
41ab37 61     //fm_init_uploader();
58bcbd 62     self.loc = window.location.protocol + '//' + window.location.host;
05e9c4 63   };
U 64
58bcbd 65   this.login_zeigen = function() {
U 66     self.meldung_mit_timeout("Benutzer: " + self.userid, 1500);
67   };
68   
b20b74 69   this.fm_neuer_reiter = function() {
U 70     window.open('/file-cms/ui2/?pfad=' + self.pfad, '_blank');
71   };
72   
94b871 73   this.menue_umschalten = function () {
05e9c4 74     var ham = document.querySelector(".hamburger");
U 75     ham.classList.toggle("is-active"); // hamburger-icon umschalten
76     self.appMenu.toggle(); // menue oeffnen/schliessen
77   };
78
94b871 79   this.info_dialog_zeigen = function () {
05e9c4 80     self.dialog_laden_und_zeigen('data/tpl/dlg-info.tpl', '');
U 81     self.menue_umschalten();
82   };
83
94b871 84   this.seitenleiste_umschalten = function () {
05e9c4 85     var ostDiv = document.querySelector('.ost');
94b871 86     if (ostDiv.classList.contains('ost-open')) {
05e9c4 87       ostDiv.classList.remove('ost-open');
94b871 88       ostDiv.style.flexBasis = '0em';
05e9c4 89     } else {
94b871 90       ostDiv.classList.add('ost-open');
U 91       ostDiv.style.flexBasis = '6em';
05e9c4 92     }
ebc1f3 93     //self.menue_umschalten();
05e9c4 94   };
U 95
94b871 96   this.fusszeile_umschalten = function () {
05e9c4 97     var suedDiv = document.querySelector('.sued');
94b871 98     if (suedDiv.classList.contains('sued-open')) {
05e9c4 99       suedDiv.classList.remove('sued-open');
94b871 100       suedDiv.style.height = '0';
05e9c4 101     } else {
U 102       suedDiv.classList.add('sued-open');
94b871 103       suedDiv.style.height = '1.5em';
05e9c4 104     }
U 105     self.menue_umschalten();
106   };
107
94b871 108   this.meldung_mit_timeout = function (meldung, timeout) {
05e9c4 109     var s = document.querySelector('.sued');
U 110     s.textContent = meldung;
85ba85 111     s.classList.add('sued-open');
U 112     s.style.height = '1.5em';
94b871 113     setTimeout(function () {
05e9c4 114       s.textContent = 'Bereit.';
94b871 115       setTimeout(function () {
05e9c4 116         var suedDiv = document.querySelector('.sued');
94b871 117         if (suedDiv.classList.contains('sued-open')) {
U 118           suedDiv.classList.remove('sued-open');
119           suedDiv.style.height = '0';
05e9c4 120         }
U 121       }, 500);
122     }, timeout);
123   };
ebc1f3 124   
U 125   this.fm_menu_datei_schliessen = function() {
126     if(self.openEditor === 'text') {
127       if(!self.cm.getDoc().isClean()) {
128         self.fm_ask_for_save();
129       } else {
130         self.fm_do_close();
131       }
132     } else {
4e450e 133       if(tinymce.activeEditor.undoManager.hasUndo()) {
ebc1f3 134         self.fm_ask_for_save();
U 135       } else {
136         self.fm_do_close();
137       }
138     }
139   };  
140
141   this.fm_ask_for_save = function() {
142     self.dialog_laden_und_zeigen('data/tpl/dlg-ask-save.tpl', '', function() {
143       // wenn dialog da ist, hier events verknuepfen
144       document.querySelector('#cancel-btn').addEventListener('click', function() {
145         self.fm_do_close();
146         self.dialog_schliessen();
147       });
148       document.querySelector('#speichern-btn').addEventListener('click', function() {
149         self.fm_menu_datei_speichern(function() {
150           self.fm_do_close();
151           self.dialog_schliessen();
152         });
153       });
154     });
155   };
156
157   this.fm_menu_datei_speichern = function(callback) {
158     //var fname = $('.datei-gewaehlt').text();
159     var fname = self.openFileName;
160     if(fname !== undefined && fname !== '') {
161       self.fm_save_file(fname, 'saveTextFile', callback);
162     } else {
163       self.fm_menu_datei_speichern_unter(callback);
164     }
165   };
166   
167   this.fm_menu_datei_speichern_unter = function(callback) {  
168     self.dialog_laden_und_zeigen('data/tpl/dlg-save-as.tpl', '', function() {
5b4d03 169       document.querySelector('#cancel-btn').addEventListener('click', function() {
U 170         //self.fm_do_close();
171         self.dialog_schliessen();
172       });
173       document.querySelector('#speichern-btn').addEventListener('click', function() {
1a9589 174         //self.fm_menu_datei_speichern(function() {
U 175           //console.log(document.querySelector('#datei-name-in').value);
5b4d03 176           self.fm_save_file(document.querySelector('#datei-name-in').value, 'saveTextFileAs', callback);
4e450e 177           if(typeof(callback) !== 'function') {
U 178             self.fm_do_close();
179             self.dialog_schliessen();
180           }
1a9589 181         //});
5b4d03 182       });
ebc1f3 183     });    
4e450e 184   };
U 185   
186   this.fm_menu_neues_dokument = function() {
187     self.fm_dok_edit('');
ebc1f3 188   };
05e9c4 189
U 190   /* Dialog-Funktionen */
191
192   /*
94b871 193    Einen Dialog aus Vorlagen erzeugen
U 194    
195    vurl - URL zur Dialogvorlage
196    msgTpl - URL mit einer Vorlage eines Mitteilungstextes (optional)
197    */
ebc1f3 198   this.dialog_laden_und_zeigen = function (vurl, msgTpl, cb) {
U 199     var vorlage = self.cache[vurl];
200     if(vorlage === undefined) {
201       self.fm_get(vurl, "text", function(antwort) {
202         self.cache[vurl] = antwort;
203         self.dialog_zeigen(vurl, antwort, cb);
204         //self.vorlage_fuellen(vurl, inhalt, cb);
94b871 205       });
05e9c4 206     } else {
ebc1f3 207       self.dialog_zeigen(vurl, vorlage, cb);
05e9c4 208     }
U 209   };
210
ebc1f3 211   this.dialog_zeigen = function (vurl, inhalt, cb) {
05e9c4 212     var dlg = document.querySelector(".dialog");
ebc1f3 213     self.html_erzeugen(
94b871 214             vurl,
U 215             inhalt,
216             function (html) {
217               //dlg.html(html);
1a9589 218               dlg.style.height = '7em';
94b871 219               dlg.innerHTML = html;
U 220               document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen);
221               //dlg.slideDown(300);
ebc1f3 222               if(typeof(cb) !== 'function') {
U 223                 // ..
224               } else {
225                 cb();
226               }
94b871 227             });
05e9c4 228   };
U 229
58bcbd 230   this.dialog_schliessen = function () {
05e9c4 231     document.querySelector('.close-btn').removeEventListener('click', self.dialog_schliessen);
U 232     //$('.dialog').slideUp(300);
233     var dlg = document.querySelector('.dialog');
234     //dlg.style.display = "none";
235     dlg.style.height = '0';
236     dlg.innerHTML = '';
5b4d03 237     self.removeAllListeners('#cancel-btn');
U 238     self.removeAllListeners('#speichern-btn');
05e9c4 239   };
39e714 240   
U 241   this.fm_auswahl_marke_entfernen = function() {
242     var gew = document.querySelector('.datei-gewaehlt');
243     if(gew !== null) {
244       gew.classList.remove('datei-gewaehlt');
245     }        
246   };
247
248   this.datei_ansehen_oder_bearbeiten = function() {
249     console.log('datei_ansehen_oder_bearbeiten');
85ba85 250     self.meldung_mit_timeout('datei_ansehen_oder_bearbeiten noch nicht implementiert.', 1500);
39e714 251   };
U 252   
253   /**
85ba85 254    * Hier werden die folgenden Faelle einer Datei- 
U 255    * bzw. Ordnerauswahl ausgefuehrt:
256    * 
257    * geklickt, nicht gewaehlt: 
258    *    auswaehlen, evtl. bestehende andere Auswahl entfernen
259    *    
260    * geklickt, ausgewaehlt: 
261    *    Datei ansehen oder oeffnen bzw. Ordner oeffnen
262    *    
263    * geklickt mit [Strg], nicht gewahlt: 
264    *    auswaehlen, bestehende Auswahl beibehalten (Mehrfachauswahl)
265    *    
266    * geklickt mit [Strg], gewaehlt: 
267    *    Auswahl bei diesem Element entfernen
39e714 268    * 
U 269    * Diese Fälle sind unterteilt in 
85ba85 270    *    1. Kachel-Modus
U 271    *    2. Listenmodus
39e714 272    * 
85ba85 273    * @param {type} ev Klick-Event
U 274    * @returns {undefined} nichts 
39e714 275    */
6648a8 276   this.fm_dateiwahl = function(ev) {
U 277     var elem = ev.target;
278     if(self.modus == 'kacheln') {
279       // Kacheln
280       if(elem.classList.contains("icon-folder")) {
39e714 281         // Ordner
U 282         var par = elem.parentElement;
283         var istGewaehlt = par.querySelector('.dateiname').classList.contains('datei-gewaehlt');
284         if(istGewaehlt) {
285           if(/*ev.shiftKey || */ ev.ctrlKey) {
286             // mehrere Ordner sind gewaehlt, diese eine wieder entfernen
287             par.querySelector('.dateiname').classList.remove('datei-gewaehlt');
6648a8 288           } else {
39e714 289             // Ordner oeffnen
U 290             var ordner = elem.parentElement.querySelector('.dateiname').textContent.trim();
291             if(self.pfad.length > 0) {
292               self.pfad = self.pfad + '/' + ordner;
293             } else {
294               self.pfad = ordner;
295             }
296             self.fm_get_list(self.pfad);
6648a8 297           }
39e714 298         } else {
U 299           // Ordner auswaehlen
300           if(/*ev.shiftKey || */ ev.ctrlKey) {
301             // Mehrfachauswahl
302           } else {
303             self.fm_auswahl_marke_entfernen();
304           }
305           par.querySelector('.dateiname').classList.add('datei-gewaehlt');
6648a8 306         }
U 307       } else if(elem.classList.contains('datei')) {
39e714 308         // Datei
6648a8 309         var par = elem.parentElement;
39e714 310         var istGewaehlt = par.querySelector('.dateiname').classList.contains('datei-gewaehlt');
U 311         if(istGewaehlt) {
312           if(/*ev.shiftKey || */ ev.ctrlKey) {
313             // mehrere Dateien sind gewaehlt, diese eine wieder entfernen
314             par.querySelector('.dateiname').classList.remove('datei-gewaehlt');
315           } else {
316             // Datei zum Bearbeiten oeffnen
317             self.datei_ansehen_oder_bearbeiten();
318           }
319         } else {
320           if(/*ev.shiftKey || */ ev.ctrlKey) {
321             // mehrere Dateien sollen gewaehlt werden
322           } else {
323             self.fm_auswahl_marke_entfernen();
324           }
325           par.querySelector('.dateiname').classList.add('datei-gewaehlt');
326         }
6648a8 327       } else {
U 328         //console.log('kein folder oder file...');
329       }
330     } else {
4f01b8 331       // Liste
U 332       var pElem = elem.closest('.datei-zeile');
333       var dElem = pElem.querySelector('.datei-elem');
39e714 334       var istGewaehlt = pElem.querySelector('.dateiname').classList.contains('datei-gewaehlt');
4f01b8 335       if(dElem.getElementsByTagName("i")[0].classList.contains('icon-doc-text-inv')) {
6648a8 336         // Datei
39e714 337         if(istGewaehlt) {
U 338           if(/*ev.shiftKey || */ ev.ctrlKey) {
339             // mehrere Dateien sind gewaehlt, diese eine wieder entfernen
340             pElem.querySelector('.dateiname').classList.remove('datei-gewaehlt');
341           } else {
342             // gewaehlte Datei ohne [Strg] geklickt: ansehen oder oeffnen
343             self.datei_ansehen_oder_bearbeiten();
344           }
6648a8 345         } else {
39e714 346           if(/*ev.shiftKey || */ ev.ctrlKey) {
U 347             // mehrere Dateien sollen gewaehlt werden, Auswahl ist weiter unten
348           } else {
349             var ti = document.querySelector('.table-info');
350             if(ti !== null) {
351               ti.classList.remove('table-info');
352             }
353             self.fm_auswahl_marke_entfernen();
4f01b8 354           }
39e714 355           pElem.classList.add('table-info');
U 356           pElem.querySelector('.dateiname').classList.add('datei-gewaehlt');
6648a8 357         }
U 358       } else {
359         // Ordner
39e714 360         if(istGewaehlt) {
U 361           if(/*ev.shiftKey || */ ev.ctrlKey) {
362             // ein gewaehlter Ordner ist mit [Strg] geklickt, Auswahl entfernen
363             pElem.querySelector('.dateiname').classList.remove('datei-gewaehlt');
6648a8 364           } else {
39e714 365             // Ordner oeffnen
U 366             var ordner = pElem.querySelector('.dateiname').textContent;
367             if(self.pfad.length > 0) {
368               self.pfad = self.pfad + '/' + ordner;
369             } else {
370               self.pfad = ordner;
371             }
372             self.fm_get_list(self.pfad);
6648a8 373           }
39e714 374         } else {
U 375           if(/*ev.shiftKey || */ ev.ctrlKey) {
376             // nicht gewaehlter Ordner und [Strg]: zu Mehrfachauswahl hinzufuegen
377           } else {
378             // nicht gewaehlter Ordner ohne [Strg]: andere Auswhalen entfernen und weiter unten Ordner auswaehlen
379             self.fm_auswahl_marke_entfernen();
380           }
381           pElem.querySelector('.dateiname').classList.add('datei-gewaehlt');
6648a8 382         }
U 383       }   
384     }
385   };
386  
41ab37 387   
58bcbd 388   this.fm_render_list = function (fl) {
4f01b8 389     if (self.modus === 'kacheln') {
58bcbd 390       // Kachelansicht
6648a8 391       self.html_erzeugen("data/tpl/kacheln.tpl", fl, function(html) {
U 392         var elem = document.querySelector('#dateien');
393         elem.innerHTML = html;
394         self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
395       });
58bcbd 396     } else {
U 397       // Listenansicht
4f01b8 398       self.html_erzeugen("data/tpl/liste.tpl", fl, function(html) {
U 399         var elem = document.querySelector('#dateien');
400         elem.innerHTML = html;
401         self.addEvtListener('.datei-zeile', 'click', self.fm_dateiwahl);
402       });
58bcbd 403     }
U 404   };
405   
406   this.fm_get_path = function (uid) {
407     var restdir;
408     if (self.pfad.indexOf(self.PUB_DIR) > -1) {
409       restdir = self.pfad.substr(self.PUB_DIR.length);
410     } else if (self.pfad.indexOf(self.PERS_DIR) > -1) {
411       restdir = self.pfad.substr(self.PERS_DIR.length);
412     } else if (self.pfad.indexOf(self.BASE_DIR) > -1) {
413       restdir = self.pfad.substr(self.BASE_DIR.length);
414     } else if (self.pfad.indexOf(self.DATA_DIR) > -1) {
415       restdir = self.pfad.substr(self.DATA_DIR.length);
416     } else if (self.pfad.indexOf(self.DAV_DIR) > -1) {
417       restdir = self.pfad.substr(self.DAV_DIR.length);
418     }
419     if (restdir !== undefined && restdir.startsWith('/')) {
420       restdir = restdir.substr(1);
421       if (restdir.indexOf(self.WWW_DIR) > -1) {
422         restdir = restdir.replace(self.WWW_DIR, 'data');
423       }
424     }
41ab37 425     var pdir = self.fm_get_base(uid);
58bcbd 426     if (restdir.length > 1) {
U 427       return pdir + "/" + restdir;
428     } else {
429       return pdir;
430     }
431   };
432
433   this.fm_get_base = function (uid) {
434     var pdir;
435     if (self.pfad.indexOf(self.PUB_DIR) > -1) {
436       pdir = '/data/' + uid;
437     } else if (self.pfad.indexOf(self.PERS_DIR) > -1) {
438       pdir = '/home/' + uid;
439     } else if (self.pfad.indexOf(self.BASE_DIR) > -1) {
440       pdir = '';
441     } else if (self.pfad.indexOf(self.DATA_DIR) > -1) {
442       pdir = '';
443     }
444     return pdir;
445   };
2864b2 446   
U 447   /**
448    * Aus einem relativen Pfad ein Array aus BcrFile Objekten 
449    * machen
450    * 
451    * @param {String} relPfad  der relative Pfad
452    * @returns {Array}  die BcrFile-Objekte zum Pfad als Array
453    */
454   this.fm_buildBreadcrumb = function(relPfad) {
455     var rp = '';
456     var dirList = new Array();
457     dirList.push(new BcrFile(rp, 'Home'));
458     if(relPfad.length > 1) {
459       var dirs = relPfad.split('/');
460       for(var i = 0; i < dirs.length; i++) {
461         if(rp.length > 0 ) {
462           // weitere Einträge
463           dirList.push(new BcrFile(rp + '/' + dirs[i], dirs[i]));
464           rp = rp + '/' + dirs[i];
465         } else {
466           // erster Eintrag
467           dirList.push(new BcrFile(dirs[i], dirs[i]));
468           rp = dirs[i];
469         }
470       }
471     }
472     return dirList;
473   };
474   
4f01b8 475   /*
U 476    * icon-th-large
477    * icon-th-list
478    * @returns {undefined}
479    */
480   this.fm_ansicht_umschalten = function() {
481     var elem = document.querySelector('#ansicht');
482     var iElem = elem.getElementsByTagName("i")[0];
483     if(iElem.classList.contains('icon-th-list')) {
484       iElem.classList.add('icon-th-large');
485       iElem.classList.remove('icon-th-list');
486       self.modus = 'liste';
487     } else {
488       iElem.classList.add('icon-th-list');
489       iElem.classList.remove('icon-th-large');
490       self.modus = 'kacheln';
491     }
492     self.fm_get_list(self.pfad);    
493   };
494
495   this.fm_set_modus = function() {
496     var elem = document.querySelector('#ansicht');
497     var iElem = elem.getElementsByTagName("i")[0];
498     if(self.modus === 'kacheln') {
499       iElem.classList.add('icon-th-list');    
500       iElem.classList.remove('icon-th-large');
501     } else {
502       iElem.classList.add('icon-th-large');
503       iElem.classList.remove('icon-th-list');
504     }    
505   };
506
507   
2864b2 508   /**
U 509    * Der letzte Eintrag in dirs ist der aktuelle Ordner und 
510    * deshalb ausgegraut.
511    * 
512    * Wenn nur ein Ordner in dirs enthalten ist, dann sind wir 
513    * an der obersten Ebene (Home).
514    * 
515    * @param {Array} dirList ein Array aus BcrFile-Objekten
516    * @returns nichts 
517    */
518   this.fm_renderBreadcrumb = function(dirList) {
519     var elem = document.querySelector('.breadcrumb');
520     if(dirList.length > 1) {
521       var last = dirList.pop();
522       var bcList = new BcrFiles(dirList);
4f01b8 523       
2864b2 524       self.html_erzeugen("data/tpl/bcr.tpl", bcList, function(html) {
4f01b8 525         var htmlGesamt = html;
2864b2 526         self.html_erzeugen("data/tpl/bcr2.tpl", last, function(html) {
4f01b8 527           htmlGesamt += html;          
U 528           self.html_erzeugen("data/tpl/bcr3.tpl", dirList[0], function(html) {
529             htmlGesamt += html;
530             elem.innerHTML = htmlGesamt;
531             self.addEvtListener('.bc-link', 'click', self.fm_bc_click);
532             self.addEvtListener('#ansicht', 'click', self.fm_ansicht_umschalten);
533             self.fm_set_modus();
534           });
535           
2864b2 536         });                  
U 537       });            
538     } else {
539       // oberste Ebene
4f01b8 540       var htmla;
U 541       var htmlb;
2864b2 542       self.html_erzeugen("data/tpl/bcr2.tpl", dirList[0], function(html) {
4f01b8 543         htmla = html;        
U 544         self.html_erzeugen("data/tpl/bcr3.tpl", dirList[0], function(html) {
545           htmlb = html;
546           elem.innerHTML = htmla + htmlb;
547           self.addEvtListener('.bc-link', 'click', self.fm_bc_click);
548           self.addEvtListener('#ansicht', 'click', self.fm_ansicht_umschalten);
549           self.fm_set_modus();
550         });
2864b2 551       });            
U 552     }
553   };
554   
555   /**
556    * Auf den Klick auf ein Breadcrumb-Element reagieren:
557    * Den Ordner-Inhalt des geklickten Elements anzeigen
558    * @returns nichts
559    */
560   this.fm_bc_click = function() {
561     var elem = this;
562     var bcPfad = elem.getAttribute("rpath");
563     if(bcPfad !== undefined) {
564       self.pfad = bcPfad;
565       self.fm_get_list(bcPfad);
566     } else {
567       pfad = '';
568       self.fm_get_list('');
569     }
570   };
571
beb124 572   /* ------- Dateifunktionen Start ----------- */
U 573
574   this.fm_menu_cut = function() {
575     console.log('fm_menu_cut');
576     self.fm_cut_files();
577   };
39e714 578   this.fm_menu_copy = function() {
beb124 579     console.log('fm_menu_kopie');
U 580     self.fm_copy_files();
581   };
582   this.fm_menu_paste = function() {
583     console.log('fm_menu_paste');
584     self.fm_paste_files();
585   };
586   this.fm_menu_delete = function() {
587     self.dialog_laden_und_zeigen('data/tpl/dlg-ask-del.tpl', '', function() {
588       // wenn dialog da ist, hier events verknuepfen
589       document.querySelector('#cancel-btn').addEventListener('click', function() {
590         //self.fm_do_close();
591         self.dialog_schliessen();
592       });
593       document.querySelector('#speichern-btn').addEventListener('click', function() {
39e714 594         //self.fm_menu_datei_speichern(function() {
beb124 595           self.fm_del_files();
U 596           self.dialog_schliessen();
39e714 597         //});
beb124 598       });
U 599     });
600     /*
601     $('#confirmOk').click(function() {
602       $('#confirmOk').attr('onclick','').unbind('click');
603       fm_del_files();
604     });
605     $('#confirmOk').text("Loeschen");
606     $('#confirmOk').removeClass('btn-primary');
607     $('#confirmOk').addClass('btn-danger');
608     $('#confirmClose').hide();
609     $('#confirmModalTitle').text("Löschen");
610     $('#confirmModalBody').text("Wirklich löschen?");
611     $('#confirmModal').modal({
612       keyboard: false,
613       show: true
614     });
615     */
616   };
617   
618   /*
619    * Hier merkt sich die Dateiverwalting die markierten Dateien fuer 
620    * eine Dateioperation. Bei cut wird in der 'paste' Operation auf dem Server 
621    * fuer die 'gemerkten' Dateien ein Move gemacht. Die Dateien werden 
622    * vom gewaehlten Ort zum Zielort verschoben.
623    * 
624    * @returns {undefined}
625    */
626   this.fm_cut_files = function() {
627     console.log('fm_cut_files');
628     self.cutCopySrcDir = self.pfad;
629     self.cutCopyFiles = self.fm_gewaehlte_dateien();
630     self.cutCopyOperation = 'cut';
631   };
632
633   /*
634    * Hier merkt sich die Dateiverwalting die markierten Dateien fuer 
635    * eine Dateioperation. Bei copy wird in der 'paste' Operation auf dem Server 
636    * fuer die 'gemerkten' Dateien eine Kopie gemacht. Die Dateien werden 
637    * am gewaehlten Ort behalten und am Zielort wird eine Kopier der 
638    * gewaehlten DAteien erstellt
639    * 
640    * @returns {undefined}
641    */
642   this.fm_copy_files = function() {
643     console.log('fm_copy_files');
644     self.cutCopySrcDir = self.pfad;
645     self.cutCopyFiles = self.fm_gewaehlte_dateien();
646     self.cutCopyOperation = 'copy';
647   };
648   
649   
650
651   /*
652    * Gewaehlte Dateien feststellen
653    * 
654    * @returns {String} eine per JSON.stringify schon vorbereitete List zum 
655    * Absenden als Parameter an den Server
656    */
657   this.fm_gewaehlte_dateien = function() {
658     //var gewaehlte = $('.datei-gewaehlt');
659     var gewaehlte = document.querySelectorAll('.datei-gewaehlt');
660     /*
661     //console.log('anzahl: ' + gewaehlte.length);
662     var fnames = new Array();
663     var i = 0;
664     while(i < gewaehlte.length) {
665       var str = { "java.lang.String": $(gewaehlte[i]).text()};
666       fnames.push(str);
667       //console.log('loeschen ' + pfad + ' ' + $(gewaehlte[i]).text());
668       //i += 2;
669       i++;
670     }
671     var liste = '{"List":' + JSON.stringify(fnames) + '}';
672     // 'liste' enthaelt:
673     // {"List":[{"java.lang.String":"test3.txt"},{"java.lang.String":"Test1.txt"},{"java.lang.String":"Test2.txt"}]}
674     // und wird auf dem Server zu einer List[ArrayList<String>] bei der jede ArrayList<String> nur ein Element hat 
675     return liste;
676     */
677     return self.fm_dateiliste_bilden(gewaehlte);
678   };
679
680   this.fm_dateiliste_bilden = function(gewaehlte) {
681     var fnames = new Array();
682     var i = 0;
683     while(i < gewaehlte.length) {
684       var str = { "java.lang.String": gewaehlte[i].innerText};
685       fnames.push(str);
686       //console.log('loeschen ' + pfad + ' ' + $(gewaehlte[i]).text());
687       //i += 2;
688       i++;
689     }
690     var liste = '{"List":' + JSON.stringify(fnames) + '}';
691     // 'liste' enthaelt:
692     // {"List":[{"java.lang.String":"test3.txt"},{"java.lang.String":"Test1.txt"},{"java.lang.String":"Test2.txt"}]}
693     // und wird auf dem Server zu einer List[ArrayList<String>] bei der jede ArrayList<String> nur ein Element hat 
694     console.log(liste);
695     return liste;
696   };
697
698   this.fm_menu_html_export = function() {
699     self.fm_export_html();
700   };
701
702   /* --------- Dateifunktionen Ende ---------- */
703
94b871 704   /* API functions */
05e9c4 705
94b871 706   // http://localhost:8079/file-cms/svc?c=de.uhilger.filecms.api.FileMgr&f=JSONNICE&m=list&p=
U 707   this.fm_get_list = function (relPfad) {
708     var m = '?c=de.uhilger.filecms.api.FileMgr&m=list&p=' + relPfad;
709     var u = '../svc' + m;
58bcbd 710     self.fm_get(u, "json", function (respText) {
U 711       var resp = JSON.parse(respText);
94b871 712       if (resp.List[0].FileRef !== undefined) {
U 713         var files = new Array();
714         if (resp.List[0].FileRef instanceof Array) {
715           for (var i = 0; i < resp.List[0].FileRef.length; i++) {
716             files.push(new FileRef(resp.List[0].FileRef[i]));
05e9c4 717           }
U 718         } else {
94b871 719           files.push(new FileRef(resp.List[0].FileRef));
05e9c4 720         }
94b871 721         var fl = new FileList(files);
58bcbd 722         self.fm_render_list(fl);
94b871 723       } else {
58bcbd 724         // #dateien leeren
8ba358 725         var elem = document.querySelector("#dateien");
U 726         elem.innerHTML = '';
94b871 727       }
8ba358 728       
U 729       // Breadcrumb
730       
2864b2 731       var dirList = self.fm_buildBreadcrumb(relPfad);
4f01b8 732       self.fm_renderBreadcrumb(dirList);     
94b871 733     });
U 734   };
f002d9 735   
1a9589 736   this.datei_neuer_ordner = function() {
U 737     self.dialog_laden_und_zeigen('data/tpl/dlg-ask-folder.tpl', '', function() {
738       document.querySelector('#cancel-btn').addEventListener('click', function() {
739         self.dialog_schliessen();
740       });
741       document.querySelector('#speichern-btn').addEventListener('click', function() {
742         var m = '?c=de.uhilger.filecms.api.FileMgr&m=newFolder&p=' + 
743                 self.pfad + 
744                 '&p=' + document.querySelector('#folder-name-in').value;
745         var u = '../svc' + m;
746         self.fm_get(u, "json", function(resp) {
747           self.dialog_schliessen();
748           self.fm_get_list(self.pfad);
749         });
750       });
751     });    
752   };
753
ebc1f3 754   this.fm_edit_as_text = function() {
U 755     self.fm_get_file_content('text');
4e450e 756   };
U 757   
758   this.fm_edit_as_doc = function() {
759     self.fm_get_file_content('doc');
ebc1f3 760   };
U 761   
f002d9 762   this.fm_get_file_content = function(typ) {
U 763     var gewaehlte = document.querySelector('.datei-gewaehlt');
764     //var fname = $(gewaehlte).find('.dateiname').text();
765
766     var fname = gewaehlte.textContent;
ebc1f3 767     //console.log('fname: ' + fname);
f002d9 768     self.openFileName = fname;
U 769     var m = '?c=de.uhilger.filecms.api.FileMgr&m=getCode&p=' + self.pfad + '&p=' + fname;
770     var u = '../svc' + m;
771     self.fm_get(u, "text", function(resp) {
772       if(typ === 'text') {
773         var mode = "text/x-java";
774         if(fname.endsWith('js')) {
775           mode = 'javascript';
776         } else if(fname.endsWith('xml')) {
777           mode = 'xml';
778         } else if(fname.endsWith('properties')) {
779           mode = 'xml';
780         } else if(fname.endsWith('adoc')) {
781           mode = 'text/x-markdown';
782         }
783         self.fm_text_edit(resp, mode);
784       } else {
785         self.fm_dok_edit(resp);
786       }
787     });
788   };
789
ebc1f3 790   this.fm_save_file = function(saveFileName, method, callback) {
U 791     var content;
792     if(self.openEditor === 'text') {
793       content = self.cm.getValue();
794       self.cm.getDoc().markClean();
795     } else {
4e450e 796       content = self.ed.getContent();
ebc1f3 797       tinymce.activeEditor.undoManager.clear();
U 798     }
799     var m = '?c=de.uhilger.filecms.api.FileMgr&m=' + method;
5b4d03 800     var u = '../svc' + m;
U 801     var data = '&p=' + self.pfad + '&p=' + saveFileName + '&p=' + encodeURIComponent(content);
802     self.fm_post(u, data, "text", function(resp) {
803       // ...
ebc1f3 804     });
U 805     self.openFileName = saveFileName;
806     if(typeof (callback) !== 'function') {
807
808     } else {
809       callback();
810     }
811   };
812
beb124 813   /*
U 814    * Hier wird fuer eine zuvor markierte Liste von Dateien, fuer die 
815    * Cut oder Copy gewaehlt wurde, die Operations ausgefuehrt (move oder copy)
816    * @returns {undefined}
817    */
818   this.fm_paste_files = function() {
819     var m;
820     if(self.cutCopyOperation === 'cut') {
821       //m = '?c=de.uhilger.filecms.api.FileMgr&m=moveFiles'; //&p=' + cutCopySrcDir + '&p=' + pfad + '&p=' + encodeURIComponent(liste);
822       m = '?c=de.uhilger.filecms.api.FileMgr&m=moveFiles&p=' + self.cutCopySrcDir + '&p=' + self.pfad + '&p=' + encodeURIComponent(self.cutCopyFiles);
823     } else {
824       //m = '?c=de.uhilger.filecms.api.FileMgr&m=copyFiles'; //&p=' + cutCopySrcDir + '&p=' + pfad + '&p=' + encodeURIComponent(liste);
825       m = '?c=de.uhilger.filecms.api.FileMgr&m=copyFiles&p=' + self.cutCopySrcDir + '&p=' + self.pfad + '&p=' + encodeURIComponent(self.cutCopyFiles);
826     }
827     var u = '../svc' + m;  
828     self.fm_get(u, "text", function(resp) {
829       // console.log('deleteFiles gab folgendes zurueck: ' + resp);
830       self.fm_get_list(self.pfad);
831     });
832   };
ebc1f3 833
beb124 834   this.fm_del_files = function() {
U 835     var liste = self.fm_gewaehlte_dateien();
836     var m = '?c=de.uhilger.filecms.api.FileMgr&m=deleteFiles&p=' + self.pfad + '&p=' + encodeURIComponent(liste);
837     var u = '../svc' + m;
838     self.fm_get(u, "text", function(resp) {
839       // console.log('deleteFiles gab folgendes zurueck: ' + resp);
840       self.fm_get_list(self.pfad);
841     });
842   };
f002d9 843
U 844 /* ---- codemirror editor handling -------- */
845
846   /*
847   function htmlDecode(value){ 
848     return $('<div/>').html(value).text(); 
849   }
850   */
851
852   this.fm_code_edit = function(content, m) {
ebc1f3 853     //console.log('fm_code_edit content: ' + content.substring(0,30));
U 854     self.cm = CodeMirror.fromTextArea(document.getElementById("editspace"), {
f002d9 855       lineNumbers: true,
U 856       lineWrapping: true,
857       gutters: ["CodeMirror-linenumbers", "breakpoints"],
858       mode: m,
859       viewportMargin : Infinity,
860       tabSize: 2,
861       extraKeys: {
862           "F9": function(cm) {
863           cm.setOption("fullScreen", !cm.getOption("fullScreen"));
864         },
865           "Esc": function(cm) {
866           if (cm.getOption("fullScreen")) cm.setOption("fullScreen", false);
867         },
868           ".": function(cm) {
869           console.log('dot pressed: perhaps look up class or method name');
870           /*
871            * Hier kann man eine Funktion ausloesen, die fuer das 
872            * Wort vor dem Punkt (Name der Klasse) eine Liste mit 
873            * Vorschlaegen fuer Methodennamen einblendet.
874            */
875
876           /*
877            * CodeMirror.Pass laesst das Zeichen zum Editorinhalt durch, 
878            * verhindert aber das Ausloesen von 'keyHandled'
879            */
880           return CodeMirror.Pass; 
881         }
882       }
883     });
884     //cm.setValue(htmlDecode(content));
885     //cm.setValue(content);
ebc1f3 886     self.cm.setValue(self.unescapeHtml(content));
U 887     self.cm.getDoc().markClean();
888     self.cm.on("gutterClick", function(theEditor, lineNumber) {
f002d9 889       var info = theEditor.lineInfo(lineNumber);
U 890       //--lineNumber;
891       //console.log(info.gutterMarkers.breakpoints.message);
892       //var marker = info.gutterMarkers.breakpoints;
893       //$(marker).tooltip('toggle');
894     });
895     /*
896     cm.on("keyHandled", function(theEditor, keyName, event){
897       console.log('cm.keyHandled keyName: ' + keyName + ', event.type: ' + event.type);    
898     });
899     */
900   };
901
902   this.makeMarker = function(msg) {
903     var marker = document.createElement("div");
904     marker.style.color = "#822";
905     marker.innerHTML = "●";
906     //marker.message = msg;
907     $(marker).tooltip({
908       placement: 'right',
909       title: msg,
910       offset: '0 -30'
911     });
912     return marker;
913   };
914
4e450e 915   /* ---- TinyMCE editor handling -------- */
U 916
917   this.fm_dok_editor_init = function(uid) {
918     var base = self.fm_get_path(uid);
919     //var edCount = 0;
920     //console.log("fm_dok_editor_init calling tinymce.init with base: " + base + "/");
921
922     /*
923      * vgl.
924      * http://stackoverflow.com/questions/4651676/how-do-i-remove-tinymce-and-then-re-add-it
925      */
926     //tinymce.EditorManager.execCommand('mceRemoveControl',true, 'textarea.text-editor');
927     //tinymce.EditorManager.execCommand('mceAddControl',true, editor_id);
928     if(self.ed !== undefined) {
929       self.ed.destroy();
930     }
931     if(tinymce !== undefined) {
932       tinymce.remove('textarea.text-editor');
933       tinymce.EditorManager.editors = []; 
934     }
935
936     /*
937      * Konfiguration TinyMCE
938      */
939     tinymce.init({
940       content_css : "/file-cms/ui/mce.css",
941       //content_css: "/jslib/bootstrap/css/bootstrap.min.css",
942       selector: "textarea.text-editor",
943       statusbar: false,
944       menubar: false,
945       plugins: 'advlist charmap code image link lists media table print preview save table textcolor importcss',
946       toolbar: 'undo redo | styleselect | image table | link unlink | bullist numlist | outdent indent | code',
947       /*
948       menu: {
949         file: {title: 'File', items: 'savevers | exit'},
950         edit: {title: 'Edit', items: 'undo redo | cut copy paste pastetext | selectall'},
951         view: {title: 'View', items: 'visualaid | code | link image media | template hr'},
952       },
953       */
954       resize: 'both',
955       importcss_append: true,
956       width: "100%",
957       height: '100%',
958       relative_urls : true, 
959       convert_urls : false, 
960       document_base_url : base + "/",
961       setup: function (editor) {
962         self.ed = editor;
963       }
964     });
965
966     window.addEventListener('resize', self.fm_resize_editor);
967     //$(window).on('resize', self.fm_resize_editor);
968     self.fm_resize_editor();
969   };
970
971   this.fm_resize_editor = function() {
972     window.clearTimeout(self.tmo);
973     self.tmo = window.setTimeout(function () {
974       try {
975         var myHeight = document.querySelector('.inhalt').offsetHeight - 
976                 document.querySelector('.nord').offsetHeight + 2; // - 4;
977         //console.log('myHeight: ' + myHeight);
978         self.ed.theme.resizeTo('100%', myHeight);  // sets the dimensions of the editable area
979       } catch (err) {
980       }
981     }, 200);
982   };
983
984
f002d9 985   
U 986   /* -------- Editoren --------- */
987   
988   this.fm_text_edit = function(content, mode) {
989     document.querySelector(".codeeditor-space").style.display = "block";
5b4d03 990     //document.querySelector(".code-editor-container").style.display = "block";
U 991     //document.querySelector(".zentrum-behaelter").style.display = "none";
992     document.querySelector(".breadcrumb").style.display = "none";
993     document.querySelector(".zentrum").style.display = "none";
f002d9 994     self.fm_code_edit(content, mode);  
U 995     self.openEditor = 'text';
996   };
997
998   this.fm_dok_edit = function(content) {
999     //fm_filectls_hide();
4e450e 1000     self.fm_dok_editor_init(self.userid);
U 1001     document.querySelector("#mce-editor").style.display = "block";
1002     //$("#mce-editor").show();
1003     document.querySelector(".breadcrumb").style.display = "none";
1004     document.querySelector(".zentrum").style.display = "none";
f002d9 1005
4e450e 1006     window.clearTimeout(self.tmo2);
U 1007     self.tmo2 = window.setTimeout(function () {
f002d9 1008       try {
4e450e 1009         self.ed.setContent(content);
U 1010         self.openEditor = 'dok';  
f002d9 1011       } catch (err) {
U 1012       }
1013     }, 200);
1014   };
ebc1f3 1015   
U 1016   this.fm_do_close = function() {
1017     document.querySelector(".codeeditor-space").style.display = "none";
4e450e 1018     document.querySelector("#mce-editor").style.display = "none";
U 1019     // $("#mce-editor").hide();
5b4d03 1020     //document.querySelector(".code-editor-container").style.display = "none";
U 1021     //document.querySelector(".zentrum-behaelter").style.display = "block";
1022     document.querySelector(".breadcrumb").style.display = "block";
1023     document.querySelector(".zentrum").style.display = "block";
ebc1f3 1024     if(self.cm !== undefined) {
U 1025       self.cm.toTextArea();
1026     }
1027     self.openFileName = '';
1028     self.openEditor = '';
1029     self.fm_get_list(self.pfad);
1030   };
05e9c4 1031
94b871 1032   /* -------- An- und Abmelden ------------- */
05e9c4 1033
94b871 1034   this.fm_get_login = function() {
U 1035     var m = '?c=de.uhilger.filecms.pub.SessionManager&m=getSessionUser';
1036     var u = '../pub' + m;
1037     self.fm_get(u, "text", function (resp) {
1038       self.userid = resp;
58bcbd 1039       self.login_zeigen();
U 1040       //document.querySelector("#userMenu").textContent = resp;
94b871 1041     });
U 1042   };
05e9c4 1043
94b871 1044   this.fm_logout = function() {
U 1045     var m = '?c=de.uhilger.filecms.pub.SessionManager&m=expireSession';
1046     var u = '../pub' + m;
1047     self.fm_get(u, "text", function (resp) {
1048       //$('#userMenu').text('nicht angemeldet');
1049       window.location.href = '../logout.html';
1050     });
1051   };
41ab37 1052   
6648a8 1053   /* ----- Hilfsfunktionen ----- */
U 1054
1055   this.serialisieren = function(obj) {
1056     return '{"' + obj.constructor.name + '":' + JSON.stringify(obj) + '}';
1057   };
1058   
1059   this.addEvtListener = function(selector, eventName, func) {
1060     document.querySelectorAll(selector).forEach(elem => { elem.addEventListener(eventName, func); });
1061   };
1062   
1063   this.removeAllListeners = function(id) {
1064     var el = document.getElementById(id);
5b4d03 1065     if(el !== null) {
U 1066       elClone = el.cloneNode(true);
1067       el.parentNode.replaceChild(elClone, el);
1068     }
6648a8 1069   }; // https://stackoverflow.com/questions/19469881/remove-all-event-listeners-of-specific-type
U 1070
ebc1f3 1071   this.escapeHtml = function(text) {
U 1072     text = text.replace(/\u228/g,'&auml;');
1073     text = text.replace(/\u246/g,'&ouml;');
1074     text = text.replace(/\u252/g,'&uuml;');
1075     text = text.replace(/\u196/g,'&Auml;');
1076     text = text.replace(/\u214/g,'&Ouml;');
1077     text = text.replace(/\u220/g,'&Uuml;');
1078     text = text.replace(/\u223/g,'&szlig;');
1079     text = text.replace(/\u26/g,'&amp;');
1080     return text;
1081   };
1082
1083   this.unescapeHtml = function(text) {
1084     text = text.replace(/&auml;/g, String.fromCharCode(228));
1085     text = text.replace(/&ouml;/g, String.fromCharCode(246));
1086     text = text.replace(/&uuml;/g, String.fromCharCode(252));
1087     text = text.replace(/&Auml;/g, String.fromCharCode(196));
1088     text = text.replace(/&Ouml;/g, String.fromCharCode(214));
1089     text = text.replace(/&Uuml;/g, String.fromCharCode(220));
1090     text = text.replace(/&szlig;/g, String.fromCharCode(223));
1091     text = text.replace(/&amp;/g, String.fromCharCode(26));
1092     return text;
1093   };
1094
41ab37 1095   /* ---- Vorlagen ---- */
U 1096
1097   this.html_erzeugen = function(vurl, inhalt, cb) {
1098     var vorlage = self.cache[vurl];
1099     if(vorlage === undefined) {
1100       self.vorlage_laden_und_fuellen(vurl, inhalt, cb);
1101     } else {
1102       self.vorlage_fuellen(vurl, inhalt, cb);
1103     }
1104   };
1105
1106   this.vorlage_fuellen = function(vurl, inhalt, cb) {
1107     cb(Mustache.render(self.cache[vurl], inhalt));
1108   };
1109
1110   this.vorlage_laden_und_fuellen = function(vurl, inhalt, cb) {
1111     self.fm_get(vurl, "text", function(antwort) {
1112       self.cache[vurl] = antwort;
1113       self.vorlage_fuellen(vurl, inhalt, cb);
1114     });
1115   };
94b871 1116
U 1117   /* -------- ajax helper functions ----------- */
1118
58bcbd 1119   this.fm_get = function (u, dtype, scallback) {    
U 1120     var xmlhttp = new XMLHttpRequest();
1121     var url = u;
1122     xmlhttp.onreadystatechange = function() {
5b4d03 1123       if (this.readyState === 4 && this.status === 200) {
58bcbd 1124         scallback(this.responseText);
94b871 1125       }
58bcbd 1126     };
U 1127     xmlhttp.open("GET", url, true);
1128     xmlhttp.send();
94b871 1129   };
ebc1f3 1130   
U 1131   self.fm_post = function(u, d, dtype, scallback) {
1132     var xmlhttp = new XMLHttpRequest();
1133     var url = u;
1134     xmlhttp.onreadystatechange = function() {
5b4d03 1135       if (this.readyState === 4 && this.status === 200) {
ebc1f3 1136         scallback(this.responseText);
U 1137       }
1138     };
1139     xmlhttp.open("POST", url, true);
1140     xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
5b4d03 1141     xmlhttp.send(d);
ebc1f3 1142   };
U 1143
5b4d03 1144   /*
ebc1f3 1145   this.http_get = function(u, cb)  {
U 1146     self.http_call('GET', u, null, cb);
1147   };
1148   
1149   this.http_post = function(u, data, cb) {
1150     self.http_call('POST', u, data, cb);
1151   };
1152
1153   this.http_call = function (method, u, data, scallback) {    
1154     var xhr = new XMLHttpRequest();
1155     var url = u;
1156     xhr.onreadystatechange = function() {
1157       if (this.readyState === 4 && this.status === 200) {
1158         scallback(this.responseText);
1159       }
1160     };
5b4d03 1161     xhr.open(method, url, false);
ebc1f3 1162     if(method === 'GET')  {
U 1163       xhr.send();
1164     } else if(method === 'POST' || method === 'PUT') {
1165       xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
1166       xhr.send(data);
1167     }
1168   };
5b4d03 1169   */
ebc1f3 1170
94b871 1171
05e9c4 1172 }