From cd0596c2eb46fc4fbfdd0beb4191e3cd8b5a1b36 Mon Sep 17 00:00:00 2001 From: ManeraKai Date: Mon, 25 Apr 2022 18:48:39 +0300 Subject: Improving code structure. Added libreddit settings #192 --- src/pages/options/reddit/reddit.html | 86 ++++++++++++- src/pages/options/reddit/reddit.js | 243 +++++++++++++++++++++-------------- src/pages/options/twitter/twitter.js | 15 ++- 3 files changed, 243 insertions(+), 101 deletions(-) (limited to 'src/pages/options') diff --git a/src/pages/options/reddit/reddit.html b/src/pages/options/reddit/reddit.html index 80aa77c5..47c0b3b2 100644 --- a/src/pages/options/reddit/reddit.html +++ b/src/pages/options/reddit/reddit.html @@ -81,9 +81,93 @@

Bypass "Open in Reddit"

-
+
+

Enable Custom Settings (will use cookies)

+ +

+
+
+

Appearance

+
+
+

Theme

+ +
+
+

Interface

+
+
+

Front page

+ +
+
+

Front Layout

+ +
+
+

Wide UI

+ +
+
+

Content

+
+
+

Default subreddit post sort

+ +
+
+

Default comment sort

+ +
+
+

Show NSFW posts

+ +
+
+

Autoplay videos

+ +
+
+

Use HLS for videos

+ +
+
+

Hide notification about possible HLS usage

+ +
+

Default Instances

