Merge branch 'master' into patch-1

src/invidious/views/components/feed_menu.ecr

@@ -1,19 +1,11 @@
-<div class="h-box pure-g">
-    <div class="pure-u-1 pure-u-md-1-4"></div>
-    <div class="pure-u-1 pure-u-md-1-2">
-        <div class="pure-g">
-            <% feed_menu = env.get("preferences").as(Preferences).feed_menu.dup %>
-            <% if !env.get?("user") %>
-                <% feed_menu.reject! {|item| {"Subscriptions", "Playlists"}.includes? item} %>
-            <% end %>
-            <% feed_menu.each do |feed| %>
-                <div class="pure-u-1-2 pure-u-md-1-<%= feed_menu.size %>">
-                    <a href="/feed/<%= feed.downcase %>" class="pure-menu-heading" style="text-align:center">
-                        <%= translate(locale, feed) %>
-                    </a>
-                </div>
-            <% end %>
-        </div>
-    </div>
-    <div class="pure-u-1 pure-u-md-1-4"></div>
+<div class="feed-menu">
+    <% feed_menu = env.get("preferences").as(Preferences).feed_menu.dup %>
+    <% if !env.get?("user") %>
+        <% feed_menu.reject! {|item| {"Subscriptions", "Playlists"}.includes? item} %>
+    <% end %>
+    <% feed_menu.each do |feed| %>
+        <a href="/feed/<%= feed.downcase %>" class="feed-menu-item pure-menu-heading">
+            <%= translate(locale, feed) %>
+        </a>
+    <% end %>
 </div>

src/invidious/views/components/item.ecr

@@ -44,7 +44,7 @@
                         <% end %>
                     </div>
                 <% end %>
-                <p><%= item.title %></p>
+                <p><%= HTML.escape(item.title) %></p>
             </a>
             <p>
                 <b>
@@ -57,10 +57,10 @@
                     <div class="thumbnail">
                         <img class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg"/>
                         <% if plid = env.get?("remove_playlist_items") %>
-                            <form onsubmit="return false" action="/playlist_ajax?action_remove_video=1&set_video_id=<%= item.index %>&playlist_id=<%= plid %>&referer=<%= env.get("current_page") %>" method="post">
+                            <form data-onsubmit="return_false" action="/playlist_ajax?action_remove_video=1&set_video_id=<%= item.index %>&playlist_id=<%= plid %>&referer=<%= env.get("current_page") %>" method="post">
                                 <input type="hidden" name="csrf_token" value="<%= URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "") %>">
                                 <p class="watched">
-                                    <a onclick="remove_playlist_item(this)" data-index="<%= item.index %>" data-plid="<%= plid %>" href="javascript:void(0)">
+                                    <a data-onclick="remove_playlist_item" data-index="<%= item.index %>" data-plid="<%= plid %>" href="javascript:void(0)">
                                         <button type="submit" style="all:unset">
                                             <i class="icon ion-md-trash"></i>
                                         </button>
@@ -76,7 +76,7 @@
                         <% end %>
                     </div>
                 <% end %>
-                <p><a href="/watch?v=<%= item.id %>"><%= item.title %></a></p>
+                <p><a href="/watch?v=<%= item.id %>"><%= HTML.escape(item.title) %></a></p>
             </a>
             <p>
                 <b>
@@ -85,7 +85,7 @@
             </p>
 
             <h5 class="pure-g">
-                <% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp && item.premiere_timestamp.not_nil! > Time.utc %>
+                <% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp.try &.> Time.utc %>
                     <div class="pure-u-2-3"><%= translate(locale, "Premieres in `x`", recode_date((item.premiere_timestamp.as(Time) - Time.utc).ago, locale)) %></div>
                 <% elsif Time.utc - item.published > 1.minute %>
                     <div class="pure-u-2-3"><%= translate(locale, "Shared `x` ago", recode_date(item.published, locale)) %></div>
@@ -103,13 +103,12 @@
                     <div class="thumbnail">
                         <img class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg"/>
                         <% if env.get? "show_watched" %>
-                            <form onsubmit="return false" action="/watch_ajax?action_mark_watched=1&id=<%= item.id %>&referer=<%= env.get("current_page") %>" method="post">
+                            <form data-onsubmit="return_false" action="/watch_ajax?action_mark_watched=1&id=<%= item.id %>&referer=<%= env.get("current_page") %>" method="post">
                                 <input type="hidden" name="csrf_token" value="<%= URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "") %>">
                                 <p class="watched">
