Added music player selection highlights

This commit is contained in:
Gregory Ballantine
2016-11-28 16:51:29 -05:00
parent 711ed2c6e7
commit 6a0ad62887
5 changed files with 67 additions and 45 deletions

View File

@ -645,13 +645,17 @@ body {
transition: background, 200ms; }
.now-playing-list li:hover,
.music-list ol li:hover {
background: #f0f0f0; }
background: #f0f0f0;
cursor: pointer; }
.now-playing-list li:hover a,
.music-list ol li:hover a {
color: #e51400; }
.now-playing-list li.selected,
.music-list ol li.selected {
background: #e0e0e0; }
.now-playing-list li.selected a,
.music-list ol li.selected a {
color: #e51400; }
.now-playing-list li,
.now-playing-list a,
.music-list ol li,

View File

@ -4,11 +4,25 @@ $(document).ready(function() {
player = $('#music-player').get(0);
$('.now-playing-list .music-track').on('click', function() {
// change the audio source
changeAudioSources(this);
// change selected track
changeSelectedTrack(this);
});
});
function changeSelectedTrack(trackElem) {
var oldSelected = $('.now-playing-list .music-track.selected');
var newSelected = $(trackElem);
if (oldSelected.data('trackid') != newSelected.data('trackid')) {
// remove selected class from the old element and add it to the new one
oldSelected.removeClass('selected');
newSelected.addClass('selected');
// now change the audio sources
changeAudioSources(trackElem);
}
}
function changeAudioSources(trackElem) {
trackElem = $(trackElem);
var playerSources = $('#music-player source');