Reputation: 543
Why videogular is not displaying the correct start time for the video?For all video it starts from 30:00 which shud be 00:00 and start incrementing as video plays.
<vg-controls>
<vg-play-pause-button></vg-play-pause-button>
<vg-time-display>{{ currentTime | date:'mm:ss' }}</vg-time-display>
<vg-scrub-bar>
<vg-scrub-bar-current-time></vg-scrub-bar-current-time>
</vg-scrub-bar>
<vg-time-display>{{ totalTime | date:'mm:ss' }}</vg-time-display>
<vg-volume>
<vg-mute-button></vg-mute-button>
<vg-volume-bar></vg-volume-bar>
</vg-volume>
<vg-fullscreen-button></vg-fullscreen-button>
</vg-controls>
Here in the image you can see the video is of 62mins but total time shown is 2 mins and current time it is showing 30:12 but only 00:12ss is only played.
Any suggections to achieve this ?Thanks
Upvotes: 2
Views: 1544
Reputation: 3047
Create a function which returns the time in readable format and use that function in vg-time-display tag
html
<vg-time-display>{{ getTimeString(currentTime) }}</vg-time-display>
angular function
$scope.getTimeString = function (duration ){
var seconds = Math.floor((duration / 1000) % 60),
minutes = Math.floor((duration / (1000 * 60)) % 60),
hours = Math.floor((duration / (1000 * 60 * 60)) % 24);
hours = (hours < 10) ? "0" + hours : hours;
minutes = (minutes < 10) ? "0" + minutes : minutes;
seconds = (seconds < 10) ? "0" + seconds : seconds;
var timeInString;
if (hours > 0) {
timeInString = hours + ":" + minutes + ":" + seconds;
} else {
timeInString = minutes + ":" + seconds;
}
return timeInString;
}
Upvotes: 0
Reputation: 7781
Use 'UTC' filter
<vg-time-display>{{ currentTime | date:'mm:ss':'UTC' }}</vg-time-display>
This ll work for all timezones.
Upvotes: 2
Reputation: 925
Videogular is using the date filter.
You need to add the timezone and that's all.
<vg-time-display>{{ currentTime | date:'mm:ss':'+0000' }}</vg-time-display>
Upvotes: 1