mirrors/ympd
1
0
Fork 0
mirror of https://github.com/SuperBFG7/ympd synced 2025-03-30 15:27:04 +00:00
Code Issues Releases Wiki Activity

Feat: configureable columns in all song views #47

Browse Source
This commit is contained in:
jcorporation 2018-10-22 23:20:57 +01:00
parent 122345abdb
commit c5856c0cbd
9 changed files with 138 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
contrib/archlinux.install
View File

@ -68,7 +68,7 @@ post_upgrade() {
[ -f /var/lib/mympd/state/notificationWeb ] || echo -n "false" > /var/lib/mympd/state/notificationWeb [ -f /var/lib/mympd/state/notificationWeb ] || echo -n "false" > /var/lib/mympd/state/notificationWeb
[ -f /var/lib/mympd/state/colsBrowseDatabase ] || echo -n '["Track","Title"]' > /var/lib/mympd/state/colsBrowseDatabase [ -f /var/lib/mympd/state/colsBrowseDatabase ] || echo -n '["Track","Title"]' > /var/lib/mympd/state/colsBrowseDatabase
[ -f /var/lib/mympd/state/colsBrowseFilesystem ] || echo -n '["Type","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowseFilesystem [ -f /var/lib/mympd/state/colsBrowseFilesystem ] || echo -n '["Type","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowseFilesystem
[ -f /var/lib/mympd/state/colsBrowsePlaylistsDetails ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowsePlaylistsDetails [ -f /var/lib/mympd/state/colsBrowsePlaylistsDetail ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowsePlaylistsDetail
[ -f /var/lib/mympd/state/colsQueue ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsQueue [ -f /var/lib/mympd/state/colsQueue ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsQueue
[ -f /var/lib/mympd/state/colsSearch ] || echo -n '["Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsSearch [ -f /var/lib/mympd/state/colsSearch ] || echo -n '["Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsSearch

2
contrib/myMPD.spec
View File

@ -83,7 +83,7 @@ done
[ -f /var/lib/mympd/state/notificationWeb ] || echo -n "false" > /var/lib/mympd/state/notificationWeb [ -f /var/lib/mympd/state/notificationWeb ] || echo -n "false" > /var/lib/mympd/state/notificationWeb
[ -f /var/lib/mympd/state/colsBrowseDatabase ] || echo -n '["Track","Title"]' > /var/lib/mympd/state/colsBrowseDatabase [ -f /var/lib/mympd/state/colsBrowseDatabase ] || echo -n '["Track","Title"]' > /var/lib/mympd/state/colsBrowseDatabase
[ -f /var/lib/mympd/state/colsBrowseFilesystem ] || echo -n '["Type","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowseFilesystem [ -f /var/lib/mympd/state/colsBrowseFilesystem ] || echo -n '["Type","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowseFilesystem
[ -f /var/lib/mympd/state/colsBrowsePlaylistsDetails ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowsePlaylistsDetails [ -f /var/lib/mympd/state/colsBrowsePlaylistsDetail ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowsePlaylistsDetail
[ -f /var/lib/mympd/state/colsQueue ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsQueue [ -f /var/lib/mympd/state/colsQueue ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsQueue
[ -f /var/lib/mympd/state/colsSearch ] || echo -n '["Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsSearch [ -f /var/lib/mympd/state/colsSearch ] || echo -n '["Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsSearch

2
debian/postinst vendored
View File

@ -63,7 +63,7 @@ fi
[ -f /var/lib/mympd/state/notificationWeb ] || echo -n "false" > /var/lib/mympd/state/notificationWeb [ -f /var/lib/mympd/state/notificationWeb ] || echo -n "false" > /var/lib/mympd/state/notificationWeb
[ -f /var/lib/mympd/state/colsBrowseDatabase ] || echo -n '["Track","Title"]' > /var/lib/mympd/state/colsBrowseDatabase [ -f /var/lib/mympd/state/colsBrowseDatabase ] || echo -n '["Track","Title"]' > /var/lib/mympd/state/colsBrowseDatabase
[ -f /var/lib/mympd/state/colsBrowseFilesystem ] || echo -n '["Type","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowseFilesystem [ -f /var/lib/mympd/state/colsBrowseFilesystem ] || echo -n '["Type","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowseFilesystem
[ -f /var/lib/mympd/state/colsBrowsePlaylistsDetails ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowsePlaylistsDetails [ -f /var/lib/mympd/state/colsBrowsePlaylistsDetail ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsBrowsePlaylistsDetail
[ -f /var/lib/mympd/state/colsQueue ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsQueue [ -f /var/lib/mympd/state/colsQueue ] || echo -n '["Pos","Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsQueue
[ -f /var/lib/mympd/state/colsSearch ] || echo -n '["Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsSearch [ -f /var/lib/mympd/state/colsSearch ] || echo -n '["Title","Artist","Album","Duration"]' > /var/lib/mympd/state/colsSearch

2
htdocs/css/mympd.css
View File

@ -43,7 +43,7 @@ button {
cursor: pointer; cursor: pointer;
} }
.tblnum, .tblaction { [data-col=Pos], [data-col=Type], [data-col=Track], [data-col=Action] {
width: 30px; width: 30px;
} }

42
htdocs/index.html
View File

@ -235,13 +235,15 @@
</div> </div>
<button data-href='{"cmd": "gotoPage", "options": ["next"]}' id="BrowsePlaylistsPaginationTopNext" title="Next Page" type="button" class="btn btn-secondary input-group-append">&raquo;</button> <button data-href='{"cmd": "gotoPage", "options": ["next"]}' id="BrowsePlaylistsPaginationTopNext" title="Next Page" type="button" class="btn btn-secondary input-group-append">&raquo;</button>
</div> </div>
<div class="btn-group mr-2 hide">
<button id="BrowsePlaylistsDetailColsBtn" class="btn btn-secondary dropdown-toggle material-icons" type="button" data-toggle="dropdown">settings</button>
<div class="dropdown-menu bg-dark px-2" id="BrowsePlaylistsDetailColsDropdown"><form></form>
<button data-href='{"cmd": "saveCols", "options": ["BrowsePlaylistsDetail"]}' class="btn btn-success btn-block btn-sm mt-2">Apply</button>
</div>
</div>
</div> </div>
<div class="table-responsive-md"> <div class="table-responsive-md">
<table id="BrowsePlaylistsAllList" class="table table-hover table-sm"> <table id="BrowsePlaylistsAllList" class="table table-hover table-sm">
<col class="tblnum"/>
<col class="tbltitle"/>
<col class="tbllastmodified"/>
<col class="tblaction"/>
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
@ -255,12 +257,6 @@
</table> </table>
<table id="BrowsePlaylistsDetailList" class="table table-hover table-sm hide"> <table id="BrowsePlaylistsDetailList" class="table table-hover table-sm hide">
<caption>Playlist List</caption> <caption>Playlist List</caption>
<col class="tblnum"/>
<col class="tbltitle"/>
<col class="tblartist"/>
<col class="tblalbum"/>
<col class="tbllength"/>
<col class="tblaction"/>
<thead> <thead>
<tr> <tr>
<th>#</th> <th>#</th>
@ -332,8 +328,6 @@
<div class="table-responsive-md"> <div class="table-responsive-md">
<table id="BrowseDatabaseTagList" class="table table-hover table-sm"> <table id="BrowseDatabaseTagList" class="table table-hover table-sm">
<col class="tblnum"/>
<col class="tbltitle"/>
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
@ -394,6 +388,12 @@
</div> </div>
<button data-href='{"cmd": "gotoPage", "options": ["next"]}' id="BrowseFilesystemPaginationTopNext" title="Next Page" type="button" class="btn btn-secondary input-group-append">&raquo;</button> <button data-href='{"cmd": "gotoPage", "options": ["next"]}' id="BrowseFilesystemPaginationTopNext" title="Next Page" type="button" class="btn btn-secondary input-group-append">&raquo;</button>
</div> </div>
<div class="btn-group mr-2">
<button id="BrowseFilesystemColsBtn" class="btn btn-secondary dropdown-toggle material-icons" type="button" data-toggle="dropdown">settings</button>
<div class="dropdown-menu bg-dark px-2" id="BrowseFilesystemColsDropdown"><form></form>
<button data-href='{"cmd": "saveCols", "options": ["BrowseFilesystem"]}' class="btn btn-success btn-block btn-sm mt-2">Apply</button>
</div>
</div>
</div> </div>
<ol id="BrowseBreadcrumb" class="breadcrumb"> <ol id="BrowseBreadcrumb" class="breadcrumb">
@ -401,12 +401,6 @@
<div class="table-responsive-md"> <div class="table-responsive-md">
<table id="BrowseFilesystemList" class="table table-hover table-sm"> <table id="BrowseFilesystemList" class="table table-hover table-sm">
<col class="tblnum"/>
<col class="tbltitle"/>
<col class="tblartist"/>
<col class="tblalbum"/>
<col class="tbllength"/>
<col class="tblaction"/>
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
@ -480,15 +474,15 @@
</div> </div>
<button data-href='{"cmd": "gotoPage", "options": ["next"]}' id="SearchPaginationTopNext" title="Next Page" type="button" class="btn btn-secondary input-group-append">&raquo;</button> <button data-href='{"cmd": "gotoPage", "options": ["next"]}' id="SearchPaginationTopNext" title="Next Page" type="button" class="btn btn-secondary input-group-append">&raquo;</button>
</div> </div>
<div class="btn-group mr-2">
<button id="SearchColsBtn" class="btn btn-secondary dropdown-toggle material-icons" type="button" data-toggle="dropdown">settings</button>
<div class="dropdown-menu bg-dark px-2" id="SearchColsDropdown"><form></form>
<button data-href='{"cmd": "saveCols", "options": ["Search"]}' class="btn btn-success btn-block btn-sm mt-2">Apply</button>
</div>
</div>
</div> </div>
<div class="table-responsive-md"> <div class="table-responsive-md">
<table id="SearchList" class="table table-hover table-sm"> <table id="SearchList" class="table table-hover table-sm">
<col class="tblnum"/>
<col class="tbltitle"/>
<col class="tblartist"/>
<col class="tblalbum"/>
<col class="tbllength"/>
<col class="tblaction"/>
<thead> <thead>
<tr> <tr>
<th></th> <th></th>

135
htdocs/js/mympd.js
View File

@ -204,7 +204,6 @@ function appRoute() {
sendAPI({"cmd": "MPD_API_PLAYLIST_CONTENT_LIST", "data": {"offset": app.current.page, "filter": app.current.filter, "uri": app.current.search}}, parsePlaylists); sendAPI({"cmd": "MPD_API_PLAYLIST_CONTENT_LIST", "data": {"offset": app.current.page, "filter": app.current.filter, "uri": app.current.search}}, parsePlaylists);
doSetFilterLetter('BrowsePlaylistsFilter'); doSetFilterLetter('BrowsePlaylistsFilter');
} }
else if (app.current.app == 'Browse' && app.current.tab == 'Database') { else if (app.current.app == 'Browse' && app.current.tab == 'Database') {
if (app.current.search != '') { if (app.current.search != '') {
sendAPI({"cmd": "MPD_API_DATABASE_TAG_ALBUM_LIST", "data": {"offset": app.current.page, "filter": app.current.filter, "search": app.current.search, "tag": app.current.view}}, parseListDBtags); sendAPI({"cmd": "MPD_API_DATABASE_TAG_ALBUM_LIST", "data": {"offset": app.current.page, "filter": app.current.filter, "search": app.current.search, "tag": app.current.view}}, parseListDBtags);
@ -540,6 +539,24 @@ function appInit() {
} }
}, false); }, false);
document.getElementById('BrowseFilesystemColsDropdown').addEventListener('click', function(event) {
if (event.target.nodeName == 'INPUT') {
event.stopPropagation();
}
}, false);
document.getElementById('SearchColsDropdown').addEventListener('click', function(event) {
if (event.target.nodeName == 'INPUT') {
event.stopPropagation();
}
}, false);
document.getElementById('BrowsePlaylistsDetailColsDropdown').addEventListener('click', function(event) {
if (event.target.nodeName == 'INPUT') {
event.stopPropagation();
}
}, false);
document.getElementById('search').addEventListener('submit', function() { document.getElementById('search').addEventListener('submit', function() {
return false; return false;
}, false); }, false);
@ -564,6 +581,9 @@ function appInit() {
dragAndDropTable('QueueList'); dragAndDropTable('QueueList');
dragAndDropTable('BrowsePlaylistsDetailList'); dragAndDropTable('BrowsePlaylistsDetailList');
dragAndDropTableHeader('Queue'); dragAndDropTableHeader('Queue');
dragAndDropTableHeader('Search');
dragAndDropTableHeader('BrowseFilesystem');
dragAndDropTableHeader('BrowsePlaylistsDetail');
window.addEventListener('hashchange', appRoute, false); window.addEventListener('hashchange', appRoute, false);
@ -1033,13 +1053,24 @@ function parseSettings(obj) {
document.getElementById('syscmds').innerHTML = syscmdsList; document.getElementById('syscmds').innerHTML = syscmdsList;
setCols('Queue'); setCols('Queue');
setCols('Search');
setCols('BrowseFilesystem');
setCols('BrowsePlaylistsDetail');
if (app.current.app == 'Queue')
getQueue();
else if (app.current.app == 'Search')
appRoute();
else if (app.current.app == 'Browse' && app.current.tab == 'Filesystem')
appRoute();
else if (app.current.app == 'Browse' && app.current.tab == 'Playlists' && app.current.view == 'Detail')
appRoute();
} }
function setCols(table) { function setCols(table) {
var tagChks = ''; var tagChks = '';
var tags = settings.tags; var tags = settings.tags.slice();
tags.push('Duration'); tags.push('Duration');
if (table == 'Queue') if (table == 'Queue' || table == 'BrowsePlaylistsDetail')
tags.push('Pos'); tags.push('Pos');
for (var i = 0; i < tags.length; i++) { for (var i = 0; i < tags.length; i++) {
@ -1094,10 +1125,7 @@ function saveCols(table) {
if (name) if (name)
cols.data.cols.push(name); cols.data.cols.push(name);
} }
sendAPI(cols); sendAPI(cols, getSettings);
getSettings();
if (table == 'Queue')
getQueue();
} }
function parseOutputs(obj) { function parseOutputs(obj) {
@ -1130,6 +1158,7 @@ function setCounter(currentSongId, totalTime, elapsedTime) {
//Set playing track in queue view //Set playing track in queue view
if (lastState) { if (lastState) {
if (lastState.data.currentSongId != currentSongId) {
var tr = document.getElementById('queueTrackId' + lastState.data.currentSongId); var tr = document.getElementById('queueTrackId' + lastState.data.currentSongId);
if (tr) { if (tr) {
var durationTd = tr.querySelector('[data-col=Duration]'); var durationTd = tr.querySelector('[data-col=Duration]');
@ -1143,6 +1172,7 @@ function setCounter(currentSongId, totalTime, elapsedTime) {
tr.classList.remove('font-weight-bold'); tr.classList.remove('font-weight-bold');
} }
} }
}
var tr = document.getElementById('queueTrackId' + currentSongId); var tr = document.getElementById('queueTrackId' + currentSongId);
if (tr) { if (tr) {
var durationTd = tr.querySelector('[data-col=Duration]'); var durationTd = tr.querySelector('[data-col=Duration]');
@ -1150,8 +1180,11 @@ function setCounter(currentSongId, totalTime, elapsedTime) {
durationTd.innerText = counterText; durationTd.innerText = counterText;
var posTd = tr.querySelector('[data-col=Pos]'); var posTd = tr.querySelector('[data-col=Pos]');
if (posTd) { if (posTd) {
if (!posTd.classList.contains('material-icons')) {
posTd.classList.add('material-icons'); posTd.classList.add('material-icons');
posTd.innerText = 'play_arrow'; posTd.innerText = 'play_arrow';
console.log('A');
}
} }
tr.classList.add('font-weight-bold'); tr.classList.add('font-weight-bold');
} }
@ -1264,9 +1297,9 @@ function parseQueue(obj) {
var tbody = table.getElementsByTagName('tbody')[0]; var tbody = table.getElementsByTagName('tbody')[0];
var tr = tbody.getElementsByTagName('tr'); var tr = tbody.getElementsByTagName('tr');
for (var i = 0; i < nrItems; i++) { for (var i = 0; i < nrItems; i++) {
if (tr[i]) //if (tr[i])
if (tr[i].getAttribute('data-trackid') == obj.data[i].id && tr[i].getAttribute('data-songpos') == (obj.data[i].pos + 1)) // if (tr[i].getAttribute('data-trackid') == obj.data[i].id && tr[i].getAttribute('data-songpos') == (obj.data[i].pos + 1))
continue; // continue;
var minutes = Math.floor(obj.data[i].Duration / 60); var minutes = Math.floor(obj.data[i].Duration / 60);
var seconds = obj.data[i].Duration - minutes * 60; var seconds = obj.data[i].Duration - minutes * 60;
@ -1282,7 +1315,7 @@ function parseQueue(obj) {
for (var c = 0; c < settings.colsQueue.length; c++) { for (var c = 0; c < settings.colsQueue.length; c++) {
tds += '<td data-col="' + settings.colsQueue[c] + '">' + obj.data[i][settings.colsQueue[c]] + '</td>'; tds += '<td data-col="' + settings.colsQueue[c] + '">' + obj.data[i][settings.colsQueue[c]] + '</td>';
} }
tds += '<td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>'; tds += '<td data-col="Action"><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>';
row.innerHTML = tds; row.innerHTML = tds;
if (i < tr.length) if (i < tr.length)
tr[i].replaceWith(row); tr[i].replaceWith(row);
@ -1323,43 +1356,52 @@ function parseSearch(obj) {
function parseFilesystem(obj) { function parseFilesystem(obj) {
if (app.current.app !== 'Browse' && app.current.tab !== 'Filesystem' && app.current.app !== 'Search') if (app.current.app !== 'Browse' && app.current.tab !== 'Filesystem' && app.current.app !== 'Search')
return; return;
var list = app.current.app + (app.current.tab == 'Filesystem' ? app.current.tab : '');
var colspan = settings['cols' + list].length;
colspan--;
var nrItems = obj.data.length; var nrItems = obj.data.length;
var tbody = document.getElementById(app.current.app + (app.current.tab == undefined ? '' : app.current.tab) + 'List').getElementsByTagName('tbody')[0]; var tbody = document.getElementById(app.current.app + (app.current.tab == undefined ? '' : app.current.tab) + 'List').getElementsByTagName('tbody')[0];
var tr = tbody.getElementsByTagName('tr'); var tr = tbody.getElementsByTagName('tr');
for (var i = 0; i < nrItems; i++) { for (var i = 0; i < nrItems; i++) {
var uri = encodeURI(obj.data[i].uri); var uri = encodeURI(obj.data[i].uri);
if (tr[i]) //if (tr[i])
if (tr[i].getAttribute('data-uri') == uri) // if (tr[i].getAttribute('data-uri') == uri)
continue; // continue;
var row = document.createElement('tr'); var row = document.createElement('tr');
row.setAttribute('data-type', obj.data[i].type); row.setAttribute('data-type', obj.data[i].Type);
row.setAttribute('data-uri', uri); row.setAttribute('data-uri', uri);
if (obj.data[i].type == 'song') if (obj.data[i].type == 'song')
row.setAttribute('data-name', obj.data[i].Title); row.setAttribute('data-name', obj.data[i].Title);
else else
row.setAttribute('data-name', obj.data[i].name); row.setAttribute('data-name', obj.data[i].name);
switch(obj.data[i].type) { switch(obj.data[i].Type) {
case 'dir': case 'dir':
row.innerHTML = '<td><span class="material-icons">folder_open</span></td>' + row.innerHTML = '<td><span class="material-icons">folder_open</span></td>' +
'<td colspan="4">' + obj.data[i].name + '</td>' + '<td colspan="' + colspan + '">' + obj.data[i].name + '</td>' +
'<td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>'; '<td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>';
break; break;
case 'song': case 'song':
var minutes = Math.floor(obj.data[i].Duration / 60); var minutes = Math.floor(obj.data[i].Duration / 60);
var seconds = obj.data[i].Duration - minutes * 60; var seconds = obj.data[i].Duration - minutes * 60;
row.innerHTML = '<td><span class="material-icons">music_note</span></td>' + obj.data[i].Duration = minutes + ':' + (seconds < 10 ? '0' : '') + seconds;
'<td>' + obj.data[i].Title + '</td>' + var tds = '';
'<td>' + obj.data[i].Artist + '</td>' + for (var c = 0; c < settings['cols' + list].length; c++) {
'<td>' + obj.data[i].Album + '</td>' + tds += '<td data-col="' + settings['cols' + list][c] + '">';
'<td>' + minutes + ':' + (seconds < 10 ? '0' : '') + seconds + if (settings['cols' + list][c] == 'Type')
'</td><td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>'; tds += '<span class="material-icons">music_note</span>';
else
tds += obj.data[i][settings['cols' + list][c]];
tds += '</td>';
}
tds += '<td data-col="Action"><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>';
row.innerHTML = tds;
break; break;
case 'smartpls': case 'smartpls':
case 'plist': case 'plist':
row.innerHTML = '<td><span class="material-icons">list</span></td>' + row.innerHTML = '<td data-col="Type"><span class="material-icons">list</span></td>' +
'<td colspan="4">' + obj.data[i].name + '</td>' + '<td colspan="' + colspan + '">' + obj.data[i].name + '</td>' +
'<td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>'; '<td data-col="Action"><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>';
break; break;
} }
if (i < tr.length) if (i < tr.length)
@ -1388,6 +1430,7 @@ function parsePlaylists(obj) {
document.getElementById('BrowsePlaylistsDetailList').classList.add('hide'); document.getElementById('BrowsePlaylistsDetailList').classList.add('hide');
document.getElementById('btnBrowsePlaylistsAll').parentNode.classList.add('hide'); document.getElementById('btnBrowsePlaylistsAll').parentNode.classList.add('hide');
document.getElementById('btnPlaylistClear').parentNode.classList.add('hide'); document.getElementById('btnPlaylistClear').parentNode.classList.add('hide');
document.getElementById('BrowsePlaylistsDetailColsBtn').parentNode.classList.add('hide');
} else { } else {
if (obj.uri.indexOf('.') > -1 || obj.smartpls == true) { if (obj.uri.indexOf('.') > -1 || obj.smartpls == true) {
document.getElementById('BrowsePlaylistsDetailList').setAttribute('data-ro', 'true') document.getElementById('BrowsePlaylistsDetailList').setAttribute('data-ro', 'true')
@ -1407,6 +1450,7 @@ function parsePlaylists(obj) {
document.getElementById('BrowsePlaylistsDetailList').classList.remove('hide'); document.getElementById('BrowsePlaylistsDetailList').classList.remove('hide');
document.getElementById('BrowsePlaylistsAllList').classList.add('hide'); document.getElementById('BrowsePlaylistsAllList').classList.add('hide');
document.getElementById('btnBrowsePlaylistsAll').parentNode.classList.remove('hide'); document.getElementById('btnBrowsePlaylistsAll').parentNode.classList.remove('hide');
document.getElementById('BrowsePlaylistsDetailColsBtn').parentNode.classList.remove('hide');
} }
var nrItems = obj.data.length; var nrItems = obj.data.length;
@ -1421,12 +1465,12 @@ function parsePlaylists(obj) {
var d = new Date(obj.data[i].last_modified * 1000); var d = new Date(obj.data[i].last_modified * 1000);
var row = document.createElement('tr'); var row = document.createElement('tr');
row.setAttribute('data-uri', uri); row.setAttribute('data-uri', uri);
row.setAttribute('data-type', obj.data[i].type); row.setAttribute('data-type', obj.data[i].Type);
row.setAttribute('data-name', obj.data[i].name); row.setAttribute('data-name', obj.data[i].name);
row.innerHTML = '<td><span class="material-icons">list</span></td>' + row.innerHTML = '<td data-col="Type"><span class="material-icons">list</span></td>' +
'<td>' + obj.data[i].name + '</td>' + '<td>' + obj.data[i].name + '</td>' +
'<td>'+ d.toUTCString() + '</td>' + '<td>'+ d.toUTCString() + '</td>' +
'<td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>'; '<td data-col="Action"><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>';
if (i < tr.length) if (i < tr.length)
tr[i].replaceWith(row); tr[i].replaceWith(row);
else else
@ -1436,26 +1480,27 @@ function parsePlaylists(obj) {
else if (app.current.view == 'Detail') { else if (app.current.view == 'Detail') {
for (var i = 0; i < nrItems; i++) { for (var i = 0; i < nrItems; i++) {
var uri = encodeURI(obj.data[i].uri); var uri = encodeURI(obj.data[i].uri);
var songpos = obj.offset + i + 1; //if (tr[i])
if (tr[i]) // if (tr[i].getAttribute('data-uri') == uri && tr[i].getAttribute('id') == 'playlistTrackId' + songpos)
if (tr[i].getAttribute('data-uri') == uri && tr[i].getAttribute('id') == 'playlistTrackId' + songpos) // continue;
continue;
var row = document.createElement('tr'); var row = document.createElement('tr');
if (obj.smartpls == false) if (obj.smartpls == false)
row.setAttribute('draggable','true'); row.setAttribute('draggable','true');
row.setAttribute('id','playlistTrackId' + songpos); row.setAttribute('id','playlistTrackId' + obj.data[i].Pos);
row.setAttribute('data-type', obj.data[i].type); row.setAttribute('data-type', obj.data[i].Type);
row.setAttribute('data-uri', uri); row.setAttribute('data-uri', uri);
row.setAttribute('data-name', obj.data[i].Title); row.setAttribute('data-name', obj.data[i].Title);
row.setAttribute('data-songpos', songpos); row.setAttribute('data-songpos', obj.data[i].Pos);
var minutes = Math.floor(obj.data[i].Duration / 60); var minutes = Math.floor(obj.data[i].Duration / 60);
var seconds = obj.data[i].Duration - minutes * 60; var seconds = obj.data[i].Duration - minutes * 60;
row.innerHTML = '<td>' + songpos + '</td>' + obj.data[i].Duration = minutes + ':' + (seconds < 10 ? '0' : '') + seconds;
'<td>' + obj.data[i].Title + '</td>' + var tds = '';
'<td>' + obj.data[i].Artist + '</td>' + for (var c = 0; c < settings.colsBrowsePlaylistsDetail.length; c++) {
'<td>' + obj.data[i].Album + '</td>' + tds += '<td data-col="' + settings.colsBrowsePlaylistsDetail[c] + '">' + obj.data[i][settings.colsBrowsePlaylistsDetail[c]] + '</td>';
'<td>' + minutes + ':' + (seconds < 10 ? '0' : '') + seconds + }
'</td><td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>'; tds += '<td data-col="Action"><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>';
row.innerHTML = tds;
if (i < tr.length) if (i < tr.length)
tr[i].replaceWith(row); tr[i].replaceWith(row);
else else
@ -1551,7 +1596,7 @@ function parseListDBtags(obj) {
continue; continue;
var row = document.createElement('tr'); var row = document.createElement('tr');
row.setAttribute('data-uri', uri); row.setAttribute('data-uri', uri);
row.innerHTML='<td><span class="material-icons">album</span></td>' + row.innerHTML='<td data-col="Type"><span class="material-icons">album</span></td>' +
'<td>' + obj.data[i].value + '</td>'; '<td>' + obj.data[i].value + '</td>';
if (i < tr.length) if (i < tr.length)
@ -1620,7 +1665,7 @@ function parseListTitles(obj) {
for (var i = 0; i < nrItems; i++) { for (var i = 0; i < nrItems; i++) {
titleList += '<tr data-type="song" data-name="' + obj.data[i].Title + '" data-uri="' + encodeURI(obj.data[i].uri) + '">' + titleList += '<tr data-type="song" data-name="' + obj.data[i].Title + '" data-uri="' + encodeURI(obj.data[i].uri) + '">' +
'<td>' + obj.data[i].Track + '</td><td>' + obj.data[i].Title + '</td>' + '<td>' + obj.data[i].Track + '</td><td>' + obj.data[i].Title + '</td>' +
'<td><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>' + '<td data-col="Action"><a href="#" class="material-icons color-darkgrey">playlist_add</a></td>' +
'</tr>'; '</tr>';
} }
tbody.innerHTML = titleList; tbody.innerHTML = titleList;
@ -1879,7 +1924,7 @@ function parseSmartPlaylist(obj) {
var nameEl = document.getElementById('saveSmartPlaylistName'); var nameEl = document.getElementById('saveSmartPlaylistName');
nameEl.value = obj.data.playlist; nameEl.value = obj.data.playlist;
nameEl.classList.remove('is-invalid'); nameEl.classList.remove('is-invalid');
document.getElementById('saveSmartPlaylistType').value = obj.data.type; document.getElementById('saveSmartPlaylistType').value = obj.data.Type;
document.getElementById('saveSmartPlaylistFrm').classList.remove('was-validated'); document.getElementById('saveSmartPlaylistFrm').classList.remove('was-validated');
document.getElementById('saveSmartPlaylistSearch').classList.add('hide'); document.getElementById('saveSmartPlaylistSearch').classList.add('hide');
document.getElementById('saveSmartPlaylistSticker').classList.add('hide'); document.getElementById('saveSmartPlaylistSticker').classList.add('hide');

15
src/mpd_client.c
View File

@ -130,9 +130,9 @@ void callback_mympd(struct mg_connection *nc, const struct mg_str msg) {
free(mympd_state.colsBrowseDatabase); free(mympd_state.colsBrowseDatabase);
mympd_state.colsBrowseDatabase = strdup(cols); mympd_state.colsBrowseDatabase = strdup(cols);
} }
else if (strcmp(p_charbuf1,"colsBrowsePlaylistsDetails")==0) { else if (strcmp(p_charbuf1,"colsBrowsePlaylistsDetail")==0) {
free(mympd_state.colsBrowsePlaylistsDetails); free(mympd_state.colsBrowsePlaylistsDetail);
mympd_state.colsBrowsePlaylistsDetails = strdup(cols); mympd_state.colsBrowsePlaylistsDetail = strdup(cols);
} }
else if (strcmp(p_charbuf1,"colsBrowseFilesystem")==0) { else if (strcmp(p_charbuf1,"colsBrowseFilesystem")==0) {
free(mympd_state.colsBrowseFilesystem); free(mympd_state.colsBrowseFilesystem);
@ -1355,7 +1355,7 @@ int mympd_put_settings(char *buffer) {
len += json_printf(&out, ", colsQueue: %s", mympd_state.colsQueue); len += json_printf(&out, ", colsQueue: %s", mympd_state.colsQueue);
len += json_printf(&out, ", colsSearch: %s", mympd_state.colsSearch); len += json_printf(&out, ", colsSearch: %s", mympd_state.colsSearch);
len += json_printf(&out, ", colsBrowseDatabase: %s", mympd_state.colsBrowseFilesystem); len += json_printf(&out, ", colsBrowseDatabase: %s", mympd_state.colsBrowseFilesystem);
len += json_printf(&out, ", colsBrowsePlaylistsDetails: %s", mympd_state.colsBrowsePlaylistsDetails); len += json_printf(&out, ", colsBrowsePlaylistsDetail: %s", mympd_state.colsBrowsePlaylistsDetail);
len += json_printf(&out, ", colsBrowseFilesystem: %s", mympd_state.colsBrowseFilesystem); len += json_printf(&out, ", colsBrowseFilesystem: %s", mympd_state.colsBrowseFilesystem);
len += json_printf(&out, "}}"); len += json_printf(&out, "}}");
@ -1826,7 +1826,7 @@ int mympd_put_playlists(char *buffer, unsigned int offset, char *filter) {
smartpls = true; smartpls = true;
else else
smartpls = false; smartpls = false;
len += json_printf(&out, "{type: %Q, uri: %Q, name: %Q, last_modified: %d}", len += json_printf(&out, "{Type: %Q, uri: %Q, name: %Q, last_modified: %d}",
(smartpls == true ? "smartpls" : "plist"), (smartpls == true ? "smartpls" : "plist"),
plpath, plpath,
plpath, plpath,
@ -1875,8 +1875,9 @@ int mympd_put_playlist_list(char *buffer, char *uri, unsigned int offset, char *
) { ) {
if (entities_returned++) if (entities_returned++)
len += json_printf(&out, ","); len += json_printf(&out, ",");
len += json_printf(&out, "{type: song, "); len += json_printf(&out, "{Type: song, ");
PUT_SONG_TAGS(); PUT_SONG_TAGS();
len += json_printf(&out, ", Pos: %d", entity_count);
len += json_printf(&out, "}"); len += json_printf(&out, "}");
} else { } else {
entity_count--; entity_count--;
@ -1929,7 +1930,7 @@ int mympd_search(char *buffer, char *searchstr, char *filter, char *plist, unsig
if (entity_count > offset && entity_count <= offset + config.max_elements_per_page) { if (entity_count > offset && entity_count <= offset + config.max_elements_per_page) {
if (entities_returned++) if (entities_returned++)
len += json_printf(&out, ", "); len += json_printf(&out, ", ");
len += json_printf(&out, "{type: song, "); len += json_printf(&out, "{Type: song, ");
PUT_SONG_TAGS(); PUT_SONG_TAGS();
len += json_printf(&out, "}"); len += json_printf(&out, "}");
} }

2
src/mpd_client.h
View File

@ -206,7 +206,7 @@ typedef struct {
char* colsQueue; char* colsQueue;
char* colsSearch; char* colsSearch;
char* colsBrowseDatabase; char* colsBrowseDatabase;
char* colsBrowsePlaylistsDetails; char* colsBrowsePlaylistsDetail;
char* colsBrowseFilesystem; char* colsBrowseFilesystem;
} t_mympd_state; } t_mympd_state;

8
src/mympd.c
View File

@ -274,11 +274,11 @@ void read_statefiles() {
mympd_state_set("colsBrowseDatabase", mympd_state.colsBrowseDatabase); mympd_state_set("colsBrowseDatabase", mympd_state.colsBrowseDatabase);
} }
if (mympd_state_get("colsBrowsePlaylistsDetails", value)) if (mympd_state_get("colsBrowsePlaylistsDetail", value))
mympd_state.colsBrowsePlaylistsDetails = strdup(value); mympd_state.colsBrowsePlaylistsDetail = strdup(value);
else { else {
mympd_state.colsBrowsePlaylistsDetails = strdup("[\"Pos\",\"Title\",\"Artist\",\"Album\",\"Duration\"]"); mympd_state.colsBrowsePlaylistsDetail = strdup("[\"Pos\",\"Title\",\"Artist\",\"Album\",\"Duration\"]");
mympd_state_set("colsBrowsePlaylistsDetails", mympd_state.colsBrowsePlaylistsDetails); mympd_state_set("colsBrowsePlaylistsDetail", mympd_state.colsBrowsePlaylistsDetail);
} }
if (mympd_state_get("colsBrowseFilesystem", value)) if (mympd_state_get("colsBrowseFilesystem", value))