-                                    <a onclick="mark_watched(this)" data-id="<%= item.id %>" href="javascript:void(0)">
+                                    <a data-onclick="mark_watched" data-id="<%= item.id %>" href="javascript:void(0)">
                                         <button type="submit" style="all:unset">
-                                            <i onmouseenter='this.setAttribute("class", "icon ion-ios-eye-off")'
-                                                onmouseleave='this.setAttribute("class", "icon ion-ios-eye")'
+                                            <i data-mouse="switch_classes" data-switch-classes="ion-ios-eye-off,ion-ios-eye"
                                                 class="icon ion-ios-eye">
                                             </i>
                                         </button>
@@ -117,10 +116,10 @@
                                 </p>
                             </form>
                         <% elsif plid = env.get? "add_playlist_items" %>
-                            <form onsubmit="return false" action="/playlist_ajax?action_add_video=1&video_id=<%= item.id %>&playlist_id=<%= plid %>&referer=<%= env.get("current_page") %>" method="post">
+                            <form data-onsubmit="return_false" action="/playlist_ajax?action_add_video=1&video_id=<%= item.id %>&playlist_id=<%= plid %>&referer=<%= env.get("current_page") %>" method="post">
                                 <input type="hidden" name="csrf_token" value="<%= URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "") %>">
                                 <p class="watched">
-                                    <a onclick="add_playlist_item(this)" data-id="<%= item.id %>" data-plid="<%= plid %>" href="javascript:void(0)">
+                                    <a data-onclick="add_playlist_item" data-id="<%= item.id %>" data-plid="<%= plid %>" href="javascript:void(0)">
                                         <button type="submit" style="all:unset">
                                             <i class="icon ion-md-add"></i>
                                         </button>
@@ -137,7 +136,7 @@
                     </div>
                 </a>
             <% end %>
-            <p><a href="/watch?v=<%= item.id %>"><%= item.title %></a></p>
+            <p><a href="/watch?v=<%= item.id %>"><%= HTML.escape(item.title) %></a></p>
             <p style="display: flex;">
                 <b style="flex: 1;">
                     <a style="width:100%" href="/channel/<%= item.ucid %>"><%= item.author %></a>
@@ -148,7 +147,7 @@
             </p>
 
             <h5 class="pure-g">
-                <% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp && item.premiere_timestamp.not_nil! > Time.utc %>
+                <% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp.try &.> Time.utc %>
                     <div class="pure-u-2-3"><%= translate(locale, "Premieres in `x`", recode_date((item.premiere_timestamp.as(Time) - Time.utc).ago, locale)) %></div>
                 <% elsif Time.utc - item.published > 1.minute %>
                     <div class="pure-u-2-3"><%= translate(locale, "Shared `x` ago", recode_date(item.published, locale)) %></div>

src/invidious/views/components/player.ecr

@@ -1,28 +1,25 @@
-<video style="outline:none;width:100%;background-color:#000" playsinline poster="<%= thumbnail %>" title="<%= HTML.escape(video.title) %>"
-    id="player" class="video-js player-style-<%= params.player_style %>"
-    onmouseenter='this["data-title"]=this["title"];this["title"]=""'
-    onmouseleave='this["title"]=this["data-title"];this["data-title"]=""'
-    oncontextmenu='this["title"]=this["data-title"]'
+<video style="outline:none;width:100%;background-color:#000" playsinline poster="<%= thumbnail %>"
+    id="player" class="on-video_player video-js player-style-<%= params.player_style %>"
     <% if params.autoplay %>autoplay<% end %>
     <% if params.video_loop %>loop<% end %>
     <% if params.controls %>controls<% end %>>
-    <% if hlsvp && !CONFIG.disabled?("livestreams") %>
-        <source src="<%= hlsvp %>?local=true" type="application/x-mpegURL" label="livestream">
+    <% if (hlsvp = video.hls_manifest_url) && !CONFIG.disabled?("livestreams") %>
+        <source src="<%= URI.parse(hlsvp).full_path %>?local=true" type="application/x-mpegURL" label="livestream">
     <% else %>
         <% if params.listen %>
             <% audio_streams.each_with_index do |fmt, i| %>
-                <source src="/latest_version?id=<%= video.id %>&itag=<%= fmt["itag"] %><% if params.local %>&local=true<% end %>" type='<%= fmt["type"] %>' label="<%= fmt["bitrate"] %>k" selected="<%= i == 0 ? true : false %>">
+                <source src="/latest_version?id=<%= video.id %>&itag=<%= fmt["itag"] %><% if params.local %>&local=true<% end %>" type='<%= fmt["mimeType"] %>' label="<%= fmt["bitrate"] %>k" selected="<%= i == 0 ? true : false %>">
             <% end %>
           <% else %>
             <% if params.quality == "dash" %>
