From b20b749a95f6aa9d73414c58b66b4c7abe9b1077 Mon Sep 17 00:00:00 2001 From: ulrich Date: Sat, 16 Jan 2021 16:31:25 +0000 Subject: [PATCH] Stile angepasst, Neuer Reiter hinzugefuegt, Menue angepasst --- web/ui2/js/app.js | 778 ++++++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 713 insertions(+), 65 deletions(-) diff --git a/web/ui2/js/app.js b/web/ui2/js/app.js index 480b26e..3e08ec4 100644 --- a/web/ui2/js/app.js +++ b/web/ui2/js/app.js @@ -1,27 +1,37 @@ function AppVorlage() { var self = this; - var appMenu; - var vorlagen; - var api; - var userid; - var pfad = ''; - var loc; - var modus = 'kacheln'; - var PERS_DIR = "Persoenlich"; - var PUB_DIR = "Oeffentlich"; - var DAV_DIR = "Austausch"; - var BASE_DIR = "$basis"; - var DATA_DIR = "$daten"; - var WWW_DIR = "www"; + this.appMenu; + //this.vorlagen; + this.api; + this.userid; + this.pfad = ''; + this.loc; + this.modus = 'kacheln'; + this.cm; + //this.tinymce; + this.ed; + this.tmo; + this.tmo2; + this.PERS_DIR = "Persoenlich"; + this.PUB_DIR = "Oeffentlich"; + this.DAV_DIR = "Austausch"; + this.BASE_DIR = "$basis"; + this.DATA_DIR = "$daten"; + this.WWW_DIR = "www"; + this.openEditor; + this.openFileName; + this.cache = {}; // mustache template cache this.datei_neuer_text = function () { - self.meldung_mit_timeout("Neuer Text", 1500); + //self.meldung_mit_timeout("Neuer Text", 1500); + self.fm_text_edit('Neue Datei'); }; - + /* Funktionen aus App-Vorlage */ - this.init = function () { - self.vorlagen = new Vorlagen(); + this.init = function () { + document.querySelector(".codeeditor-space").style.display = "none"; + document.querySelector("#mce-editor").style.display = "none"; self.appMenu = new AppMenu(); self.appMenu.init( "data/menu/", @@ -33,12 +43,28 @@ self.menue_umschalten(); }); self.fm_get_login(); - self.fm_get_list(''); + + var parsedUrl = new URL(window.location.href); + var wunschPfad = parsedUrl.searchParams.get("pfad"); + + if(wunschPfad !== null && wunschPfad.length > 0) { + self.pfad = wunschPfad; + self.fm_get_list(wunschPfad); + } else { + self.fm_get_list(''); + } + + self.seitenleiste_umschalten(); + //fm_init_uploader(); self.loc = window.location.protocol + '//' + window.location.host; }; this.login_zeigen = function() { self.meldung_mit_timeout("Benutzer: " + self.userid, 1500); + }; + + this.fm_neuer_reiter = function() { + window.open('/file-cms/ui2/?pfad=' + self.pfad, '_blank'); }; this.menue_umschalten = function () { @@ -61,7 +87,7 @@ ostDiv.classList.add('ost-open'); ostDiv.style.flexBasis = '6em'; } - self.menue_umschalten(); + //self.menue_umschalten(); }; this.fusszeile_umschalten = function () { @@ -90,6 +116,71 @@ }, 500); }, timeout); }; + + this.fm_menu_datei_schliessen = function() { + if(self.openEditor === 'text') { + if(!self.cm.getDoc().isClean()) { + self.fm_ask_for_save(); + } else { + self.fm_do_close(); + } + } else { + if(tinymce.activeEditor.undoManager.hasUndo()) { + self.fm_ask_for_save(); + } else { + self.fm_do_close(); + } + } + }; + + this.fm_ask_for_save = function() { + self.dialog_laden_und_zeigen('data/tpl/dlg-ask-save.tpl', '', function() { + // wenn dialog da ist, hier events verknuepfen + document.querySelector('#cancel-btn').addEventListener('click', function() { + self.fm_do_close(); + self.dialog_schliessen(); + }); + document.querySelector('#speichern-btn').addEventListener('click', function() { + self.fm_menu_datei_speichern(function() { + self.fm_do_close(); + self.dialog_schliessen(); + }); + }); + }); + }; + + this.fm_menu_datei_speichern = function(callback) { + //var fname = $('.datei-gewaehlt').text(); + var fname = self.openFileName; + if(fname !== undefined && fname !== '') { + self.fm_save_file(fname, 'saveTextFile', callback); + } else { + self.fm_menu_datei_speichern_unter(callback); + } + }; + + this.fm_menu_datei_speichern_unter = function(callback) { + self.dialog_laden_und_zeigen('data/tpl/dlg-save-as.tpl', '', function() { + document.querySelector('#cancel-btn').addEventListener('click', function() { + //self.fm_do_close(); + self.dialog_schliessen(); + }); + document.querySelector('#speichern-btn').addEventListener('click', function() { + //self.fm_menu_datei_speichern(function() { + //console.log(document.querySelector('#datei-name-in').value); + self.fm_save_file(document.querySelector('#datei-name-in').value, 'saveTextFileAs', callback); + if(typeof(callback) !== 'function') { + self.fm_do_close(); + self.dialog_schliessen(); + } + //}); + }); + }); + }; + + this.fm_menu_neues_dokument = function() { + self.fm_dok_edit(''); + }; /* Dialog-Funktionen */ @@ -99,31 +190,35 @@ vurl - URL zur Dialogvorlage msgTpl - URL mit einer Vorlage eines Mitteilungstextes (optional) */ - this.dialog_laden_und_zeigen = function (vurl, msgTpl) { - if (msgTpl !== '') { - fetch(msgTpl) - .then(data => { - // Handle data - self.dialog_zeigen(vurl, data); - }).catch(error => { - // Handle error + this.dialog_laden_und_zeigen = function (vurl, msgTpl, cb) { + var vorlage = self.cache[vurl]; + if(vorlage === undefined) { + self.fm_get(vurl, "text", function(antwort) { + self.cache[vurl] = antwort; + self.dialog_zeigen(vurl, antwort, cb); + //self.vorlage_fuellen(vurl, inhalt, cb); }); } else { - self.dialog_zeigen(vurl, ''); + self.dialog_zeigen(vurl, vorlage, cb); } }; - this.dialog_zeigen = function (vurl, inhalt) { + this.dialog_zeigen = function (vurl, inhalt, cb) { var dlg = document.querySelector(".dialog"); - self.vorlagen.html_erzeugen( + self.html_erzeugen( vurl, inhalt, function (html) { //dlg.html(html); - dlg.style.height = '5em'; + dlg.style.height = '7em'; dlg.innerHTML = html; document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen); //dlg.slideDown(300); + if(typeof(cb) !== 'function') { + // .. + } else { + cb(); + } }); }; @@ -134,40 +229,99 @@ //dlg.style.display = "none"; dlg.style.height = '0'; dlg.innerHTML = ''; + self.removeAllListeners('#cancel-btn'); + self.removeAllListeners('#speichern-btn'); }; + + this.fm_dateiwahl = function(ev) { + var elem = ev.target; + if(self.modus == 'kacheln') { + // Kacheln + if(elem.classList.contains("icon-folder")) { + if(/*ev.shiftKey || */ ev.ctrlKey) { + var par = elem.parentElement; + par.querySelector('.dateiname').classList.add('datei-gewaehlt'); + } else { + var ordner = elem.parentElement.querySelector('.dateiname').textContent.trim(); + if(self.pfad.length > 0) { + self.pfad = self.pfad + '/' + ordner; + } else { + self.pfad = ordner; + } + self.fm_get_list(self.pfad); + } + } else if(elem.classList.contains('datei')) { + if(/*ev.shiftKey || */ ev.ctrlKey) { + // mehrere Dateien sollen gewaehlt werden + } else { + var gew = document.querySelector('.datei-gewaehlt'); + if(gew != undefined) { + gew.classList.remove('datei-gewaehlt'); + } + } + var par = elem.parentElement; + par.querySelector('.dateiname').classList.add('datei-gewaehlt'); + } else { + //console.log('kein folder oder file...'); + } + } else { + // Liste + var pElem = elem.closest('.datei-zeile'); + var dElem = pElem.querySelector('.datei-elem'); + if(dElem.getElementsByTagName("i")[0].classList.contains('icon-doc-text-inv')) { + // Datei + if(/*ev.shiftKey || */ ev.ctrlKey) { + // mehrere Dateien sollen gewaehlt werden + } else { + var ti = document.querySelector('.table-info'); + if(ti !== null) { + ti.classList.remove('table-info'); + } + var dg = document.querySelector('.datei-gewaehlt'); + if(dg !== null) { + dg.classList.remove('datei-gewaehlt'); + } + } + pElem.classList.add('table-info'); + pElem.querySelector('.dateiname').classList.add('datei-gewaehlt'); + } else { + // Ordner + if(/*ev.shiftKey || */ ev.ctrlKey) { + //elem.children[0].classList.add('datei-gewaehlt'); + pElem.querySelector('.dateiname').classList.add('datei-gewaehlt'); + } else { + var ordner = pElem.querySelector('.dateiname').textContent; + if(self.pfad.length > 0) { + self.pfad = self.pfad + '/' + ordner; + } else { + self.pfad = ordner; + } + self.fm_get_list(self.pfad); + } + } + } + }; + this.fm_render_list = function (fl) { - if (self.modus == 'kacheln') { + if (self.modus === 'kacheln') { // Kachelansicht - - // neu bauen - - /* - var template = $('#tpl-kacheln').html(); - Mustache.parse(template); // optional, speeds up future uses - $('.datei-zeile').attr('onclick', '').unbind('click'); - $('#dateien').empty(); - $('#dateien').html(Mustache.render(template, fl)); - $('.figure').click(fm_dateiwahl); - */ + self.html_erzeugen("data/tpl/kacheln.tpl", fl, function(html) { + var elem = document.querySelector('#dateien'); + elem.innerHTML = html; + self.addEvtListener('.figure', 'click', self.fm_dateiwahl); + }); } else { // Listenansicht - - // neu bauen - - /* - var template = $('#tpl-liste').html(); - Mustache.parse(template); // optional, speeds up future uses - $('.figure').attr('onclick', '').unbind('click'); - $('#dateien').empty(); - $('#dateien').html(Mustache.render(template, fl)); - $('.datei-zeile').click(fm_dateiwahl); - */ + self.html_erzeugen("data/tpl/liste.tpl", fl, function(html) { + var elem = document.querySelector('#dateien'); + elem.innerHTML = html; + self.addEvtListener('.datei-zeile', 'click', self.fm_dateiwahl); + }); } }; this.fm_get_path = function (uid) { - //console.log('pfad: ' + pfad); var restdir; if (self.pfad.indexOf(self.PUB_DIR) > -1) { restdir = self.pfad.substr(self.PUB_DIR.length); @@ -186,8 +340,7 @@ restdir = restdir.replace(self.WWW_DIR, 'data'); } } - var pdir = fm_get_base(uid); - // console.log('fm_get_path path: ' + pdir + "/" + restdir); + var pdir = self.fm_get_base(uid); if (restdir.length > 1) { return pdir + "/" + restdir; } else { @@ -196,7 +349,6 @@ }; this.fm_get_base = function (uid) { - //console.log('pfad: ' + pfad); var pdir; if (self.pfad.indexOf(self.PUB_DIR) > -1) { pdir = '/data/' + uid; @@ -207,16 +359,138 @@ } else if (self.pfad.indexOf(self.DATA_DIR) > -1) { pdir = ''; } - //console.log('fm_get_base base: ' + pdir + uid); return pdir; }; + + /** + * Aus einem relativen Pfad ein Array aus BcrFile Objekten + * machen + * + * @param {String} relPfad der relative Pfad + * @returns {Array} die BcrFile-Objekte zum Pfad als Array + */ + this.fm_buildBreadcrumb = function(relPfad) { + var rp = ''; + var dirList = new Array(); + dirList.push(new BcrFile(rp, 'Home')); + if(relPfad.length > 1) { + var dirs = relPfad.split('/'); + for(var i = 0; i < dirs.length; i++) { + if(rp.length > 0 ) { + // weitere Einträge + dirList.push(new BcrFile(rp + '/' + dirs[i], dirs[i])); + rp = rp + '/' + dirs[i]; + } else { + // erster Eintrag + dirList.push(new BcrFile(dirs[i], dirs[i])); + rp = dirs[i]; + } + } + } + return dirList; + }; + + /* + * icon-th-large + * icon-th-list + * @returns {undefined} + */ + this.fm_ansicht_umschalten = function() { + var elem = document.querySelector('#ansicht'); + var iElem = elem.getElementsByTagName("i")[0]; + if(iElem.classList.contains('icon-th-list')) { + iElem.classList.add('icon-th-large'); + iElem.classList.remove('icon-th-list'); + self.modus = 'liste'; + } else { + iElem.classList.add('icon-th-list'); + iElem.classList.remove('icon-th-large'); + self.modus = 'kacheln'; + } + self.fm_get_list(self.pfad); + }; + this.fm_set_modus = function() { + var elem = document.querySelector('#ansicht'); + var iElem = elem.getElementsByTagName("i")[0]; + if(self.modus === 'kacheln') { + iElem.classList.add('icon-th-list'); + iElem.classList.remove('icon-th-large'); + } else { + iElem.classList.add('icon-th-large'); + iElem.classList.remove('icon-th-list'); + } + }; + + + /** + * Der letzte Eintrag in dirs ist der aktuelle Ordner und + * deshalb ausgegraut. + * + * Wenn nur ein Ordner in dirs enthalten ist, dann sind wir + * an der obersten Ebene (Home). + * + * @param {Array} dirList ein Array aus BcrFile-Objekten + * @returns nichts + */ + this.fm_renderBreadcrumb = function(dirList) { + var elem = document.querySelector('.breadcrumb'); + if(dirList.length > 1) { + var last = dirList.pop(); + var bcList = new BcrFiles(dirList); + + self.html_erzeugen("data/tpl/bcr.tpl", bcList, function(html) { + var htmlGesamt = html; + self.html_erzeugen("data/tpl/bcr2.tpl", last, function(html) { + htmlGesamt += html; + self.html_erzeugen("data/tpl/bcr3.tpl", dirList[0], function(html) { + htmlGesamt += html; + elem.innerHTML = htmlGesamt; + self.addEvtListener('.bc-link', 'click', self.fm_bc_click); + self.addEvtListener('#ansicht', 'click', self.fm_ansicht_umschalten); + self.fm_set_modus(); + }); + + }); + }); + } else { + // oberste Ebene + var htmla; + var htmlb; + self.html_erzeugen("data/tpl/bcr2.tpl", dirList[0], function(html) { + htmla = html; + self.html_erzeugen("data/tpl/bcr3.tpl", dirList[0], function(html) { + htmlb = html; + elem.innerHTML = htmla + htmlb; + self.addEvtListener('.bc-link', 'click', self.fm_bc_click); + self.addEvtListener('#ansicht', 'click', self.fm_ansicht_umschalten); + self.fm_set_modus(); + }); + }); + } + }; + + /** + * Auf den Klick auf ein Breadcrumb-Element reagieren: + * Den Ordner-Inhalt des geklickten Elements anzeigen + * @returns nichts + */ + this.fm_bc_click = function() { + var elem = this; + var bcPfad = elem.getAttribute("rpath"); + if(bcPfad !== undefined) { + self.pfad = bcPfad; + self.fm_get_list(bcPfad); + } else { + pfad = ''; + self.fm_get_list(''); + } + }; /* API functions */ // http://localhost:8079/file-cms/svc?c=de.uhilger.filecms.api.FileMgr&f=JSONNICE&m=list&p= this.fm_get_list = function (relPfad) { - //$('#ansicht').attr('onclick', '').unbind('click'); var m = '?c=de.uhilger.filecms.api.FileMgr&m=list&p=' + relPfad; var u = '../svc' + m; self.fm_get(u, "json", function (respText) { @@ -234,13 +508,282 @@ self.fm_render_list(fl); } else { // #dateien leeren - var elems = document.querySelector("#dateien"); - var count = elems[0].childElementCount; - for(var i = count-1; i > -1; i--) { - elems[0].removeChild(i); + var elem = document.querySelector("#dateien"); + elem.innerHTML = ''; + } + + // Breadcrumb + + var dirList = self.fm_buildBreadcrumb(relPfad); + self.fm_renderBreadcrumb(dirList); + }); + }; + + this.datei_neuer_ordner = function() { + self.dialog_laden_und_zeigen('data/tpl/dlg-ask-folder.tpl', '', function() { + document.querySelector('#cancel-btn').addEventListener('click', function() { + self.dialog_schliessen(); + }); + document.querySelector('#speichern-btn').addEventListener('click', function() { + var m = '?c=de.uhilger.filecms.api.FileMgr&m=newFolder&p=' + + self.pfad + + '&p=' + document.querySelector('#folder-name-in').value; + var u = '../svc' + m; + self.fm_get(u, "json", function(resp) { + self.dialog_schliessen(); + self.fm_get_list(self.pfad); + }); + }); + }); + }; + + this.fm_edit_as_text = function() { + self.fm_get_file_content('text'); + }; + + this.fm_edit_as_doc = function() { + self.fm_get_file_content('doc'); + }; + + this.fm_get_file_content = function(typ) { + var gewaehlte = document.querySelector('.datei-gewaehlt'); + //var fname = $(gewaehlte).find('.dateiname').text(); + + var fname = gewaehlte.textContent; + //console.log('fname: ' + fname); + self.openFileName = fname; + var m = '?c=de.uhilger.filecms.api.FileMgr&m=getCode&p=' + self.pfad + '&p=' + fname; + var u = '../svc' + m; + self.fm_get(u, "text", function(resp) { + if(typ === 'text') { + var mode = "text/x-java"; + if(fname.endsWith('js')) { + mode = 'javascript'; + } else if(fname.endsWith('xml')) { + mode = 'xml'; + } else if(fname.endsWith('properties')) { + mode = 'xml'; + } else if(fname.endsWith('adoc')) { + mode = 'text/x-markdown'; + } + self.fm_text_edit(resp, mode); + } else { + self.fm_dok_edit(resp); + } + }); + }; + + this.fm_save_file = function(saveFileName, method, callback) { + var content; + if(self.openEditor === 'text') { + content = self.cm.getValue(); + self.cm.getDoc().markClean(); + } else { + content = self.ed.getContent(); + tinymce.activeEditor.undoManager.clear(); + } + var m = '?c=de.uhilger.filecms.api.FileMgr&m=' + method; + var u = '../svc' + m; + var data = '&p=' + self.pfad + '&p=' + saveFileName + '&p=' + encodeURIComponent(content); + self.fm_post(u, data, "text", function(resp) { + // ... + }); + self.openFileName = saveFileName; + if(typeof (callback) !== 'function') { + + } else { + callback(); + } + }; + + + +/* ---- codemirror editor handling -------- */ + + /* + function htmlDecode(value){ + return $('<div/>').html(value).text(); + } + */ + + this.fm_code_edit = function(content, m) { + //console.log('fm_code_edit content: ' + content.substring(0,30)); + self.cm = CodeMirror.fromTextArea(document.getElementById("editspace"), { + lineNumbers: true, + lineWrapping: true, + gutters: ["CodeMirror-linenumbers", "breakpoints"], + mode: m, + viewportMargin : Infinity, + tabSize: 2, + extraKeys: { + "F9": function(cm) { + cm.setOption("fullScreen", !cm.getOption("fullScreen")); + }, + "Esc": function(cm) { + if (cm.getOption("fullScreen")) cm.setOption("fullScreen", false); + }, + ".": function(cm) { + console.log('dot pressed: perhaps look up class or method name'); + /* + * Hier kann man eine Funktion ausloesen, die fuer das + * Wort vor dem Punkt (Name der Klasse) eine Liste mit + * Vorschlaegen fuer Methodennamen einblendet. + */ + + /* + * CodeMirror.Pass laesst das Zeichen zum Editorinhalt durch, + * verhindert aber das Ausloesen von 'keyHandled' + */ + return CodeMirror.Pass; } } }); + //cm.setValue(htmlDecode(content)); + //cm.setValue(content); + self.cm.setValue(self.unescapeHtml(content)); + self.cm.getDoc().markClean(); + self.cm.on("gutterClick", function(theEditor, lineNumber) { + var info = theEditor.lineInfo(lineNumber); + //--lineNumber; + //console.log(info.gutterMarkers.breakpoints.message); + //var marker = info.gutterMarkers.breakpoints; + //$(marker).tooltip('toggle'); + }); + /* + cm.on("keyHandled", function(theEditor, keyName, event){ + console.log('cm.keyHandled keyName: ' + keyName + ', event.type: ' + event.type); + }); + */ + }; + + this.makeMarker = function(msg) { + var marker = document.createElement("div"); + marker.style.color = "#822"; + marker.innerHTML = "●"; + //marker.message = msg; + $(marker).tooltip({ + placement: 'right', + title: msg, + offset: '0 -30' + }); + return marker; + }; + + /* ---- TinyMCE editor handling -------- */ + + this.fm_dok_editor_init = function(uid) { + var base = self.fm_get_path(uid); + //var edCount = 0; + //console.log("fm_dok_editor_init calling tinymce.init with base: " + base + "/"); + + /* + * vgl. + * http://stackoverflow.com/questions/4651676/how-do-i-remove-tinymce-and-then-re-add-it + */ + //tinymce.EditorManager.execCommand('mceRemoveControl',true, 'textarea.text-editor'); + //tinymce.EditorManager.execCommand('mceAddControl',true, editor_id); + if(self.ed !== undefined) { + self.ed.destroy(); + } + if(tinymce !== undefined) { + tinymce.remove('textarea.text-editor'); + tinymce.EditorManager.editors = []; + } + + /* + * Konfiguration TinyMCE + */ + tinymce.init({ + content_css : "/file-cms/ui/mce.css", + //content_css: "/jslib/bootstrap/css/bootstrap.min.css", + selector: "textarea.text-editor", + statusbar: false, + menubar: false, + plugins: 'advlist charmap code image link lists media table print preview save table textcolor importcss', + toolbar: 'undo redo | styleselect | image table | link unlink | bullist numlist | outdent indent | code', + /* + menu: { + file: {title: 'File', items: 'savevers | exit'}, + edit: {title: 'Edit', items: 'undo redo | cut copy paste pastetext | selectall'}, + view: {title: 'View', items: 'visualaid | code | link image media | template hr'}, + }, + */ + resize: 'both', + importcss_append: true, + width: "100%", + height: '100%', + relative_urls : true, + convert_urls : false, + document_base_url : base + "/", + setup: function (editor) { + self.ed = editor; + } + }); + + window.addEventListener('resize', self.fm_resize_editor); + //$(window).on('resize', self.fm_resize_editor); + self.fm_resize_editor(); + }; + + this.fm_resize_editor = function() { + window.clearTimeout(self.tmo); + self.tmo = window.setTimeout(function () { + try { + var myHeight = document.querySelector('.inhalt').offsetHeight - + document.querySelector('.nord').offsetHeight + 2; // - 4; + //console.log('myHeight: ' + myHeight); + self.ed.theme.resizeTo('100%', myHeight); // sets the dimensions of the editable area + } catch (err) { + } + }, 200); + }; + + + + /* -------- Editoren --------- */ + + this.fm_text_edit = function(content, mode) { + document.querySelector(".codeeditor-space").style.display = "block"; + //document.querySelector(".code-editor-container").style.display = "block"; + //document.querySelector(".zentrum-behaelter").style.display = "none"; + document.querySelector(".breadcrumb").style.display = "none"; + document.querySelector(".zentrum").style.display = "none"; + self.fm_code_edit(content, mode); + self.openEditor = 'text'; + }; + + this.fm_dok_edit = function(content) { + //fm_filectls_hide(); + self.fm_dok_editor_init(self.userid); + document.querySelector("#mce-editor").style.display = "block"; + //$("#mce-editor").show(); + document.querySelector(".breadcrumb").style.display = "none"; + document.querySelector(".zentrum").style.display = "none"; + + window.clearTimeout(self.tmo2); + self.tmo2 = window.setTimeout(function () { + try { + self.ed.setContent(content); + self.openEditor = 'dok'; + } catch (err) { + } + }, 200); + }; + + this.fm_do_close = function() { + document.querySelector(".codeeditor-space").style.display = "none"; + document.querySelector("#mce-editor").style.display = "none"; + // $("#mce-editor").hide(); + //document.querySelector(".code-editor-container").style.display = "none"; + //document.querySelector(".zentrum-behaelter").style.display = "block"; + document.querySelector(".breadcrumb").style.display = "block"; + document.querySelector(".zentrum").style.display = "block"; + if(self.cm !== undefined) { + self.cm.toTextArea(); + } + self.openFileName = ''; + self.openEditor = ''; + self.fm_get_list(self.pfad); }; /* -------- An- und Abmelden ------------- */ @@ -263,6 +806,70 @@ window.location.href = '../logout.html'; }); }; + + /* ----- Hilfsfunktionen ----- */ + + this.serialisieren = function(obj) { + return '{"' + obj.constructor.name + '":' + JSON.stringify(obj) + '}'; + }; + + this.addEvtListener = function(selector, eventName, func) { + document.querySelectorAll(selector).forEach(elem => { elem.addEventListener(eventName, func); }); + }; + + this.removeAllListeners = function(id) { + var el = document.getElementById(id); + if(el !== null) { + elClone = el.cloneNode(true); + el.parentNode.replaceChild(elClone, el); + } + }; // https://stackoverflow.com/questions/19469881/remove-all-event-listeners-of-specific-type + + this.escapeHtml = function(text) { + text = text.replace(/\u228/g,'ä'); + text = text.replace(/\u246/g,'ö'); + text = text.replace(/\u252/g,'ü'); + text = text.replace(/\u196/g,'Ä'); + text = text.replace(/\u214/g,'Ö'); + text = text.replace(/\u220/g,'Ü'); + text = text.replace(/\u223/g,'ß'); + text = text.replace(/\u26/g,'&'); + return text; + }; + + this.unescapeHtml = function(text) { + text = text.replace(/ä/g, String.fromCharCode(228)); + text = text.replace(/ö/g, String.fromCharCode(246)); + text = text.replace(/ü/g, String.fromCharCode(252)); + text = text.replace(/Ä/g, String.fromCharCode(196)); + text = text.replace(/Ö/g, String.fromCharCode(214)); + text = text.replace(/Ü/g, String.fromCharCode(220)); + text = text.replace(/ß/g, String.fromCharCode(223)); + text = text.replace(/&/g, String.fromCharCode(26)); + return text; + }; + + /* ---- Vorlagen ---- */ + + 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)); + }; + + this.vorlage_laden_und_fuellen = function(vurl, inhalt, cb) { + self.fm_get(vurl, "text", function(antwort) { + self.cache[vurl] = antwort; + self.vorlage_fuellen(vurl, inhalt, cb); + }); + }; /* -------- ajax helper functions ----------- */ @@ -270,12 +877,53 @@ var xmlhttp = new XMLHttpRequest(); var url = u; xmlhttp.onreadystatechange = function() { - if (this.readyState == 4 && this.status == 200) { + if (this.readyState === 4 && this.status === 200) { scallback(this.responseText); } }; xmlhttp.open("GET", url, true); xmlhttp.send(); }; + + self.fm_post = function(u, d, dtype, scallback) { + var xmlhttp = new XMLHttpRequest(); + var url = u; + xmlhttp.onreadystatechange = function() { + if (this.readyState === 4 && this.status === 200) { + scallback(this.responseText); + } + }; + xmlhttp.open("POST", url, true); + xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); + xmlhttp.send(d); + }; + + /* + this.http_get = function(u, cb) { + self.http_call('GET', u, null, cb); + }; + + this.http_post = function(u, data, cb) { + self.http_call('POST', u, data, cb); + }; + + this.http_call = function (method, u, data, scallback) { + var xhr = new XMLHttpRequest(); + var url = u; + xhr.onreadystatechange = function() { + if (this.readyState === 4 && this.status === 200) { + scallback(this.responseText); + } + }; + xhr.open(method, url, false); + if(method === 'GET') { + xhr.send(); + } else if(method === 'POST' || method === 'PUT') { + xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); + xhr.send(data); + } + }; + */ + } -- Gitblit v1.9.3