From 5b4d03923d33998372e339cfe21b7b87f22af290 Mon Sep 17 00:00:00 2001
From: ulrich
Date: Fri, 15 Jan 2021 18:54:15 +0000
Subject: [PATCH] Text bearbeiten und speichern, weiter in arbeit

---
 web/ui2/js/app.js |  274 +++++++++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 235 insertions(+), 39 deletions(-)

diff --git a/web/ui2/js/app.js b/web/ui2/js/app.js
index 413ee9b..303b5af 100644
--- a/web/ui2/js/app.js
+++ b/web/ui2/js/app.js
@@ -7,6 +7,8 @@
   this.pfad = '';
   this.loc;
   this.modus = 'kacheln';
+  this.cm;
+  this.tinymce;
   this.PERS_DIR = "Persoenlich";
   this.PUB_DIR = "Oeffentlich";
   this.DAV_DIR = "Austausch";
@@ -18,7 +20,12 @@
   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');
+  };
+  
+  this.datei_neuer_ordner = function() {
+    
   };
 
   /* Funktionen aus App-Vorlage */
@@ -27,7 +34,7 @@
     
     // Hide and show an element by changing "display" to block and none
     document.querySelector(".codeeditor-space").style.display = "none";
-    document.querySelector(".code-editor-container").style.display = "none";
+    //document.querySelector(".code-editor-container").style.display = "none";
     document.querySelector("#mce-editor").style.display = "none";
     //document.querySelector(".box").style.display = "block";
     
@@ -53,6 +60,8 @@
     } else {
       self.fm_get_list('');
     }
+    
+    self.seitenleiste_umschalten();
     //fm_init_uploader();
     self.loc = window.location.protocol + '//' + window.location.host;
     
@@ -84,7 +93,7 @@
       ostDiv.classList.add('ost-open');
       ostDiv.style.flexBasis = '6em';
     }
-    self.menue_umschalten();
+    //self.menue_umschalten();
   };
 
   this.fusszeile_umschalten = function () {
@@ -113,6 +122,90 @@
       }, 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(self.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);
+          self.fm_do_close();
+          self.dialog_schliessen();
+        });
+      });
+    });    
+    
+    
+    /*
+    $('#modal_ok').click(function() {
+      $('#modal_ok').attr('onclick','').unbind('click');
+      // hier speichern
+      fm_save_file($('#dateiname').val(), 'saveTextFileAs', callback);
+    });
+    $('#saveModalTitle').text('Datei speichern');
+    $('#dialogfrage').text("Dateiname?");
+
+    var fname = $('.datei-gewaehlt').text();
+    if(fname !== undefined) {
+      $('#dateiname').val(fname);
+    } else {
+      $('#dateiname').val('');
+    }
+    $('#dateiname').attr('placeholder', 'Dateiname');
+    $('#saveModal').modal({
+      keyboard: false,
+      show: true
+    });
+    */
+  };
+
+
 
   /* Dialog-Funktionen */
 
@@ -122,23 +215,22 @@
    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) {
@@ -147,6 +239,11 @@
               dlg.innerHTML = html;
               document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen);
               //dlg.slideDown(300);
+              if(typeof(cb) !== 'function') {
+                // ..
+              } else {
+                cb();
+              }
             });
   };
 
@@ -157,6 +254,8 @@
     //dlg.style.display = "none";
     dlg.style.height = '0';
     dlg.innerHTML = '';
+    self.removeAllListeners('#cancel-btn');
+    self.removeAllListeners('#speichern-btn');
   };
  
   this.fm_dateiwahl = function(ev) {
@@ -445,11 +544,16 @@
     });
   };
   
+  this.fm_edit_as_text = function() {
+    self.fm_get_file_content('text');
+  };
+  
   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;
@@ -472,6 +576,30 @@
     });
   };
 
+  this.fm_save_file = function(saveFileName, method, callback) {
+    var content;
+    if(self.openEditor === 'text') {
+      content = self.cm.getValue();
+      self.cm.getDoc().markClean();
+    } else {
+      content = 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 -------- */
 
@@ -482,7 +610,8 @@
   */
 
   this.fm_code_edit = function(content, m) {
-    cm = CodeMirror.fromTextArea(document.getElementById("editspace"), {
+    //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"],
@@ -514,9 +643,9 @@
     });
     //cm.setValue(htmlDecode(content));
     //cm.setValue(content);
-    cm.setValue(unescapeHtml(content));
-    cm.getDoc().markClean();
-    cm.on("gutterClick", function(theEditor, lineNumber) {
+    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);
@@ -547,11 +676,11 @@
   /* -------- Editoren --------- */
   
   this.fm_text_edit = function(content, mode) {
-    //fm_filectls_hide();
-    //$('.codeeditor-space').show();
-    //$('.code-editor-container').show();
     document.querySelector(".codeeditor-space").style.display = "block";
-    document.querySelector(".code-editor-container").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';
   };
@@ -570,20 +699,20 @@
       }
     }, 200);
   };
-
-  /*
-  function fm_filectls_hide() {
-    $('#zentrum_bc').hide();
-    $('#dateien').hide();
-    $('#editMenu').addClass('disabled');
-  }
-
-  function fm_filectls_show() {
-    $('#zentrum_bc').show();
-    $('#dateien').show();  
-    $('#editMenu').removeClass('disabled');
-  }
-  */
+  
+  this.fm_do_close = function() {
+    document.querySelector(".codeeditor-space").style.display = "none";
+    //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 ------------- */
 
@@ -618,9 +747,35 @@
   
   this.removeAllListeners = function(id) {
     var el = document.getElementById(id);
-    elClone = el.cloneNode(true);
-    el.parentNode.replaceChild(elClone, el);
+    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 ---- */
 
@@ -650,12 +805,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