polifonia-project / sonar2021_demo

This repository is created for the documentation of the Polifonia demo that is going to be presented to SONAR2021
https://polifonia-project.github.io/sonar2021_demo/
2 stars 0 forks source link

display video progress #67

Closed phivk closed 2 years ago

phivk commented 2 years ago

@JaseMK via email:

One addition that has been on my mind for a while but I’ve not had time to look at is a live timer readout for the currently playing video. Perhaps under the video – next to the player controls or under them, I’m not sure, we could have a clock (or Bootstrap progress bar) that shows the current play time. As we’ve disabled the YouTube player controls, there’s currently no indication of how far through a song we are.

On the video component (video.component.ts) there is a ‘this.currentPlayTime’ variable that just tracks the current play time in seconds. This would need to be formatted into a minutes:seconds type string I guess, for rendering. If you do want to work on this, just create a ‘feature/time-readout’ branch (or similar) and then it can be merged back in with a PR when done.

There is also a function in that component – ‘tick()’ – that gets called every 0.5 seconds and updates the play time. If you had some routine to generate a custom formatted time string, you could call it from in there.

Within that component, you can access the YouTube Player API via the ‘this.youtubePlayer’ object, so for example can get the total duration of a song using ‘this.youtubePlayer.getDuration()’. Full YouTube Player API specs here:

https://developers.google.com/youtube/iframe_api_reference#Retrieving_video_information

phivk commented 2 years ago

fixed via https://github.com/polifonia-project/sonar2021_demo/commit/5a59b2695d37534c9b4433c407cd99a1b640ee5c

can be reopened in case there is a need for a more custom solution