From 5bf530d39a7e06bdd982a5c2495ff9a04fd83da4 Mon Sep 17 00:00:00 2001 From: undisclosed Date: Wed, 11 Jan 2023 17:38:22 +0000 Subject: [PATCH] Erste Versuche mit StreamHandler --- www/js/app.js | 94 ++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 84 insertions(+), 10 deletions(-) diff --git a/www/js/app.js b/www/js/app.js index c7f341e..9b634bb 100644 --- a/www/js/app.js +++ b/www/js/app.js @@ -402,6 +402,47 @@ self.removeClassMulti('selected'); t.classList.add('selected'); }); + self.addEvtListener('.entity-eintrag', 'dragstart', function (e) { + //console.log("drag started"); + e.dataTransfer.setData('text/plain', e.target.textContent); + setTimeout(() => { + e.target.classList.add('hide'); + e.target.classList.add('drag-elem'); + }, 0); + }); + self.addEvtListener('.entity-eintrag', 'dragenter', function (e) { + e.preventDefault(); + //console.log("drag enter"); + e.target.classList.add('drag-over'); + }); + self.addEvtListener('.entity-eintrag', 'dragover', function (e) { + e.preventDefault(); + //console.log("drag over"); + e.target.classList.add('drag-over'); + }); + self.addEvtListener('.entity-eintrag', 'dragleave', function (e) { + //console.log("drag leave"); + e.target.classList.remove('drag-over'); + }); + self.addEvtListener('.entity-eintrag', 'drop', function (e) { + e.preventDefault(); + //console.log("drop"); + //console.log("index: " + self.getIndexBySelector('drag-over')); + const pos = self.getIndexBySelector('drag-elem'); + const zielPos = self.getIndexBySelector('drag-over'); + const titeltext = e.dataTransfer.getData('text/plain'); + const draggable = document.querySelector(".drag-elem"); + draggable.classList.remove("drag-elem"); + e.target.classList.remove('drag-over'); + var plname = document.querySelector('#playlist').value; + self.http_put('api/alist/' + plname + "/" + pos + "/" + zielPos, '', function(responseText) { + //self.meldung_mit_timeout(responseText, 1500); + }); + ulElem = draggable.parentElement; + ulElem.removeChild(draggable); + e.target.insertAdjacentElement('beforebegin', draggable); + draggable.classList.remove('hide'); + }); }); }); }; @@ -532,6 +573,17 @@ }); }; + /* + * { + * "katalogUrl":"/media", + * "pfad":"/Musik/B/Bay-City-Rollers/Original-Album-Classics/3/", + * "name":"3-37-Love-Is.mp3", + * "interpret":"Bay City Rollers", + * "titelAnzName":"Love Is", + * "album":"Original Album Classics" + * } + * @returns {undefined} + */ this.titelDazu = function() { var titel = self.titelErmitteln(document.querySelector(".selected")); //var titelName = elem.textContent; @@ -554,20 +606,22 @@ }; this.titelWeg = function() { - var elem = document.querySelector(".selected"); - var parentElem = elem.parentNode; + //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 + //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++) { + //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; + //if(liElems.item(i).classList.contains("selected")) { + //gefunden = true; + //var index = i; //console.log(elem.textContent + ' hat Index ' + i); - } - } + //} + //} + + const index = self.getIndexBySelector("selected"); // /mz/api/alist/[pl-name]/[nr] var plname = document.querySelector('#playlist').value; self.http_delete('api/alist/' + plname + '/' + index,'', function(responseText) { @@ -578,6 +632,26 @@ }; + this.getIndexBySelector = function(selector) { + var qSel = '.' + selector; + var elem = document.querySelector(qSel); + 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; + var index = -1; + for(var i = 0; i < liElems.length && !gefunden; i++) { + //console.log(liElems.item(i).textContent); + if(liElems.item(i).classList.contains(selector)) { + gefunden = true; + index = i; + //console.log(elem.textContent + ' hat Index ' + i); + } + } + return index; + }; + /* ------------- Helfer fuer Entitaets-Formulare ----------------------- */ /* -- Gitblit v1.9.3