Handle equirectangular projections for VR (#2379)

assets/js/player.js

@@ -151,8 +151,13 @@ player.on('error', function (event) {
 // Enable VR video support
 if (video_data.vr && video_data.params.vr_mode) {
     player.crossOrigin("anonymous")
+    switch (video_data.projection_type) {
+        case "EQUIRECTANGULAR":
+            player.vr({projection: "equirectangular"});
+        default: // Should only be "MESH" but we'll use this as a fallback.
             player.vr({projection: "EAC"});
     }
+}
 
 // Add markers
 if (video_data.params.video_start > 0 || video_data.params.video_end > 0) {

src/invidious/videos.cr

@@ -762,7 +762,12 @@ struct Video
   end
 
   def is_vr : Bool?
-    info.dig?("streamingData", "adaptiveFormats", 0, "projectionType").try &.as_s == "MESH"
+    projection_type = info.dig?("streamingData", "adaptiveFormats", 0, "projectionType").try &.as_s
+    return {"EQUIRECTANGULAR", "MESH"}.includes? projection_type
+  end
+
+  def projection_type : String?
+    return info.dig?("streamingData", "adaptiveFormats", 0, "projectionType").try &.as_s
   end
 
   def wilson_score : Float64

src/invidious/views/watch.ecr

@@ -63,7 +63,8 @@ we're going to need to do it here in order to allow for translations.
     "params" => params,
     "preferences" => preferences,
     "premiere_timestamp" => video.premiere_timestamp.try &.to_unix,
-    "vr" => video.is_vr
+    "vr" => video.is_vr,
+    "projection_type" => video.projection_type
 }.to_pretty_json
 %>
 </script>