From bc3a4ad4be534ecc0be3f0a60c38b1c6754c0b8e Mon Sep 17 00:00:00 2001
From: Emanuele Grande <ema.grandem@gmail.com>
Date: Tue, 8 Jun 2021 19:26:57 +0200
Subject: [PATCH] Volume slider with the number on right

---
 htdocs/index.html | 1 +
 htdocs/js/mpd.js  | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/htdocs/index.html b/htdocs/index.html
index 2ce4669..44527ea 100644
--- a/htdocs/index.html
+++ b/htdocs/index.html
@@ -63,6 +63,7 @@
             <div class="btn btn-toolbar btn-default">
               <span id="volume-icon" class="glyphicon glyphicon-volume-up"></span>
               <div id="volumeslider"></div>
+              <span id="volume-number"></span>
             </div>
           </div>
            <!-- <div class="btn-group" role="group">
diff --git a/htdocs/js/mpd.js b/htdocs/js/mpd.js
index f82e866..ca312a6 100644
--- a/htdocs/js/mpd.js
+++ b/htdocs/js/mpd.js
@@ -491,8 +491,8 @@ function webSocketConnect() {
 
                     var elapsed_minutes = Math.floor(obj.data.elapsedTime / 60);
                     var elapsed_seconds = obj.data.elapsedTime - elapsed_minutes * 60;
-
                     $('#volumeslider').slider(obj.data.volume);
+                    $('#volume-number').text(obj.data.volume+"%")
                     var progress = Math.floor(100*obj.data.elapsedTime/obj.data.totalTime);
                     $('#progressbar').slider(progress);