From 822ddf5649666248df1c7436d237e50fd79646dc Mon Sep 17 00:00:00 2001 From: ulrich Date: Tue, 06 Apr 2021 15:09:37 +0000 Subject: [PATCH] Katalog (in Arbeit) --- www/ui/js/app.js | 149 ++++++++++++++++++++++++++++--------------------- 1 files changed, 86 insertions(+), 63 deletions(-) diff --git a/www/ui/js/app.js b/www/ui/js/app.js index d242320..17b88fd 100644 --- a/www/ui/js/app.js +++ b/www/ui/js/app.js @@ -9,8 +9,59 @@ function Mediazentrale() { var self = this; var appMenu; - // var vorlagen; var cache; // mustache templates + var ortPfad; + var mediaPfad; + + // auf der obersten Ebene werden die Kataloge angezeigt, + // darunter der Inhalt des aktuellen Pfades + this.media_liste = function() { + if(self.ortPfad === '/') { + // Kataloge listen + self.http_get('../api/store/Ablageort/', function (responseText) { + self.vorlage_laden_und_fuellen("data/tpl/katalog_root_liste.tpl", JSON.parse(responseText), function (html) { + document.querySelector(".zentraler-inhalt").innerHTML = html; + self.addEvtListener('.entity-eintrag', 'click', function (event) { + var t = event.target; + self.http_get('../api/store/Ablageort/' + t.textContent, function(responseText) { + var ablageort = JSON.parse(responseText); + self.ortPfad = ablageort.url; + self.media_liste(); + }); + }); + }); + }); + } else { + // Pfad listen + self.http_get('..' + self.ortPfad + '/' + self.mediaPfad + '/', function(responseText) { + //console.log(responseText); + self.vorlage_laden_und_fuellen("data/tpl/katalog_inhalt_liste.tpl", JSON.parse(responseText), function (html) { + document.querySelector(".zentraler-inhalt").innerHTML = html; + self.addEvtListener('.entity-eintrag', 'click', function (event) { + var t = event.target; + //console.log(t.textContent); + if(t.classList.contains("entity-typ-folder")) { + self.mediaPfad = self.mediaPfad + '/' + t.textContent; + self.media_liste(); + } else { + console.log("Media-Inhalt auswaehlen oder abspielen"); + } + }); + self.addEvtListener('#zurueck-btn', 'click', function (event) { + if(self.mediaPfad === '/') { + self.ortPfad = '/'; + } else { + var pos = self.mediaPfad.lastIndexOf('/'); + var parent = self.mediaPfad.substring(0, pos); + //console.log("Parent: " + parent); + self.mediaPfad = parent; + } + self.media_liste(); + }); + }); + }); + } + }; this.ablageort_liste = function() { self.http_get('../api/store/Ablageort/', function (responseText) { @@ -18,12 +69,14 @@ document.querySelector(".zentraler-inhalt").innerHTML = html; self.addEvtListener('.entity-eintrag', 'click', function (event) { var t = event.target; - //self.meldung_mit_timeout(t.textContent, 1500); self.http_get('../api/store/Ablageort/' + t.textContent, function(responseText){ - ablageort = JSON.parse(responseText); + var ablageort = JSON.parse(responseText); self.ablageort_form(ablageort); }); }); + self.addEvtListener('#neu-btn', 'click', function (event) { + eval("self.ablageort_form" + "(this)"); + }); }); }); }; @@ -40,24 +93,31 @@ self.vorlage_laden_und_fuellen("data/tpl/form_ablageort.tpl", ort, function (html) { document.querySelector(".zentraler-inhalt").innerHTML = html; self.addEvtListener('#ok-btn', 'click', function () { + var aName = document.querySelector('#ablageort-name').value; + aName = aName.replace(' ', '').replace(/[\W]+/g, ''); var a = new Ablageort( - document.querySelector('#ablageort-name').value, + aName, document.querySelector('#ablageort-ort').value, document.querySelector('#ablageort-url').value ); var daten = JSON.stringify(a); - if(typeof ort === "undefined") { + if(typeof ort === "undefined" || ort.name !== aName) { + // neu self.http_post('../api/store/Ablageort', daten, function (responseText) { // hier die Antwort verarbeiten }); } else { + // aendern self.http_put('../api/store/Ablageort', daten, function (responseText) { // hier die Antwort verarbeiten }); } + //document.querySelector(".zentraler-inhalt").innerHTML = ''; + self.ablageort_liste(); }); self.addEvtListener('#cancel-btn', 'click', function () { - document.querySelector(".zentraler-inhalt").innerHTML = ''; + //document.querySelector(".zentraler-inhalt").innerHTML = ''; + self.ablageort_liste(); }); self.addEvtListener('#loeschen-btn', 'click', function() { var aoname = document.querySelector('#ablageort-name').value; @@ -67,6 +127,9 @@ self.addEvtListener('#ja-btn', 'click', function() { self.http_delete('../api/store/Ablageort/' + aoname, '', function (responseText) { // hier die Antwort verarbeiten + self.dialog_schliessen(); + //document.querySelector(".zentraler-inhalt").innerHTML = ''; + self.ablageort_liste(); }); }); }); @@ -82,6 +145,8 @@ } }; + /* asynchroner HTTP Client */ + this.http_get = function (u, cb) { self.http_call('GET', u, null, cb); }; @@ -95,6 +160,7 @@ }; this.http_delete = function (u, data, cb) { + console.log("delete " + u); self.http_call('DELETE', u, data, cb); }; @@ -109,23 +175,18 @@ xhr.open(method, url); if (method === 'GET') { xhr.send(); - } else if (method === 'POST' || method === 'PUT') { + } else if (method === 'POST' || method === 'PUT' || method === 'DELETE') { xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xhr.send(data); } }; - this.serialisieren = function (obj) { - return '{"' + obj.constructor.name + '":' + JSON.stringify(obj) + '}'; - }; - - - - /* ab hier aus App-Vorlage */ this.init = function () { //self.vorlagen = new Vorlagen(); + self.mediaPfad = '/'; + self.ortPfad = '/'; self.cache = new Array(); self.appMenu = new AppMenu(); self.appMenu.init( @@ -233,55 +294,29 @@ self.http_get(vurl, function(antwort) { self.cache[vurl] = antwort; self.dialog_zeigen(vurl, msgTpl, cb); - //self.dialog_zeigen(vurl, antwort, cb); - //self.vorlage_fuellen(vurl, inhalt, cb); }); } else { self.dialog_zeigen(vurl, msgTpl, cb); - //self.dialog_zeigen(vurl, vorlage, cb); } }; this.dialog_zeigen = function (vurl, inhalt, cb) { var dlg = document.querySelector(".dialog"); - self.html_erzeugen( - vurl, - inhalt, - function (html) { - //dlg.html(html); - 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(); - } - }); + self.html_erzeugen(vurl, inhalt, function (html) { + dlg.style.height = '7em'; + dlg.innerHTML = html; + document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen); + if(typeof(cb) !== 'function') { + // .. + } else { + cb(); + } + }); }; - - -/* - this.dialog_zeigen = function (vurl, inhalt) { - var dlg = document.querySelector(".dialog"); - self.html_erzeugen( - vurl, - inhalt, - function (html) { - //dlg.html(html); - dlg.style.height = '5em'; - dlg.innerHTML = html; - document.querySelector('.close-btn').addEventListener('click', self.dialog_schliessen); - //dlg.slideDown(300); - }); - }; -*/ + self.dialog_schliessen = function () { document.querySelector('.close-btn').removeEventListener('click', self.dialog_schliessen); - //$('.dialog').slideUp(300); var dlg = document.querySelector('.dialog'); - //dlg.style.display = "none"; dlg.style.height = '0'; dlg.innerHTML = ''; }; @@ -314,8 +349,6 @@ }; this.vorlage_fuellen = function (vurl, inhalt, cb) { - //console.log("vorlage " + self.cache[vurl]); - //console.log("render " + inhalt); cb(Mustache.render(self.cache[vurl], inhalt)); }; @@ -328,16 +361,6 @@ Inhalt gefüllt ist */ this.vorlage_laden_und_fuellen = function (vurl, inhalt, cb) { - /* - $.ajax({ - url: vurl, - type: "GET", - dataType : "text" - }).done(function( vorlage ) { - self.cache[vurl] = vorlage; - self.vorlage_fuellen(vurl, inhalt, cb); - }); - */ var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { -- Gitblit v1.9.3