Viewer: Improve playback of videos, animations & live photos

[lastzero]

As a user with many videos, animations and/or live photos, I would like to see the following improvements implemented for the new hybrid photo/video viewer in component/viewer.vue so that I can safely enjoy them in the next stable release:

• Check if there is a more convenient and/or secure way to render the video slide, then perform security tests to ensure that no code can be injected, e.g. create an HTMLVideoElement object, set the properties based on the media type/video duration, and then return it instead of the plain HTML as implemented in the proof-of-concept.
• Live Photos and Animations (e.g. GIFs) should be looped and played automatically (autoplay attribute).
• If the browser can naively handle the video file format, don't default to the AVC video URL, as this may require transcoding, which is slow and resource-intensive. For this, the Util.videoUrl() function has a second argument for the codec (might need to be added to the server response, which is something we can help with).

Additional notes and requirements:

• Live photos, animations and/or videos should NOT loop while a slideshow is running (to be implemented), otherwise you might get stuck on that slide. However, it seems to be a good idea to play them automatically while a slideshow is running (the next slide should only open when the video/animation is finished/paused).
• Be sure to additionally test the Viewer (with all media types) in Library > Originals and in the Places view, as it works with limited data fields to improve query performance. So it's possible that something is missing for media/file types other than regular images.

Once this is released, the following enhancements can be worked on and shipped in a future release:

1. We MAY consider using the .m3u8 file format for specifying the stream URL(s) if it improves the user experience in any way (develop a simple/static proof-of-concept first to see if/how it works).
2. The server SHOULD (additionally) provide a video/animation still from time index 0 that can be used as a poster (the current thumbnail is taken later for longer videos, since the first frame is often black).

Related Issues:

• UX: Add a hybrid Photo/Video Viewer (Lightbox) #1307
• UX: Problems with the display of videos #3372