From 8ba358fc936b9d3721aa1fea64a4c00eaaa347a4 Mon Sep 17 00:00:00 2001
From: ulrich
Date: Tue, 12 Jan 2021 23:18:10 +0000
Subject: [PATCH] Uebertragung Breadcrumb angefangen, noch in Arbeit
---
web/ui2/js/app.js | 210 +++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 204 insertions(+), 6 deletions(-)
diff --git a/web/ui2/js/app.js b/web/ui2/js/app.js
index d194768..fa1d44d 100644
--- a/web/ui2/js/app.js
+++ b/web/ui2/js/app.js
@@ -150,11 +150,83 @@
dlg.innerHTML = '';
};
+ /*
this.html_zeigen = function(html) {
// was mit dem html getan werden soll..
var elem = document.querySelector('#dateien');
elem.innerHTML = html;
+ $('.figure').click(fm_dateiwahl);
};
+ */
+
+ this.fm_dateiwahl = function(ev) {
+ var elem = ev.target;
+ //console.log(elem.nodeName);
+ //var elem = this;
+ //console.log('dateiwahl nach click, event shift: ' + ev.shiftKey + ", event ctrl: " + ev.ctrlKey);
+ if(self.modus == 'kacheln') {
+ // Kacheln
+ if(elem.classList.contains("icon-folder")) {
+ //console.log('contains icon-folder');
+ if(/*ev.shiftKey || */ ev.ctrlKey) {
+ //$(elem).find('.dateiname').addClass('datei-gewaehlt');
+ elem.querySelector('.dateiname').classList.add('datei-gewaehlt');
+ } else {
+ var ordner = elem.parentElement.querySelector('.dateiname').textContent.trim();
+ //console.log('ordner ' + ordner);
+ 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')) {
+ //console.log('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');
+ }
+ }
+ //$(elem).find('.dateiname').addClass('datei-gewaehlt');
+ var par = elem.parentElement;
+ //console.log(par.nodeName);
+ par.querySelector('.dateiname').classList.add('datei-gewaehlt');
+ } else {
+ //console.log('kein folder oder file...');
+ }
+ } else {
+ // Liste NOCH NEU MACHEN OHNE jQuery, wenn Liste implementiert ist
+ if(elem.querySelector('.datei-elem').children(0).hasClass('icon-doc-text-inv')) {
+ // Datei
+ if(/*ev.shiftKey || */ ev.ctrlKey) {
+ // mehrere Dateien sollen gewaehlt werden
+ } else {
+ document.querySelector('.table-info').classList.remove('table-info');
+ document.querySelector('.datei-gewaehlt').classList.remove('datei-gewaehlt');
+ }
+ elem.classList.add('table-info');
+ elem.querySelector('.dateiname').classList.add('datei-gewaehlt');
+ } else {
+ // Ordner
+ if(/*ev.shiftKey || */ ev.ctrlKey) {
+ elem.children[0].classList.add('datei-gewaehlt');
+ } else {
+ var ordner = elem.querySelector('.dateiname').textContent;
+ if(self.pfad.length > 0) {
+ self.pfad = self.pfad + '/' + ordner;
+ } else {
+ self.pfad = ordner;
+ }
+ self.fm_get_list(pfad);
+ }
+ }
+ }
+ };
+
this.fm_render_list = function (fl) {
if (self.modus == 'kacheln') {
@@ -164,7 +236,14 @@
//html_erzeugen = function(vurl, inhalt, cb)
- self.html_erzeugen("data/tpl/kacheln.tpl", fl, self.html_zeigen);
+ self.html_erzeugen("data/tpl/kacheln.tpl", fl, function(html) {
+ var elem = document.querySelector('#dateien');
+ elem.innerHTML = html;
+ //$('.figure').click(fm_dateiwahl);
+ self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+
+
+ });
/*
var template = $('#tpl-kacheln').html();
@@ -259,12 +338,106 @@
//self.fm_render_list(resp);
} 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
+
+ // Breadcrumb-Ansicht
+ //$('.breadcrumb-item').attr('onclick','').unbind('click');
+ //$('#bcnav').empty();
+ var dirList = new Array();
+ var rp = '';
+ //console.log("'" + relPfad + "'");
+ var dirs = relPfad.split('/');
+ //console.log(dirs.length);
+ dirList.push(new BcrFile(rp, 'Home'));
+ if(relPfad.length > 0) {
+ for(var i = 0; i < dirs.length - 1; i++) {
+ if(rp.length > 0 ) {
+ dirList.push(new BcrFile(rp + '/' + dirs[i], dirs[i]));
+ rp = rp + '/' + dirs[i];
+ } else {
+ dirList.push(new BcrFile(dirs[i], dirs[i]));
+ rp = dirs[i];
+ }
+ }
+ var bl = new BcrFiles(dirList);
+
+ if(dirList.length > 0) {
+ //template = $('#tpl-bcr').html();
+ //Mustache.parse(template); // optional, speeds up future uses
+ //$('#bcnav').html(Mustache.render(template, bl));
+
+ self.html_erzeugen("data/tpl/bcr.tpl", bl, function(html) {
+ var elem = document.querySelector('.breadcrumb');
+ elem.innerHTML = html;
+ //self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+ });
+
+ }
+
+ 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]));
+ self.html_erzeugen("data/tpl/bcr2.tpl", dirList[dirList.length-1], function(html) {
+ var elem = document.querySelector('.breadcrumb');
+ elem.innerHTML += html;
+ //self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+ });
+ } else {
+ //template = $('#tpl-bcr2').html();
+ //Mustache.parse(template); // optional, speeds up future uses
+ //$('#bcnav').append(Mustache.render(template, dirList[0]));
+ self.html_erzeugen("data/tpl/bcr2.tpl", dirList[0], function(html) {
+ var elem = document.querySelector('.breadcrumb');
+ elem.innerHTML += html;
+ //self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+ });
+ }
+
+ //$('#bcnav').append($('#tpl-bcr3').html());
+ self.html_erzeugen("data/tpl/bcr3.tpl", bl, function(html) {
+ var elem = document.querySelector('.breadcrumb');
+ elem.innerHTML += html;
+ //self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+ });
+ } else {
+ //self.pfad = '';
+ //template = $('#tpl-bcr2').html();
+ //Mustache.parse(template); // optional, speeds up future uses
+ //$('#bcnav').append(Mustache.render(template, dirList[0]));
+ //$('#bcnav').append($('#tpl-bcr3').html());
+ self.html_erzeugen("data/tpl/bcr2.tpl", dirList[0], function(html) {
+ var elem = document.querySelector('.breadcrumb');
+ elem.innerHTML += html;
+ //self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+ });
+ self.html_erzeugen("data/tpl/bcr3.tpl", dirList[0], function(html) {
+ var elem = document.querySelector('.breadcrumb');
+ elem.innerHTML += html;
+ //self.addEvtListener('.figure', 'click', self.fm_dateiwahl);
+ });
+ }
+
+ /*
+ $('.breadcrumb-item').click(fm_bc_click);
+ $('#ansicht').click(fm_ansicht_umschalten);
+ fm_set_modus();
+
+ if(fm_slideshow) {
+ $("[data-fancybox]").fancybox({
+ loop: true,
+ idleTime: 2
+ });
+ }
+ */
+
+ // Breadcrumb
+
});
};
@@ -289,6 +462,31 @@
});
};
+ /* ----- 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); });
+
+ /*
+ var elems = document.querySelectorAll(selector);
+ var index;
+ for (index = 0; index < elems.length; index++) {
+ elems[index].addEventListener(eventName, func);
+ }
+ */
+ };
+
+ this.removeAllListeners = function(id) {
+ var el = document.getElementById(id);
+ elClone = el.cloneNode(true);
+ el.parentNode.replaceChild(elClone, el);
+ }; // https://stackoverflow.com/questions/19469881/remove-all-event-listeners-of-specific-type
+
/* ---- Vorlagen ---- */
this.html_erzeugen = function(vurl, inhalt, cb) {
--
Gitblit v1.9.3