Add share button

This commit is contained in:
Omar Roth 2018-07-31 13:40:26 -05:00
parent e1391f4ac7
commit b5bbf1b9f2
3 changed files with 57 additions and 1 deletions

View file

@ -430,6 +430,16 @@ get "/watch" do |env|
description = " " description = " "
end 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" thumbnail = "https://i.ytimg.com/vi/#{id}/mqdefault.jpg"
templated "watch" templated "watch"
@ -1357,6 +1367,26 @@ get "/embed/:id" do |env|
next env.redirect url next env.redirect url
end 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" thumbnail = "https://i.ytimg.com/vi/#{id}/mqdefault.jpg"
rendered "embed" rendered "embed"
@ -2810,7 +2840,7 @@ get "/:id" do |env|
params = params.join("&") params = params.join("&")
url = "/watch?v=#{id}" url = "/watch?v=#{id}"
if params if !params.empty?
url += "&#{params}" url += "&#{params}"
end end

View file

@ -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/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/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-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/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/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/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-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> <title><%= video.title %> - Invidious</title>
</head> </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() { var player = videojs('player', options, function() {
this.hotkeys({ this.hotkeys({
volumeStep: 0.1, volumeStep: 0.1,
@ -117,6 +128,8 @@ var player = videojs('player', options, function() {
}); });
}); });
player.share(shareOptions);
<% if video_start > 0 || video_end > 0 %> <% if video_start > 0 || video_end > 0 %>
player.markers({ player.markers({
onMarkerReached: function(marker) { onMarkerReached: function(marker) {

View file

@ -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/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/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-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/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/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/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-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> <title><%= video.title %> - Invidious</title>
<% end %> <% 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() { var player = videojs('player', options, function() {
this.hotkeys({ this.hotkeys({
volumeStep: 0.1, volumeStep: 0.1,
@ -127,6 +138,8 @@ var player = videojs('player', options, function() {
}); });
}); });
player.share(shareOptions);
<% if preferences %> <% if preferences %>
player.volume(<%= preferences.volume.to_f / 100 %>); player.volume(<%= preferences.volume.to_f / 100 %>);
player.playbackRate(<%= preferences.speed %>); player.playbackRate(<%= preferences.speed %>);