Use markers to implement timestamps

This commit is contained in:
broquemonsieur 2023-08-05 02:53:36 -07:00
parent d7a53d0159
commit 472a2d7e76
5 changed files with 72 additions and 40 deletions

View File

@ -200,11 +200,18 @@ if (!video_data.params.listen && video_data.vr && video_data.params.vr_mode) {
// Add markers
if (video_data.params.video_start > 0 || video_data.params.video_end > 0) {
var markers = [{ time: video_data.params.video_start, text: 'Start' }];
if (video_data.starting_timestamp_seconds) {
markers = [{ time: video_data.starting_timestamp_seconds, text: 'Start' }];
}
if (video_data.params.video_end < 0) {
markers.push({ time: video_data.length_seconds - 0.5, text: 'End' });
if (!video_data.ending_timestamp_seconds) {
if (video_data.params.video_end < 0) {
markers.push({ time: video_data.length_seconds - 0.5, text: 'End' });
} else {
markers.push({ time: video_data.params.video_end, text: 'End' });
}
} else {
markers.push({ time: video_data.params.video_end, text: 'End' });
markers.push({ time: video_data.ending_timestamp_seconds, text: 'End' });
}
player.markers({

View File

@ -103,7 +103,7 @@ function continue_autoplay(event) {
}
function get_compilation(compid) {
var compilation = document.getElementById('compilations');
var compilation = document.getElementById('compilation');
compilation.innerHTML = spinnerHTMLwithHR;
@ -111,47 +111,49 @@ function get_compilation(compid) {
compid_url = '/api/v1/compilations/' + compid +
'?index=' + video_data.index +
'&continuation=' + video_data.id +
'&format=html&hl=' + video_data.preferences.locale;
'&format=html&hl=' + video_data.preferences.locale;
console.log("Send "+compid_url);
helpers.xhr('GET', compid_url, {retries: 5, entity_name: 'compilation'}, {
on200: function (response) {
compilation.innerHTML = response.compilationHtml;
if (!response.nextVideo) return;
if (!response.nextVideo) return;
var nextVideo = document.getElementById(response.nextVideo);
nextVideo.parentNode.parentNode.scrollTop = nextVideo.offsetTop;
var nextVideo = document.getElementById(response.nextVideo);
nextVideo.parentNode.parentNode.scrollTop = nextVideo.offsetTop;
player.on('ended', function () {
var url = new URL('https://example.com/watch?v=' + response.nextVideo);
player.on('ended', function () {
var url = new URL('https://example.com/watch?v=' + response.nextVideo);
url.searchParams.set('list', compid);
if (!plid.startsWith('RD'))
url.searchParams.set('index', response.index);
if (video_data.params.autoplay || video_data.params.continue_autoplay)
url.searchParams.set('autoplay', '1');
if (video_data.params.listen !== video_data.preferences.listen)
url.searchParams.set('listen', video_data.params.listen);
if (video_data.params.speed !== video_data.preferences.speed)
url.searchParams.set('speed', video_data.params.speed);
if (video_data.params.local !== video_data.preferences.local)
url.searchParams.set('local', video_data.params.local);
url.searchParams.set('list', compid);
if (!compid.startsWith('RD'))
url.searchParams.set('index', response.index);
if (video_data.params.autoplay || video_data.params.continue_autoplay)
url.searchParams.set('autoplay', '1');
if (video_data.params.listen !== video_data.preferences.listen)
url.searchParams.set('listen', video_data.params.listen);
if (video_data.params.speed !== video_data.preferences.speed)
url.searchParams.set('speed', video_data.params.speed);
if (video_data.params.local !== video_data.preferences.local)
url.searchParams.set('local', video_data.params.local);
location.assign(url.pathname + url.search);
});
},
onNon200: function (xhr) {
compilation.innerHTML = '';
document.getElementById('continue').style.display = '';
},
onError: function (xhr) {
compilation.innerHTML = spinnerHTMLwithHR;
},
onTimeout: function (xhr) {
compilation.innerHTML = spinnerHTMLwithHR;
}
});
}
location.assign(url.pathname + url.search);
});
},
onNon200: function (xhr) {
compilation.innerHTML = '';
document.getElementById('continue').style.display = '';
},
onError: function (xhr) {
compilation.innerHTML = spinnerHTMLwithHR;
},
onTimeout: function (xhr) {
compilation.innerHTML = spinnerHTMLwithHR;
}
});
}
function get_playlist(plid) {
var playlist = document.getElementById('playlist');

View File

@ -258,6 +258,18 @@ module Invidious::Database::CompilationVideos
return PG_DB.query_all(request, compid, index, video_index, offset, limit, as: CompilationVideo)
end
def select_timestamps(compid : String, vid : String)
request = <<-SQL
SELECT starting_timestamp_seconds,ending_timestamp_seconds FROM compilation_videos
WHERE compid = $1 AND id = $2
LIMIT 1
SQL
return PG_DB.query_one?(request, compid, vid, as: {Int32,Int32})
end
def select_id_from_order_index(order_index : Int32)
request = <<-SQL
SELECT id FROM compilation_videos

View File

@ -44,6 +44,13 @@ module Invidious::Routes::Watch
continuation = process_continuation(env.params.query, plid, id)
elsif env.params.query["list"]?.try &.starts_with? "IVCMP"
compid = env.params.query["list"]?.try &.gsub(/[^a-zA-Z0-9_-]/, "")
if (!compid.nil?)
timestamps = Invidious::Database::CompilationVideos.select_timestamps(compid, id)
if (!timestamps.nil?)
starting_timestamp_seconds=timestamps[0]
ending_timestamp_seconds=timestamps[1]
end
end
continuation = process_continuation(env.params.query, compid, id)
end

View File

@ -51,6 +51,8 @@ we're going to need to do it here in order to allow for translations.
"index" => continuation,
"plid" => plid,
"compid" => compid,
"starting_timestamp_seconds" => starting_timestamp_seconds,
"ending_timestamp_seconds" => ending_timestamp_seconds,
"length_seconds" => video.length_seconds.to_f,
"play_next" => !video.related_videos.empty? && !plid && params.continue,
"next_video" => video.related_videos.select { |rv| rv["id"]? }[0]?.try &.["id"],
@ -313,16 +315,18 @@ we're going to need to do it here in order to allow for translations.
</div>
</div>
<% if params.related_videos || plid %>
<% if params.related_videos || plid || compid%>
<div class="pure-u-1 pure-u-lg-1-5">
<% if plid %>
<div id="playlist" class="h-box"></div>
<% elsif compid %>
<div id="compilation" class="h-box"></div>
<% end %>
<% if params.related_videos %>
<div class="h-box">
<% if !video.related_videos.empty? %>
<div <% if plid %>style="display:none"<% end %>>
<div <% if plid || compid %>style="display:none"<% end %>>
<div class="pure-control-group">
<label for="continue"><%= translate(locale, "preferences_continue_label") %></label>
<input name="continue" id="continue" type="checkbox" <% if params.continue %>checked<% end %>>