From 7d8ef67736311d75b97a249482a938662035fd39 Mon Sep 17 00:00:00 2001
From: Ulrich <undisclosed>
Date: Mon, 27 Feb 2017 11:04:06 +0000
Subject: [PATCH] Mustache wieder als Teil der HTML-Datei. TinyMCE in erster Fassung fertig eingebaut.
---
/dev/null | 21 ----
web/ui/index.html | 46 ++++++++
web/ui/ui.js | 220 ++++++++++++++++++-------------------------
3 files changed, 134 insertions(+), 153 deletions(-)
diff --git a/web/ui/index.html b/web/ui/index.html
index e8960be..2837f56 100644
--- a/web/ui/index.html
+++ b/web/ui/index.html
@@ -9,12 +9,50 @@
<link rel="stylesheet" type="text/css" href="/jslib/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/jslib/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="stile.css">
+ <script id="tpl-kacheln" type="x-tmpl-mustache">
+ {{#files}}
+ <figure class="figure datei-figure text-center text-warning align-top datei-elem">
+ <i class="fa {{ typeClass }} fa-3x"></i>
+ <figcaption class="figure-caption dateiname">{{ fileName }}</figcaption>
+ </figure>
+ {{/files}}
+ </script>
+ <script id="tpl-liste" type="x-tmpl-mustache">
+ <table class="table table-hover table-sm table-responsive tableBodyScroll">
+ <thead>
+ <tr>
+ <th colspan="2">Name</th>
+ <th>Größe</th>
+ <th>Art</th>
+ <th>geändert</th>
+ </tr>
+ </thead>
+ <tbody>
+ {{#files}}
+ <tr class="datei-zeile">
+ <td class="datei-elem"><i class="fa {{ typeClass }}"></i></td>
+ <td class="dateiname">{{ fileName }}</td>
+ <td>{{ fr.length }}</td>
+ <td> </td>
+ <td>{{ fr.lastModified }}</td>
+ </tr>
+ {{/files}}
+ </tbody>
+ </table>
+ </script>
+ <script id="tpl-bcr" type="x-tmpl-mustache">
+ {{#files}}
+ <a class="breadcrumb-item" rpath="{{ relPath }}" href="#">{{ fName }}</a>
+ {{/files}}
+ </script>
+ <script id="tpl-bcr2" type="x-tmpl-mustache">
+ <span class="breadcrumb-item active">{{ fName }}</span>
+ </script>
<script id="tpl-bcr3" type="x-tmpl-mustache">
<div id="ansicht" class="pull-right align-middle">
<i class="fa fa-th-list"></i>
</div>
- </script>
- </head>
+ </script> </head>
<body>
<!-- Kopfzeile -->
<div class="nord">
@@ -29,7 +67,7 @@
<a id="newFolder" class="dropdown-item" href="#">Neuer Ordner..</a>
<div class="dropdown-divider"></div>
<a id="editTextFile" class="dropdown-item" href="#">Öffnen als Text</a>
- <a class="dropdown-item disabled" href="#">Öffnen als Dokument</a>
+ <a id="editDocFile" class="dropdown-item" href="#">Öffnen als Dokument</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item disabled" href="#">Ansehen als Text</a>
<a class="dropdown-item disabled" href="#">Ansehen als Dokument</a>
@@ -94,7 +132,7 @@
</div>
<!-- Codemirror Ende -->
<!-- TinyMCE Start -->
- <div id="mce-editor">
+ <div id="mce-editor" class="pl-3 pr-3">
<textarea class="text-editor" id="text-editspace"></textarea>
</div>
<!-- TinyMCE Ende -->
diff --git a/web/ui/tpl-bcr.txt b/web/ui/tpl-bcr.txt
deleted file mode 100644
index 16454c1..0000000
--- a/web/ui/tpl-bcr.txt
+++ /dev/null
@@ -1,3 +0,0 @@
-{{#files}}
- <a class="breadcrumb-item" rpath="{{ relPath }}" href="#">{{ fName }}</a>
-{{/files}}
\ No newline at end of file
diff --git a/web/ui/tpl-bcr2.txt b/web/ui/tpl-bcr2.txt
deleted file mode 100644
index 5dc613a..0000000
--- a/web/ui/tpl-bcr2.txt
+++ /dev/null
@@ -1 +0,0 @@
-<span class="breadcrumb-item active">{{ fName }}</span>
diff --git a/web/ui/tpl-bcr3.txt b/web/ui/tpl-bcr3.txt
deleted file mode 100644
index edd8f44..0000000
--- a/web/ui/tpl-bcr3.txt
+++ /dev/null
@@ -1,4 +0,0 @@
-<div id="ansicht" class="pull-right align-middle">
- <i class="fa fa-th-list"></i>
-</div>
-
diff --git a/web/ui/tpl-kacheln.txt b/web/ui/tpl-kacheln.txt
deleted file mode 100644
index 0a8102f..0000000
--- a/web/ui/tpl-kacheln.txt
+++ /dev/null
@@ -1,6 +0,0 @@
-{{#files}}
- <figure class="figure datei-figure text-center align-top datei-elem">
- <i class="fa {{ typeClass }} fa-3x"></i>
- <figcaption class="figure-caption dateiname">{{ fileName }}</figcaption>
- </figure>
-{{/files}}
\ No newline at end of file
diff --git a/web/ui/tpl-liste.txt b/web/ui/tpl-liste.txt
deleted file mode 100644
index b71baff..0000000
--- a/web/ui/tpl-liste.txt
+++ /dev/null
@@ -1,21 +0,0 @@
-<table class="table table-hover table-sm table-responsive tableBodyScroll">
- <thead>
- <tr>
- <th colspan="2">Name</th>
- <th>Größe</th>
- <th>Art</th>
- <th>geändert</th>
- </tr>
- </thead>
- <tbody>
- {{#files}}
- <tr class="datei-zeile">
- <td class="datei-elem"><i class="fa {{ typeClass }}"></i></td>
- <td class="dateiname">{{ fileName }}</td>
- <td>{{ fr.length }}</td>
- <td> </td>
- <td>{{ fr.lastModified }}</td>
- </tr>
- {{/files}}
- </tbody>
-</table>
\ No newline at end of file
diff --git a/web/ui/ui.js b/web/ui/ui.js
index db82e7a..47ca193 100644
--- a/web/ui/ui.js
+++ b/web/ui/ui.js
@@ -21,7 +21,7 @@
var modus = 'kacheln';
var openFileName = '';
var ed;
-var t;
+var openEditor;
function fm_init() {
$("#mce-editor").hide();
@@ -31,7 +31,12 @@
$('#newTextFile').on('click', fm_menu_neue_textdatei);
$('#newDoc').on('click', fm_menu_neues_dokument);
$('#newFolder').on('click', fm_get_new_folder);
- $('#editTextFile').on('click', fm_get_file_content);
+ $('#editTextFile').on('click', function() {
+ fm_get_file_content('text');
+ });
+ $('#editDocFile').on('click', function() {
+ fm_get_file_content('dok');
+ });
$('#saveFile').on('click', fm_menu_datei_speichern);
$('#saveFileAs').on('click', fm_menu_datei_speichern_unter);
$('#closeFile').on('click', fm_menu_datei_schliessen);
@@ -50,11 +55,11 @@
*/
tinymce.init({
content_css : "mce.css",
- selector: "textarea",
+ selector: "textarea.text-editor",
statusbar: false,
menubar: false,
- plugins: 'autoresize advlist charmap code image link lists media print preview save table textcolor',
- toolbar: 'undo redo | styleselect | outdent indent',
+ plugins: 'advlist charmap code image link lists media print preview save table textcolor',
+ toolbar: 'undo redo | styleselect | image | link unlink | bullist numlist | outdent indent | code',
/*
menu: {
file: {title: 'File', items: 'savevers | exit'},
@@ -62,64 +67,26 @@
view: {title: 'View', items: 'visualaid | code | link image media | template hr'},
},
*/
- resize: true,
+ /*resize: 'both',*/
width: "100%",
height: '100%',
- autoresize_bottom_margin : 1,
+ /*autoresize_bottom_margin : 1,*/
setup: function (editor) {
ed = editor;
- //self.ed = editor;
- /*
- editor.addMenuItem('fileinfo', {
- text: 'Toggle file info',
- onclick: function () {
- editor.insertContent('Toggle file info');
- toggleFileInfo();
- }
- });
- editor.addMenuItem('savevers', {
- text: 'Speichern',
- onclick: function () {
- self.notizSpeichern();
- }
- });
- editor.addMenuItem('exit', {
- text: 'Exit',
- onclick: function () {
- self.editorBeenden();
- }
- });
- */
}
});
+ window.onresize = function() {
+ fm_resizeEditor();
+ };
}
-
-function resizeEditor(myHeight) {
- window.console.log('resizeEditor');
- var myEditor = ed;
- if (myEditor) {
+function fm_resizeEditor() {
+ if (ed) {
try {
- /*
- if (!myHeight) {
- var targetHeight = window.innerHeight; // Change this to the height of your wrapper element
- var mce_bars_height = 0;
- $('.mce-toolbar, .mce-statusbar, .mce-menubar').each(function () {
- mce_bars_height += $(this).height();
- });
- window.console.log('mce bars height total: ' + mce_bars_height);
- myHeight = targetHeight - mce_bars_height - 8; // the extra 8 is for margin added between the toolbars
- }
- */
- var myHeight = $('.zentrum').height() - $('.nord').height();
- window.console.log('resizeEditor: ', myHeight);
- myEditor.theme.resizeTo('100%', myHeight); // sets the dimensions of the editable area
+ var myHeight = $('.zentrum').height() - $('.nord').height() - 4;
+ ed.theme.resizeTo('100%', myHeight); // sets the dimensions of the editable area
} catch (err) {
}
}
-}
-
-window.onresize = function() {
- resizeEditor();
}
/* ----- Uploader Anfang ----------*/
@@ -223,16 +190,13 @@
}
function fm_menu_neues_dokument() {
+ /*
fm_filectls_hide();
$("#mce-editor").show();
- resizeEditor();
- /*
- var ht = $(window).innerHeight() - 20;
- window.clearTimeout(t);
- t = window.setTimeout(function () {
- $('.mce-editor').height(ht - 100);
- }, 200);
+ fm_resizeEditor();
+ openEditor = 'dok';
*/
+ fm_dok_edit('');
}
function fm_menu_datei_schliessen() {
@@ -243,6 +207,7 @@
cm.toTextArea();
}
openFileName = '';
+ openEditor = '';
fm_get_list(pfad);
fm_filectls_show();
}
@@ -320,6 +285,15 @@
$('.codeeditor-space').show();
$('.code-editor-container').show();
fm_code_edit(content);
+ openEditor = 'text';
+}
+
+function fm_dok_edit(content) {
+ fm_filectls_hide();
+ $("#mce-editor").show();
+ ed.setContent(content);
+ fm_resizeEditor();
+ openEditor = 'dok';
}
function fm_filectls_hide() {
@@ -360,7 +334,7 @@
});
}
-function fm_get_file_content() {
+function fm_get_file_content(typ) {
var gewaehlte = $('.datei-gewaehlt');
//var fname = $(gewaehlte).find('.dateiname').text();
@@ -369,7 +343,11 @@
var m = '?c=de.uhilger.filecms.api.FileMgr&m=getCode&p=' + pfad + '&p=' + fname;
var u = '../svc' + m;
fm_get(u, "text", function(resp) {
- fm_text_edit(resp);
+ if(typ == 'text') {
+ fm_text_edit(resp);
+ } else {
+ fm_dok_edit(resp);
+ }
});
}
@@ -404,6 +382,24 @@
function fm_render_list(fl) {
if(modus == 'kacheln') {
// Kachelansicht
+ 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);
+ } else {
+ // Listenansicht
+ 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);
+ }
+ /*
+ if(modus == 'kacheln') {
+ // Kachelansicht
$.get('tpl-kacheln.txt', function(template) {
$('#dateien').empty();
$('#dateien').html(Mustache.render(template, fl));
@@ -419,6 +415,7 @@
});
$('.figure').attr('onclick','').unbind('click');
}
+ */
}
// http://localhost:8079/file-cms/svc?c=de.uhilger.filecms.api.FileMgr&f=JSONNICE&m=list&p=
@@ -444,7 +441,7 @@
}
// Breadcrumb-Ansicht
- //var template;
+ var template;
$('.breadcrumb-item').attr('onclick','').unbind('click');
$('#bcnav').empty();
var dirList = new Array();
@@ -464,75 +461,36 @@
}
}
var bl = new BcrFiles(dirList);
-
- if(dirList.length > 0) {
- $.get('tpl-bcr.txt', function(template) {
- $('#bcnav').html(Mustache.render(template, bl));
- //fm_bcr_step2(dirs, dirList);
-
- if(dirs.length > 0) {
- dirList.push(new BcrFile(rp + '/' + dirs[dirs.length-1], dirs[dirs.length-1]));
- $.get('tpl-bcr2.txt', function(template) {
- $('#bcnav').append(Mustache.render(template, dirList[dirList.length-1]));
- fm_bcr_3();
- fm_bcr_end();
- });
- //template = $('#tpl-bcr2').html();
- //Mustache.parse(template); // optional, speeds up future uses
- //$('#bcnav').append(Mustache.render(template, dirList[dirList.length-1]));
- } else {
- $.get('tpl-bcr2.txt', function(template) {
- $('#bcnav').append(Mustache.render(template, dirList[0]));
- fm_bcr_3();
- fm_bcr_end();
- });
- //template = $('#tpl-bcr2').html();
- //Mustache.parse(template); // optional, speeds up future uses
- //$('#bcnav').append(Mustache.render(template, dirList[0]));
- }
-
- });
- } else {
- //fm_bcr_step2(dirs, dirList);
- /*
- if(dirs.length > 0) {
- dirList.push(new BcrFile(rp + '/' + dirs[dirs.length-1], dirs[dirs.length-1]));
- $.get('tpl-bcr2.txt', function(template) {
- $('#bcnav').append(Mustache.render(template, dirList[dirList.length-1]));
- $('#bcnav').append($('#tpl-bcr3').html());
- fm_bcr_end();
- });
- //template = $('#tpl-bcr2').html();
- //Mustache.parse(template); // optional, speeds up future uses
- //$('#bcnav').append(Mustache.render(template, dirList[dirList.length-1]));
- } else {
- $.get('tpl-bcr2.txt', function(template) {
- $('#bcnav').append(Mustache.render(template, dirList[0]));
- $('#bcnav').append($('#tpl-bcr3').html());
- fm_bcr_end();
- });
- //template = $('#tpl-bcr2').html();
- //Mustache.parse(template); // optional, speeds up future uses
- //$('#bcnav').append(Mustache.render(template, dirList[0]));
- }
- */
+
+ if(dirList.length > 0) {
+ template = $('#tpl-bcr').html();
+ Mustache.parse(template); // optional, speeds up future uses
+ $('#bcnav').html(Mustache.render(template, bl));
}
+
+ if(dirs.length > 0) {
+ dirList.push(new BcrFile(rp + '/' + dirs[dirs.length-1], dirs[dirs.length-1]));
+ template = $('#tpl-bcr2').html();
+ Mustache.parse(template); // optional, speeds up future uses
+ $('#bcnav').append(Mustache.render(template, dirList[dirList.length-1]));
+ } else {
+ template = $('#tpl-bcr2').html();
+ Mustache.parse(template); // optional, speeds up future uses
+ $('#bcnav').append(Mustache.render(template, dirList[0]));
+ }
+
+ $('#bcnav').append($('#tpl-bcr3').html());
} else {
pfad = '';
- $.get('tpl-bcr2.txt', function(template) {
- $('#bcnav').append(Mustache.render(template, dirList[0]));
- fm_bcr_3();
- fm_bcr_end();
- });
- //template = $('#tpl-bcr2').html();
- //Mustache.parse(template); // optional, speeds up future uses
- //$('#bcnav').append(Mustache.render(template, dirList[0]));
- //$('#bcnav').append($('#tpl-bcr3').html());
+ template = $('#tpl-bcr2').html();
+ Mustache.parse(template); // optional, speeds up future uses
+ $('#bcnav').append(Mustache.render(template, dirList[0]));
+ $('#bcnav').append($('#tpl-bcr3').html());
}
- //$('.breadcrumb-item').click(fm_bc_click);
- //$('#ansicht').click(fm_ansicht_umschalten);
- //fm_set_modus();
- });
+ $('.breadcrumb-item').click(fm_bc_click);
+ $('#ansicht').click(fm_ansicht_umschalten);
+ fm_set_modus();
+ });
}
/*
@@ -583,9 +541,15 @@
}
function fm_save_file(saveFileName) {
+ var content;
+ if(openEditor === 'text') {
+ content = cm.getValue();
+ } else {
+ content = ed.getContent();
+ }
var m = '?c=de.uhilger.filecms.api.FileMgr&m=saveTextFile';
var u = '../svc' + m;
- fm_post(u, {p1: pfad, p2: saveFileName, p3: cm.getValue()}, function(resp) {
+ fm_post(u, {p1: pfad, p2: saveFileName, p3: content}, function(resp) {
openFileName = saveFileName;
});
}
--
Gitblit v1.9.3