From bb7435ba595758bfbc68d86a307cc83d18ca8a13 Mon Sep 17 00:00:00 2001 From: epicsam123 <92618898+epicsam123@users.noreply.github.com> Date: Wed, 19 Feb 2025 21:16:47 -0500 Subject: [PATCH] revert accidental changes staged from different pr --- assets/css/player.css | 17 +++------------ assets/js/player.js | 51 +++++++------------------------------------ 2 files changed, 11 insertions(+), 57 deletions(-) diff --git a/assets/css/player.css b/assets/css/player.css index e204457a..5c8b6cd0 100644 --- a/assets/css/player.css +++ b/assets/css/player.css @@ -71,10 +71,8 @@ padding-top: 2em } -.video-js.player-style-youtube .vjs-progress-control .vjs-progress-holder, .video-js.player-style-youtube .vjs-progress-control { - height: 5px; - margin-bottom: 10px; -} +.video-js.player-style-youtube .vjs-progress-control .vjs-progress-holder, .video-js.player-style-youtube .vjs-progress-control {height: 5px; + margin-bottom: 10px;} ul.vjs-menu-content::-webkit-scrollbar { display: none; @@ -84,20 +82,11 @@ ul.vjs-menu-content::-webkit-scrollbar { cursor: none; } -/* Customizable CSS in player.js */ -.vjs-text-track-display > div > div -{ - background-color: rgba(0, 0, 0, 0); /* caption window background: toggle with "w" event */ -} - /* Customizable CSS in player.js */ .video-js .vjs-text-track-display > div > div > div { - font-size: 27px !important; /* caption size Toggle with "-/=" event */ - background-color: rgba(0, 0, 0, 0.75) !important; /* caption background: toggle with "w" event */ - color: rgb(255, 255, 255, 1) !important; /* caption text: toggle with "o" event */ + background-color: rgba(0, 0, 0, 0.75) !important; border-radius: 9px !important; padding: 5px !important; - line-height: 1.5 !important; } .vjs-play-control, diff --git a/assets/js/player.js b/assets/js/player.js index c74a68a4..24b2467c 100644 --- a/assets/js/player.js +++ b/assets/js/player.js @@ -2,16 +2,9 @@ var player_data = JSON.parse(document.getElementById('player_data').textContent); var video_data = JSON.parse(document.getElementById('video_data').textContent); -var player_css = [...Array.from(document.styleSheets).find(sS => sS.href?.includes('player.css')).cssRules] -var caption_background_css = player_css.find(rule => rule.selectorText === '.vjs-text-track-display > div > div'); -var caption_text_css = player_css.find(rule => rule.selectorText === '.video-js .vjs-text-track-display > div > div > div'); - var options = { liveui: true, playbackRates: [0.25, 0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0], - captionSizes: ['22px', '27px', '32px', '37px'], - captionBackground: [0, 0.5, 0.8, 1].map(a => 'rgba(0, 0, 0, ' + a + ')'), - captionOpacity: [0.4, 0.7, 1].map(a => 'rgba(255, 255, 255, ' + a + ')'), controlBar: { children: [ 'playToggle', @@ -143,11 +136,14 @@ player.on('timeupdate', function () { let elem_yt_watch = document.getElementById('link-yt-watch'); let elem_yt_embed = document.getElementById('link-yt-embed'); - let base_url_yt_watch = elem_yt_watch.getAttribute('data-base-url'); - let base_url_yt_embed = elem_yt_embed.getAttribute('data-base-url'); + // YT links could be turned off by the user + if (elem_yt_watch) { + let base_url_yt_watch = elem_yt_watch.getAttribute('data-base-url'); + let base_url_yt_embed = elem_yt_embed.getAttribute('data-base-url'); - elem_yt_watch.href = addCurrentTimeToURL(base_url_yt_watch); - elem_yt_embed.href = addCurrentTimeToURL(base_url_yt_embed); + elem_yt_watch.href = addCurrentTimeToURL(base_url_yt_watch); + elem_yt_embed.href = addCurrentTimeToURL(base_url_yt_embed); + } // Invidious links @@ -181,7 +177,7 @@ var shareOptions = { }; if (location.pathname.startsWith('/embed/')) { - var overlay_content = '

' + player_data.title + '

'; + var overlay_content = '

' + player_data.title + '

'; player.overlay({ overlays: [ { start: 'loadstart', content: overlay_content, end: 'playing', align: 'top'}, @@ -598,31 +594,6 @@ function increase_playback_rate(steps) { player.playbackRate(options.playbackRates[newIndex]); } -function increase_caption_size(steps) { - const maxIndex = options.captionSizes.length - 1; - const font_size = caption_text_css.style.getPropertyValue('font-size'); - const curIndex = options.captionSizes.indexOf(font_size); - let newIndex = curIndex + steps; - newIndex = helpers.clamp(newIndex, 0, maxIndex); - caption_text_css.style.setProperty('font-size', options.captionSizes[newIndex], 'important'); -} - -function toggle_caption_window() { - const numOptions = options.captionBackground.length; - const backgroundColor = caption_background_css.style.getPropertyValue('background-color'); - const curIndex = options.captionBackground.indexOf(backgroundColor); - const newIndex = (curIndex + 1) % numOptions; - caption_background_css.style.setProperty('background-color', options.captionBackground[newIndex], 'important'); -} - -function toggle_caption_opacity() { - const numOptions = options.captionOpacity.length; - const opacity = caption_text_css.style.getPropertyValue('color'); - const curIndex = options.captionOpacity.indexOf(opacity); - const newIndex = (curIndex + 1) % numOptions; - caption_text_css.style.setProperty('color', options.captionOpacity[newIndex], 'important'); -} - addEventListener('keydown', function (e) { if (e.target.tagName.toLowerCase() === 'input') { // Ignore input when focus is on certain elements, e.g. form fields. @@ -718,12 +689,6 @@ addEventListener('keydown', function (e) { case '>': action = increase_playback_rate.bind(this, 1); break; case '<': action = increase_playback_rate.bind(this, -1); break; - - case '=': action = increase_caption_size.bind(this, 1); break; - case '-': action = increase_caption_size.bind(this, -1); break; - - case 'w': action = toggle_caption_window; break; - case 'o': action = toggle_caption_opacity; break; default: console.info('Unhandled key down event: %s:', decoratedKey, e);