diff options
| -rw-r--r-- | src/assets/javascripts/helpers/youtube/invidious-options.js | 14 | ||||
| -rw-r--r-- | src/assets/javascripts/helpers/youtube/piped-options.js | 138 | ||||
| -rw-r--r-- | src/assets/javascripts/helpers/youtube/piped-preferences.js | 45 | ||||
| -rw-r--r-- | src/assets/javascripts/helpers/youtube/youtube-options.js | 28 | ||||
| -rw-r--r-- | src/assets/javascripts/helpers/youtube/youtube.js | 112 | ||||
| -rw-r--r-- | src/pages/options/youtube/invidious.js | 10 | ||||
| -rw-r--r-- | src/pages/options/youtube/piped.js | 147 | ||||
| -rw-r--r-- | src/pages/options/youtube/youtube.html | 333 | ||||
| -rw-r--r-- | src/pages/options/youtube/youtube.js | 8 |
9 files changed, 794 insertions, 41 deletions
diff --git a/src/assets/javascripts/helpers/youtube/invidious-options.js b/src/assets/javascripts/helpers/youtube/invidious-options.js index ea45ae01..aab5508b 100644 --- a/src/assets/javascripts/helpers/youtube/invidious-options.js +++ b/src/assets/javascripts/helpers/youtube/invidious-options.js @@ -1,7 +1,9 @@ "use strict"; +window.browser = window.browser || window.chrome; + export let invidiousQuality; -export const getinvidiousQuality = () => invidiousQuality; +export const getInvidiousQuality = () => invidiousQuality; export function setinvidiousQuality(val) { invidiousQuality = val; browser.storage.local.set({ invidiousQuality }) @@ -48,14 +50,6 @@ export function setInvidiousContinue(val) { console.log("invidiousContinue: ", invidiousContinue) } -export let invidiousListen; -export const getInvidiousListen = () => invidiousListen; -export function setInvidiousListen(val) { - invidiousListen = val; - browser.storage.local.set({ invidiousListen }) - console.log("invidiousListen: ", invidiousListen) -} - export let invidiousSpeed; export const getInvidiousSpeed = () => invidiousSpeed; export function setInvidiousSpeed(val) { @@ -141,7 +135,6 @@ export async function invidiousInit() { "invidiousVideoLoop", "invidiousContinueAutoplay", "invidiousContinue", - "invidiousListen", "invidiousSpeed", "invidiousQualityDash", "invidiousComments", @@ -159,7 +152,6 @@ export async function invidiousInit() { invidiousQuality = r.invidiousQuality ?? 'hd720'; invidiousContinueAutoplay = r.invidiousContinueAutoplay ?? true; invidiousContinue = r.invidiousContinue ?? false; - invidiousListen = r.invidiousListen ?? false; invidiousSpeed = r.invidiousSpeed ?? '1.0'; invidiousQualityDash = r.invidiousQualityDash ?? 'auto'; invidiousComments = r.invidiousComments ?? ['youtube', '']; diff --git a/src/assets/javascripts/helpers/youtube/piped-options.js b/src/assets/javascripts/helpers/youtube/piped-options.js new file mode 100644 index 00000000..f0aea4ea --- /dev/null +++ b/src/assets/javascripts/helpers/youtube/piped-options.js @@ -0,0 +1,138 @@ +"use strict"; + +window.browser = window.browser || window.chrome; + +export let pipedBufferGoal; +export const getPipedBufferGoal = () => pipedBufferGoal; +export function setPipedBufferGoal(val) { + pipedBufferGoal = val; + browser.storage.local.set({ pipedBufferGoal }) + console.log("pipedBufferGoal: ", pipedBufferGoal) +} + +export let pipedComments; +export const getPipedComments = () => pipedComments; +export function setPipedComments(val) { + pipedComments = val; + browser.storage.local.set({ pipedComments }) + console.log("pipedComments: ", pipedComments) +} + +export let pipedDisableLBRY; +export const getPipedDisableLBRY = () => pipedDisableLBRY; +export function setPipedDisableLBRY(val) { + pipedDisableLBRY = val; + browser.storage.local.set({ pipedDisableLBRY }) + console.log("pipedDisableLBRY: ", pipedDisableLBRY) +} + +export let pipedEnabledCodecs; +export const getPipedEnabledCodecs = () => pipedEnabledCodecs; +export function setPipedEnabledCodecs(val) { + pipedEnabledCodecs = val; + browser.storage.local.set({ pipedEnabledCodecs }) + console.log("pipedEnabledCodecs: ", pipedEnabledCodecs) +} + +export let pipedHomepage; +export const getPipedHomepage = () => pipedHomepage; +export function setPipedHomepage(val) { + pipedHomepage = val; + browser.storage.local.set({ pipedHomepage }) + console.log("pipedHomepage: ", pipedHomepage) +} + +export let pipedMinimizeDescription; +export const getPipedMinimizeDescription = () => pipedMinimizeDescription; +export function setPipedMinimizeDescription(val) { + pipedMinimizeDescription = val; + browser.storage.local.set({ pipedMinimizeDescription }) + console.log("pipedMinimizeDescription: ", pipedMinimizeDescription) +} + +export let pipedProxyLBRY; +export const getPipedProxyLBRY = () => pipedProxyLBRY; +export function setPipedProxyLBRY(val) { + pipedProxyLBRY = val; + browser.storage.local.set({ pipedProxyLBRY }) + console.log("pipedProxyLBRY: ", pipedProxyLBRY) +} + +export let pipedQuality; +export const getPipedQuality = () => pipedQuality; +export function setPipedQuality(val) { + pipedQuality = val; + browser.storage.local.set({ pipedQuality }) + console.log("pipedQuality: ", pipedQuality) +} + +export let pipedRegion; +export const getPipedRegion = () => pipedRegion; +export function setPipedRegion(val) { + pipedRegion = val; + browser.storage.local.set({ pipedRegion }) + console.log("pipedRegion: ", pipedRegion) +} + +export let pipedSelectedSkip; +export const getPipedSelectedSkip = () => pipedSelectedSkip; +export function setPipedSelectedSkip(val) { + pipedSelectedSkip = val; + browser.storage.local.set({ pipedSelectedSkip }) + console.log("pipedSelectedSkip: ", pipedSelectedSkip) +} + +export let pipedSponsorblock; +export const getPipedSponsorblock = () => pipedSponsorblock; +export function setPipedSponsorblock(val) { + pipedSponsorblock = val; + browser.storage.local.set({ pipedSponsorblock }) + console.log("pipedSponsorblock: ", pipedSponsorblock) +} + +export let pipedWatchHistory; +export const getPipedWatchHistory = () => pipedWatchHistory; +export function setPipedWatchHistory(val) { + pipedWatchHistory = val; + browser.storage.local.set({ pipedWatchHistory }) + console.log("pipedWatchHistory: ", pipedWatchHistory) +} + +export async function pipedInit() { + return new Promise( + resolve => { + browser.storage.local.get( + [ + "pipedBufferGoal", + "pipedComments", + "pipedDisableLBRY", + "pipedEnabledCodecs", + "pipedHomepage", + "pipedMinimizeDescription", + "pipedProxyLBRY", + "pipedQuality", + "pipedRegion", + "pipedSelectedSkip", + "pipedSponsorblock", + "pipedWatchHistory", + ], + r => { + pipedBufferGoal = r.pipedBufferGoal ?? 10; + pipedComments = r.pipedComments ?? true; + pipedDisableLBRY = r.pipedDisableLBRY ?? false; + pipedEnabledCodecs = r.pipedEnabledCodecs ?? ["av1", "vp9", "avc"]; + pipedHomepage = r.pipedHomepage ?? "trending"; + pipedMinimizeDescription = r.pipedMinimizeDescription ?? false; + pipedProxyLBRY = r.pipedProxyLBRY ?? false; + pipedQuality = r.pipedQuality ?? 0; + pipedRegion = r.pipedRegion ?? "US"; + pipedSelectedSkip = r.pipedSelectedSkip ?? ["sponsor", "interaction", "selfpromo", "music_offtopic"]; + pipedSponsorblock = r.pipedSponsorblock ?? true; + pipedWatchHistory = r.pipedWatchHistory ?? false; + + resolve(); + } + ) + } + ) +} diff --git a/src/assets/javascripts/helpers/youtube/piped-preferences.js b/src/assets/javascripts/helpers/youtube/piped-preferences.js index f4b41e5c..9182b1e5 100644 --- a/src/assets/javascripts/helpers/youtube/piped-preferences.js +++ b/src/assets/javascripts/helpers/youtube/piped-preferences.js @@ -4,15 +4,56 @@ browser.storage.local.get( [ "theme", "youtubeVolume", - "youtubeAutoplay" + "youtubeAutoplay", + "youtubeListen", + + "pipedBufferGoal", + "pipedComments", + "pipedDisableLBRY", + "pipedEnabledCodecs", + "pipedHomepage", + "pipedMinimizeDescription", + "pipedProxyLBRY", + "pipedQuality", + "pipedRegion", + "pipedSelectedSkip", + "pipedSponsorblock", + "pipedWatchHistory", ], r => { let theme = r.theme ?? "dark"; let youtubeAutoplay = r.youtubeAutoplay ?? false; let youtubeVolume = r.youtubeVolume ?? 100; + let youtubeListen = r.youtubeListen ?? false; + + let pipedBufferGoal = r.pipedBufferGoal ?? 10; + let pipedComments = r.pipedComments ?? true; + let pipedDisableLBRY = r.pipedDisableLBRY ?? false; + let pipedEnabledCodecs = r.pipedEnabledCodecs ?? "av1,vp9,avc"; + let pipedHomepage = r.pipedHomepage ?? "trending"; + let pipedMinimizeDescription = r.pipedMinimizeDescription ?? false; + let pipedProxyLBRY = r.pipedProxyLBRY ?? false; + let pipedQuality = r.pipedQuality ?? 0; + let pipedRegion = r.pipedRegion ?? "US"; + let pipedSelectedSkip = r.pipedSelectedSkip ?? []; + let pipedSponsorblock = r.pipedSponsorblock ?? true; + let pipedWatchHistory = r.pipedWatchHistory ?? false; + localStorage.setItem("bufferGoal", pipedBufferGoal); + localStorage.setItem("comments", pipedComments); + localStorage.setItem("disableLBRY", pipedDisableLBRY); + localStorage.setItem("enabledCodecs", pipedEnabledCodecs); + localStorage.setItem("homepage", pipedHomepage); + localStorage.setItem("listen", youtubeListen); + localStorage.setItem("minimizeDescription", pipedMinimizeDescription); + localStorage.setItem("playerAutoPlay", youtubeAutoplay); + localStorage.setItem("proxyLBRY", pipedProxyLBRY); + localStorage.setItem("quality", pipedQuality); + localStorage.setItem("region", pipedRegion); + localStorage.setItem("selectedSkip", pipedSelectedSkip); + localStorage.setItem("sponsorblock", pipedSponsorblock); localStorage.setItem("theme", theme); localStorage.setItem("volume", youtubeVolume / 100); - localStorage.setItem("playerAutoPlay", youtubeAutoplay); + localStorage.setItem("watchHistory", pipedWatchHistory); } ) \ No newline at end of file diff --git a/src/assets/javascripts/helpers/youtube/youtube-options.js b/src/assets/javascripts/helpers/youtube/youtube-options.js new file mode 100644 index 00000000..cacc80c7 --- /dev/null +++ b/src/assets/javascripts/helpers/youtube/youtube-options.js @@ -0,0 +1,28 @@ +"use strict"; + +window.browser = window.browser || window.chrome; + +export let youtubeListen; +export const getYoutubeListen = () => youtubeListen; +export function setYoutubeListen(val) { + youtubeListen = val; + browser.storage.local.set({ youtubeListen }) + console.log("youtubeListen: ", youtubeListen) +} + +export async function youtubeInit() { + return new Promise( + resolve => { + browser.storage.local.get( + [ + "youtubeListen" + ], + r => { + youtubeListen = r.youtubeListen ?? false; + + resolve(); + } + ) + } + ) +} diff --git a/src/assets/javascripts/helpers/youtube/youtube.js b/src/assets/javascripts/helpers/youtube/youtube.js index 1f4bf298..21a5c634 100644 --- a/src/assets/javascripts/helpers/youtube/youtube.js +++ b/src/assets/javascripts/helpers/youtube/youtube.js @@ -3,7 +3,7 @@ import commonHelper from '../common.js' import { invidiousQuality, - getinvidiousQuality, + getInvidiousQuality, setinvidiousQuality, invidiousAlwaysProxy, @@ -27,10 +27,6 @@ import { getInvidiousContinue, setInvidiousContinue, - invidiousListen, - getInvidiousListen, - setInvidiousListen, - invidiousSpeed, getInvidiousSpeed, setInvidiousSpeed, @@ -67,7 +63,64 @@ import { getInvidiousSavePlayerPos, setInvidiousSavePlayerPos, -} from './invidious-options.js' +} from './invidious-options.js'; +import { + pipedBufferGoal, + getPipedBufferGoal, + setPipedBufferGoal, + + pipedComments, + getPipedComments, + setPipedComments, + + pipedDisableLBRY, + getPipedDisableLBRY, + setPipedDisableLBRY, + + pipedEnabledCodecs, + getPipedEnabledCodecs, + setPipedEnabledCodecs, + + pipedHomepage, + getPipedHomepage, + setPipedHomepage, + + pipedMinimizeDescription, + getPipedMinimizeDescription, + setPipedMinimizeDescription, + + pipedProxyLBRY, + getPipedProxyLBRY, + setPipedProxyLBRY, + + pipedQuality, + getPipedQuality, + setPipedQuality, + + pipedRegion, + getPipedRegion, + setPipedRegion, + + pipedSelectedSkip, + getPipedSelectedSkip, + setPipedSelectedSkip, + + pipedSponsorblock, + getPipedSponsorblock, + setPipedSponsorblock, + + pipedWatchHistory, + getPipedWatchHistory, + setPipedWatchHistory, + + pipedInit +} from './piped-options.js'; +import { + youtubeListen, + getYoutubeListen, + setYoutubeListen, + youtubeInit +} from './youtube-options.js'; window.browser = window.browser || window.chrome; @@ -611,7 +664,7 @@ function initInvidiousCookies() { prefs.video_loop = invidiousVideoLoop == 'true'; prefs.continue_autoplay = invidiousContinueAutoplay == 'true'; prefs.continue = invidiousContinue == 'true'; - prefs.listen = invidiousListen == 'true'; + prefs.listen = youtubeListen == 'true'; prefs.speed = parseFloat(invidiousSpeed); prefs.quality = invidiousQuality; prefs.quality_dash = invidiousQualityDash; @@ -646,7 +699,9 @@ function initInvidiousCookies() { } async function init() { + await youtubeInit(); await invidiousInit(); + await pipedInit(); return new Promise( resolve => { fetch('/instances/data.json').then(response => response.text()).then(data => { @@ -729,6 +784,7 @@ async function init() { if (r.youtubeEmbedExceptions) exceptions = r.youtubeEmbedExceptions; initInvidiousCookies(); + resolve(); }); @@ -765,7 +821,7 @@ export default { getInvidiousAlwaysProxy, setinvidiousQuality, - getinvidiousQuality, + getInvidiousQuality, setInvidiousPlayerStyle, getInvidiousPlayerStyle, @@ -797,8 +853,8 @@ export default { getInvidiousContinue, setInvidiousContinue, - getInvidiousListen, - setInvidiousListen, + getYoutubeListen, + setYoutubeListen, getInvidiousSpeed, setInvidiousSpeed, @@ -827,6 +883,42 @@ export default { getInvidiousSavePlayerPos, setInvidiousSavePlayerPos, + getPipedBufferGoal, + setPipedBufferGoal, + + getPipedComments, + setPipedComments, + + getPipedDisableLBRY, + setPipedDisableLBRY, + + getPipedEnabledCodecs, + setPipedEnabledCodecs, + + getPipedHomepage, + setPipedHomepage, + + getPipedMinimizeDescription, + setPipedMinimizeDescription, + + getPipedProxyLBRY, + setPipedProxyLBRY, + + getPipedQuality, + setPipedQuality, + + getPipedRegion, + setPipedRegion, + + getPipedSelectedSkip, + setPipedSelectedSkip, + + getPipedSponsorblock, + setPipedSponsorblock, + + getPipedWatchHistory, + setPipedWatchHistory, + getInvidiousNormalRedirectsChecks, setInvidiousNormalRedirectsChecks, diff --git a/src/pages/options/youtube/invidious.js b/src/pages/options/youtube/invidious.js index d8486e7a..b99a3ab3 100644 --- a/src/pages/options/youtube/invidious.js +++ b/src/pages/options/youtube/invidious.js @@ -31,9 +31,9 @@ invidiousContinueElement.addEventListener("change", event => youtubeHelper.setInvidiousContinue(event.target.checked) ); -let invidiousListenElement = document.getElementById("invidious-listen"); -invidiousListenElement.addEventListener("change", - event => youtubeHelper.setInvidiousListen(event.target.checked) +let youtubeListenElement = document.getElementById("invidious-listen"); +youtubeListenElement.addEventListener("change", + event => youtubeHelper.setYoutubeListen(event.target.checked) ); let invidiousSpeedElement = document.getElementById("invidious-speed"); @@ -120,9 +120,9 @@ youtubeHelper.init().then(() => { invidiousVideoLoopElement.value = youtubeHelper.getInvidiousVideoLoop(); invidiousContinueAutoplayElement.value = youtubeHelper.getInvidiousContinueAutoplay(); invidiousContinueElement.value = youtubeHelper.getInvidiousContinue(); - invidiousListenElement.value = youtubeHelper.getInvidiousListen(); + youtubeListenElement.value = youtubeHelper.getYoutubeListen(); invidiousSpeedElement.value = youtubeHelper.getInvidiousSpeed(); - invidiousQualityElement.value = youtubeHelper.getinvidiousQuality(); + invidiousQualityElement.value = youtubeHelper.getInvidiousQuality(); invidiousQualityDashElement.value = youtubeHelper.getInvidiousQualityDash(); invidiousComments0Element.value = youtubeHelper.getInvidiousComments()[0]; invidiousComments1Element.value = youtubeHelper.getInvidiousComments()[1]; diff --git a/src/pages/options/youtube/piped.js b/src/pages/options/youtube/piped.js index c6517966..0425ae79 100644 --- a/src/pages/options/youtube/piped.js +++ b/src/pages/options/youtube/piped.js @@ -1,7 +1,154 @@ import youtubeHelper from "../../../assets/javascripts/helpers/youtube/youtube.js"; import commonHelper from "../../../assets/javascripts/helpers/common.js"; +let pipedSponsorblockElement = document.getElementById("piped-sponsorblock"); +pipedSponsorblockElement.addEventListener("change", + event => youtubeHelper.setPipedSponsorblock(event.target.checked) +); + +function selectSkipModify(value, boolean) { + if (boolean) { + if (!selectSkip.includes(value)) selectSkip.push(value); + } + else { + let i = selectSkip.indexOf(value); + if (i > -1) selectSkip.splice(i, 1); + } + youtubeHelper.setPipedSelectedSkip(selectSkip) +} + +let pipedSelectedSkipSponsorElement = document.getElementById("piped-selectedSkip-sponsor"); +pipedSelectedSkipSponsorElement.addEventListener("change", + event => selectSkipModify('sponsor', event.target.checked) +); + +let pipedSelectedSkipIntroElement = document.getElementById("piped-selectedSkip-intro"); +pipedSelectedSkipIntroElement.addEventListener("change", + event => selectSkipModify('intro', event.target.checked) +); + +let pipedSelectedSkipOutroElement = document.getElementById("piped-selectedSkip-outro"); +pipedSelectedSkipOutroElement.addEventListener("change", + event => selectSkipModify('outro', event.target.checked) +); + +let pipedSelectedSkipPreviewElement = document.getElementById("piped-selectedSkip-preview"); +pipedSelectedSkipPreviewElement.addEventListener("change", + event => selectSkipModify('preview', event.target.checked) +); + +let pipedSelectedSkipInteractionElement = document.getElementById("piped-selectedSkip-interaction"); +pipedSelectedSkipInteractionElement.addEventListener("change", + event => selectSkipModify('interaction', event.target.checked) +); + +let pipedSelectedSkipSelfpromoElement = document.getElementById("piped-selectedSkip-selfpromo"); +pipedSelectedSkipSelfpromoElement.addEventListener("change", + event => selectSkipModify('selfpromo', event.target.checked) +); + +let pipedSelectedSkipMusicOfftopicElement = document.getElementById("piped-selectedSkip-music_offtopic"); +pipedSelectedSkipMusicOfftopicElement.addEventListener("change", + event => selectSkipModify('music_offtopic', event.target.checked) +); + +let pipedSelectedSkipPoiHighlightElement = document.getElementById("piped-selectedSkip-poi_highlight"); +pipedSelectedSkipPoiHighlightElement.addEventListener("change", + event => selectSkipModify('poi_highlight', event.target.checked) +); + +let pipedSelectedSkipFillerElement = document.getElementById("piped-selectedSkip-filler"); +pipedSelectedSkipFillerElement.addEventListener("change", + event => selectSkipModify('filler', event.target.checked) +); + +let pipedListenElement = document.getElementById("piped-listen"); +pipedListenElement.addEventListener("change", + event => youtubeHelper.setYoutubeListen(event.target.checked) +); + +let pipedQualityElement = document.getElementById("piped-quality"); +pipedQualityElement.addEventListener("change", + event => youtubeHelper.setPipedQuality(event.target.options[pipedQualityElement.selectedIndex].value) +); + +let pipedBufferGoalElement = document.getElementById("piped-bufferGoal"); +pipedBufferGoalElement.addEventListener("change", + event => youtubeHelper.setPipedBufferGoal(pipedBufferGoalElement.value) +); + +let pipedRegionElement = document.getElementById("piped-region"); +pipedRegionElement.addEventListener("change", + event => youtubeHelper.setPipedRegion(event.target.options[pipedRegionElement.selectedIndex].value) +); + +let pipedHomepageElement = document.getElementById("piped-homepage"); +pipedHomepageElement.addEventListener("change", + event => youtubeHelper.setPipedHomepage(event.target.options[pipedHomepageElement.selectedIndex].value) +); + +let pipedCommentsElement = document.getElementById("piped-comments"); +pipedCommentsElement.addEventListener("change", + event => youtubeHelper.setPipedComments(event.target.checked) +); + +let pipedMinimizeDescriptionElement = document.getElementById("piped-minimizeDescription"); +pipedMinimizeDescriptionElement.addEventListener("change", + event => youtubeHelper.setPipedMinimizeDescription(event.target.checked) +); + +let pipedWatchHistoryElement = document.getElementById("piped-watchHistory"); +pipedWatchHistoryElement.addEventListener("change", + event => youtubeHelper.setPipedWatchHistory(event.target.checked) +); + +let pipedEnabledCodecsElement = document.getElementById("piped-enabledCodecs"); +pipedEnabledCodecsElement.addEventListener("change", + () => { + let result = []; + for (const opt of pipedEnabledCodecsElement.options) + if (opt.selected) result.push(opt.value); + youtubeHelper.setPipedEnabledCodecs(result); + } +); + +let pipedDisableLBRYElement = document.getElementById("piped-disableLBRY"); +pipedDisableLBRYElement.addEventListener("change", + event => youtubeHelper.setPipedDisableLBRY(event.target.checked) +); + +let pipedProxyLBRYElement = document.getElementById("piped-proxyLBRY"); +pipedProxyLBRYElement.addEventListener("change", + event => youtubeHelper.setPipedProxyLBRY(event.target.checked) +); + +let selectSkip = []; youtubeHelper.init().then(() => { + + pipedSponsorblockElement.checked = youtubeHelper.getPipedSponsorblock(); + selectSkip = youtubeHelper.getPipedSelectedSkip(); + pipedSelectedSkipSponsorElement.checked = selectSkip.includes('sponsor'); + pipedSelectedSkipIntroElement.checked = selectSkip.includes('intro'); + pipedSelectedSkipOutroElement.checked = selectSkip.includes('outro'); + pipedSelectedSkipPreviewElement.checked = selectSkip.includes('preview'); + pipedSelectedSkipInteractionElement.checked = selectSkip.includes('interaction'); + pipedSelectedSkipSelfpromoElement.checked = selectSkip.includes('selfpromo'); + pipedSelectedSkipMusicOfftopicElement.checked = selectSkip.includes('music_offtopic'); + pipedSelectedSkipPoiHighlightElement.checked = selectSkip.includes('poi_highlight'); + pipedSelectedSkipFillerElement.checked = selectSkip.includes('filler'); + pipedListenElement.checked = youtubeHelper.getYoutubeListen(); + pipedQualityElement.value = youtubeHelper.getPipedQuality(); + pipedBufferGoalElement.value = youtubeHelper.getPipedBufferGoal(); + pipedRegionElement.value = youtubeHelper.getPipedRegion(); + pipedHomepageElement.value = youtubeHelper.getPipedHomepage(); + pipedCommentsElement.checked = youtubeHelper.getPipedComments(); + pipedMinimizeDescriptionElement.checked = youtubeHelper.getPipedMinimizeDescription(); + pipedWatchHistoryElement.checked = youtubeHelper.getPipedWatchHistory(); + pipedEnabledCodecsElement.value = youtubeHelper.getPipedEnabledCodecs(); + pipedDisableLBRYElement.checked = youtubeHelper.getPipedDisableLBRY(); + pipedProxyLBRYElement.checked = youtubeHelper.getPipedProxyLBRY(); + + commonHelper.processDefaultCustomInstances( 'piped', 'normal', diff --git a/src/pages/options/youtube/youtube.html b/src/pages/options/youtube/youtube.html index ce4ebf50..61350fc0 100644 --- a/src/pages/options/youtube/youtube.html +++ b/src/pages/options/youtube/youtube.html @@ -154,8 +154,6 @@ <input id="bypass-watch-on-youtube" type="checkbox" /> </div> - <hr> - <div class="some-block option-block"> <h4>Enable Custom Settings (will use cookies and localStorage)</h4> <input id="enable-youtube-custom-settings" type="checkbox" /> @@ -163,6 +161,8 @@ <div class="custom-settings"> + <hr> + <div class="some-block option-block"> <h4>Autoplay Video</h4> <input id="invidious-autoplay" type="checkbox" /> @@ -177,9 +177,9 @@ </div> + <div id="invidious"> - <div id="invidious"> <div class="custom-settings"> <div class="some-block option-block"> <h4>Player Style</h4> @@ -704,7 +704,7 @@ <hr> <div id="invidious-normal"> - + <div class="some-block option-block"> <h4>Default Instances</h4> </div> @@ -757,8 +757,328 @@ </div> <div id="piped"> - <hr> + <div class="custom-settings"> + + <div class="some-block option-block"> + <h4>Enable Sponsorblock</h4> + <input id="piped-sponsorblock" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Sponsors</h4> + <input id="piped-selectedSkip-sponsor" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Intermission/Intro Animation</h4> + <input id="piped-selectedSkip-intro" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Endcards/Credits</h4> + <input id="piped-selectedSkip-outro" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Preview/Recap</h4> + <input id="piped-selectedSkip-preview" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Interaction Reminder (Subscribe)</h4> + <input id="piped-selectedSkip-interaction" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Unpaid/Self Promotion</h4> + <input id="piped-selectedSkip-selfpromo" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Music: Non-Music Section</h4> + <input id="piped-selectedSkip-music_offtopic" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Highlight</h4> + <input id="piped-selectedSkip-poi_highlight" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Skip Filler Tangent</h4> + <input id="piped-selectedSkip-filler" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Audio Only</h4> + <input id="piped-listen" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Default Quality</h4> + <select id="piped-quality"> + <option value="0">Auto</option> + <option value="144">144p</option> + <option value="240">240p</option> + <option value="360">360p</option> + <option value="480">480p</option> + <option value="720">720p</option> + <option value="1080">1080p</option> + <option value="1440">1440p</option> + <option value="2160">2160p</option> + <option value="4320">4320p</option> + </select> + </div> + + <div class="some-block option-block"> + <h4>Buffering Goal (in seconds)</h4> + <input id="piped-bufferGoal" type="number" min="0" /> + </div> + + <div class="some-block option-block"> + <h4>Country Selection</h4> + <select id="piped-region"> + <option value="AF">Afghanistan</option> + <option value="AL">Albania</option> + <option value="DZ">Algeria</option> + <option value="AD">Andorra</option> + <option value="AO">Angola</option> + <option value="AG">Antigua and Barbuda</option> + <option value="AR">Argentina</option> + <option value="AM">Armenia</option> + <option value="AU">Australia</option> + <option value="AT">Austria</option> + <option value="AZ">Azerbaijan</option> + <option value="BS">Bahamas</option> + <option value="BH">Bahrain</option> + <option value="BD">Bangladesh</option> + <option value="BB">Barbados</option> + <option value="BY">Belarus</option> + <option value="BE">Belgium</option> + <option value="BZ">Belize</option> + <option value="BJ">Benin</option> + <option value="BT">Bhutan</option> + <option value="BO">Bolivia (Plurinational State of)</option> + <option value="BA">Bosnia and Herzegovina</option> + <option value="BW">Botswana</option> + <option value="BR">Brazil</option> + <option value="BN">Brunei Darussalam</option> + <option value="BG">Bulgaria</option> + <option value="BF">Burkina Faso</option> + <option value="BI">Burundi</option> + <option value="CV">Cabo Verde</option> + <option value="KH">Cambodia</option> + <option value="CM">Cameroon</option> + <option value="CA">Canada</option> + <option value="CF">Central African Republic</option> + <option value="TD">Chad</option> + <option value="CL">Chile</option> + <option value="CN">China</option> + <option value="CO">Colombia</option> + <option value="KM">Comoros</option> + <option value="CG">Congo</option> + <option value="CD">Congo, Democratic Republic of the</option> + <option value="CR">Costa Rica</option> + <option value="CI">Côte d'Ivoire</option> + <option value="HR">Croatia</option> + <option value="CU">Cuba</option> + <option value="CY">Cyprus</option> + <option value="CZ">Czechia</option> + <option value="DK">Denmark</option> + <option value="DJ">Djibouti</option> + <option value="DM">Dominica</option> + <option value="DO">Dominican Republic</option> + <option value="EC">Ecuador</option> + <option value="EG">Egypt</option> + <option value="SV">El Salvador</option> + <option value="GQ">Equatorial Guinea</option> + <option value="ER">Eritrea</option> + <option value="EE">Estonia</option> + <option value="SZ">Eswatini</option> + <option value="ET">Ethiopia</option> + <option value="FJ">Fiji</option> + <option value="FI">Finland</option> + <option value="FR">France</option> + <option value="GA">Gabon</option> + <option value="GM">Gambia</option> + <option value="GE">Georgia</option> + <option value="DE">Germany</option> + <option value="GH">Ghana</option> + <option value="GR">Greece</option> + <option value="GD">Grenada</option> + <option value="GT">Guatemala</option> + <option value="GN">Guinea</option> + <option value="GW">Guinea-Bissau</option> + <option value="GY">Guyana</option> + <option value="HT">Haiti</option> + <option value="HN">Honduras</option> + <option value="HU">Hungary</option> + <option value="IS">Iceland</option> + <option value="IN">India</option> + <option value="ID">Indonesia</option> + <option value="IR">Iran (Islamic Republic of)</option> + <option value="IQ">Iraq</option> + <option value="IE">Ireland</option> + <option value="IL">Israel</option> + <option value="IT">Italy</option> + <option value="JM">Jamaica</option> + <option value="JP">Japan</option> + <option value="JO">Jordan</option> + <option value="KZ">Kazakhstan</option> + <option value="KE">Kenya</option> + <option value="KI">Kiribati</option> + <option value="KP">Korea (Democratic People's Republic of)</option> + <option value="KR">Korea, Republic of</option> + <option value="KW">Kuwait</option> + <option value="KG">Kyrgyzstan</option> + <option value="LA">Lao People's Democratic Republic</option> + <option value="LV">Latvia</option> + <option value="LB">Lebanon</option> + <option value="LS">Lesotho</option> + <option value="LR">Liberia</option> + <option value="LY">Libya</option> + <option value="LI">Liechtenstein</option> + <option value="LT">Lithuania</option> + <option value="LU">Luxembourg</option> + <option value="MG">Madagascar</option> + <option value="MW">Malawi</option> + <option value="MY">Malaysia</option> + <option value="MV">Maldives</option> + <option value="ML">Mali</option> + <option value="MT">Malta</option> + <option value="MH">Marshall Islands</option> + <option value="MR">Mauritania</option> + <option value="MU">Mauritius</option> + <option value="MX">Mexico</option> + <option value="FM">Micronesia (Federated States of)</option> + <option value="MD">Moldova, Republic of</option> + <option value="MC">Monaco</option> + <option value="MN">Mongolia</option> + <option value="ME">Montenegro</option> + <option value="MA">Morocco</option> + <option value="MZ">Mozambique</option> + <option value="MM">Myanmar</option> + <option value="NA">Namibia</option> + <option value="NR">Nauru</option> + <option value="NP">Nepal</option> + <option value="NL">Netherlands</option> + <option value="NZ">New Zealand</option> + <option value="NI">Nicaragua</option> + <option value="NE">Niger</option> + <option value="NG">Nigeria</option> + <option value="MK">North Macedonia</option> + <option value="NO">Norway</option> + <option value="OM">Oman</option> + <option value="PK">Pakistan</option> + <option value="PW">Palau</option> + <option value="PA">Panama</option> + <option value="PG">Papua New Guinea</option> + <option value="PY">Paraguay</option> + <option value="PE">Peru</option> + <option value="PH">Philippines</option> + <option value="PL">Poland</option> + <option value="PT">Portugal</option> + <option value="QA">Qatar</option> + <option value="RO">Romania</option> + <option value="RU">Russian Federation</option> + <option value="RW">Rwanda</option> + <option value="KN">Saint Kitts and Nevis</option> + <option value="LC">Saint Lucia</option> + <option value="VC">Saint Vincent and the Grenadines</option> + <option value="WS">Samoa</option> + <option value="SM">San Marino</option> + <option value="ST">Sao Tome and Principe</option> + <option value="SA">Saudi Arabia</option> + <option value="SN">Senegal</option> + <option value="RS">Serbia</option> + <option value="SC">Seychelles</option> + <option value="SL">Sierra Leone</option> + <option value="SG">Singapore</option> + <option value="SK">Slovakia</option> + <option value="SI">Slovenia</option> + <option value="SB">Solomon Islands</option> + <option value="SO">Somalia</option> + <option value="ZA">South Africa</option> + <option value="SS">South Sudan</option> + <option value="ES">Spain</option> + <option value="LK">Sri Lanka</option> + <option value="SD">Sudan</option> + <option value="SR">Suriname</option> + <option value="SE">Sweden</option> + <option value="CH">Switzerland</option> + <option value="SY">Syrian Arab Republic</option> + <option value="TJ">Tajikistan</option> + <option value="TZ">Tanzania, United Republic of</option> + <option value="TH">Thailand</option> + <option value="TL">Timor-Leste</option> + <option value="TG">Togo</option> + <option value="TO">Tonga</option> + <option value="TT">Trinidad and Tobago</option> + <option value="TN">Tunisia</option> + <option value="TR">Turkey</option> + <option value="TM">Turkmenistan</option> + <option value="TV">Tuvalu</option> + <option value="UG">Uganda</option> + <option value="UA">Ukraine</option> + <option value="AE">United Arab Emirates</option> + <option value="GB">United Kingdom of Great Britain and Northern Ireland</option> + <option value="US">United States of America</option> + <option value="UY">Uruguay</option> + <option value="UZ">Uzbekistan</option> + <option value="VU">Vanuatu</option> + <option value="VE">Venezuela (Bolivarian Republic of)</option> + <option value="VN">Viet Nam</option> + <option value="YE">Yemen</option> + <option value="ZM">Zambia</option> + <option value="ZW">Zimbabwe</option> + </select> + </div> + + <div class="some-block option-block"> + <h4>Default Homepage</h4> + <select id="piped-homepage"> + <option value="trending">Trending</option> + <option value="feed">Feed</option> + </select> + </div> + + <div class="some-block option-block"> + <h4>Show Comments</h4> + <input id="piped-comments" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Minimize Description by default</h4> + <input id="piped-minimizeDescription" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Store Watch History</h4> + <input id="piped-watchHistory" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Enabled Codecs (Multiple)</h4> + <select id="piped-enabledCodecs" multiple> + <option value="av1">AV1</option> + <option value="vp9">VP9</option> + <option value="avc">AVC (h.264)</option> + </select> + </div> + + <div class="some-block option-block"> + <h4>Disable LBRY for Streaming</h4> + <input id="piped-disableLBRY" type="checkbox" /> + </div> + + <div class="some-block option-block"> + <h4>Enable Proxy for LBRY</h4> + <input id="piped-proxyLBRY" type="checkbox" /> + </div> + + </div> + <hr> <div id="piped-normal"> <div class="some-block option-block"> <h4>Default Instances</h4> @@ -808,6 +1128,7 @@ </form> <div class="checklist" id="piped-tor-custom-checklist"></div> </div> + <hr> </div> <div id="pipedMaterial"> @@ -862,8 +1183,6 @@ </div> </div> - <hr> - <div class="some-block option-block"> <h4>Embed Exceptions</h4> </div> diff --git a/src/pages/options/youtube/youtube.js b/src/pages/options/youtube/youtube.js index 97bfd44a..e3b8c5e7 100644 --- a/src/pages/options/youtube/youtube.js +++ b/src/pages/options/youtube/youtube.js @@ -1,7 +1,5 @@ import youtubeHelper from "../../../assets/javascripts/helpers/youtube/youtube.js"; - - let youtubeFrontendElement = document.getElementById("youtube-frontend"); let invidiousDivElement = document.getElementById("invidious"); let pipedDivElement = document.getElementById("piped"); @@ -17,10 +15,8 @@ function changeFrontendsSettings() { console.log("customSettingsDivElement", customSettingsDivElement[0].style.display); if (enableYoutubeCustomSettingsElement.checked) for (const item of customSettingsDivElement) item.style.display = 'block'; - else { - console.log("setting it to none"); + else for (const item of customSettingsDivElement) item.style.display = 'none'; - } if (frontend == 'invidious') { invidiousPipedPipedMaterialDivElement.style.display = 'block' @@ -70,6 +66,7 @@ function changeYoutubeEmbedFrontendsSettings(youtubeEmbedFrontend) { invidiousDivElement.style.display = 'none'; } } + youtubeFrontendElement.addEventListener("change", event => { let frontend = event.target.options[youtubeFrontendElement.selectedIndex].value @@ -100,7 +97,6 @@ enableYoutubeCustomSettingsElement.addEventListener("change", } ); - let volumeElement = document.getElementById("invidious-volume"); let volumeValueElement = document.getElementById("volume-value"); volumeElement.addEventListener("input", |