diff --git a/src/pages/options/reddit/reddit.js b/src/pages/options/reddit/reddit.js index 36bb8a5f..9fb5589a 100644 --- a/src/pages/options/reddit/reddit.js +++ b/src/pages/options/reddit/reddit.js @@ -1,48 +1,56 @@ import redditHelper from "../../../assets/javascripts/helpers/reddit.js"; import commonHelper from "../../../assets/javascripts/helpers/common.js"; -let disableRedditElement = document.getElementById("disable-reddit"); -disableRedditElement.addEventListener("change", - (event) => redditHelper.setDisableReddit(!event.target.checked) -); let libredditDivElement = document.getElementById("libreddit") let tedditDivElement = document.getElementById("teddit") +let enableLibredditSettingsElement = document.getElementById("enable-libreddit-custom-settings"); +let customSettingsDivElement = document.getElementsByClassName("custom-settings"); -function changeFrontendsSettings(frontend) { - let frontendElement = document.getElementById("frontend"); - if (frontend == 'libreddit') { - frontendElement.innerHTML = 'Frontend'; - libredditDivElement.style.display = 'block'; - tedditDivElement.style.display = 'none'; - } - else if (frontend == 'teddit') { - frontendElement.innerHTML = 'Frontend'; - libredditDivElement.style.display = 'none'; - tedditDivElement.style.display = 'block'; - } - else if (frontend == 'old') { - frontendElement.innerHTML = `Frontend: This isn't a fully private frontend`; - libredditDivElement.style.display = 'none'; - tedditDivElement.style.display = 'none'; - } -} +let disableRedditElement = document.getElementById("disable-reddit"); let redditFrontendElement = document.getElementById("reddit-frontend"); -redditFrontendElement.addEventListener("change", - (event) => { - let frontend = event.target.options[redditFrontendElement.selectedIndex].value - redditHelper.setFrontend(frontend) - changeFrontendsSettings(frontend); - } -); - let protocolElement = document.getElementById("protocol") -protocolElement.addEventListener("change", - (event) => { - let protocol = event.target.options[protocolElement.selectedIndex].value - redditHelper.setProtocol(protocol); - changeProtocolSettings(protocol); - } -); +let bypassWatchOnRedditElement = document.getElementById("bypass-watch-on-reddit") + +let theme = document.getElementById('libreddit').getElementsByClassName('theme')[0]; +let front_page = document.getElementById('libreddit').getElementsByClassName('front_page')[0]; +let layout = document.getElementById('libreddit').getElementsByClassName('layout')[0]; +let wide = document.getElementById('libreddit').getElementsByClassName('wide')[0]; +let post_sort = document.getElementById('libreddit').getElementsByClassName('post_sort')[0]; +let comment_sort = document.getElementById('libreddit').getElementsByClassName('comment_sort')[0]; +let show_nsfw = document.getElementById('libreddit').getElementsByClassName('show_nsfw')[0]; +let autoplay_videos = document.getElementById('libreddit').getElementsByClassName('autoplay_videos')[0]; +let use_hls = document.getElementById('libreddit').getElementsByClassName('use_hls')[0]; +let hide_hls_notification = document.getElementById('libreddit').getElementsByClassName('hide_hls_notification')[0]; + +document.addEventListener("change", async () => { + await browser.storage.local.set({ + disableReddit: !disableRedditElement.checked, + bypassWatchOnReddit: bypassWatchOnRedditElement.checked, + redditProtocol: protocolElement.value, + redditFrontend: redditFrontendElement.value, + + enableLibredditCustomSettings: enableLibredditSettingsElement.checked, + + redditTheme: theme.value, + redditFrontPage: front_page.value, + redditLayout: layout.value, + redditWide: wide.checked, + redditPostSort: post_sort.value, + redditCommentSort: comment_sort.value, + redditShowNsfw: show_nsfw.checked, + redditAutoplayVideos: autoplay_videos.checked, + redditUseHls: use_hls.checked, + redditHideHlsNotification: hide_hls_notification.checked, + }); + init(); +}) + + +window.onblur = () => { + console.log('initting cookies') + redditHelper.initLibredditCookies(); + redditHelper.initTedditCookies(); +} function changeProtocolSettings(protocol) { let normalLibredditDiv = libredditDivElement.getElementsByClassName("normal")[0]; @@ -62,77 +70,126 @@ function changeProtocolSettings(protocol) { torTedditDiv.style.display = 'block'; torLibredditDiv.style.display = 'block'; } + if (enableLibredditSettingsElement.checked) + for (const item of customSettingsDivElement) item.style.display = 'block'; + else + for (const item of customSettingsDivElement) item.style.display = 'none'; } +function changeFrontendsSettings(frontend) { + let frontendElement = document.getElementById("frontend"); + if (frontend == 'libreddit') { + frontendElement.innerHTML = 'Frontend'; + libredditDivElement.style.display = 'block'; + tedditDivElement.style.display = 'none'; + } + else if (frontend == 'teddit') { + frontendElement.innerHTML = 'Frontend'; + libredditDivElement.style.display = 'none'; + tedditDivElement.style.display = 'block'; + } + else if (frontend == 'old') { + frontendElement.innerHTML = `Frontend: This isn't a fully private frontend`; + libredditDivElement.style.display = 'none'; + tedditDivElement.style.display = 'none'; + } +} +function init() { + redditHelper.init().then(() => { + browser.storage.local.get( + [ + "disableReddit", + "bypassWatchOnReddit", + "redditProtocol", + "redditFrontend", + + "enableLibredditCustomSettings", + + "redditTheme", + "redditFrontPage", + "redditLayout", + "redditWide", + "redditPostSort", + "redditCommentSort", + "redditShowNsfw", + "redditAutoplayVideos", + "redditUseHls", + "redditHideHlsNotification", + ], + r => { + disableRedditElement.checked = !r.disableReddit + bypassWatchOnRedditElement.checked = r.bypassWatchOnReddit + protocolElement.value = r.redditProtocol + redditFrontendElement.value = r.redditFrontend + enableLibredditSettingsElement.checked = r.enableLibredditCustomSettings + changeFrontendsSettings(r.redditFrontend); + changeProtocolSettings(r.redditProtocol); + + theme.value = r.redditTheme; + front_page.value = r.redditFrontPage; + layout.value = r.redditLayout; + wide.checked = r.redditWide; + post_sort.value = r.redditPostSort; + comment_sort.value = r.redditCommentSort; + show_nsfw.checked = r.redditShowNsfw; + autoplay_videos.checked = r.redditAutoplayVideos; + use_hls.checked = r.redditUseHls; + hide_hls_notification.checked = r.redditHideHlsNotification; + } + ) -let bypassWatchOnRedditElement = document.getElementById("bypass-watch-on-reddit") -bypassWatchOnRedditElement.addEventListener("change", - event => redditHelper.setBypassWatchOnReddit(event.target.checked) -); - -redditHelper.init().then(() => { - disableRedditElement.checked = !redditHelper.getDisableReddit(); - bypassWatchOnRedditElement.checked = redditHelper.getBypassWatchOnReddit(); - - let frontend = redditHelper.getFrontend(); - redditFrontendElement.value = frontend; - changeFrontendsSettings(frontend); - - let protocol = redditHelper.getProtocol(); - protocolElement.value = protocol; - changeProtocolSettings(protocol); + browser.storage.local.get("libredditLatency").then(r => { + commonHelper.processDefaultCustomInstances( + 'libreddit', + 'normal', + redditHelper, + document, + redditHelper.getLibredditNormalRedirectsChecks, + redditHelper.setLibredditNormalRedirectsChecks, + redditHelper.getLibredditNormalCustomRedirects, + redditHelper.setLibredditNormalCustomRedirects, + r.libredditLatency, + ) + }) - browser.storage.local.get("libredditLatency").then(r => { commonHelper.processDefaultCustomInstances( 'libreddit', - 'normal', + 'tor', redditHelper, document, - redditHelper.getLibredditNormalRedirectsChecks, - redditHelper.setLibredditNormalRedirectsChecks, - redditHelper.getLibredditNormalCustomRedirects, - redditHelper.setLibredditNormalCustomRedirects, - r.libredditLatency, + redditHelper.getLibredditTorRedirectsChecks, + redditHelper.setLibredditTorRedirectsChecks, + redditHelper.getLibredditTorCustomRedirects, + redditHelper.setLibredditTorCustomRedirects ) - }) - commonHelper.processDefaultCustomInstances( - 'libreddit', - 'tor', - redditHelper, - document, - redditHelper.getLibredditTorRedirectsChecks, - redditHelper.setLibredditTorRedirectsChecks, - redditHelper.getLibredditTorCustomRedirects, - redditHelper.setLibredditTorCustomRedirects - ) - - browser.storage.local.get("tedditLatency").then(r => { + browser.storage.local.get("tedditLatency").then(r => { + commonHelper.processDefaultCustomInstances( + 'teddit', + 'normal', + redditHelper, + document, + redditHelper.getTedditNormalRedirectsChecks, + redditHelper.setTedditNormalRedirectsChecks, + redditHelper.getTedditNormalCustomRedirects, + redditHelper.setTedditNormalCustomRedirects, + r.tedditLatency, + ); + }) + commonHelper.processDefaultCustomInstances( 'teddit', - 'normal', + 'tor', redditHelper, document, - redditHelper.getTedditNormalRedirectsChecks, - redditHelper.setTedditNormalRedirectsChecks, - redditHelper.getTedditNormalCustomRedirects, - redditHelper.setTedditNormalCustomRedirects, - r.tedditLatency, + redditHelper.getTedditTorRedirectsChecks, + redditHelper.setTedditTorRedirectsChecks, + redditHelper.getTedditTorCustomRedirects, + redditHelper.setTedditTorCustomRedirects ); - }) - - commonHelper.processDefaultCustomInstances( - 'teddit', - 'tor', - redditHelper, - document, - redditHelper.getTedditTorRedirectsChecks, - redditHelper.setTedditTorRedirectsChecks, - redditHelper.getTedditTorCustomRedirects, - redditHelper.setTedditTorCustomRedirects - ); - -}) + }) +} +init(); let latencyLibredditElement = document.getElementById("latency-libreddit"); let latencyLibredditLabel = document.getElementById("latency-libreddit-label"); diff --git a/src/pages/options/twitter/twitter.js b/src/pages/options/twitter/twitter.js index 4cb31643..bd611497 100644 --- a/src/pages/options/twitter/twitter.js +++ b/src/pages/options/twitter/twitter.js @@ -23,14 +23,13 @@ let muteVideos = document.getElementById('nitter').getElementsByClassName('muteV let autoplayGifs = document.getElementById('nitter').getElementsByClassName('autoplayGifs')[0]; let nitterElement = document.getElementById("nitter"); -document.addEventListener("change", async _ => { - twitterHelper.setDisable(!disableTwitterElement.checked) - twitterHelper.setProtocol(protocolElement.value); - twitterHelper.setEnableCustomSettings(enableYoutubeCustomSettingsElement.checked); - twitterHelper.setBypassWatchOnTwitter(bypassWatchOnTwitterElement.checked); - changeProtocolSettings(protocolElement.value); +document.addEventListener("change", async () => { + await browser.storage.local.set({ + disableTwitter: !disableTwitterElement.checked, + twitterProtocol: protocolElement.value, + enableTwitterCustomSettings: enableYoutubeCustomSettingsElement.checked, + bypassWatchOnTwitter: bypassWatchOnTwitterElement.checked, - await twitterHelper.setSettings({ // Display nitterTheme: theme.value, nitterInfiniteScroll: infiniteScroll.checked, @@ -121,6 +120,8 @@ function init() { } init(); +window.onblur = twitterHelper.initNitterCookies; + let latencyElement = document.getElementById("latency"); let latencyLabel = document.getElementById("latency-label"); latencyElement.addEventListener("click", -- cgit 1.4.1