As a part of refactoring the project (#51) we'll want to start using this new UI.
When first opening the video player
Due to browser restrictions, we can't autoplay a video with audio when the page is first loaded. The user has to actively click on a button before we can start playing video with audio. This is how the current sync site works, however we want the play button to be more prominent with a blur effect on the background.
The play button should be grey by default and blue on hover.
After clicking the play button
After clicking on the play button, the controls will appear and the video should start playing.
Here are all of the icons used in the new design:
SVG icons.zip
Playlist sidebar
For now don't worry about implementing the playlist sidebar. You can make the HTML / CSS for the sidebar if you want, however the backend is going to need to be updated to send playlist information. Additionally, we may want to hide the names of files in the playlist until they have started playing to prevent spoilers. Or we might want to hide the playlist sidebar entirely unless you are an admin.
As a part of refactoring the project (#51) we'll want to start using this new UI.
When first opening the video player
Due to browser restrictions, we can't autoplay a video with audio when the page is first loaded. The user has to actively click on a button before we can start playing video with audio. This is how the current sync site works, however we want the play button to be more prominent with a blur effect on the background.
The play button should be grey by default and blue on hover.
After clicking the play button
After clicking on the play button, the controls will appear and the video should start playing.
Here are all of the icons used in the new design:
SVG icons.zip
Playlist sidebar
For now don't worry about implementing the playlist sidebar. You can make the HTML / CSS for the sidebar if you want, however the backend is going to need to be updated to send playlist information. Additionally, we may want to hide the names of files in the playlist until they have started playing to prevent spoilers. Or we might want to hide the playlist sidebar entirely unless you are an admin.