From eb1d01b0639665645167a2e35df9d2bc4ef72b8d Mon Sep 17 00:00:00 2001 From: ManeraKai Date: Wed, 27 Apr 2022 19:51:34 +0300 Subject: [PATCH] Added proxiTok settings #197 --- pug/options/tiktok/tiktok.pug | 21 +++ src/assets/javascripts/helpers/reddit.js | 53 +++---- src/assets/javascripts/helpers/tiktok.js | 144 ++++++++++++------- src/pages/background/background.js | 3 +- src/pages/options/reddit/reddit.js | 1 - src/pages/options/tiktok/tiktok.html | 26 ++++ src/pages/options/tiktok/tiktok.js | 125 ++++++++++------- src/pages/popup/popup.js | 168 +++++++++-------------- 8 files changed, 308 insertions(+), 233 deletions(-) diff --git a/pug/options/tiktok/tiktok.pug b/pug/options/tiktok/tiktok.pug index e9017f9..31ae18d 100644 --- a/pug/options/tiktok/tiktok.pug +++ b/pug/options/tiktok/tiktok.pug @@ -18,8 +18,29 @@ body.option(dir="auto") option(value="normal" data-localise="__MSG_normal__") Normal option(value="tor" data-localise="__MSG_tor__") Tor + .some-block.option-block + h4(data-localise="__MSG_enableCustomSettings__") Enable Custom Settings (will use cookies) + input#enable-custom-settings(type="checkbox") + #proxiTok hr + .custom-settings + .some-block.option-block + h2 General + .some-block.option-block + h4(data-localise="__MSG_theme__") Theme + select.theme + option(value="default") Default + option(value="card") Card + + .some-block.option-block + h2 Api + .some-block.option-block + h4(data-localise="__MSG_legacyMode__") Legacy mode + select.api-legacy + option(value="on") On + option(value="off") Off + .normal include ../../widgets/instances.pug +instances('https://proxitok.com') diff --git a/src/assets/javascripts/helpers/reddit.js b/src/assets/javascripts/helpers/reddit.js index 9cd7600..35aec74 100644 --- a/src/assets/javascripts/helpers/reddit.js +++ b/src/assets/javascripts/helpers/reddit.js @@ -7,18 +7,15 @@ const targets = [ /^https?:\/{2}(i\.|preview\.)redd\.it/, ]; let redirects = { - // modern UI "libreddit": { "normal": [], "tor": [] }, - // old UI "teddit": { "normal": [], "tor": [] }, "desktop": "https://old.reddit.com", // desktop - "mobile": "https://i.reddit.com", // mobile }; const getRedirects = () => redirects; const getCustomRedirects = function () { @@ -186,10 +183,7 @@ function initLibredditCookies() { } } function initTedditCookies() { - let themeValue; - if (theme == 'light') themeValue = 'white'; - if (theme == 'dark') themeValue = 'dark'; - if (enableCustom && themeValue) { + if (enableCustom) { let checkedInstances = [ ...tedditNormalRedirectsChecks, ...tedditNormalCustomRedirects, @@ -200,26 +194,25 @@ function initTedditCookies() { browser.cookies.set({ url: instanceUrl, name: "theme", - value: themeValue + value: theme == 'dark' ? 'dark' : 'white' }) } } let alwaysUsePreferred; -// https://libreddit.exonip.de/vid/1mq8d0ma3yk81/720.mp4 -// https://libreddit.exonip.de/img/4v3t1vgvrzk81.png - -// https://teddit.net/vids/1mq8d0ma3yk81.mp4 -// https://teddit.net/pics/w:null_4v3t1vgvrzk81.png - - -// redd.it/t5379n -// https://v.redd.it/z08avb339n801/DASH_1_2_M -// https://i.redd.it/bfkhs659tzk81.jpg - - function redirect(url, type, initiator) { + // https://libreddit.exonip.de/vid/1mq8d0ma3yk81/720.mp4 + // https://libreddit.exonip.de/img/4v3t1vgvrzk81.png + + // https://teddit.net/vids/1mq8d0ma3yk81.mp4 + // https://teddit.net/pics/w:null_4v3t1vgvrzk81.png + + + // redd.it/t5379n + // https://v.redd.it/z08avb339n801/DASH_1_2_M + // https://i.redd.it/bfkhs659tzk81.jpg + if (disableReddit) return null; let protocolHost = commonHelper.protocolHost(url); @@ -263,17 +256,15 @@ function redirect(url, type, initiator) { if ( bypassWatchOnReddit && initiator && - ( - [...redirects.libreddit.normal, - ...redirects.libreddit.tor, - ...libredditNormalCustomRedirects, - ...libredditTorCustomRedirects, - ...redirects.teddit.normal, - ...redirects.teddit.tor, - ...tedditNormalCustomRedirects, - ...tedditTorCustomRedirects, - ].includes(initiator.origin) - ) + [...redirects.libreddit.normal, + ...redirects.libreddit.tor, + ...libredditNormalCustomRedirects, + ...libredditTorCustomRedirects, + ...redirects.teddit.normal, + ...redirects.teddit.tor, + ...tedditNormalCustomRedirects, + ...tedditTorCustomRedirects, + ].includes(initiator.origin) ) return 'BYPASSTAB'; if (type !== "main_frame" || url.pathname.match(bypassPaths)) return null; diff --git a/src/assets/javascripts/helpers/tiktok.js b/src/assets/javascripts/helpers/tiktok.js index fbadc2a..bd91849 100644 --- a/src/assets/javascripts/helpers/tiktok.js +++ b/src/assets/javascripts/helpers/tiktok.js @@ -81,24 +81,43 @@ function setDisable(val) { } let protocol; -const getProtocol = () => protocol; -function setProtocol(val) { - protocol = val; - browser.storage.local.set({ tiktokProtocol: val }) - console.log("tiktokProtocol: ", val) +let enableCustom; + +let theme; +let api_legacy; + +function initProxiTokCookies() { + console.log('initProxiTokCookies') + if (enableCustom) { + let checkedInstances = [ + ...proxiTokNormalRedirectsChecks, + ...proxiTokNormalCustomRedirects, + ...proxiTokTorRedirectsChecks, + ...proxiTokTorCustomRedirects + ] + + for (const instance of checkedInstances) { + browser.cookies.set({ url: instance, name: "theme", value: theme }) + browser.cookies.set({ url: instance, name: "api-legacy", value: api_legacy ? 'on' : 'off' }) + } + } } -function isTiktok(url, initiator) { - if (disable) return false; - if (initiator && ([...redirects.proxiTok.normal, ...proxiTokNormalCustomRedirects].includes(initiator.origin) || targets.includes(initiator.host))) return false; - return targets.some(rx => rx.test(url.href)); -} - -function redirect(url, type) { - // https://www.tiktok.com/@keysikaspol/video/7061265241887345946?for_redirection=@keysikaspol - // https://proxitok.pussthecat.org/video/7061265241887345946 +function redirect(url, type, initiator) { + if (disable) return; + if (initiator && + ( + [ + ...redirects.proxiTok.normal, + ...proxiTokNormalCustomRedirects + ].includes(initiator.origin) || + targets.includes(initiator.host) + ) + ) return; + if (!targets.some(rx => rx.test(url.href))) return; + // https://www.tiktok.com/@keysikaspol/video/7061265241887345946 // https://www.tiktok.com/@keysikaspol - // https://proxitok.herokuapp.com/video/7061265241887345946 + if (type != "main_frame") return null; @@ -108,8 +127,6 @@ function redirect(url, type) { if (instancesList.length === 0) return null; let randomInstance = commonHelper.getRandomInstance(instancesList); - // let pathName = url.pathname.replace(/@.*\/(?=video)/, ""); - return `${randomInstance}${url.pathname}`; } @@ -125,42 +142,76 @@ function reverse(url) { return `https://tiktok.com${url.pathname}${url.search}`; } +async function initDefaults() { + return new Promise(async resolve => { + fetch('/instances/data.json').then(response => response.text()).then(async data => { + let dataJson = JSON.parse(data); + redirects.proxiTok = dataJson.proxiTok; + await browser.storage.local.set({ + disableTiktok: false, + tiktokProtocol: "normal", + + tiktokRedirects: { + 'proxiTok': redirects.proxiTok, + }, + + proxiTokNormalRedirectsChecks: [...redirects.proxiTok.normal], + proxiTokNormalCustomRedirects: [], + + proxiTokTorRedirectsChecks: [...redirects.proxiTok.tor], + proxiTokTorCustomRedirects: [], + + enableTiktokCustomSettings: false, + + proxiTokTheme: 'default', + proxiTokApiLegacy: 'off', + + }); + resolve(); + }); + }) +} + async function init() { return new Promise(resolve => { - fetch('/instances/data.json').then(response => response.text()).then(data => { - let dataJson = JSON.parse(data); - browser.storage.local.get( - [ - "disableTiktok", - "tiktokRedirects", + console.log('redirects', redirects) + browser.storage.local.get( + [ + "disableTiktok", + "tiktokProtocol", + "tiktokRedirects", - "proxiTokNormalRedirectsChecks", - "proxiTokNormalCustomRedirects", + "proxiTokNormalRedirectsChecks", + "proxiTokNormalCustomRedirects", - "proxiTokTorRedirectsChecks", - "proxiTokTorCustomRedirects", + "proxiTokTorRedirectsChecks", + "proxiTokTorCustomRedirects", - "tiktokProtocol" - ], - r => { - redirects.proxiTok = dataJson.proxiTok; - disable = r.disableTiktok ?? false; + "enableTiktokCustomSettings", - protocol = r.tiktokProtocol ?? "normal"; + "proxiTokTheme", + "proxiTokApiLegacy", + ], + r => { + disable = r.disableTiktok; + protocol = r.tiktokProtocol; + redirects = r.tiktokRedirects; - if (r.tiktokRedirects) redirects = r.tiktokRedirects; + proxiTokNormalRedirectsChecks = r.proxiTokNormalRedirectsChecks; + proxiTokNormalCustomRedirects = r.proxiTokNormalCustomRedirects; - proxiTokNormalRedirectsChecks = r.proxiTokNormalRedirectsChecks ?? [...redirects.proxiTok.normal]; - proxiTokNormalCustomRedirects = r.proxiTokNormalCustomRedirects ?? []; + proxiTokTorRedirectsChecks = r.proxiTokTorRedirectsChecks; + proxiTokTorCustomRedirects = r.proxiTokTorCustomRedirects; - proxiTokTorRedirectsChecks = r.proxiTokTorRedirectsChecks ?? [...redirects.proxiTok.tor]; - proxiTokTorCustomRedirects = r.proxiTokTorCustomRedirects ?? []; + enableCustom = r.enableTiktokCustomSettings; - resolve(); - } - ) - }); - }); + theme = r.proxiTokTheme; + api_legacy = r.proxiTokApiLegacy; + + resolve(); + } + ) + }) } export default { @@ -174,9 +225,6 @@ export default { reverse, - getProtocol, - setProtocol, - getProxiTokNormalRedirectsChecks, setProxiTokNormalRedirectsChecks, getProxiTokTorRedirectsChecks, @@ -187,7 +235,9 @@ export default { getProxiTokNormalCustomRedirects, setProxiTokNormalCustomRedirects, + initProxiTokCookies, + redirect, - isTiktok, + initDefaults, init, }; diff --git a/src/pages/background/background.js b/src/pages/background/background.js index 1aecd81..d5de169 100644 --- a/src/pages/background/background.js +++ b/src/pages/background/background.js @@ -25,6 +25,7 @@ window.browser = window.browser || window.chrome; browser.runtime.onInstalled.addListener(async details => { if (details.reason == 'install') { await redditHelper.initDefaults(); + await tiktokHelper.initDefaults(); await wholeInit(); } }); @@ -85,7 +86,7 @@ browser.webRequest.onBeforeRequest.addListener( if (imgurHelper.isImgur(url, initiator)) newUrl = imgurHelper.redirect(url, details.type); - if (tiktokHelper.isTiktok(url, initiator)) newUrl = tiktokHelper.redirect(url, details.type); + if (!newUrl) newUrl = tiktokHelper.redirect(url, details.type, initiator); if (!newUrl) newUrl = pixivHelper.redirect(url, details.type, initiator); diff --git a/src/pages/options/reddit/reddit.js b/src/pages/options/reddit/reddit.js index 9fb5589..91160ec 100644 --- a/src/pages/options/reddit/reddit.js +++ b/src/pages/options/reddit/reddit.js @@ -47,7 +47,6 @@ document.addEventListener("change", async () => { window.onblur = () => { - console.log('initting cookies') redditHelper.initLibredditCookies(); redditHelper.initTedditCookies(); } diff --git a/src/pages/options/tiktok/tiktok.html b/src/pages/options/tiktok/tiktok.html index 67fc248..9aff1e4 100644 --- a/src/pages/options/tiktok/tiktok.html +++ b/src/pages/options/tiktok/tiktok.html @@ -69,8 +69,34 @@ +
+

