mirror of
https://github.com/owntone/owntone-server.git
synced 2025-01-13 07:53:23 -05:00
First pass at playlist editor
This commit is contained in:
Ron Pedde
parent
8d3d31d119
commit
e7d5aa986a
@ -2,15 +2,45 @@
|
|||||||
|
|
||||||
<div class="stx">
|
<div class="stx">
|
||||||
|
|
||||||
<table class="hovertable" width="400">
|
<h2>Smart Playlists</h2>
|
||||||
<thead><th>ID</th><th>Playlist Name</th><th>Type</th></thead>
|
|
||||||
|
<table width="400">
|
||||||
|
<thead><th>ID</th><th>Playlist Name</th><th>Type</th><th>Action</th></thead>
|
||||||
<tbody id="playlists">
|
<tbody id="playlists">
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
<a href="javascript:pl_new();">Add new playlist</a>
|
||||||
|
|
||||||
<div id="pl_data">
|
<div id="pl_data">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="pl_editor" style="display:none">
|
||||||
|
<h3>Playlist Spec</h3>
|
||||||
|
<form name="pl_form">
|
||||||
|
<input type="hidden" name="playlist_id">
|
||||||
|
<table width="400">
|
||||||
|
<tr>
|
||||||
|
<th>Name</th>
|
||||||
|
<td><input type="text" name="playlist_name"></td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<th>Playlist Criteria</th>
|
||||||
|
<td><textarea rows="5" name="playlist_spec"></textarea></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<input type="button" onclick="javascript:pl_update();" name="submit_button" value="Submit">
|
||||||
|
<input type="button" value="Cancel">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="pl_warning" class="message" style="display:none">
|
||||||
|
Error Messages Go here
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@include ftr.html@
|
@include ftr.html@
|
||||||
|
|||||||
@ -1,26 +1,98 @@
|
|||||||
var req;
|
var req;
|
||||||
var playlist_info={};
|
var playlist_info={};
|
||||||
|
|
||||||
function selectPlaylist(e) {
|
function pl_errormsg(msg) {
|
||||||
var targ;
|
var msgdiv = document.getElementById("pl_warning");
|
||||||
|
|
||||||
if(!e) var e=window.event;
|
if(!msgdiv)
|
||||||
if(e.target) targ=e.target;
|
return;
|
||||||
else if (e.srcElement) targ=e.srcElement;
|
|
||||||
if(targ.nodeType == 3)
|
|
||||||
targ = targ.parentNode;
|
|
||||||
|
|
||||||
while(targ.previousSibling)
|
msgdiv.innerHTML = msg + "\n";
|
||||||
targ=targ.previousSibling;
|
msgdiv.style.display="block";
|
||||||
|
|
||||||
|
|
||||||
pl_id = targ.firstChild.nodeValue;
|
|
||||||
|
|
||||||
|
|
||||||
alert(playlist_info[pl_id]['name']);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function processPlaylists() {
|
function pl_displayresults(xmldoc) {
|
||||||
|
}
|
||||||
|
|
||||||
|
function pl_update() {
|
||||||
|
/* this is either update or create, depending... */
|
||||||
|
var id, name, spec;
|
||||||
|
var pleditor=document.getElementById("pl_editor");
|
||||||
|
|
||||||
|
id = document.forms['pl_form']['playlist_id'].value;
|
||||||
|
name = encodeURIComponent(document.forms['pl_form']['playlist_name'].value);
|
||||||
|
spec = encodeURIComponent(document.forms['pl_form']['playlist_spec'].value);
|
||||||
|
|
||||||
|
if(id == '0') {
|
||||||
|
/* new playlist... post it! */
|
||||||
|
var url = '/databases/1/containers/add?output=xml&org.mt-daapd.playlist-type=1&dmap.itemname=' + name + '&org.mt-daapd.smart-playlist-spec=' + spec;
|
||||||
|
result = pl_exec(url,false);
|
||||||
|
} else {
|
||||||
|
pl_errormsg("Can't yet update existing playlists.. sorry.");
|
||||||
|
}
|
||||||
|
|
||||||
|
init();
|
||||||
|
pleditor.style.display="none";
|
||||||
|
}
|
||||||
|
|
||||||
|
function pl_new() {
|
||||||
|
var msgdiv = document.getElementById("pl_warning");
|
||||||
|
var pleditor=document.getElementById("pl_editor");
|
||||||
|
|
||||||
|
if((!msgdiv)||(!pleditor))
|
||||||
|
return;
|
||||||
|
|
||||||
|
msgdiv.style.display="none";
|
||||||
|
|
||||||
|
document.forms['pl_form']['playlist_id'].value='0';
|
||||||
|
document.forms['pl_form']['playlist_name'].value = 'New Playlist';
|
||||||
|
document.forms['pl_form']['playlist_spec'].value = '';
|
||||||
|
document.forms['pl_form']['submit_button'].value = 'Create';
|
||||||
|
|
||||||
|
pleditor.style.display="block";
|
||||||
|
}
|
||||||
|
|
||||||
|
function pl_delete(pl_id) {
|
||||||
|
if(confirm('Are you sure you want to delete playlist "' + playlist_info[pl_id]['name'] + '"?')) {
|
||||||
|
result=pl_exec("/databases/1/containers/del?output=xml&dmap.itemid=" + pl_id,false);
|
||||||
|
init();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function pl_edit(pl_id) {
|
||||||
|
var msgdiv = document.getElementById("pl_warning");
|
||||||
|
var pleditor=document.getElementById("pl_editor");
|
||||||
|
|
||||||
|
if((!msgdiv)||(!pleditor))
|
||||||
|
return;
|
||||||
|
|
||||||
|
msgdiv.style.display="none";
|
||||||
|
pleditor.style.display="none";
|
||||||
|
|
||||||
|
if(pl_id == 1) {
|
||||||
|
msgdiv.innerHTML="Cannot edit library playlist";
|
||||||
|
msgdiv.style.display="block";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if(playlist_info[pl_id]['type'] != 1) {
|
||||||
|
msgdiv.innerHTML="Can only edit smart playlists";
|
||||||
|
msgdiv.style.display="block";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.forms['pl_form']['playlist_id'].value = pl_id;
|
||||||
|
document.forms['pl_form']['playlist_name'].value = playlist_info[pl_id]['name'];
|
||||||
|
document.forms['pl_form']['playlist_spec'].value = playlist_info[pl_id]['spec'];
|
||||||
|
document.forms['pl_form']['submit_button'].value = 'Update';
|
||||||
|
|
||||||
|
pleditor.style.display="block";
|
||||||
|
|
||||||
|
//alert(playlist_info[pl_id]['name']);
|
||||||
|
}
|
||||||
|
|
||||||
|
function pl_process() {
|
||||||
var xmldoc = req.responseXML;
|
var xmldoc = req.responseXML;
|
||||||
var playlists = xmldoc.getElementsByTagName("dmap.listingitem");
|
var playlists = xmldoc.getElementsByTagName("dmap.listingitem");
|
||||||
var pl_table = document.getElementById("playlists");
|
var pl_table = document.getElementById("playlists");
|
||||||
@ -50,56 +122,63 @@ function processPlaylists() {
|
|||||||
pl_type = "Smart";
|
pl_type = "Smart";
|
||||||
break;
|
break;
|
||||||
case "2":
|
case "2":
|
||||||
pl_type = "Static (File)";
|
pl_type = "Static (m3u/pls file)";
|
||||||
break;
|
break;
|
||||||
case "3":
|
case "3":
|
||||||
pl_type = "Static (iTunes)";
|
pl_type = "Static (iTunes xml file)";
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
var row = document.createElement("tr");
|
|
||||||
row.onclick=selectPlaylist;
|
if(playlist_info[pl_id]['type'] == 1) {
|
||||||
if(row.captureEvents) row.captureEvents(Event.CLICK);
|
var row = document.createElement("tr");
|
||||||
var td1 = document.createElement("td");
|
var td1 = document.createElement("td");
|
||||||
var td2 = document.createElement("td");
|
var td2 = document.createElement("td");
|
||||||
var td3 = document.createElement("td");
|
var td3 = document.createElement("td");
|
||||||
td1.innerHTML=pl_id;
|
var td4 = document.createElement("td");
|
||||||
td2.innerHTML=pl_name + "\n";
|
td1.innerHTML=pl_id + '\n';
|
||||||
td3.innerHTML=pl_type + "\n";
|
td2.innerHTML=pl_name + '\n';
|
||||||
row.appendChild(td1);
|
td3.innerHTML=pl_type + '\n';
|
||||||
row.appendChild(td2);
|
td4.innerHTML='<a href="javascript:pl_edit(' + pl_id + ')">Edit</a>';
|
||||||
row.appendChild(td3);
|
if(pl_id != 1) {
|
||||||
pl_table.appendChild(row);
|
td4.innerHTML = td4.innerHTML + ' <a href="javascript:pl_delete(' + pl_id + ')">Delete</a>';
|
||||||
|
}
|
||||||
|
|
||||||
|
row.appendChild(td1);
|
||||||
|
row.appendChild(td2);
|
||||||
|
row.appendChild(td3);
|
||||||
|
row.appendChild(td4);
|
||||||
|
pl_table.appendChild(row);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function processReqChange() {
|
function pl_state_change() {
|
||||||
if(req.readyState == 4) {
|
if(req.readyState == 4) {
|
||||||
if(req.status == 200) {
|
if(req.status == 200) {
|
||||||
processPlaylists();
|
pl_process();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
loadXMLDoc("/databases/1/containers?output=xml&meta=dmap.itemid,dmap.itemname,org.mt-daapd.playlist-type,org.mt-daapd.smart-playlist-spec","playlists");
|
pl_exec("/databases/1/containers?output=xml&meta=dmap.itemid,dmap.itemname,org.mt-daapd.playlist-type,org.mt-daapd.smart-playlist-spec",true);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function pl_exec(url, async) {
|
||||||
function loadXMLDoc(url) {
|
|
||||||
// branch for native XMLHttpRequest object
|
// branch for native XMLHttpRequest object
|
||||||
if (window.XMLHttpRequest) {
|
if (window.XMLHttpRequest) {
|
||||||
req = new XMLHttpRequest();
|
req = new XMLHttpRequest();
|
||||||
req.onreadystatechange = processReqChange;
|
req.onreadystatechange = pl_state_change;
|
||||||
req.open("GET", url, true);
|
req.open("GET", url, async);
|
||||||
req.send(null);
|
return req.send(null);
|
||||||
// branch for IE/Windows ActiveX version
|
// branch for IE/Windows ActiveX version
|
||||||
} else if (window.ActiveXObject) {
|
} else if (window.ActiveXObject) {
|
||||||
req = new ActiveXObject("Microsoft.XMLHTTP");
|
req = new ActiveXObject("Microsoft.XMLHTTP");
|
||||||
if (req) {
|
if (req) {
|
||||||
req.onreadystatechange = processReqChange;
|
req.onreadystatechange = pl_state_change;
|
||||||
req.open("GET", url, true);
|
req.open("GET", url, async);
|
||||||
req.send();
|
return req.send();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user