From 9c7bda01801855aeb45adf1fe1ddbada80cc050d Mon Sep 17 00:00:00 2001 From: ulrich Date: Wed, 14 Apr 2021 06:22:51 +0000 Subject: [PATCH] UI- und Menue-Anpassungen --- www/ui/js/app.js | 123 ++++++++++++++++++++++++++++++++++++----- 1 files changed, 108 insertions(+), 15 deletions(-) diff --git a/www/ui/js/app.js b/www/ui/js/app.js index ff1a26e..5be012f 100644 --- a/www/ui/js/app.js +++ b/www/ui/js/app.js @@ -18,7 +18,7 @@ "hauptmenue.json", "data/tpl/app-menu.txt", ".west", - "8em"); + "6em"); document.querySelector('.hamburger').addEventListener('click', function (e) { self.menue_umschalten(); @@ -30,6 +30,7 @@ self.addEvtListener('#mi-player', 'click', self.abspieler_liste); self.addEvtListener('#mi-listen', 'click', self.abspielliste_liste); self.addEvtListener('#mi-list', 'click', self.titel_liste); + self.addEvtListener('#mi-live', 'click', self.livestream_liste); self.fusszeile_umschalten(); self.seitenleiste_umschalten(); @@ -37,6 +38,21 @@ }; /* ---------------- Entitaets-Listen ----------------- */ + + this.livestream_selection = function() { + document.querySelector('.breadcrumb-behaelter').textContent = ''; + document.querySelector('.bereich-name').textContent = 'Livestream-Auswahl'; + self.http_get('../api/store/Livestream/liste/', function(responseText) { + self.vorlage_laden_und_fuellen("data/tpl/livestream_liste.txt", JSON.parse(responseText), function (html) { + document.querySelector(".zentraler-inhalt").innerHTML = html; + self.addEvtListener('.entity-eintrag', 'click', function (event) { + var t = event.target; + self.removeClassMulti('selected'); + t.classList.add('selected'); + }); + }); + }); + }; // auf der obersten Ebene werden die Kataloge angezeigt, // darunter der Inhalt des aktuellen Pfades @@ -55,11 +71,15 @@ self.addEvtListener('.entity-eintrag', 'click', function (event) { var t = event.target; self.katName = t.textContent; - self.http_get('../api/store/Ablageort/' + t.textContent, function(responseText) { - var ablageort = JSON.parse(responseText); - self.ortPfad = ablageort.url; - self.media_liste(); - }); + if(self.katName !== "Livestreams") { + self.http_get('../api/store/Ablageort/' + t.textContent, function(responseText) { + var ablageort = JSON.parse(responseText); + self.ortPfad = ablageort.url; + self.media_liste(); + }); + } else { + self.livestream_selection(); + } }); }); }); @@ -161,6 +181,15 @@ }); }; + this.livestream_liste = function() { + self.entitaet_liste('Livestream','../api/store/Livestream/liste/', + "data/tpl/livestream_liste.txt", '../api/store/Livestream/', + "self.livestream_form", function(responseText) { + var livestream = JSON.parse(responseText); + self.livestream_form(livestream); + }); + }; + this.abspielliste_liste = function() { self.entitaet_liste('Abspielliste','../api/store/Abspielliste/liste/', "data/tpl/abspielliste_liste.txt", '../api/store/Abspielliste/', @@ -191,6 +220,14 @@ '#abspieler-name', function() { self.abspieler_auswahl_fuellen(); self.abspieler_liste(); + }); + }; + + this.livestream_form = function(ls) { + self.entitaet_form('Livestream', ls, ls.name, + "data/tpl/form_livestream.txt", '../api/store/Livestream/', + '#livestream-name', function() { + self.livestream_liste(); }); }; @@ -299,14 +336,49 @@ /* ------------- Media-Steuerung ------------------------- */ this.play = function() { - var abs = document.querySelector('#abspieler').value; - var lst = document.querySelector('#playlist').value; - console.log( - "play playlist.value: " + document.querySelector('#playlist').value + - ", abspieler.value: " + document.querySelector('#abspieler').value); - self.http_get('../api/strg/' + abs + '/play/liste/' + lst, function(responseText) { - self.meldung_mit_timeout(responseText, 1500); - }); + var bereichName = document.querySelector('.bereich-name').textContent; + if(bereichName === '') { + var titel = self.titelErmitteln(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 playername = document.querySelector('#abspieler').value; + /* + HTTP POST /mz/api/strg/abspieler/play mit Titel im Body + + url: /media/test/M/Muenchener-Freiheit/01-Ohne-Dich-schlaf-ich-heut-Nacht-nicht-ein.mp3 + */ + console.log('plname: ' + playername + ' url: ' + titel.katalogUrl + titel.pfad + titel.name); + self.http_post('../api/strg/' + playername + '/titel', JSON.stringify(titel), function(responseText) { + self.meldung_mit_timeout(responseText, 1500); + }); + } else if(bereichName === 'Livestream-Auswahl') { + var streamName = document.querySelector(".selected").textContent; + var playername = document.querySelector('#abspieler').value; + var stream = new Livestream(streamName, '-'); + self.http_post('../api/strg/' + playername + '/stream', JSON.stringify(stream), function(responseText) { + self.meldung_mit_timeout(responseText, 1500); + }); + } else { + var abs = document.querySelector('#abspieler').value; + var lst = document.querySelector('#playlist').value; + console.log( + "play playlist.value: " + document.querySelector('#playlist').value + + ", abspieler.value: " + document.querySelector('#abspieler').value); + self.http_get('../api/strg/' + abs + '/play/liste/' + lst, function(responseText) { + self.meldung_mit_timeout(responseText, 1500); + }); + } }; this.kommando = function(kommando) { @@ -328,8 +400,9 @@ }; this.titelDazu = function() { - var elem = document.querySelector(".selected"); + var titel = self.titelErmitteln(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; @@ -340,6 +413,7 @@ } 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); @@ -500,6 +574,20 @@ this.removeClassMulti = function(selector) { document.querySelectorAll('.' + selector).forEach(elem => { elem.classList.remove(selector); }); + }; + + self.titelErmitteln = function(elem) { + 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); + } + return titel; }; /* --------------------- asynchroner HTTP Client ----------------- */ @@ -728,6 +816,11 @@ this.url = u; } +function Livestream(n, u) { + this.name = n; + this.url = u; +} + function Abspielliste(n) { this.name = n; } -- Gitblit v1.9.3