diff --git a/marietje/marietje/static/css/custom.css b/marietje/marietje/static/css/custom.css
index f5a1514..2971a82 100644
--- a/marietje/marietje/static/css/custom.css
+++ b/marietje/marietje/static/css/custom.css
@@ -5,3 +5,11 @@
.control-icons {
min-width: 90px;
}
+
+.song-info {
+ position: absolute;
+ padding: 8px;
+ background: silver;
+ white-space: nowrap;
+ z-index: 9999;
+}
diff --git a/marietje/marietje/static/js/queue.js b/marietje/marietje/static/js/queue.js
index aa284a5..554b31a 100644
--- a/marietje/marietje/static/js/queue.js
+++ b/marietje/marietje/static/js/queue.js
@@ -48,7 +48,7 @@ $(function () {
});
$('.pagesize').change(function(){
- Cookies.set('pagesize', $(this).val(), { expires: 365 });
+ Cookies.set('pagesize', $(this).val());
$('.pagenum').val(1);
getSongs();
});
@@ -86,6 +86,23 @@ $(function () {
$.post('/api/volumeup', {csrfmiddlewaretoken: csrf_token});
});
+ $(document).on('touchstart', '.artist, .title', function(){
+ $('.song-info').remove();
+ var row = $(this).parent();
+ var timeLeft = row.find('.time-left');
+ var playsAt = row.find('.plays-at');
+ var text = timeLeft[0] ? 'Time Left: ' + timeLeft.text() : 'Plays At: ' + playsAt.text();
+ $('body').append('Requested By: ' + row.find('.requested-by').text() + '
' + text
+ + '');
+ var offset = row.offset();
+ $('.song-info').css('top', offset.top - $(document).scrollTop() + row.height())
+ .css('left', offset.left).css('backgroundColor', '#EEEEEE').width(row.width() - 16);
+ });
+
+ $(document).on('click', '.song-info', function(){
+ $(this).remove();
+ });
+
getSongs();
});
@@ -120,7 +137,7 @@ function updateTime()
iteration = (iteration + 1) % 10;
if (secondsLeft >= 0)
{
- $('.currentsong .timeleft').text(secondsLeft.secondsToHHMMSS());
+ $('.currentsong .time-left').text(secondsLeft.secondsToHHMMSS());
}
// Refresh every ten seconds, or if the song has ended in the last ten
@@ -150,7 +167,7 @@ function refreshQueue()
var requestedBy = currentSong.requested_by;
$('.currentsong .artist').text(currentSong.song.artist);
$('.currentsong .title').text(currentSong.song.title);
- $('.currentsong .requestedby').text(requestedBy);
+ $('.currentsong .requested-by').text(requestedBy);
if (currentSong.can_skip || canSkip)
{
$('#skip').addClass('glyphicon glyphicon-fast-forward');
@@ -168,9 +185,9 @@ function refreshQueue()
var artist = song.song.artist.trim() === '' ? '?' : song.song.artist;
var title = song.song.title.trim() === '' ? '?' : song.song.title;
- $('.queuebody:last-child').append('