mirrors/mStream
3
0
Fork 0
mirror of https://github.com/IrosTheBeggar/mStream.git synced 2025-10-27 07:31:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

added song duration to shared page

Browse Source
This commit is contained in:
IrosTheBeggar 2021-02-19 15:59:00 -05:00
parent 59a5c0e08c
commit f4dfbba7be
2 changed files with 27 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
webapp/assets/js/mstream.vue.player.js
View File

@ -12,6 +12,22 @@ const VUEPLAYERCORE = (() => {
lastVol: 100,
},
computed: {
currentTime: function() {
if (!this.playerStats.duration) { return ''; }
const minutes = Math.floor(this.playerStats.currentTime / 60);
const secondsToCalc = Math.floor(this.playerStats.currentTime % 60) + '';
const currentText = minutes + ':' + (secondsToCalc.length < 2 ? '0' + secondsToCalc : secondsToCalc);
return currentText;
},
durationTime: function() {
if (!this.playerStats.duration) { return '0:00'; }
const minutes = Math.floor(this.playerStats.duration / 60);
const secondsToCalc = Math.floor(this.playerStats.duration % 60) + '';
const currentText = minutes + ':' + (secondsToCalc.length < 2 ? '0' + secondsToCalc : secondsToCalc);
return currentText;
},
widthcss: function () {
if (this.playerStats.duration === 0) {
return "width:0";

14
webapp/shared/index.html
View File

@ -115,6 +115,10 @@
margin-top: 30px;
padding-top: 11px
}
.inline-block {
display: inline-block;
}
</style>
</head>
@ -151,9 +155,13 @@
<p><b>Year:</b> {{ (meta.year) ? meta.year : '' }}</p>
</div>
</div>
<div v-on:click.stop="seekTo($event)" id="progressWrapper" ref="progressWrapper">
<div class="progress pointer">
<div class="determinate" :style="widthcss"></div>
<div>
<div class="left inline-block">{{currentTime}}</div>
<div class="right inline-block">{{durationTime}}</div>
<div v-on:click.stop="seekTo($event)" id="progressWrapper" ref="progressWrapper">
<div class="progress pointer">
<div class="determinate" :style="widthcss"></div>
</div>
</div>
</div>
</div>