Merge pull request #55 from omarroth/share-button

Add share button and markers
pull/66/head
Omar Roth 6 years ago committed by GitHub
commit cdd644ded7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -287,7 +287,7 @@ get "/watch" do |env|
subscriptions ||= [] of String subscriptions ||= [] of String
autoplay = env.params.query["autoplay"]?.try &.to_i autoplay = env.params.query["autoplay"]?.try &.to_i
video_loop = env.params.query["video_loop"]?.try &.to_i video_loop = env.params.query["loop"]?.try &.to_i
if preferences if preferences
autoplay ||= preferences.autoplay.to_unsafe autoplay ||= preferences.autoplay.to_unsafe
@ -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"
@ -1287,6 +1297,10 @@ get "/embed/:id" do |env|
video_loop = env.params.query["loop"]?.try &.to_i video_loop = env.params.query["loop"]?.try &.to_i
video_loop ||= 0 video_loop ||= 0
autoplay = autoplay == 1
video_loop = video_loop == 1
controls = controls == 1
begin begin
video = get_video(id, PG_DB) video = get_video(id, PG_DB)
rescue ex rescue ex
@ -1294,6 +1308,20 @@ get "/embed/:id" do |env|
next templated "error" next templated "error"
end end
if video.info["hlsvp"]?
hlsvp = video.info["hlsvp"]
if Kemal.config.ssl || CONFIG.https_only
scheme = "https://"
else
scheme = "http://"
end
host = env.request.headers["Host"]
url = "#{scheme}#{host}"
hlsvp = hlsvp.gsub("https://manifest.googlevideo.com", url)
end
fmt_stream = [] of HTTP::Params fmt_stream = [] of HTTP::Params
video.info["url_encoded_fmt_stream_map"].split(",") do |string| video.info["url_encoded_fmt_stream_map"].split(",") do |string|
if !string.empty? if !string.empty?
@ -1339,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"
@ -2792,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

@ -891,16 +891,16 @@ def decode_time(string)
time = string.try &.to_f? time = string.try &.to_f?
if !time if !time
hours = /(?<hours>\d+)h/.match(string).try &.["hours"].try &.to_i hours = /(?<hours>\d+)h/.match(string).try &.["hours"].try &.to_f
hours ||= 0 hours ||= 0
minutes = /(?<minutes>\d+)m(?!s)/.match(string).try &.["minutes"].try &.to_i minutes = /(?<minutes>\d+)m(?!s)/.match(string).try &.["minutes"].try &.to_f
minutes ||= 0 minutes ||= 0
seconds = /(?<seconds>\d+)s/.match(string).try &.["seconds"].try &.to_i seconds = /(?<seconds>\d+)s/.match(string).try &.["seconds"].try &.to_f
seconds ||= 0 seconds ||= 0
millis = /(?<millis>\d+)ms/.match(string).try &.["millis"].try &.to_i millis = /(?<millis>\d+)ms/.match(string).try &.["millis"].try &.to_f
millis ||= 0 millis ||= 0
time = hours * 3600 + minutes * 60 + seconds + millis / 1000 time = hours * 3600 + minutes * 60 + seconds + millis / 1000
@ -909,10 +909,12 @@ def decode_time(string)
return time return time
end end
def decode_date(date : String) def decode_date(string : String)
# Time matches format "20 hours ago", "40 minutes ago"... # Time matches format "20 hours ago", "40 minutes ago"...
delta = date.split(" ")[0].to_i date = string.split(" ")[-3, 3]
case date delta = date[0].to_i
case date[1]
when .includes? "minute" when .includes? "minute"
delta = delta.minutes delta = delta.minutes
when .includes? "hour" when .includes? "hour"
@ -926,7 +928,7 @@ def decode_date(date : String)
when .includes? "year" when .includes? "year"
delta = delta.years delta = delta.years
else else
raise "Could not parse #{date}" raise "Could not parse #{string}"
end end
return Time.now - delta return Time.now - delta

