mirrors/ympd
1
0
Fork 0
mirror of https://github.com/SuperBFG7/ympd synced 2024-06-25 22:23:16 +00:00
Code Issues Releases Wiki Activity

Feat: configurable tags in playback card

Browse Source
This commit is contained in:
jcorporation 2018-11-05 19:57:06 +00:00
parent 65c5d6486d
commit 179668e868
3 changed files with 78 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
htdocs/index.html
View File

@ -81,6 +81,12 @@
<div class="card" id="cardPlayback">
<div class="card-header">Playback
<div class="btn-group mr-2 featTags pull-right">
<button id="PlaybackColsBtn" class="btn btn-sm btn-light dropdown-toggle material-icons" type="button" data-toggle="dropdown">settings</button>
<div class="dropdown-menu bg-dark px-2" id="PlaybackColsDropdown"><form></form>
<button data-href='{"cmd": "saveColsPlayback", "options": ["Playback"]}' class="btn btn-success btn-block btn-sm mt-2">Apply</button>
</div>
</div>
<div class="btn-group btn-group-sm featStickers pull-right">
<button title="Dislike song" id="btnVoteDown" data-href='{"cmd": "voteSong", "options": [0]}' class="btn btn-sm btn-light material-icons">thumb_down</button>
<button title="Like song" id="btnVoteUp" data-href='{"cmd": "voteSong", "options": [2]}' class="btn btn-sm btn-light material-icons">thumb_up</button>

93
htdocs/js/mympd.js
View File

