feat: Implements a progress bar on external video for viewers.

[gabriellpr]

The viewer can't see if the shared video is ending or in the middle.

This PR adds a progress bar for the viewers, so they can follow the progress of the video.

[antobinary]

Hi @gabriellpr ! Thank you for your first contribution!
@TiagoJacobs we don't need a CLA, right?

[TiagoJacobs]

Hi @gabriellpr ! Thank you for your first contribution! @TiagoJacobs we don't need a CLA, right?

Hello @antobinary - it's right, as @gabriellpr is a member of iMDT team (and this work was done during working hours), it's covered as a iMDT contribution - all good!

[prlanzarin]

Have you considered making the progress bar visible only on hover (desktop)/touch (mobile)?
That would make it consistent with the current volume control and some common players on web browsers (eg youtube, vimeo).

[gabriellpr]

Thanks for the suggestion, I will implement it and remove the white space.

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[prlanzarin]

@gabriellpr I see you implemented the hover suggestion.
There's one caveat with the chosen approach (css hover etc): it only applies to desktop endpoints. The progress bar is still always visible on mobile endpoints.

My suggestion is to use the same hover/touch implementation as the other stuff (volume slider, full screen button, reload button) by moving the progress bar HTML block inside the hover-toolbar-external-video div. Further adjustments to the progressBar's style will probably be necessary if that's done.

That being said it can be adjusted in a subsequent PR if need be, not a real blocker IMO.

[antobinary]

Let's do the iteration on 2.5+