@ -7,10 +7,13 @@
<meta name="thumbnail" content="<%= thumbnail %>"> <meta name="thumbnail" content="<%= thumbnail %>">
<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-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-offset@2.0.0-beta.2/dist/videojs-offset.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>
@ -29,23 +32,31 @@ video, #my_video, .video-js, .vjs-default-skin
} }
</style> </style>
<% if hlsvp %>
<script src="https://unpkg.com/videojs-contrib-hls@5.14.1/dist/videojs-contrib-hls.min.js"></script>
<% end %>
<video playsinline poster="<%= thumbnail %>" title="<%= HTML.escape(video.title) %>" id="player" <video playsinline poster="<%= thumbnail %>" title="<%= HTML.escape(video.title) %>" id="player"
<% if autoplay == 1 %>autoplay<% end %> <% if autoplay %>autoplay<% end %>
<% if controls == 1 %>controls<% end %> <% if controls %>controls<% end %>
<% if video_loop == 1 %>loop<% end %> <% if video_loop %>loop<% end %>
class="video-js vjs-default-skin"> class="video-js vjs-default-skin">
<% if listen %> <% if hlsvp %>
<% audio_streams.each_with_index do |fmt, i| %> <source src="<%= hlsvp %>" type="application/x-mpegURL">
<source src="<%= fmt["url"] %>" type='<%= fmt["type"] %>' label="<%= fmt["bitrate"] %>k" selected="<%= i == 0 ? true : false %>">
<% end %>
<% else %> <% else %>
<% fmt_stream.each_with_index do |fmt, i| %> <% if listen %>
<% if quality != "hd720" %> <% audio_streams.each_with_index do |fmt, i| %>
<source src="<%= fmt["url"] %>" type='<%= fmt["type"] %>' label="<%= fmt["label"] %>" selected="<%= quality == fmt["label"].split(" - ")[0] %>"> <source src="<%= fmt["url"] %>" type='<%= fmt["type"] %>' label="<%= fmt["bitrate"] %>k" selected="<%= i == 0 ? true : false %>">
<% else %>
<source src="<%= fmt["url"] %>" type='<%= fmt["type"] %>' label="<%= fmt["label"] %>" selected="<%= i == 0 ? true : false %>">
<% end %> <% end %>
<% end %> <% else %>
<% fmt_stream.each_with_index do |fmt, i| %>
<% if quality != "hd720" %>
<source src="<%= fmt["url"] %>" type='<%= fmt["type"] %>' label="<%= fmt["label"] %>" selected="<%= quality == fmt["label"].split(" - ")[0] %>">
<% else %>
<source src="<%= fmt["url"] %>" type='<%= fmt["type"] %>' label="<%= fmt["label"] %>" selected="<%= i == 0 ? true : false %>">
<% end %>
<% end %>
<% end %>
<% end %> <% end %>
</video> </video>
@ -59,18 +70,28 @@ var options = {
'volumePanel', 'volumePanel',
'progressControl', 'progressControl',
'remainingTimeDisplay', 'remainingTimeDisplay',
'captionsButton',
'qualitySelector', 'qualitySelector',
'playbackRateMenuButton', 'playbackRateMenuButton',
'fullscreenToggle', 'fullscreenToggle',
], ],
}, },
}; };
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,
seekStep: 5, seekStep: 5,
enableModifiersForNumbers: false, enableModifiersForNumbers: false,
enableVolumeScroll: false,
customKeys: { customKeys: {
play: { play: {
key: function(e) { key: function(e) {
@ -107,11 +128,32 @@ var player = videojs('player', options, function() {
}); });
}); });
player.offset({ player.share(shareOptions);
start: <%= video_start %>,
end: <%= video_end %> <% if video_start > 0 || video_end > 0 %>
player.markers({
onMarkerReached: function(marker) {
if (marker.text === 'End') {
if (player.loop()) {
player.markers.prev('Start');
} else {
player.pause();
}
}
},
markers: [
{time: <%= video_start %>, text: 'Start'},
<% if video_end < 0 %>
{time: <%= video.info["length_seconds"].to_f - 0.5 %>, text: 'End'}
<% else %>
{time: <%= video_end %>, text: 'End'}
<% end %>
]
}); });
player.currentTime(<%= video_start %>);
<% end %>
<% if !listen %> <% if !listen %>
var currentSources = player.currentSources(); var currentSources = player.currentSources();
for ( var i = 0; i < currentSources.length; i++ ) { for ( var i = 0; i < currentSources.length; i++ ) {

@ -24,10 +24,13 @@
<meta name="twitter:player:height" content="720"> <meta name="twitter:player:height" content="720">
<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-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-offset@2.0.0-beta.2/dist/videojs-offset.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 %>
@ -85,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,
@ -126,15 +138,37 @@ 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 %>);
<% end %> <% end %>
player.offset({
start: <%= video_start %>, <% if video_start > 0 || video_end > 0 %>
end: <%= video_end %> player.markers({
onMarkerReached: function(marker) {
if (marker.text === 'End') {
if (player.loop()) {
player.markers.prev('Start');
} else {
player.pause();
}
}
},
markers: [
{time: <%= video_start %>, text: 'Start'},
<% if video_end < 0 %>
{time: <%= video.info["length_seconds"].to_f - 0.5 %>, text: 'End'}
<% else %>
{time: <%= video_end %>, text: 'End'}
<% end %>
]
}); });
player.currentTime(<%= video_start %>);
<% end %>
<% if !listen %> <% if !listen %>
var currentSources = player.currentSources(); var currentSources = player.currentSources();
for ( var i = 0; i < currentSources.length; i++ ) { for ( var i = 0; i < currentSources.length; i++ ) {

Loading…
Cancel
Save