sebclem/ClaptrapBot
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases 1 Wiki Activity

Adding duration on web page

Browse Source
This commit is contained in:
BrokenFire 2018-01-08 10:46:24 +01:00
parent 2e9abd58a9
commit f5e83ce1cf
2 changed files with 10 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/main/resources/static/js/init.js
View File

@ -122,6 +122,8 @@ function getCurentMusic() {
} }
$('#music_img').attr("src","/img/no_music.jpg"); $('#music_img').attr("src","/img/no_music.jpg");
$('#total_time').text("00:00");
$('#current_time').text("00:00");
break; break;
@ -258,6 +260,9 @@ function updateControl(data){
} }
$('#music_img').attr("src","https://img.youtube.com/vi/"+data.info.identifier+"/hqdefault.jpg"); $('#music_img').attr("src","https://img.youtube.com/vi/"+data.info.identifier+"/hqdefault.jpg");
console.log(data);
$('#total_time').text(msToTime(data.info.length));
$('#current_time').text(msToTime(data.currentPos));
updateModal(data); updateModal(data);
} }

6
src/main/resources/templates/music.html
View File

@ -45,11 +45,15 @@
<img class="responsive-img z-depth-3" id="music_img" style="max-width: 30%" src=""/> <img class="responsive-img z-depth-3" id="music_img" style="max-width: 30%" src=""/>
</div> </div>
<h4 class="center" id="music_text"></h4> <h4 class="center" id="music_text"></h4>
<div class="row center"> <div class="row center" style="margin-bottom: 0px">
<div class="progress col s6 offset-s3 z-depth-3"> <div class="progress col s6 offset-s3 z-depth-3">
<div class="determinate" id="music_progress" style="width: 0%"></div> <div class="determinate" id="music_progress" style="width: 0%"></div>
</div> </div>
</div> </div>
<div class="row center">
<div class="col s2 offset-s3 left-align" style="padding: 0px" id="current_time">0:00</div>
<div class="col s2 offset-s2 right-align " style="padding: 0px" id="total_time">0:00</div>
</div>
<div class="row center"> <div class="row center">
<div class="col s2 offset-s3 center"> <div class="col s2 offset-s3 center">
<a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_stop"> <a class="btn-large blue-grey darken-4 z-depth-3 waves-effect waves-light" id="btn_stop">