From: eb041592 <35889760+eb041592@users.noreply.github.com> Date: Wed, 4 Apr 2018 17:40:12 +0000 (+0200) Subject: Add queue's total time to panel header. X-Git-Url: http://gitweb.hugovil.com/?a=commitdiff_plain;h=0faf70ad05b90731638c6d760a59a0036ecc6d36;p=ympd.git Add queue's total time to panel header. --- diff --git a/htdocs/index.html b/htdocs/index.html index 6bf5c60..eb3319a 100644 --- a/htdocs/index.html +++ b/htdocs/index.html @@ -81,10 +81,11 @@ <div class="col-md-10 col-xs-12"> <div class="notifications top-right"></div> - + <div class="panel panel-primary"> <!-- Default panel contents --> - <div class="panel-heading"><b id="panel-heading">Queue</b></div> + <div class="panel-heading"><b id="panel-heading">Queue</b> + <b id="panel-heading-info" class="text pull-right"></b></div> <div class="panel-body"> <h1> <span id="track-icon" onclick="clickPlay();" class="glyphicon glyphicon-play"></span> @@ -218,7 +219,7 @@ <h5>ympd uses following excellent software:</h5> <h6><a href="http://cesanta.com/docs.html">Mongoose</a> <small>GPLv2</small></h6> <h6><a href="http://www.musicpd.org/libs/libmpdclient/">libMPDClient</a> <small>BSD License</small></h6> - <hr /> + <hr /> <div class="row"> <div class="form-group col-md-6"> <button type="button" class="btn btn-default btn-block" onclick="updateDB();"> @@ -296,7 +297,7 @@ </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> - + <div class="modal fade" id="savequeue" tabindex="-1" role="dialog" aria-labelledby="savequeueLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> diff --git a/htdocs/js/mpd.js b/htdocs/js/mpd.js index ce2fd8e..5112874 100644 --- a/htdocs/js/mpd.js +++ b/htdocs/js/mpd.js @@ -222,6 +222,18 @@ function webSocketConnect() { if(current_app !== 'queue') break; + if (obj.totalTime > 0) { + var hours = Math.floor(obj.totalTime / 3600); + var minutes = Math.floor(obj.totalTime / 60) - hours * 60; + var seconds = obj.totalTime - hours * 3600 - minutes * 60; + + $('#panel-heading-info').text('Total: ' + + (hours > 0 ? hours + '\u2009h ' + (minutes < 10 ? '0' : '') : '') + + minutes + '\u2009m ' + (seconds < 10 ? '0' : '') + seconds + '\u2009s'); + } else { + $('#panel-heading-info').empty(); + } + $('#salamisandwich > tbody').empty(); for (var song in obj.data) { var minutes = Math.floor(obj.data[song].duration / 60);