Enable Custom Settings (will use cookies)

+ +
+
+
+

General

+
+
+

Theme

+ +
+
+

Api

+
+
+

Legacy mode

+ +
+

Default Instances

diff --git a/src/pages/options/tiktok/tiktok.js b/src/pages/options/tiktok/tiktok.js index 35cc668..299664d 100644 --- a/src/pages/options/tiktok/tiktok.js +++ b/src/pages/options/tiktok/tiktok.js @@ -1,64 +1,93 @@ import tiktokHelper from "../../../assets/javascripts/helpers/tiktok.js"; import commonHelper from "../../../assets/javascripts/helpers/common.js"; -let disableTiktokElement = document.getElementById("disable-tiktok"); -disableTiktokElement.addEventListener("change", - event => tiktokHelper.setDisable(!event.target.checked) -); +let disable = document.getElementById("disable-tiktok"); +let protocol = document.getElementById("protocol") -let protocolElement = document.getElementById("protocol") -protocolElement.addEventListener("change", - event => { - let protocol = event.target.options[protocolElement.selectedIndex].value - tiktokHelper.setProtocol(protocol); - changeProtocolSettings(protocol); - } -); +let enableCustomSettings = document.getElementById("enable-custom-settings"); +let customSettingsDiv = document.getElementsByClassName("custom-settings")[0]; -function changeProtocolSettings(protocol) { - let normalDiv = document.getElementsByClassName("normal")[0]; - let torDiv = document.getElementsByClassName("tor")[0]; - if (protocol == 'normal') { - normalDiv.style.display = 'block'; - torDiv.style.display = 'none'; - } - else if (protocol == 'tor') { - normalDiv.style.display = 'none'; - torDiv.style.display = 'block'; - } -} +let theme = document.getElementById('proxiTok').getElementsByClassName('theme')[0]; +let api_legacy = document.getElementById('proxiTok').getElementsByClassName('api-legacy')[0]; -tiktokHelper.init().then(() => { - disableTiktokElement.checked = !tiktokHelper.getDisable(); +document.addEventListener("change", async () => { + await browser.storage.local.set({ + disableTiktok: !disable.checked, + tiktokProtocol: protocol.value, - let protocol = tiktokHelper.getProtocol(); - protocolElement.value = protocol; - changeProtocolSettings(protocol); + enableTiktokCustomSettings: enableCustomSettings.checked, - browser.storage.local.get("proxiTokLatency").then(r => { + proxiTokTheme: theme.value, + proxiTokApiLegacy: api_legacy.value, + + }); + init(); +}) + +window.onblur = tiktokHelper.initProxiTokCookies; + +function init() { + tiktokHelper.init().then(() => { + browser.storage.local.get( + [ + "disableTiktok", + "tiktokProtocol", + + "enableTiktokCustomSettings", + + "proxiTokTheme", + "proxiTokApiLegacy", + ], + r => { + disable.checked = !r.disableTiktok; + protocol.value = r.tiktokProtocol; + let normalDiv = document.getElementsByClassName("normal")[0]; + let torDiv = document.getElementsByClassName("tor")[0]; + if (r.tiktokProtocol == 'normal') { + normalDiv.style.display = 'block'; + torDiv.style.display = 'none'; + } + else if (r.tiktokProtocol == 'tor') { + normalDiv.style.display = 'none'; + torDiv.style.display = 'block'; + } + + enableCustomSettings.checked = r.enableTiktokCustomSettings; + if (r.enableTiktokCustomSettings) + customSettingsDiv.style.display = 'block'; + else + customSettingsDiv.style.display = 'none'; + + theme.value = r.proxiTokTheme; + api_legacy.value = r.proxiTokApiLegacy + } + ) + browser.storage.local.get("proxiTokLatency").then(r => { + commonHelper.processDefaultCustomInstances( + 'proxiTok', + 'normal', + tiktokHelper, + document, + tiktokHelper.getProxiTokNormalRedirectsChecks, + tiktokHelper.setProxiTokNormalRedirectsChecks, + tiktokHelper.getProxiTokNormalCustomRedirects, + tiktokHelper.setProxiTokNormalCustomRedirects, + r.proxiTokLatency, + ); + }) commonHelper.processDefaultCustomInstances( 'proxiTok', - 'normal', + 'tor', tiktokHelper, document, - tiktokHelper.getProxiTokNormalRedirectsChecks, - tiktokHelper.setProxiTokNormalRedirectsChecks, - tiktokHelper.getProxiTokNormalCustomRedirects, - tiktokHelper.setProxiTokNormalCustomRedirects, - r.proxiTokLatency, - ); + tiktokHelper.getProxiTokTorRedirectsChecks, + tiktokHelper.setProxiTokTorRedirectsChecks, + tiktokHelper.getProxiTokTorCustomRedirects, + tiktokHelper.setProxiTokTorCustomRedirects + ) }) - commonHelper.processDefaultCustomInstances( - 'proxiTok', - 'tor', - tiktokHelper, - document, - tiktokHelper.getProxiTokTorRedirectsChecks, - tiktokHelper.setProxiTokTorRedirectsChecks, - tiktokHelper.getProxiTokTorCustomRedirects, - tiktokHelper.setProxiTokTorCustomRedirects - ) -}) +} +init(); let latencyElement = document.getElementById("latency"); let latencyLabel = document.getElementById("latency-label"); diff --git a/src/pages/popup/popup.js b/src/pages/popup/popup.js index 53e8c10..6014690 100644 --- a/src/pages/popup/popup.js +++ b/src/pages/popup/popup.js @@ -39,117 +39,75 @@ let disableTiktokElement = document.getElementById("disable-tiktok"); let disablePixivElement = document.getElementById("disable-pixiv"); let disableSpotifyElement = document.getElementById("disable-spotify"); -async function wholeInit() { - await youtubeHelper.init(); - await youtubeMusicHelper.init(); - await twitterHelper.init(); - await instagramHelper.init(); - await mapsHelper.init(); - await redditHelper.init(); - await searchHelper.init(); - await translateHelper.init(); - await wikipediaHelper.init(); - await imgurHelper.init(); - await tiktokHelper.init(); - await pixivHelper.init(); - await spotifyHelper.init(); - await sendTargetsHelper.init(); - await peertubeHelper.init(); - await lbryHelper.init(); - await mediumHelper.init(); -}; - let copyRawElement = document.getElementById('copy_raw'); -wholeInit().then(() => { - disableTwitterElement.checked = !twitterHelper.getDisable(); - disableYoutubeElement.checked = !youtubeHelper.getDisable(); - disableYoutubeMusicElement.checked = !youtubeMusicHelper.getDisable(); - disableInstagramElement.checked = !instagramHelper.getDisable(); - disableMapsElement.checked = !mapsHelper.getDisable(); - disableRedditElement.checked = !redditHelper.getDisableReddit(); - disableSearchElement.checked = !searchHelper.getDisable(); - disableElement.checked = !translateHelper.getDisable(); - disableWikipediaElement.checked = !wikipediaHelper.getDisable(); - disableImgurElement.checked = !imgurHelper.getDisable(); - disableTiktokElement.checked = !tiktokHelper.getDisable(); - disablePixivElement.checked = !pixivHelper.getDisable(); - disableSpotifyElement.checked = !spotifyHelper.getDisable(); - disableMediumElement.checked = !mediumHelper.getDisable(); - disablePeertubeElement.checked = !peertubeHelper.getDisable(); - disableLbryElement.checked = !lbryHelper.getDisable(); +browser.storage.local.get( + [ + "disableTwitter", + "disableYoutube", + "disableYoutubeMusic", + "disableInstagram", + "disableMaps", + "disableReddit", + "disableSearch", + "translateDisable", + "disableWikipedia", + "disableImgur", + "disableTiktok", + "disablePixiv", + "disableSpotifyTargets", + "disableMedium", + "disablePeertubeTargets", + "disableLbryTargets", + "disableSendTarget", + ], + r => { + disableTwitterElement.checked = !r.disableTwitter; + disableYoutubeElement.checked = !r.disableYoutube; + disableYoutubeMusicElement.checked = !r.disableYoutubeMusic; + disableInstagramElement.checked = !r.disableInstagram; + disableMapsElement.checked = !r.disableMaps; + disableRedditElement.checked = !r.disableReddit; + disableSearchElement.checked = !r.disableSearch; + disableElement.checked = !r.translateDisable; + disableWikipediaElement.checked = !r.disableWikipedia; + disableImgurElement.checked = !r.disableImgur; + disableTiktokElement.checked = !r.disableTiktok; + disablePixivElement.checked = !r.disablePixiv; + disableSpotifyElement.checked = !r.disableSpotifyTargets; + disableMediumElement.checked = !r.disableMedium; + disablePeertubeElement.checked = !r.disablePeertubeTargets; + disableLbryElement.checked = !r.disableLbryTargets; + disableSendTargetsElement.checked = r.disableSendTarget; + } +) - let changeInstanceElement = document.getElementById("change-instance") - changeInstanceElement.addEventListener("click", switchInstance); - copyRawElement.addEventListener("click", copyRaw); +document.addEventListener("change", () => { + browser.storage.local.set({ + disableTwitter: !disableTwitterElement.checked, + disableYoutube: !disableYoutubeElement.checked, + disableYoutubeMusic: !disableYoutubeMusicElement.checked, + disableInstagram: !disableInstagramElement.checked, + disableMaps: !disableMapsElement.checked, + disableReddit: !disableRedditElement.checked, + disableSearch: !disableSearchElement.checked, + translateDisable: !disableElement.checked, + disableWikipedia: !disableWikipediaElement.checked, + disableImgur: !disableImgurElement.checked, + disableTiktok: !disableTiktokElement.checked, + disablePixiv: !disablePixivElement.checked, + disableSpotifyTargets: !disableSpotifyElement.checked, + disableMedium: !disableMediumElement.checked, + disablePeertubeTargets: !disablePeertubeElement.checked, + disableLbryTargets: !disableLbryElement.checked, + disableSendTarget: !disableSendTargetsElement.checked, + }); }) -disableTwitterElement.addEventListener("change", - event => twitterHelper.setDisable(!event.target.checked) -); -disableYoutubeElement.addEventListener("change", - event => youtubeHelper.setDisable(!event.target.checked) -); +let changeInstanceElement = document.getElementById("change-instance") +changeInstanceElement.addEventListener("click", switchInstance); +copyRawElement.addEventListener("click", copyRaw); -disableYoutubeMusicElement.addEventListener("change", - event => youtubeMusicHelper.setDisable(!event.target.checked) -); - -disableInstagramElement.addEventListener("change", - event => instagramHelper.setDisable(!event.target.checked) -); - -disableMapsElement.addEventListener("change", - event => mapsHelper.setDisable(!event.target.checked) -); - -disableRedditElement.addEventListener("change", - event => redditHelper.setDisableReddit(!event.target.checked) -); - -disableSearchElement.addEventListener("change", - event => searchHelper.setDisable(!event.target.checked) -); - -disableElement.addEventListener("change", - event => translateHelper.setDisable(!event.target.checked) -); - -disableWikipediaElement.addEventListener("change", - event => wikipediaHelper.setDisable(!event.target.checked) -); - -disableImgurElement.addEventListener("change", - event => imgurHelper.setDisable(!event.target.checked) -); - -disableTiktokElement.addEventListener("change", - event => tiktokHelper.setDisable(!event.target.checked) -); - -disablePixivElement.addEventListener("change", - event => pixivHelper.setDisable(!event.target.checked) -); - -disableSpotifyElement.addEventListener("change", - event => spotifyHelper.setDisable(!event.target.checked) -); - -disableMediumElement.addEventListener("change", - event => mediumHelper.setDisable(!event.target.checked) -); - -disablePeertubeElement.addEventListener("change", - event => peertubeHelper.setDisable(!event.target.checked) -); - -disableLbryElement.addEventListener("change", - event => lbryHelper.setDisable(!event.target.checked) -); - -disableSendTargetsElement.addEventListener("change", - event => sendTargetsHelper.setDisable(!event.target.checked) -); document.getElementById("more-options").addEventListener("click", () => browser.runtime.openOptionsPage()