mirrors/ympd
1
0
Fork 0
mirror of https://github.com/SuperBFG7/ympd synced 2025-10-21 00:57:37 +00:00
Code Issues Releases Wiki Activity

Add songdetails modal

Browse Source
This commit is contained in:
jcorporation
2018-07-09 18:28:28 +01:00
parent cfd20a36fd
commit ff2b40baf8
5 changed files with 144 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
htdocs/js/mpd.js
View File

@@ -66,12 +66,12 @@ domCache.btnNext = document.getElementById('btnNext');
domCache.progressBar = document.getElementById('progressBar');
domCache.volumeBar = document.getElementById('volumeBar');
domCache.outputs = document.getElementById('outputs');
domCache.kbitrate = document.getElementById('kbitrate');
var modalConnectionError = new Modal(document.getElementById('modalConnectionError'));
var modalSettings = new Modal(document.getElementById('modalSettings'));
var modalAddstream = new Modal(document.getElementById('modalAddstream'));
var modalSavequeue = new Modal(document.getElementById('modalSavequeue'));
var modalSongDetails = new Modal(document.getElementById('modalSongDetails'));
var mainMenu = new Dropdown(document.getElementById('mainMenu'));
function appPrepare(scrollPos) {
@@ -295,19 +295,19 @@ function appInit() {
document.getElementById('modalAbout').addEventListener('shown.bs.modal', function () {
sendAPI({"cmd": "MPD_API_GET_STATS"}, parseStats);
})
});
document.getElementById('modalSettings').addEventListener('shown.bs.modal', function () {
getSettings();
document.getElementById('settingsFrm').classList.remove('was-validated');
document.getElementById('inputCrossfade').classList.remove('is-invalid');
document.getElementById('inputMixrampdb').classList.remove('is-invalid');
document.getElementById('inputMixrampdelay').classList.remove('is-invalid');
})
});
document.getElementById('modalAddstream').addEventListener('shown.bs.modal', function () {
document.getElementById('streamurl').focus();
})
});
document.getElementById('addstreamFrm').addEventListener('submit', function () {
addStream();
@@ -720,8 +720,6 @@ function parseState(obj) {
total_minutes + ":" + (total_seconds < 10 ? '0' : '') + total_seconds;
domCache.counter.innerText = counterText;
domCache.kbitrate.innerText = 'Bitrate: ' + obj.data.kbitrate + ' kbit';
//Set playing track in queue view
if (last_state) {
var tr = document.getElementById('queueTrackId' + last_state.data.currentsongid);
@@ -790,6 +788,7 @@ function parseQueue(obj) {
row.setAttribute('id','queueTrackId' + obj.data[i].id);
row.setAttribute('data-songpos', (obj.data[i].pos + 1));
row.setAttribute('data-duration', duration);
row.setAttribute('data-uri', obj.data[i].uri);
row.innerHTML = '<td>' + (obj.data[i].pos + 1) + '</td>' +
'<td>' + obj.data[i].title + '</td>' +
'<td>' + obj.data[i].artist + '</td>' +
@@ -958,7 +957,7 @@ function parseListDBtags(obj) {
if (nrItems == 0)
tbody.innerHTML = '<tr><td><span class="material-icons">error_outline</span></td>' +
'<td colspan="5">No entries found.</td></tr>'
'<td colspan="5">No entries found.</td></tr>';
document.getElementById('BrowseDatabaseArtistList').classList.remove('opacity05');
} else if (obj.tagtype == 'Album') {
@@ -966,7 +965,7 @@ function parseListDBtags(obj) {
document.getElementById('BrowseDatabaseArtistList').classList.add('hide');
document.getElementById('btnBrowseDatabaseArtist').classList.remove('hide');
var nrItems = obj.data.length;
var cardContainer = document.getElementById('BrowseDatabaseAlbumCards')
var cardContainer = document.getElementById('BrowseDatabaseAlbumCards');
var cards = cardContainer.querySelectorAll('.col-md');
for (var i = 0; i < nrItems; i++) {
var id=genId(obj.data[i].value);
@@ -1083,15 +1082,15 @@ function appendQueue(type, uri, name) {
switch(type) {
case 'song':
sendAPI({"cmd": "MPD_API_ADD_TRACK", "data": {"uri": uri}});
showNotification('"' + name + '" added','','','success');
showNotification('"' + name + '" added', '', '', 'success');
break;
case 'dir':
sendAPI({"cmd": "MPD_API_ADD_TRACK", "data": {"uri": uri}});
showNotification('"' + name + '" added','','','success');
showNotification('"' + name + '" added', '', '', 'success');
break;
case 'plist':
sendAPI({"cmd": "MPD_API_ADD_PLAYLIST", "data": {"plist": uri}});
showNotification('"' + name + '" added','','','success');
showNotification('"' + name + '" added', '', '', 'success');
break;
}
}
@@ -1113,19 +1112,45 @@ function replaceQueue(type, uri, name) {
switch(type) {
case 'song':
sendAPI({"cmd": "MPD_API_REPLACE_TRACK", "data": {"uri": uri}});
showNotification('"' + name + '" replaced','','','success');
showNotification('"' + name + '" replaced', '', '', 'success');
break;
case 'dir':
sendAPI({"cmd": "MPD_API_REPLACE_TRACK", "data": {"uri": uri}});
showNotification('"' + name + '" replaced','','','success');
showNotification('"' + name + '" replaced', '', '', 'success');
break;
case 'plist':
sendAPI({"cmd": "MPD_API_REPLACE_PLAYLIST", "data": {"plist": uri}});
showNotification('"' + name + '" replaced','','','success');
showNotification('"' + name + '" replaced', '', '', 'success');
break;
}
}
function songDetails(uri) {
sendAPI({"cmd": "MPD_API_GET_SONGDETAILS", "data": {"uri": uri}}, parseSongDetails);
modalSongDetails.show();
}
function parseSongDetails(obj) {
var modal = document.getElementById('modalSongDetails');
modal.querySelector('.album-cover').style.backgroundImage = 'url(' + obj.data.cover + ')';
modal.getElementsByTagName('h1')[0].innerText = obj.data.title;
var tr = modal.getElementsByTagName('tr');
var trLen = tr.length;
for (var i = 0; i < trLen; i ++) {
var key = tr[i].getAttribute('data-name');
var value = obj.data[key];
if (key == 'duration') {
var minutes = Math.floor(value / 60);
var seconds = value - minutes * 60;
value = minutes + ':' + (seconds < 10 ? '0' : '') + seconds;
}
else if (key == 'uri') {
value = '<a class="text-success" href="/library/' + value + '">' + value + '</a>';
}
tr[i].getElementsByTagName('td')[1].innerHTML = value;
}
}
function showMenu(el) {
var type = el.getAttribute('data-type');
var uri = decodeURI(el.getAttribute('data-uri'));
@@ -1144,11 +1169,11 @@ function showMenu(el) {
( type != 'plist' ? '<a class="dropdown-item" href="#" data-href="{\'cmd\': \'appendAfterQueue\', \'options\': [\'' + type + '\',\'' +
uri + '\',' + last_state.data.nextsongpos + ',\'' + name + '\']}">Add after current playing song</a>' : '') +
'<a class="dropdown-item" href="#" data-href="{\'cmd\': \'replaceQueue\', \'options\': [\'' + type + '\',\'' +
uri + '\',\'' + name + '\']}">Replace queue</a>';
/* ( type != 'plist' ? '<div class="dropdown-divider"></div><a class="dropdown-item" href="#">Add to playlist</a>' : '') +
uri + '\',\'' + name + '\']}">Replace queue</a>' +
// ( type != 'plist' ? '<div class="dropdown-divider"></div><a class="dropdown-item" href="#">Add to playlist</a>' : '') +
( type != 'dir' ? '<div class="dropdown-divider"></div>' : '') +
( type == 'song' ? '<a class="dropdown-item" href="#">Songdetails</a>' : '') +
( type == 'plist' ? '<a class="dropdown-item" href="#">Show playlist</a>' : '');*/
( type == 'song' ? '<a class="dropdown-item" data-href="{\'cmd\': \'songDetails\', \'options\': [\'' + uri + '\']}" href="#">Songdetails</a>' : '');
// ( type == 'plist' ? '<a class="dropdown-item" href="#">Show playlist</a>' : '');
}
else if (app.current.app == 'Browse' && app.current.tab == 'Playlists') {
menu += '<a class="dropdown-item" href="#" data-href="{\'cmd\': \'appendQueue\', \'options\': [\'' + type + '\',\'' +
@@ -1167,9 +1192,9 @@ function showMenu(el) {
'<a class="dropdown-item" href="#" data-href="{\'cmd\': \'delQueueSong\', \'options\': [\'range\',0,'+
el.parentNode.parentNode.getAttribute('data-songpos') + ']}">Remove all upwards</a>' +
'<a class="dropdown-item" href="#" data-href="{\'cmd\': \'delQueueSong\', \'options\': [\'range\',' +
(parseInt(el.parentNode.parentNode.getAttribute('data-songpos'))-1) + ',-1]}">Remove all downwards</a>';
// '<div class="dropdown-divider"></div>' +
// '<a class="dropdown-item" href="#">Songdetails</a>';
(parseInt(el.parentNode.parentNode.getAttribute('data-songpos'))-1) + ',-1]}">Remove all downwards</a>' +
'<div class="dropdown-divider"></div>' +
'<a class="dropdown-item" data-href="{\'cmd\': \'songDetails\', \'options\': [\'' + uri + '\']}" href="#">Songdetails</a>';
}
if (el.Popover == undefined) {
new Popover(el, { trigger: 'click', template: '<div class="popover" role="tooltip">' +
@@ -1363,7 +1388,7 @@ function showNotification(notificationTitle,notificationText,notificationHtml,no
var alertBox;
if (!document.getElementById('alertBox')) {
alertBox = document.createElement('div');
alertBox.setAttribute('id','alertBox');
alertBox.setAttribute('id', 'alertBox');
}
else {
alertBox = document.getElementById('alertBox');
@@ -1426,7 +1451,7 @@ function songChange(obj) {
if (playingTr)
playingTr.getElementsByTagName('td')[1].innerText = obj.data.title;
showNotification(obj.data.title,textNotification,htmlNotification,'success');
showNotification(obj.data.title, textNotification, htmlNotification, 'success');
last_song = cur_song;
}