Add share button

3 files changed, 57 insertions, 1 deletions

diff --git a/src/invidious.cr b/src/invidious.cr
index 778556ba..4b18f681 100644
--- a/src/invidious.cr
+++ b/src/invidious.cr
@@ -430,6 +430,16 @@ get "/watch" do |env|
     description = " "
   end
 
+  if Kemal.config.ssl || CONFIG.https_only
+    scheme = "https://"
+  else
+    scheme = "http://"
+  end
+  host = env.request.headers["Host"]
+  host_url = "#{scheme}#{host}"
+  host_params = env.request.query_params
+  host_params.delete_all("v")
+
   thumbnail = "https://i.ytimg.com/vi/#{id}/mqdefault.jpg"
 
   templated "watch"
@@ -1357,6 +1367,26 @@ get "/embed/:id" do |env|
     next env.redirect url
   end
 
+  video.description = fill_links(video.description, "https", "www.youtube.com")
+  video.description = add_alt_links(video.description)
+
+  description = video.description.gsub("<br>", " ")
+  description = description.gsub("<br/>", " ")
+  description = XML.parse_html(description).content[0..200].gsub('"', "&quot;").gsub("\n", " ").strip(" ")
+  if description.empty?
+    description = " "
+  end
+
+  if Kemal.config.ssl || CONFIG.https_only
+    scheme = "https://"
+  else
+    scheme = "http://"
+  end
+  host = env.request.headers["Host"]
+  host_url = "#{scheme}#{host}"
+  host_params = env.request.query_params
+  host_params.delete_all("v")
+
   thumbnail = "https://i.ytimg.com/vi/#{id}/mqdefault.jpg"
 
   rendered "embed"
@@ -2810,7 +2840,7 @@ get "/:id" do |env|
     params = params.join("&")
 
     url = "/watch?v=#{id}"
-    if params
+    if !params.empty?
       url += "&#{params}"
     end
 
diff --git a/src/invidious/views/embed.ecr b/src/invidious/views/embed.ecr
index 82e5070a..f3613247 100644
--- a/src/invidious/views/embed.ecr
+++ b/src/invidious/views/embed.ecr
@@ -8,10 +8,12 @@
 <link rel="stylesheet" href="https://unpkg.com/video.js@6.10.3/dist/video-js.min.css">
 <link rel="stylesheet" href="https://unpkg.com/silvermine-videojs-quality-selector@1.1.2/dist/css/quality-selector.css">
 <link rel="stylesheet" href="https://unpkg.com/videojs-markers@1.0.1/dist/videojs.markers.min.css">
+<link rel="stylesheet" href="https://unpkg.com/videojs-share@1.1.0/dist/videojs-share.css">
 <script src="https://unpkg.com/video.js@6.10.3/dist/video.min.js"></script>
 <script src="https://unpkg.com/videojs-hotkeys@0.2.21/videojs.hotkeys.min.js"></script>
 <script src="https://unpkg.com/silvermine-videojs-quality-selector@1.1.2/dist/js/silvermine-videojs-quality-selector.min.js"></script>
 <script src="https://unpkg.com/videojs-markers@1.0.1/dist/videojs-markers.min.js"></script>
+<script src="https://unpkg.com/videojs-share@1.1.0/dist/videojs-share.min.js"></script>
 <title><%= video.title %> - Invidious</title>
 </head>
 
@@ -76,6 +78,15 @@ var options = {
    },
 };
 
+var shareOptions = {
+  socials: ["fb", "tw", "reddit", "mail"],
+
+  url: "<%= host_url %>/<%= video.id %>?<%= host_params %>",
+  title: "<%= video.title %>",
+  description: "<%= description %>",
+  image: '<%= thumbnail %>'
+};
+
 var player = videojs('player', options, function() {
     this.hotkeys({
     volumeStep: 0.1,
@@ -117,6 +128,8 @@ var player = videojs('player', options, function() {
   });
 });
 
+player.share(shareOptions);
+
 <% if video_start > 0 || video_end > 0 %>
 player.markers({
     onMarkerReached: function(marker) {
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index 8a9ef978..6cbcb19f 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -25,10 +25,12 @@
 <link rel="stylesheet" href="https://unpkg.com/video.js@6.10.3/dist/video-js.min.css">
 <link rel="stylesheet" href="https://unpkg.com/silvermine-videojs-quality-selector@1.1.2/dist/css/quality-selector.css">
 <link rel="stylesheet" href="https://unpkg.com/videojs-markers@1.0.1/dist/videojs.markers.min.css">
+<link rel="stylesheet" href="https://unpkg.com/videojs-share@1.1.0/dist/videojs-share.css">
 <script src="https://unpkg.com/video.js@6.10.3/dist/video.min.js"></script>
 <script src="https://unpkg.com/videojs-hotkeys@0.2.21/videojs.hotkeys.min.js"></script>
 <script src="https://unpkg.com/silvermine-videojs-quality-selector@1.1.2/dist/js/silvermine-videojs-quality-selector.min.js"></script>
 <script src="https://unpkg.com/videojs-markers@1.0.1/dist/videojs-markers.min.js"></script>
+<script src="https://unpkg.com/videojs-share@1.1.0/dist/videojs-share.min.js"></script>
 <title><%= video.title %> - Invidious</title>
 <% end %>
 
@@ -86,6 +88,15 @@ var options = {
    },
 };
 
+var shareOptions = {
+  socials: ["fb", "tw", "reddit", "mail"],
+
+  url: "<%= host_url %>/<%= video.id %>?<%= host_params %>",
+  title: "<%= video.title %>",
+  description: "<%= description %>",
+  image: '<%= thumbnail %>'
+};
+
 var player = videojs('player', options, function() {
     this.hotkeys({
     volumeStep: 0.1,
@@ -127,6 +138,8 @@ var player = videojs('player', options, function() {
   });
 });
 
+player.share(shareOptions);
+
 <% if preferences %>
 player.volume(<%= preferences.volume.to_f / 100 %>);
 player.playbackRate(<%= preferences.speed %>);