Provide support for 360 VR videos.
https://docs.brightcove.com/en/video-cloud/brightcove-player/guides/360-plugin.html
One thing to note here, is that it seems there are no standardized methods in html5 yet to indicate 360'ishness of videos. So we will require data attribute annotations or something.
A secondary challenge is that you need really high resolution video for this to be somewhat useful, and our pipelines are still somewhat flacky on that front.
Related: T151749: 360 Photo support
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| [WIP] 360 video support | mediawiki/extensions/TimedMediaHandler | master | +52 K -15 |
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Open | None | T133526 Epic saga: immersive hypermedia (Myst for Wikipedia) | |||
| Open | Feature | None | T150624 Support 360 videos | ||
| Open | None | T150640 Support WebM spatial metadata file annotations |
While VideoJS doesn't have native support for spherical video, there is a plugin that adds support: https://github.com/videojs/videojs-vr. The examples at https://videojs-vr.netlify.app/ work well, it has an active maintainer, and it's what Brightcove's current player uses.
This doesn't solve the problem of getting projection metadata from the source media to the player though.
Also @zhuyifei1999 experimented with this for @Eatcha: https://yifeibot.toolforge.org/videojs-vr/examples/eac.html
I've gone through a couple of the videos and i really see 0 indication of any annotations so we'll really need to provide our own I guess. i also doubt this will work icw with ogvjs, but thats something we can live with i think.
What does need to happen is that this metadata does not only have to be added, we also need to pass it into every thumbnail as metadata, so that the player can dynamically lazyload the appropriate module.
Change 787066 had a related patch set uploaded (by TheDJ; author: TheDJ):
[mediawiki/extensions/TimedMediaHandler@master] [WIP] 360 video support
https://twitter.com/dj_hartman/status/1519406694421479426
Video of patch running on my machine for https://commons.wikimedia.org/wiki/File:360_Video_of_LCS-15_Christening_and_Launch.webm
Ideally we'd use CommonsData to add a projection property to a file page, with the projection values.
Then when a page has these properties, we read them during the thumbnail stage (means we have to find the revision content of the page instead of the file)
We encode the values in an HTML attribute:
<video id="mwe_player_0" poster="https://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/360_Video_of_LCS-15_Christening_and_Launch.webm/1024px--360_Video_of_LCS-15_Christening_and_Launch.webm.jpg?20190710204436" controls="" preload="none" width="1024" height="512" data-durationhint="71" data-mwtitle="360_Video_of_LCS-15_Christening_and_Launch.webm" data-mwprovider="local" data-mwprojection="EAC"> <source src="https://upload.wikimedia.org/wikipedia/commons/transcoded/1/1e/360_Video_of_LCS-15_Christening_and_Launch.webm/360_Video_of_LCS-15_Christening_and_Launch.webm.480p.vp9.webm" type="video/webm; codecs="vp9, opus"" data-title="SD VP9 (480P)" data-shorttitle="VP9 480P" data-transcodekey="480p.vp9.webm" data-width="854" data-height="428" data-bandwidth="461672" data-framerate="23.976"/> </source> </video>
The projection info has to be forwarded to the InlinePlayer loader, which will conditionally load the VR plugin and after videojs setup will trigger the vr plugin with the correct projection.
Unfortunately, once more, the terminology for projections seem kinda all over the place. Which is going to make it a bit difficult to create the projection items in Wikidata perhaps :(