diff options
Diffstat (limited to 'assets/js')
| -rw-r--r-- | assets/js/handlers.js | 12 | ||||
| -rw-r--r-- | assets/js/player.js | 97 | ||||
| -rw-r--r-- | assets/js/themes.js | 21 | ||||
| -rw-r--r-- | assets/js/watch.js | 2 |
4 files changed, 125 insertions, 7 deletions
diff --git a/assets/js/handlers.js b/assets/js/handlers.js index 1498f39a..a417fcca 100644 --- a/assets/js/handlers.js +++ b/assets/js/handlers.js @@ -142,4 +142,16 @@ var csrf_token = target.parentNode.querySelector('input[name="csrf_token"]').value; xhr.send('csrf_token=' + csrf_token); } + + // Handle keypresses + window.addEventListener('keydown', (event) => { + // Ignore modifier keys + if (event.ctrlKey || event.metaKey) { return; } + + // Focus search bar on '/' + if (event.key == "/") { + document.getElementById('searchbox').focus(); + event.preventDefault(); + } + }); })(); diff --git a/assets/js/player.js b/assets/js/player.js index a461c53d..5ff55eb3 100644 --- a/assets/js/player.js +++ b/assets/js/player.js @@ -38,6 +38,8 @@ embed_url.searchParams.delete('v'); short_url = location.origin + '/' + video_data.id + embed_url.search; embed_url = location.origin + '/embed/' + video_data.id + embed_url.search; +var save_player_pos_key = "save_player_pos"; + var shareOptions = { socials: ['fbFeed', 'tw', 'reddit', 'email'], @@ -57,6 +59,16 @@ videojs.Hls.xhr.beforeRequest = function(options) { var player = videojs('player', options); +const storage = (() => { + try { + if (localStorage.length !== -1) { + return localStorage; + } + } catch (e) { + console.info('No storage available: ' + e); + } + return undefined; +})(); if (location.pathname.startsWith('/embed/')) { player.overlay({ @@ -199,6 +211,32 @@ if (video_data.premiere_timestamp && Math.round(new Date() / 1000) < video_data. player.getChild('bigPlayButton').hide(); } +if (video_data.params.save_player_pos) { + const url = new URL(location); + const hasTimeParam = url.searchParams.has("t"); + const remeberedTime = get_video_time(); + let lastUpdated = 0; + + if(!hasTimeParam) { + set_seconds_after_start(remeberedTime); + } + + const updateTime = () => { + const raw = player.currentTime(); + const time = Math.floor(raw); + + if(lastUpdated !== time && raw <= video_data.length_seconds - 15) { + save_video_time(time); + lastUpdated = time; + } + }; + + player.on("timeupdate", updateTime); +} +else { + remove_all_video_times(); +} + if (video_data.params.autoplay) { var bpb = player.getChild('bigPlayButton'); bpb.hide(); @@ -330,6 +368,65 @@ function skip_seconds(delta) { player.currentTime(newTime); } +function set_seconds_after_start(delta) { + const start = video_data.params.video_start; + player.currentTime(start + delta); +} + +function save_video_time(seconds) { + const videoId = video_data.id; + const all_video_times = get_all_video_times(); + + all_video_times[videoId] = seconds; + + set_all_video_times(all_video_times); +} + +function get_video_time() { + try { + const videoId = video_data.id; + const all_video_times = get_all_video_times(); + const timestamp = all_video_times[videoId]; + + return timestamp || 0; + } + catch { + return 0; + } +} + +function set_all_video_times(times) { + if (storage) { + if (times) { + try { + storage.setItem(save_player_pos_key, JSON.stringify(times)); + } catch (e) { + console.debug('set_all_video_times: ' + e); + } + } else { + storage.removeItem(save_player_pos_key); + } + } +} + +function get_all_video_times() { + if (storage) { + const raw = storage.getItem(save_player_pos_key); + if (raw !== null) { + try { + return JSON.parse(raw); + } catch (e) { + console.debug('get_all_video_times: ' + e); + } + } + } + return {}; +} + +function remove_all_video_times() { + set_all_video_times(null); +} + function set_time_percent(percent) { const duration = player.duration(); const newTime = duration * (percent / 100); diff --git a/assets/js/themes.js b/assets/js/themes.js index 543b849e..470f10bf 100644 --- a/assets/js/themes.js +++ b/assets/js/themes.js @@ -11,7 +11,9 @@ toggle_theme.addEventListener('click', function () { xhr.open('GET', url, true); set_mode(dark_mode); - window.localStorage.setItem('dark_mode', dark_mode ? 'dark' : 'light'); + try { + window.localStorage.setItem('dark_mode', dark_mode ? 'dark' : 'light'); + } catch {} xhr.send(); }); @@ -23,9 +25,12 @@ window.addEventListener('storage', function (e) { }); window.addEventListener('DOMContentLoaded', function () { - window.localStorage.setItem('dark_mode', document.getElementById('dark_mode_pref').textContent); - // Update localStorage if dark mode preference changed on preferences page - update_mode(window.localStorage.dark_mode); + const dark_mode = document.getElementById('dark_mode_pref').textContent; + try { + // Update localStorage if dark mode preference changed on preferences page + window.localStorage.setItem('dark_mode', dark_mode); + } catch {} + update_mode(dark_mode); }); @@ -37,9 +42,11 @@ lightScheme.addListener(scheme_switch); function scheme_switch (e) { // ignore this method if we have a preference set - if (localStorage.getItem('dark_mode')) { - return; - } + try { + if (localStorage.getItem('dark_mode')) { + return; + } + } catch {} if (e.matches) { if (e.media.includes("dark")) { set_mode(true); diff --git a/assets/js/watch.js b/assets/js/watch.js index 3909edd4..1579abf4 100644 --- a/assets/js/watch.js +++ b/assets/js/watch.js @@ -149,6 +149,8 @@ function get_playlist(plid, retries) { if (xhr.readyState == 4) { if (xhr.status == 200) { playlist.innerHTML = xhr.response.playlistHtml; + var nextVideo = document.getElementById(xhr.response.nextVideo); + nextVideo.parentNode.parentNode.scrollTop = nextVideo.offsetTop; if (xhr.response.nextVideo) { player.on('ended', function () { |
