diff --git a/approot/mediaplayer.xml b/approot/mediaplayer.xml index b510fc88..bcd52a9c 100644 --- a/approot/mediaplayer.xml +++ b/approot/mediaplayer.xml @@ -14,11 +14,18 @@
-
- - - - +
+
+
+ + + + +
+ +
diff --git a/approot/release.xml b/approot/release.xml index e6445458..14bd076b 100644 --- a/approot/release.xml +++ b/approot/release.xml @@ -8,7 +8,7 @@
-
+
${cover class="Lms-explore-release-cover"}
diff --git a/docroot/css/lms.css b/docroot/css/lms.css index 1315f9b1..e441bcb8 100644 --- a/docroot/css/lms.css +++ b/docroot/css/lms.css @@ -402,7 +402,7 @@ a:hover { } .Lms-player-btn { - font-size: 34px !important; + font-size: 40px !important; cursor: pointer; } @@ -411,11 +411,18 @@ a:hover { } .Lms-player-btn-playpause { - width: 32px; + width: 40px; margin-left: 8px; margin-right: 8px; } +.Lms-player-duration { + line-height: 40px; + text-align: center; + color: darkgrey; + white-space: nowrap; +} + .Lms-player-seek-container { margin-top: 8px; margin-bottom: 8px; diff --git a/docroot/js/mediaplayer.js b/docroot/js/mediaplayer.js index ddb8362f..df20f3cd 100644 --- a/docroot/js/mediaplayer.js +++ b/docroot/js/mediaplayer.js @@ -23,17 +23,13 @@ LMS.mediaplayer = function () { } } - var _durationToString = function (duration, displayHours) { - var hours = parseInt(duration / 3600, 10) % 24; - var minutes = parseInt(duration / 60, 10) % 60; + var _durationToString = function (duration) { + var minutes = parseInt(duration / 60, 10); var seconds = parseInt(duration, 10) % 60; var res = ""; - if (displayHours) - res += (hours < 10 ? "0" + hours : hours) + ":"; - - res += (minutes < 10 ? "0" + minutes : minutes) + ":"; + res += minutes + ":"; res += (seconds < 10 ? "0" + seconds : seconds); return res; @@ -62,6 +58,8 @@ LMS.mediaplayer = function () { _elems.next = document.getElementById("lms-mp-next"); _elems.progress = document.getElementById("lms-mp-progress"); _elems.seek = document.getElementById("lms-mp-seek"); + _elems.curtime = document.getElementById("lms-mp-curtime"); + _elems.duration = document.getElementById("lms-mp-duration"); _elems.play.addEventListener("click", function() { if (_elems.audio.hasAttribute("src")) @@ -94,6 +92,7 @@ LMS.mediaplayer = function () { _elems.audio.addEventListener("timeupdate", function() { _elems.progress.style.width = "" + ((_offset + _elems.audio.currentTime) / _duration) * 100 + "%"; + _elems.curtime.innerHTML = _durationToString(_offset + _elems.audio.currentTime); }); _elems.audio.addEventListener("ended", function() { @@ -111,6 +110,9 @@ LMS.mediaplayer = function () { _elems.seek.max = _duration; _elems.audio.src = _audioSrc; + _elems.curtime.innerHTML = _durationToString(_offset); + _elems.duration.innerHTML = _durationToString(_duration); + if (autoplay) _playTrack(); }