-                <source src="/api/manifest/dash/id/<%= video.id %>?local=true" type='application/dash+xml' label="dash">
+                <source src="/api/manifest/dash/id/<%= video.id %>?local=true&unique_res=1" type='application/dash+xml' label="dash">
             <% end %>
 
             <% fmt_stream.each_with_index do |fmt, i| %>
                 <% if params.quality %>
-                    <source src="/latest_version?id=<%= video.id %>&itag=<%= fmt["itag"] %><% if params.local %>&local=true<% end %>" type='<%= fmt["type"] %>' label="<%= fmt["label"] %>" selected="<%= params.quality == fmt["label"].split(" - ")[0] %>">
+                    <source src="/latest_version?id=<%= video.id %>&itag=<%= fmt["itag"] %><% if params.local %>&local=true<% end %>" type='<%= fmt["mimeType"] %>' label="<%= fmt["quality"] %>" selected="<%= params.quality == fmt["quality"] %>">
                 <% else %>
-                    <source src="/latest_version?id=<%= video.id %>&itag=<%= fmt["itag"] %><% if params.local %>&local=true<% end %>" type='<%= fmt["type"] %>' label="<%= fmt["label"] %>" selected="<%= i == 0 ? true : false %>">
+                    <source src="/latest_version?id=<%= video.id %>&itag=<%= fmt["itag"] %><% if params.local %>&local=true<% end %>" type='<%= fmt["mimeType"] %>' label="<%= fmt["quality"] %>" selected="<%= i == 0 ? true : false %>">
                 <% end %>
             <% end %>
         <% end %>
@@ -39,12 +36,14 @@
     <% end %>
 </video>
 
-<script>
-var player_data = {
-    aspect_ratio: '<%= aspect_ratio %>',
-    title: "<%= video.title.dump_unquoted %>",
-    description: "<%= HTML.escape(video.short_description) %>",
-    thumbnail: "<%= thumbnail %>"
-}
+<script id="player_data" type="application/json">
+<%=
+{
+    "aspect_ratio" => aspect_ratio,
+    "title" => video.title,
+    "description" => HTML.escape(video.short_description),
+    "thumbnail" => thumbnail
+}.to_pretty_json
+%>
 </script>
 <script src="/js/player.js?v=<%= ASSET_COMMIT %>"></script>

src/invidious/views/components/player_sources.ecr

@@ -3,6 +3,8 @@
 <link rel="stylesheet" href="/css/videojs.markers.min.css?v=<%= ASSET_COMMIT %>">
 <link rel="stylesheet" href="/css/videojs-share.css?v=<%= ASSET_COMMIT %>">
 <link rel="stylesheet" href="/css/videojs-vtt-thumbnails.css?v=<%= ASSET_COMMIT %>">
+<link rel="stylesheet" href="/css/videojs-vtt-thumbnails-fix.css?v=<%= ASSET_COMMIT %>">
+<script src="/js/global.js?v=<%= ASSET_COMMIT %>"></script>
 <script src="/js/video.min.js?v=<%= ASSET_COMMIT %>"></script>
 <script src="/js/videojs-contrib-quality-levels.min.js?v=<%= ASSET_COMMIT %>"></script>
 <script src="/js/videojs-http-source-selector.min.js?v=<%= ASSET_COMMIT %>"></script>

src/invidious/views/components/subscribe_widget.ecr

@@ -19,15 +19,17 @@
         </p>
     <% end %>
 
-    <script>
-    var subscribe_data = {
-        ucid: '<%= ucid %>',
-        author: '<%= HTML.escape(author) %>',
-        sub_count_text: '<%= HTML.escape(sub_count_text) %>',
-        csrf_token: '<%= URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "") %>',
-        subscribe_text: '<%= HTML.escape(translate(locale, "Subscribe")) %>',
-        unsubscribe_text: '<%= HTML.escape(translate(locale, "Unsubscribe")) %>'
-    }
+    <script id="subscribe_data" type="application/json">
+    <%=
+    {
+        "ucid" => ucid,
+        "author" => HTML.escape(author),
+        "sub_count_text" => HTML.escape(sub_count_text),
+        "csrf_token" => URI.encode_www_form(env.get?("csrf_token").try &.as(String) || ""),
+        "subscribe_text" => HTML.escape(translate(locale, "Subscribe")),
+        "unsubscribe_text" => HTML.escape(translate(locale, "Unsubscribe"))
+    }.to_pretty_json
+    %>
     </script>
     <script src="/js/subscribe_widget.js?v=<%= ASSET_COMMIT %>"></script>
 <% else %>