@ -25,6 +25,7 @@
var socket;
var lastSong = '';
var lastSongObj = {};
var lastState;
var currentSong = new Object();
var playstate = '';
@ -564,6 +565,12 @@ function appInit() {
if (event.target.nodeName == 'INPUT') {
event.stopPropagation();
}
}, false);
document.getElementById('PlaybackColsDropdown').addEventListener('click', function(event) {
if (event.target.nodeName == 'INPUT') {
event.stopPropagation();
}
}, false);
document.getElementById('search').addEventListener('submit', function() {
@ -980,12 +987,12 @@ function filterCols(x) {
tags.push('Duration');
if (x == 'colsQueue' || x == 'colsBrowsePlaylistsDetail')
tags.push('Pos');
if (x == 'colsBrowseFilesystem')
else if (x == 'colsBrowseFilesystem')
tags.push('Type');
var cols = [];
for (var i = 0; i < settings[x].length; i++) {
if (tags.includes(settings[x][i]))
if (tags.includes(settings[x][i]))
cols.push(settings[x][i]);
}
settings[x] = cols;
@ -1067,12 +1074,13 @@ function parseSettings(obj) {
else {
var pbtl = '';
for (var i = 0; i < settings.colsPlayback.length; i++) {
pbtl += '<small>' + settings.colsPlayback[i] + '</small>' +
'<h4 ';
pbtl += '<div id="current' + settings.colsPlayback[i] + '" data-tag="' + settings.colsPlayback[i] + '" '+
'data-name="' + encodeURI((lastSongObj.data ? lastSongObj.data[settings.colsPlayback[i]] : '')) + '">' +
'<small>' + settings.colsPlayback[i] + '</small>' +
'<h4';
if (settings.browsetags.includes(settings.colsPlayback[i]))
pbtl += 'class="clickable" ';
pbtl += 'id="current' + settings.colsPlayback[i] + '" data-tag="' + settings.colsPlayback[i] + '">' +
( lastSong ? lastSong[settings.colsPlayback[i]] : '') + '</h4>';
pbtl += ' class="clickable"';
pbtl += '>' + (lastSongObj.data ? lastSongObj.data[settings.colsPlayback[i]] : '') + '</h4></div>';
}
document.getElementById('cardPlaybackTags').innerHTML = pbtl;
}
@ -1156,6 +1164,7 @@ function parseSettings(obj) {
setCols('BrowseFilesystem');
setCols('BrowsePlaylistsDetail');
setCols('BrowseDatabase', '.tblAlbumTitles');
setCols('Playback');
if (app.current.app == 'Queue')
getQueue();
else if (app.current.app == 'Search')
@ -1182,6 +1191,8 @@ function setCols(table, className) {
tags.sort();
for (var i = 0; i < tags.length; i++) {
if (table == 'Playback' && tags[i] == 'Title')
continue;
tagChks += '<div class="form-check">' +
'<input class="form-check-input" type="checkbox" value="1" name="' + tags[i] + '"';
if (settings['cols' + table].includes(tags[i]))
@ -1192,21 +1203,23 @@ function setCols(table, className) {
}
document.getElementById(table + 'ColsDropdown').firstChild.innerHTML = tagChks;
var heading = '';
for (var i = 0; i < settings['cols' + table].length; i++) {
var h = settings['cols' + table][i];
heading += '<th draggable="true" data-col="' + h + '">';
if (h == 'Track' || h == 'Pos')
h = '#';
heading += h + '</th>';
}
heading += '<th></th>';
if (className == undefined)
document.getElementById(table + 'List').getElementsByTagName('tr')[0].innerHTML = heading;
else {
var tbls = document.querySelectorAll(className);
for (var i = 0; i < tbls.length; i++) {
tbls[i].getElementsByTagName('tr')[0].innerHTML = heading;
if (table != 'Playback') {
var heading = '';
for (var i = 0; i < settings['cols' + table].length; i++) {
var h = settings['cols' + table][i];
heading += '<th draggable="true" data-col="' + h + '">';
if (h == 'Track' || h == 'Pos')
h = '#';
heading += h + '</th>';
}
heading += '<th></th>';
if (className == undefined)
document.getElementById(table + 'List').getElementsByTagName('tr')[0].innerHTML = heading;
else {
var tbls = document.querySelectorAll(className);
for (var i = 0; i < tbls.length; i++) {
tbls[i].getElementsByTagName('tr')[0].innerHTML = heading;
}
}
}
}
@ -1249,6 +1262,35 @@ function saveCols(table, tableEl) {
sendAPI(cols, getSettings);
}
function saveColsPlayback(table) {
var colInputs = document.getElementById(table + 'ColsDropdown').firstChild.getElementsByTagName('input');
var header = document.getElementById('cardPlaybackTags');
for (var i = 0; i < colInputs.length; i++) {
var th = document.getElementById('current' + colInputs[i].name);
if (colInputs[i].checked == false) {
if (th)
th.remove();
}
else if (!th) {
th = document.createElement('div');
th.innerHTML = '<small>' + colInputs[i].name + '</small><h4></h4>';
th.setAttribute('id', 'current'+ colInputs[i].name);
th.setAttribute('data-tag', colInputs[i].name);
header.appendChild(th);
}
}
var cols = {"cmd": "MPD_API_COLS_SAVE", "data": {"table": "cols" + table, "cols": []}};
var ths = header.getElementsByTagName('div');
for (var i = 0; i < ths.length; i++) {
var name = ths[i].getAttribute('data-tag');
if (name)
cols.data.cols.push(name);
}
sendAPI(cols, getSettings);
}
function parseOutputs(obj) {
var btns = '';
var outputsLen = obj.data.outputs.length;
@ -1905,8 +1947,8 @@ function titleClick() {
}
function gotoBrowse(x) {
var tag = x.getAttribute('data-tag');
var name = decodeURI(x.getAttribute('data-name'));
var tag = x.parentNode.getAttribute('data-tag');
var name = decodeURI(x.parentNode.getAttribute('data-name'));
if (tag != '' && name != '' && settings.browsetags.includes(tag))
appGoto('Browse', 'Database', tag, '0/-/' + name);
}
@ -2717,7 +2759,7 @@ function songChange(obj) {
for (var i = 0; i < settings.colsPlayback.length; i++) {
var c = document.getElementById('current' + settings.colsPlayback[i]);
c.innerText = obj.data[settings.colsPlayback[i]];
c.getElementsByTagName('h4')[0].innerText = obj.data[settings.colsPlayback[i]];
c.setAttribute('data-name', encodeURI(obj.data[settings.colsPlayback[i]]));
}
@ -2728,6 +2770,7 @@ function songChange(obj) {
showNotification(obj.data.Title, textNotification, htmlNotification, 'success');
lastSong = curSong;
lastSongObj = obj;
}
function doSetFilterLetter(x) {

4
src/mpd_client.c
View File

@ -138,6 +138,10 @@ void callback_mympd(struct mg_connection *nc, const struct mg_str msg) {
free(mympd_state.colsBrowseFilesystem);
mympd_state.colsBrowseFilesystem = strdup(cols);
}
else if (strcmp(p_charbuf1,"colsPlayback")==0) {
free(mympd_state.colsPlayback);
mympd_state.colsPlayback = strdup(cols);
}
mympd_state_set(p_charbuf1, cols);
free(p_charbuf1);
}