From c7030d001eafe77660cd18d59b63bf0be9441f10 Mon Sep 17 00:00:00 2001 From: ulrich Date: Fri, 09 Apr 2021 14:47:03 +0000 Subject: [PATCH] JavaScript Formulare weiter vereinheitlicht --- www/ui/js/app.js | 195 +++++++++++++++++++++++------------------------- 1 files changed, 93 insertions(+), 102 deletions(-) diff --git a/www/ui/js/app.js b/www/ui/js/app.js index 6c6d41b..f4aaa0e 100644 --- a/www/ui/js/app.js +++ b/www/ui/js/app.js @@ -105,35 +105,6 @@ } }; - /* - * url: '../api/store/Ablageort/liste/' - * tpl: "data/tpl/ablageort_liste.tpl" - * storeUrl: '../api/store/Ablageort/' - * formFunc: "self.ablageort_form" - * cb: etwas wie - * - * function(responseText){ - * var ablageort = JSON.parse(responseText); - * self.ablageort_form(ablageort); - * }); - */ - this.entitaet_liste = function(listUrl, tpl, storeUrl, formFunc, cb) { - self.reset_top_buttons(); - self.http_get(listUrl, function (responseText) { - self.vorlage_laden_und_fuellen(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(storeUrl + t.textContent, cb); - }); - //self.addEvtListener('#neu-btn', 'click', function (event) { - self.addEvtListener('#top-neu-btn', 'click', function(event) { - eval(formFunc + "(this)"); - }); - }); - }); - }; - this.ablageort_liste = function() { self.entitaet_liste('../api/store/Ablageort/liste/', "data/tpl/ablageort_liste.tpl", '../api/store/Ablageort/', @@ -141,25 +112,6 @@ var ablageort = JSON.parse(responseText); self.ablageort_form(ablageort); }); - /* - self.reset_top_buttons(); - self.http_get('../api/store/Ablageort/liste/', function (responseText) { - self.vorlage_laden_und_fuellen("data/tpl/ablageort_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.ablageort_form(ablageort); - }); - }); - //self.addEvtListener('#neu-btn', 'click', function (event) { - self.addEvtListener('#top-neu-btn', 'click', function(event) { - eval("self.ablageort_form" + "(this)"); - }); - }); - }); - */ }; this.prefs_liste = function() { @@ -169,24 +121,6 @@ var einstellung = JSON.parse(responseText); self.prefs_form(einstellung); }); - /* - self.reset_top_buttons(); - self.http_get('../api/store/Einstellung/liste/', function (responseText) { - self.vorlage_laden_und_fuellen("data/tpl/einstellung_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/Einstellung/' + t.textContent, function(responseText){ - var einstellung = JSON.parse(responseText); - self.prefs_form(einstellung); - }); - }); - self.addEvtListener('#top-neu-btn', 'click', function(event) { - eval("self.prefs_form" + "(this)"); - }); - }); - }); - */ }; this.abspieler_liste = function() { @@ -196,24 +130,6 @@ var abspieler = JSON.parse(responseText); self.abspieler_form(abspieler); }); - /* - self.http_get('../api/store/Abspieler/liste/', function (responseText) { - self.vorlage_laden_und_fuellen("data/tpl/abspieler_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/Abspieler/' + t.textContent, function(responseText){ - var abspieler = JSON.parse(responseText); - self.abspieler_form(abspieler); - }); - }); - //self.addEvtListener('#neu-btn', 'click', function(event) { - self.addEvtListener('#top-neu-btn', 'click', function(event) { - eval("self.abspieler_form" + "(this)"); - }); - }); - }); - */ }; this.abspielliste_liste = function() { @@ -223,28 +139,18 @@ var abspielliste = JSON.parse(responseText); self.abspielliste_form(abspielliste); }); - /* - self.http_get('../api/store/Abspielliste/liste/', function (responseText) { - self.vorlage_laden_und_fuellen("data/tpl/abspielliste_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/Abspielliste/' + t.textContent, function(responseText){ - var abspielliste = JSON.parse(responseText); - self.abspielliste_form(abspielliste); - }); - }); - self.addEvtListener('#top-neu-btn', 'click', function(event) { - eval("self.abspielliste_form" + "(this)"); - }); - }); - }); - */ }; - /* -------------------- Entitaets-Formulare ------------------ */ + /* -------------------- Entitaets-Formulare ------------------ */ this.abspielliste_form = function(al) { + self.entitaet_form(al, al.name, + "data/tpl/form_abspielliste.tpl", '../api/store/Abspielliste/', + '#abspielliste-name', function() { + self.abspielliste_auswahl_fuellen(); + self.abspielliste_liste(); + }); + /* self.vorlage_laden_und_fuellen("data/tpl/form_abspielliste.tpl", al, function (html) { document.querySelector(".zentraler-inhalt").innerHTML = html; const form = document.querySelector('form'); @@ -266,9 +172,17 @@ }); }); }); + */ }; this.abspieler_form = function(pl) { + self.entitaet_form(pl, pl.key, + "data/tpl/form_abspieler.tpl", '../api/store/Abspieler/', + '#abspieler-name', function() { + self.abspieler_auswahl_fuellen(); + self.abspieler_liste(); + }); + /* self.vorlage_laden_und_fuellen("data/tpl/form_abspieler.tpl", pl, function (html) { document.querySelector(".zentraler-inhalt").innerHTML = html; const form = document.querySelector('form'); @@ -290,9 +204,16 @@ }); }); }); + */ }; this.prefs_form = function(k) { + self.entitaet_form(k, k.key, + "data/tpl/form_einstellung.tpl", '../api/store/Einstellung/', + '#einstellung-key', function() { + self.prefs_liste(); + }); + /* self.vorlage_laden_und_fuellen("data/tpl/form_einstellung.tpl", k, function (html) { document.querySelector(".zentraler-inhalt").innerHTML = html; const form = document.querySelector('form'); @@ -313,6 +234,7 @@ }); }); }); + */ }; /* @@ -324,6 +246,12 @@ * @returns {undefined} kein Rueckgabewert */ this.ablageort_form = function(ort) { + self.entitaet_form(ort, ort.name, + "data/tpl/form_ablageort.tpl", '../api/store/Ablageort/', + '#ablageort-name', function() { + self.ablageort_liste(); + }); + /* self.vorlage_laden_und_fuellen("data/tpl/form_ablageort.tpl", ort, function (html) { document.querySelector(".zentraler-inhalt").innerHTML = html; const form = document.querySelector('form'); @@ -343,6 +271,7 @@ }); }); }); + */ }; /* ------------------------------- UI-Dynamik ----------------------- */ @@ -419,8 +348,70 @@ }; /* ------------- Helfer fuer Entitaets-Formulare ----------------------- */ + + /* + * url: '../api/store/Ablageort/liste/' + * tpl: "data/tpl/ablageort_liste.tpl" + * storeUrl: '../api/store/Ablageort/' + * formFunc: "self.ablageort_form" + * cb: etwas wie + * function(responseText){ + * var ablageort = JSON.parse(responseText); + * self.ablageort_form(ablageort); + * }); + */ + this.entitaet_liste = function(listUrl, tpl, storeUrl, formFunc, cb) { + self.reset_top_buttons(); + self.http_get(listUrl, function (responseText) { + self.vorlage_laden_und_fuellen(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(storeUrl + t.textContent, cb); + }); + //self.addEvtListener('#neu-btn', 'click', function (event) { + self.addEvtListener('#top-neu-btn', 'click', function(event) { + eval(formFunc + "(this)"); + }); + }); + }); + }; /* + * dat: gefuelltes Datenobjekt bei Aenderung + * key: der alte schluesselbegriff bei Aenderung (z.B. al.name) + * tpl: "data/tpl/form_abspielliste.tpl" + * url: '../api/store/Abspielliste/' + * selector: '#abspielliste-name' + * cbOk: etwas wie + * function() { + * self.abspielliste_auswahl_fuellen(); + * self.abspielliste_liste(); + * }); + * delSelector: '#abspielliste-name' + * cbDel: etwas wie + * function() { + * self.abspielliste_auswahl_fuellen(); + * self.abspielliste_liste(); + * }); + */ + + this.entitaet_form = function(dat, key, tpl, url, selector, cb) { + self.vorlage_laden_und_fuellen(tpl, dat, function (html) { + document.querySelector(".zentraler-inhalt").innerHTML = html; + const form = document.querySelector('form'); + form.addEventListener('submit', function(event) { + self.handle_submit(event, key, url, selector, cb); + }); + self.addEvtListener('#cancel-btn', 'click', cb); + self.addEvtListener('#loeschen-btn', 'click', function(event) { + event.preventDefault(); + self.handle_del_btn(selector, url, cb); + }); + }); + }; + + /* * existingKey: wenn die Entitaet existiert und geandert werden soll * leer, wenn neue Entitaet */ -- Gitblit v1.9.3