From d12f6ef6e56ac9b696d643dd0945573424a1afdc Mon Sep 17 00:00:00 2001 From: ulrich Date: Sun, 11 Apr 2021 14:39:04 +0000 Subject: [PATCH] UI-Feinschliff --- www/ui/js/app.js | 142 +++++++++++++++++++++++++++++----------------- 1 files changed, 89 insertions(+), 53 deletions(-) diff --git a/www/ui/js/app.js b/www/ui/js/app.js index b03d5e1..ff1a26e 100644 --- a/www/ui/js/app.js +++ b/www/ui/js/app.js @@ -42,7 +42,7 @@ // darunter der Inhalt des aktuellen Pfades this.media_liste = function() { self.reset_top_buttons(); - console.log("ortPfad: " + self.ortPfad + ", mediaPfad: " + self.mediaPfad); + //console.log("ortPfad: " + self.ortPfad + ", mediaPfad: " + self.mediaPfad); document.querySelector('.bereich-name').textContent = ''; if(self.ortPfad === '/') { var bb = document.querySelector('.breadcrumb-behaelter'); @@ -81,7 +81,7 @@ } bb.innerHTML = brLinks; self.addEvtListener('.breadcrumb-link', 'click', function(event) { - console.log(event.target.attributes.brlink.nodeValue); + //console.log(event.target.attributes.brlink.nodeValue); var neuerPfad = event.target.attributes.brlink.nodeValue; self.mediaPfad = neuerPfad; self.media_liste(); @@ -106,7 +106,7 @@ } else { if(t.classList.contains('selected')) { t.classList.add('added-to-playlist'); - self.addSelectedTitel(); + self.titelDazu(); } else { self.removeClassMulti('selected'); t.classList.add('selected'); @@ -165,6 +165,7 @@ self.entitaet_liste('Abspielliste','../api/store/Abspielliste/liste/', "data/tpl/abspielliste_liste.txt", '../api/store/Abspielliste/', "self.abspielliste_form", function(responseText) { + //console.log("responseTest: '" + responseText + "'"); var abspielliste = JSON.parse(responseText); self.abspielliste_form(abspielliste); }); @@ -176,7 +177,9 @@ self.entitaet_form('Abspielliste', al, al.name, "data/tpl/form_abspielliste.txt", '../api/store/Abspielliste/', '#abspielliste-name', function(event) { - event.preventDefault(); + if(event !== undefined) { + event.preventDefault(); + } self.abspielliste_auswahl_fuellen(); self.abspielliste_liste(); }); @@ -242,50 +245,6 @@ }); }; - this.addSelectedTitel = function() { - var elem = document.querySelector(".selected"); - //var titelName = elem.textContent; - var titelName = elem.attributes.dateiName.nodeValue; - var album = elem.attributes.album.nodeValue; - var interpret = elem.attributes.interpret.nodeValue; - var anzName = elem.attributes.titelAnzName.nodeValue; - var titel; - if(self.mediaPfad.endsWith('/')) { - titel = new Titel(titelName, self.mediaPfad, self.ortPfad, interpret, anzName, album); - } else { - titel = new Titel(titelName, self.mediaPfad + '/', self.ortPfad, interpret, anzName, album); - } - var plname = document.querySelector('#playlist').value; - self.http_put('../api/alist/' + plname, JSON.stringify(titel), function(responseText) { - //self.meldung_mit_timeout(responseText, 1500); - }); - }; - - this.removeSelectedTitel = function() { - var elem = document.querySelector(".selected"); - var parentElem = elem.parentNode; - //console.log("elem: " + elem.nodeName + ", parent: " + parentElem.nodeName + ", len: " + parentElem.childNodes.length); - var liElems = parentElem.getElementsByTagName(elem.nodeName); // nur die LI Elemente - //console.log("liElems.anz: " + liElems.length); - var gefunden = false; - for(var i = 0; i < liElems.length && !gefunden; i++) { - //console.log(liElems.item(i).textContent); - if(liElems.item(i).classList.contains("selected")) { - gefunden = true; - var index = i; - //console.log(elem.textContent + ' hat Index ' + i); - } - } - // /mz/api/alist/[pl-name]/[nr] - var plname = document.querySelector('#playlist').value; - self.http_delete('../api/alist/' + plname + '/' + index,'', function(responseText) { - // DELETE http://localhost:9090/mz/api/alist/liste1/0 - //self.meldung_mit_timeout(responseText, 1500); - self.titel_liste(); - }); - - }; - /* Unterer Einblendbereich */ this.dialog_unten_zeigen = function() { @@ -295,9 +254,24 @@ dlg.innerHTML = html; self.abspieler_auswahl_fuellen(); self.abspielliste_auswahl_fuellen(); - self.addEvtListener('#dazu-btn', 'click', self.addSelectedTitel); + self.addEvtListener('#dazu-btn', 'click', self.titelDazu); self.addEvtListener('#play-btn', 'click', self.play); - self.addEvtListener('#weg-btn', 'click', self.removeSelectedTitel); + self.addEvtListener('#stop-btn', 'click', function() { + self.kommando('stop'); + }); + self.addEvtListener('#pause-btn', 'click', function() { + self.kommando('pause'); + }); + self.addEvtListener('#weiter-btn', 'click', function() { + self.kommando('weiter'); + }); + +/* + <button class="ctrl-btn ctrl-item" id="hier-btn" title="hier spielen"><i class="icon-tablet"></i></button> + */ + + self.addEvtListener('#weg-btn', 'click', self.titelWeg); + self.addEvtListener('#leeren-btn', 'click', self.alleTitelEntfernen); self.media_liste(); }); }; @@ -333,6 +307,68 @@ self.http_get('../api/strg/' + abs + '/play/liste/' + lst, function(responseText) { self.meldung_mit_timeout(responseText, 1500); }); + }; + + this.kommando = function(kommando) { + var abs = document.querySelector('#abspieler').value; + self.http_get('../api/strg/' + abs + '/' + kommando, function(responseText) { + self.meldung_mit_timeout(responseText, 1500); + }); + }; + + /* ------------- Verwaltungsfunktionen Abspielliste -------------------- */ + + self.alleTitelEntfernen = function() { + var plname = document.querySelector('#playlist').value; + self.http_delete('../api/alist/' + plname + '/alle', '', function(responseText) { + // DELETE http://localhost:9090/mz/api/alist/liste1/0 + //self.meldung_mit_timeout(responseText, 1500); + self.titel_liste(); + }); + }; + + this.titelDazu = function() { + var elem = document.querySelector(".selected"); + //var titelName = elem.textContent; + var titelName = elem.attributes.dateiName.nodeValue; + var album = elem.attributes.album.nodeValue; + var interpret = elem.attributes.interpret.nodeValue; + var anzName = elem.attributes.titelAnzName.nodeValue; + var titel; + if(self.mediaPfad.endsWith('/')) { + titel = new Titel(titelName, self.mediaPfad, self.ortPfad, interpret, anzName, album); + } else { + titel = new Titel(titelName, self.mediaPfad + '/', self.ortPfad, interpret, anzName, album); + } + var plname = document.querySelector('#playlist').value; + self.http_put('../api/alist/' + plname, JSON.stringify(titel), function(responseText) { + //self.meldung_mit_timeout(responseText, 1500); + }); + }; + + this.titelWeg = function() { + var elem = document.querySelector(".selected"); + var parentElem = elem.parentNode; + //console.log("elem: " + elem.nodeName + ", parent: " + parentElem.nodeName + ", len: " + parentElem.childNodes.length); + var liElems = parentElem.getElementsByTagName(elem.nodeName); // nur die LI Elemente + //console.log("liElems.anz: " + liElems.length); + var gefunden = false; + for(var i = 0; i < liElems.length && !gefunden; i++) { + //console.log(liElems.item(i).textContent); + if(liElems.item(i).classList.contains("selected")) { + gefunden = true; + var index = i; + //console.log(elem.textContent + ' hat Index ' + i); + } + } + // /mz/api/alist/[pl-name]/[nr] + var plname = document.querySelector('#playlist').value; + self.http_delete('../api/alist/' + plname + '/' + index,'', function(responseText) { + // DELETE http://localhost:9090/mz/api/alist/liste1/0 + //self.meldung_mit_timeout(responseText, 1500); + self.titel_liste(); + }); + }; /* ------------- Helfer fuer Entitaets-Formulare ----------------------- */ @@ -411,8 +447,8 @@ event.preventDefault(); const data = new FormData(event.target); const value = Object.fromEntries(data.entries()); - console.log({ value }); - console.log(JSON.stringify(value)); + //console.log({ value }); + //console.log(JSON.stringify(value)); var daten = JSON.stringify(value); var formkey = document.querySelector(keySelector).value; formkey = formkey.replace(' ', '').replace(/[\W]+/g, ''); @@ -443,7 +479,7 @@ self.dialog_laden_und_zeigen('data/tpl/dlg-loeschen.txt', dlgdata, function() { self.addEvtListener('#nein-btn', 'click', self.dialog_schliessen); self.addEvtListener('#ja-btn', 'click', function(event) { - console.log("loeschen geklickt."); + //console.log("loeschen geklickt."); self.http_delete(delUrl + pkey, '', function (responseText) { self.dialog_schliessen(); if(typeof(cb) !== 'function') { -- Gitblit v1.9.3