Dateiverwaltung für die WebBox
view | history | commit | commitdiff
Ulrich
2017-02-23 7aa5665ab6b2bb72582713eda9534a02f7b3c50a
commit | author | age
a4d3b5 1 var cm;
5dfab6 2 var pfad = '';
10d3d3 3 var modus = 'kacheln';
5ebb8e 4 var openFileName = '';
c7c502 5
U 6 function fm_init() {
a4d3b5 7   $('.codeeditor-space').hide();
U 8   $('.code-editor-container').hide();
bef5c6 9   //$('.ost').attr('flex-basis', 0);
a4d3b5 10   $('#newTextFile').on('click', fm_menu_neue_textdatei);
adf812 11   $('#newFolder').on('click', fm_get_new_folder);
3ad4db 12   $('#editTextFile').on('click', fm_get_file_content);
e5ff42 13   $('#saveFile').on('click', fm_menu_datei_speichern);
5ebb8e 14   $('#saveFileAs').on('click', fm_menu_datei_speichern_unter);
a4d3b5 15   $('#closeFile').on('click', fm_menu_datei_schliessen);
bef5c6 16   $('#m-test').on('click', fm_menu_test);
c509a0 17   $('#saveModal').on('hidden.bs.modal', function (e) {
915927 18     $('#modal_ok').attr('onclick','').unbind('click');
b7475d 19   });
U 20   $('#logout').click(fm_logout);  
e5ff42 21   fm_get_login();
7342b1 22   fm_get_list('');
7aa566 23   fm_init_uploader();
10d3d3 24 }
7aa566 25
U 26 /* ----- Uploader Anfang ----------*/
27
28 var idNr; 
29 var dateien = new Array();
30 var sendet = false;
31
32 function fm_init_uploader() {
33   var dropzone = document.getElementById("dateien");  
34   dropzone.ondragover = dropzone.ondragenter = function(event) {  
35     event.stopPropagation();  
36     event.preventDefault();  
37   };
38
39   dropzone.ondrop = function(event) {  
40     console.log('drop ' + event.dataTransfer.files[0]);
41     event.stopPropagation();  
42     event.preventDefault();  
43
44     var filesArray = event.dataTransfer.files;  
45     for (var i=0; i<filesArray.length; i++) {  
46       //sendFile(filesArray[i]);  
47       var datei = new Datei(++idNr, filesArray[i]);
48       dateien.push(datei);
49       dateiListen(datei);
50     }  
51     naechsteDatei();
52   };
53 }
54
55 function dateiListen(d) {
56   $('.ost').append(d.file.name);
57 }
58
59 function naechsteDatei() {
60   if(!sendet && dateien.length > 0) {
61     sendFile(dateien.pop());
62   }
63 }
64
65 function sendFile(datei) {
66
67   // Dateitabelle ergaenzen
68   /*
69   var elem = document.getElementById('dateitabelle');
70   var tr = document.createElement('tr');
71   var td = document.createElement('td');
72   td.innerHTML = file.name;
73   tr.appendChild(td);
74   td = document.createElement('td');
75   td.innerHTML = 'wird hochgeladen..';
76   tr.appendChild(td);
77   elem.appendChild(tr);
78   */
79   
80   //doNotImplemented();
81   // Datei senden
82   var uri = "../api/upload"; // "../api/UploadFile"; //"/index.php";  
83   var xhr = new XMLHttpRequest();  
84   var fd = new FormData();  
85     
86   sendet = true;
87   xhr.open("POST", uri, true);  
88   xhr.onreadystatechange = function() {  
89     if (xhr.readyState == 4 && xhr.status == 200) {  
90       //var td = document.getElementById('dateizeile' + datei.nr);
91       // Handle response.  
92       //td.innerHTML = 'hochladen beendet';
93       //alert(xhr.responseText + ' ' + index); // handle response.  
94       sendet = false;
95       //window.setTimeout(function() {
96       fm_get_list(pfad);
97       naechsteDatei();
98       //}, 1000);                    
99     }  
100   };  
101   fd.append('dateiauswahlfeld', datei.file);  
102   // Initiate a multipart/form-data upload  
103   xhr.send(fd);          
104 }
105
106 function Datei (n, d) {
107   this.nr = n;
108   this.file = d;
109 }
110
111 /* ----- Uploader Ende --------------- */
10d3d3 112
bef5c6 113 function fm_menu_test() {
U 114   var w = $('.ost').width();
115   console.log('.ost.width: ' + w);
116   if(w == 0) {
117     $('.ost').width('20%');
118     $('.ost').text('Hallo Welt!');
119   } else {
120     $('.ost').empty();
121     $('.ost').width(0);
122   }
123 }
124
10d3d3 125 function fm_ansicht_umschalten() {
U 126   if($('#ansicht').children(0).hasClass('fa-th-list')) {
127     $('#ansicht').children(0).addClass('fa-th-large');
128     $('#ansicht').children(0).removeClass('fa-th-list');
129     modus = 'liste';
130   } else {
131     $('#ansicht').children(0).addClass('fa-th-list');    
132     $('#ansicht').children(0).removeClass('fa-th-large');
133     modus = 'kacheln';
134   }
135   fm_get_list(pfad);
136 }
137
138 function fm_set_modus() {
139   if(modus == 'kacheln') {
140     $('#ansicht').children(0).addClass('fa-th-list');    
141     $('#ansicht').children(0).removeClass('fa-th-large');  
142   } else {
143     $('#ansicht').children(0).addClass('fa-th-large');
144     $('#ansicht').children(0).removeClass('fa-th-list');    
145   }
a4d3b5 146 }
U 147
148 function fm_menu_neue_textdatei() {
adf812 149   fm_text_edit('Neue Datei');
a4d3b5 150 }
U 151
152 function fm_menu_datei_schliessen() {
153   $('.codeeditor-space').hide();
154   $('.code-editor-container').hide();
155   cm.toTextArea();
f5505f 156   $('#bcnav').show();
U 157   $('#dateien').show();
5ebb8e 158   openFileName = '';
adf812 159   fm_get_list(pfad);
e5ff42 160 }
U 161
5dfab6 162 function fm_dateiwahl() {
U 163   var elem = this;
10d3d3 164   if(modus == 'kacheln') {
U 165     if($(elem).children(0).hasClass('fa-folder')) {
166       var ordner = $(elem).text().trim();
167       if(pfad.length > 0) {
168         pfad = pfad + '/' + ordner;
169       } else {
170         pfad = ordner;
171       }
172       fm_get_list(pfad);
173     } else if($(elem).children(0).hasClass('fa-file')) {
174       $('.datei-gewaehlt').removeClass('datei-gewaehlt');
175       $(elem).children(0).addClass('datei-gewaehlt');
5dfab6 176     } else {
10d3d3 177       //console.log('kein folder oder file...');
5dfab6 178     }
U 179   } else {
10d3d3 180     if($(elem).find('.datei-elem').children(0).hasClass('fa-file-o')) {
U 181       $('.table-info').removeClass('table-info');
182       $(elem).addClass('table-info');
183       $('.datei-gewaehlt').removeClass('datei-gewaehlt');
184       $(elem).find('.dateiname').addClass('datei-gewaehlt');
185     } else {
186       var ordner = $(elem).find('.dateiname').text();
187       if(pfad.length > 0) {
188         pfad = pfad + '/' + ordner;
189       } else {
190         pfad = ordner;
191       }
192       fm_get_list(pfad);
193     }   
5dfab6 194   }
c509a0 195 }
U 196
a94216 197 function fm_bc_click() {
U 198   var elem = this;
199   var bcPfad = $(elem).attr('rpath');
200   if(bcPfad !== undefined) {
c509a0 201     pfad = bcPfad;
a94216 202     fm_get_list(bcPfad);
U 203   } else {
204     pfad = '';
205     fm_get_list('');
206   }
207 }
208
3ad4db 209 function fm_text_edit(content) {
f5505f 210   $('#bcnav').hide();
U 211   $('#dateien').hide();
3ad4db 212   $('.codeeditor-space').show();
U 213   $('.code-editor-container').show();
214   fm_code_edit(content);  
215 }
216
b7475d 217 /* ----- API Calls ------------- */
U 218
e5ff42 219 function fm_get_login() {
3ad4db 220   var m = '?c=de.uhilger.filecms.pub.SessionManager&m=getSessionUser';
U 221   var u = '../pub' + m;
222   fm_get(u, "text", function(resp) {
223     $('#userMenu').text(resp);
7342b1 224   });  
c509a0 225 }
U 226
227 function fm_get_new_folder() {
228   $('#modal_ok').click(function() {
229     // hier speichern
230     var m = '?c=de.uhilger.filecms.api.FileMgr&m=newFolder&p=' + pfad + '&p=' + $('#dateiname').val();
231     var u = '../svc' + m;
232     fm_get(u, "json", function(resp) {
adf812 233       fm_get_list(pfad);
c509a0 234     });
U 235   });
236   $('.modal-title').text('Neuer Ordner');
237   $('#dialogfrage').text("Name?");
238   $('#dateiname').val('');
239   $('#dateiname').attr('placeholder', 'Ordnername');
240   $('#saveModal').modal({
241     keyboard: false,
242     show: true
243   });
7342b1 244 }
U 245
2121cc 246 function fm_get_file_content() {
U 247   var fname = $('.datei-gewaehlt').text();
5ebb8e 248   openFileName = fname;
3ad4db 249   var m = '?c=de.uhilger.filecms.api.FileMgr&m=getCode&p=' + pfad + '&p=' + fname;
2121cc 250   var u = '../svc' + m;
3ad4db 251   fm_get(u, "text", function(resp) {
U 252     fm_text_edit(resp);
2121cc 253   });
3ad4db 254   
2121cc 255 }
U 256
10d3d3 257 function fm_render_list(fl) {
U 258   if(modus == 'kacheln') {
259     // Kachelansicht
260     var template = $('#tpl-kacheln').html();
261     Mustache.parse(template);   // optional, speeds up future uses
262     $('.datei-zeile').attr('onclick','').unbind('click');
263     $('#dateien').empty();
264     $('#dateien').html(Mustache.render(template, fl));
265     $('.figure').click(fm_dateiwahl);
266   } else {
267     // Listenansicht
268     var template = $('#tpl-liste').html();
269     Mustache.parse(template);   // optional, speeds up future uses
270     $('.figure').attr('onclick','').unbind('click');
271     $('#dateien').empty();
272     $('#dateien').html(Mustache.render(template, fl));
273     $('.datei-zeile').click(fm_dateiwahl);
274   }
275 }
276
7342b1 277 // http://localhost:8079/file-cms/svc?c=de.uhilger.filecms.api.FileMgr&f=JSONNICE&m=list&p=
a94216 278 function fm_get_list(relPfad) {
10d3d3 279   $('#ansicht').attr('onclick','').unbind('click');
a94216 280   var m = '?c=de.uhilger.filecms.api.FileMgr&m=list&p=' + relPfad;
7342b1 281   var u = '../svc' + m;
U 282   fm_get(u, "json", function(resp) {
10d3d3 283     
2121cc 284     if(resp.List[0].FileRef !== undefined) {
U 285       var files = new Array();
c509a0 286       if(resp.List[0].FileRef instanceof Array) {
U 287         for(var i = 0; i < resp.List[0].FileRef.length; i++) {
288           files.push(new FileRef(resp.List[0].FileRef[i]));
289         }
290       } else {
291         files.push(new FileRef(resp.List[0].FileRef));
2121cc 292       }
U 293       var fl = new FileList(files);
10d3d3 294       fm_render_list(fl);
2121cc 295     } else {
U 296       $('#dateien').empty();
7342b1 297     }
5dfab6 298     
10d3d3 299     // Breadcrumb-Ansicht
2315a0 300     var template;
a94216 301     $('.breadcrumb-item').attr('onclick','').unbind('click');
2315a0 302     $('#bcnav').empty();
5dfab6 303     var dirList = new Array();
U 304     var rp = '';
a94216 305     //console.log("'" + relPfad + "'");
U 306     var dirs = relPfad.split('/');
307     //console.log(dirs.length);
2121cc 308     dirList.push(new BcrFile(rp, 'Home'));
a94216 309     if(relPfad.length > 0) {
2315a0 310       for(var i = 0; i < dirs.length - 1; i++) {
5dfab6 311         if(rp.length > 0 ) {
U 312           dirList.push(new BcrFile(rp + '/' + dirs[i], dirs[i]));
2315a0 313           rp = rp + '/' + dirs[i];
5dfab6 314         } else {
U 315           dirList.push(new BcrFile(dirs[i], dirs[i]));
2315a0 316           rp = dirs[i];
5dfab6 317         }
U 318       }
319       var bl = new BcrFiles(dirList);
2315a0 320
U 321       if(dirList.length > 0) {
322         template = $('#tpl-bcr').html();
323         Mustache.parse(template);   // optional, speeds up future uses
324         $('#bcnav').html(Mustache.render(template, bl));
325       }
326       
327       if(dirs.length > 0) {
328         dirList.push(new BcrFile(rp + '/' + dirs[dirs.length-1], dirs[dirs.length-1]));
329         template = $('#tpl-bcr2').html();
330         Mustache.parse(template);   // optional, speeds up future uses
331         $('#bcnav').append(Mustache.render(template, dirList[dirList.length-1]));        
332       } else {
333         template = $('#tpl-bcr2').html();
334         Mustache.parse(template);   // optional, speeds up future uses
335         $('#bcnav').append(Mustache.render(template, dirList[0]));        
336       }
337       
5dfab6 338       $('#bcnav').append($('#tpl-bcr3').html());
2315a0 339     } else {
a94216 340       pfad = '';
2315a0 341       template = $('#tpl-bcr2').html();
U 342       Mustache.parse(template);   // optional, speeds up future uses
10d3d3 343       $('#bcnav').append(Mustache.render(template, dirList[0]));   
U 344       $('#bcnav').append($('#tpl-bcr3').html());
5dfab6 345     }
a94216 346     $('.breadcrumb-item').click(fm_bc_click);
10d3d3 347     $('#ansicht').click(fm_ansicht_umschalten);
U 348     fm_set_modus();
e5ff42 349   });  
U 350 }
351
352 function fm_menu_datei_speichern() {
5ebb8e 353   //var fname = $('.datei-gewaehlt').text();
U 354   var fname = openFileName;
355   if(fname !== undefined && fname !== '') {
356     fm_save_file(fname);
357   } else {
358     fm_menu_datei_speichern_unter();
359   }
360 }
361
362 function fm_save_file(saveFileName) {
363   var m = '?c=de.uhilger.filecms.api.FileMgr&m=saveTextFile';
364   var u = '../svc' + m;
365   fm_post(u, {p1: pfad, p2: saveFileName, p3: cm.getValue()}, function(resp) {
366     openFileName = saveFileName;
367   });
368 }
369
370 function fm_menu_datei_speichern_unter() {
e5ff42 371   
915927 372   $('#modal_ok').click(function() {
U 373     // hier speichern
5ebb8e 374     fm_save_file($('#dateiname').val());
U 375     /*
915927 376     var m = '?c=de.uhilger.filecms.api.FileMgr&m=saveTextFile';
U 377     var u = '../svc' + m;
2121cc 378     fm_post(u, {p1: pfad, p2: $('#dateiname').val(), p3: cm.getValue()}, function(resp) {
915927 379
U 380     });
5ebb8e 381     */
915927 382   });
c509a0 383   $('.modal-title').text('Datei speichern');
U 384   $('#dialogfrage').text("Dateiname?");
3ad4db 385   
U 386   var fname = $('.datei-gewaehlt').text();
387   if(fname !== undefined) {
388     $('#dateiname').val(fname);
389   } else {
390     $('#dateiname').val('');
391   }
c509a0 392   $('#dateiname').attr('placeholder', 'Dateiname');
915927 393   $('#saveModal').modal({
U 394     keyboard: false,
395     show: true
396   });
a4d3b5 397 }
U 398
b7475d 399 function fm_logout() {
U 400   var m = '?c=de.uhilger.filecms.pub.SessionManager&m=expireSession';
401   var u = '../pub' + m;
402   
403   fm_get(u, "text", function(resp) {
404     $('#userMenu').text('nicht angemeldet');
405     window.location.href = '../logout.html';
406   });
407 }
408
409
a4d3b5 410 /* ---- codemirror editor handling -------- */
U 411
412 function fm_code_edit(content) {
413   cm = CodeMirror.fromTextArea(document.getElementById("editspace"), {
414     lineNumbers: true,
415     mode: "xml",
416     viewportMargin : Infinity,
417     extraKeys: {
915927 418         "F9": function(cm) {
U 419         cm.setOption("fullScreen", !cm.getOption("fullScreen"));
420       },
421         "Esc": function(cm) {
422         if (cm.getOption("fullScreen")) cm.setOption("fullScreen", false);
423       }
a4d3b5 424     }
U 425   });
426   cm.setValue(content);
915927 427 }
a4d3b5 428
U 429
430
431 /* -------- helper functions ----------- */
432
b7475d 433 function fm_get(u, dtype, scallback) {
a4d3b5 434   $.ajax({
U 435     url: u,
436     type: "GET",
b7475d 437     dataType: dtype,
a4d3b5 438     success: scallback,
U 439     error: function (xhr, status, errorThrown) {
440       alert("Error: " + errorThrown + " Status: " + status + " URL: " + u);
441     },
442     complete: function (xhr, status) {
443       //console.log( "The request is complete!" );
444     }
445
446   });
915927 447 }
a4d3b5 448
U 449 function fm_post(u, d, scallback) {
450   $.ajax({
451     url: u,
452     data: d,
453     type: "POST",
454     dataType: "json",
455     success: scallback,
456     error: function (xhr, status, errorThrown) {
457       $('#fehler').html("Error: " + errorThrown + " Status: " + status);
458     },
459     complete: function (xhr, status) {
460       //alert( "The request is complete!" );
461     }
462   });
915927 463 }
a4d3b5 464
e5ff42 465 function fm_serialise(obj) {
U 466   return '{"' + obj.constructor.name + '":' + JSON.stringify(obj) + '}';
915927 467 }
e5ff42 468
7342b1 469 /* ----- Objekte ----- */
U 470
471 function FileList(fl) {
472   this.files = fl;
473 }
474
475 function FileRef(obj) {
476   var self = this;
477   this.fr = obj;
478   
479   this.typeClass = function() {
10d3d3 480     if(modus == 'kacheln') {
U 481       if(self.fr.isDirectory) {
482         return 'fa-folder';
483       } else {
484         return 'fa-file';
485       }
7342b1 486     } else {
10d3d3 487       if(self.fr.isDirectory) {
U 488         return 'fa-folder';
489       } else {
490         return 'fa-file-o';
491       }
7342b1 492     }
2121cc 493   };
U 494   
495   this.fileName = function() {
496     var namen = self.fr.absolutePath.split('/');
497     if(namen.length > 0) {
498       return namen[namen.length - 1];
499     } else {
500       return self.fr.absolutePath;
501     }
502   };
7342b1 503 }
5dfab6 504
U 505 function BcrFiles(fl) {
506   this.files = fl;
507 }
508
509 function BcrFile(rp, n) {
510   this.relPath = rp;
511   this.fName = n;
7aa566 512 }
U 513