I have an angular 6 app using videogular2 for running audio files. The component containing the vg-player (the parent component) is part of ngSwitch statement and therefore is а component that can be destroyed.
I need to run audio in background when the view changes. But when the view is changed the holder of the player is destroyed.
I can't change this complex switch logic and can't hide the components.
The only option I see is to display the controls (play, pause, volume and progress bar) of the player in the view but the source of the player to be placed outside of current parent holder component. This way, when the view is destroyed, the audio will remain on background.
So here comes the exact question: Can i create "mock" controls which are synced with the source of the media. There is a singleton service which is holding the whole communication for the player but the main issue I suppose is coming from the progress bar.
- 1 - can I display just the controls of the player without the video tag
<video id="singleVideo"
[muted]="isMuted"
preload="auto"
[vgMedia]="media"
playsinline>
<source [src]="videoSrc" type="video/mp4">
</video>
- 2 - If that is possible can the controls be synced with the source through the service
In summary:
- Is it possible to have several different views (holding just the controls of the player) linked to just one source?
- The source to be placed outside of the views?
- To have synced progress bar?
- If one view is destroyed, the rest to remain and from each view the use to be able to command the media player?
- On certain command all controls to be synced?
Thank you in advance! In my opinion this is very legit use case which deserves to be observed.
