From db02e7cf8ef7716ce8c97c91a6053ff9bd5ac759 Mon Sep 17 00:00:00 2001 From: Krzysztof Jan Modras Date: Wed, 2 Dec 2020 14:29:19 +0100 Subject: [PATCH 1/3] Better Ghostery Search integration Send user account info with all Ghostery Search requests so UI can reflect the state of account. Use templates for tiles. --- src/background.js | 43 +++++++++++++++++++++++++++--- src/content/login-cta.js | 16 ----------- src/content/top-sites.js | 57 ++++++++-------------------------------- src/manifest.json | 2 +- 4 files changed, 51 insertions(+), 67 deletions(-) delete mode 100644 src/content/login-cta.js diff --git a/src/background.js b/src/background.js index 99420d2..3884f62 100644 --- a/src/background.js +++ b/src/background.js @@ -15,6 +15,19 @@ class AccessToken { return AccessToken.TOKEN; } + static parse() { + if (!AccessToken.TOKEN) { + return {}; + } + const base64Url = AccessToken.TOKEN.split('.')[1]; + const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/'); + const jsonPayload = decodeURIComponent(atob(base64).split('').map(function(c) { + return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2); + }).join('')); + + return JSON.parse(jsonPayload); + } + static destroy() { console.warn("ACCESS_TOKEN removed") AccessToken.TOKEN = null; @@ -100,13 +113,35 @@ async function start() { requestHeaders, }; }, { urls: [`${SERP_BASE_URL}/search*`]}, ["blocking", "requestHeaders"]); + + browser.webRequest.onBeforeSendHeaders.addListener(async (details) => { + const { requestHeaders } = details; + + requestHeaders.push({ + name: "X-Ghostery-Browser", + value: "true", + }); + + requestHeaders.push({ + name: "X-Ghostery-Login", + value: String(!!AccessToken.TOKEN), + }); + + if (AccessToken.TOKEN) { + const scopes = AccessToken.parse().scopes || []; + requestHeaders.push({ + name: "X-Ghostery-Scopes", + value: scopes.join(','), + }); + } + + return { + requestHeaders, + }; + }, { urls: [`${SERP_BASE_URL}/*`]}, ["blocking", "requestHeaders"]); } browser.runtime.onMessage.addListener(async ({ action, args }, { tab }) => { - if (action === 'getTokenCount') { - return Promise.resolve(tokenPool.tokens.length); - } - if (action === 'getTopSites') { if (browser.ghostery.getPref('app.update.channel') === 'release') { return; diff --git a/src/content/login-cta.js b/src/content/login-cta.js deleted file mode 100644 index a629b76..0000000 --- a/src/content/login-cta.js +++ /dev/null @@ -1,16 +0,0 @@ -"use strict" - -const loginButton = document.querySelector('#login-button'); -const signInTemplate = document.querySelector('#signin-button-template'); - -browser.runtime.sendMessage({ - action: 'getTokenCount' -}).then((result) => { - if (loginButton && signInTemplate && result === 0) { - while (loginButton.firstChild) { - loginButton.firstChild.remove(); - } - const signIn = signInTemplate.content.cloneNode(true); - loginButton.appendChild(signIn); - } -}); diff --git a/src/content/top-sites.js b/src/content/top-sites.js index ae3285e..a928cfb 100644 --- a/src/content/top-sites.js +++ b/src/content/top-sites.js @@ -1,61 +1,26 @@ "use strict"; (async function () { + function cleanup() { - const $content = document.querySelector('.content'); - const $oldTopSites = $content.querySelector('.topsites'); - if ($oldTopSites) { - $content.removeChild($oldTopSites); - } + const $topsites = document.querySelector('.top-sites'); + $topsites.innerHTML = ''; } async function loadTopSites() { - const $content = document.querySelector('.content'); + const $topsites = document.querySelector('.top-sites'); + const $tileTemplate = document.querySelector('#tile-template'); const topSites = await browser.runtime.sendMessage({ action: 'getTopSites' }); - const $topSitesWrapper = document.createElement('div'); - $topSitesWrapper.classList.add('topsites'); - $topSitesWrapper.style.display = 'flex'; - $topSitesWrapper.style.flexDirection = 'row'; - $topSitesWrapper.style.margin = '40px 0 0 0'; - $topSitesWrapper.style.flexWrap = 'wrap'; - $topSitesWrapper.style.justifyContent = 'center'; - - topSites.forEach(site => { - const $site = document.createElement('a'); - $site.setAttribute('href', site.url); - $site.style.display = 'flex'; - $site.style.flexDirection = 'column'; - $site.style.alignItems = 'center'; - $site.style.margin = '10px 7px'; - $site.style.textDecoration = 'none'; - $site.style.color = 'black'; - - const $favicon = document.createElement('img'); - $favicon.setAttribute('src', site.favicon); - $favicon.style.height = '48px'; - $favicon.style.width = '48px'; - $favicon.style.boxShadow = 'inset 0 0 0 1px rgba(249, 249, 250, 0.2), 0 1px 8px 0 rgba(12, 12, 13, 0.2)'; - $favicon.style.transition = 'box-shadow 150ms'; - $favicon.style.borderRadius = '5px'; - $favicon.style.backgroundColor = 'white'; - $site.appendChild($favicon); - - const $title = document.createElement('span'); - $title.innerText = site.title; - $title.style.marginTop = '5px'; - $title.style.maxWidth = '70px'; - $title.style.whiteSpace = 'nowrap'; - $title.style.overflow = 'hidden'; - $title.style.textOverflow = 'clip'; - $site.appendChild($title); - - $topSitesWrapper.appendChild($site); + topSites.slice(0, 5).forEach(site => { + const $tile = $tileTemplate.content.cloneNode(true); + $tile.querySelector('a').setAttribute('href', site.url); + $tile.querySelector('img').setAttribute('src', site.favicon); + $tile.querySelector('span').innerText = site.title; + $topsites.appendChild($tile); }); - - $content.appendChild($topSitesWrapper); } if (document.readyState === 'complete' || document.readyState === 'interactive') { diff --git a/src/manifest.json b/src/manifest.json index 212eee8..d78df32 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -21,7 +21,7 @@ "https://*.ghosterysearch.com/", "http://localhost/*" ], - "js": ["content/login-cta.js", "content/top-sites.js", "content/search-bar.js"] + "js": ["content/top-sites.js", "content/search-bar.js"] }, { "matches": [ "https://*.ghosterysearch.com/search*", From 63f8bf5c30e0356496aaab150c142c3f2929a111 Mon Sep 17 00:00:00 2001 From: Krzysztof Jan Modras Date: Wed, 2 Dec 2020 15:14:14 +0100 Subject: [PATCH 2/3] top sites for all --- src/background.js | 3 --- src/config.js | 2 +- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/src/background.js b/src/background.js index 3884f62..9876cda 100644 --- a/src/background.js +++ b/src/background.js @@ -143,9 +143,6 @@ async function start() { browser.runtime.onMessage.addListener(async ({ action, args }, { tab }) => { if (action === 'getTopSites') { - if (browser.ghostery.getPref('app.update.channel') === 'release') { - return; - } return (await browser.topSites.get({ newtab: true, includeFavicon: true, diff --git a/src/config.js b/src/config.js index 80ccbc3..cb2a647 100644 --- a/src/config.js +++ b/src/config.js @@ -1,4 +1,4 @@ -let DEBUG = false; +let DEBUG = true; const STAGING_BASE_URL = 'https://staging.ghosterysearch.com'; const PROD_BASE_URL = 'https://ghosterysearch.com'; const STAGING_AUTH_DOMAIN = '.ghosterystage.com'; From dcbdb5982d7c0fd6dcf2055cb7272ddc0a8755c9 Mon Sep 17 00:00:00 2001 From: Krzysztof Jan Modras Date: Wed, 2 Dec 2020 15:38:58 +0100 Subject: [PATCH 3/3] fixes --- src/background.js | 2 +- src/config.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/background.js b/src/background.js index 9876cda..f091105 100644 --- a/src/background.js +++ b/src/background.js @@ -114,7 +114,7 @@ async function start() { }; }, { urls: [`${SERP_BASE_URL}/search*`]}, ["blocking", "requestHeaders"]); - browser.webRequest.onBeforeSendHeaders.addListener(async (details) => { + browser.webRequest.onBeforeSendHeaders.addListener((details) => { const { requestHeaders } = details; requestHeaders.push({ diff --git a/src/config.js b/src/config.js index cb2a647..80ccbc3 100644 --- a/src/config.js +++ b/src/config.js @@ -1,4 +1,4 @@ -let DEBUG = true; +let DEBUG = false; const STAGING_BASE_URL = 'https://staging.ghosterysearch.com'; const PROD_BASE_URL = 'https://ghosterysearch.com'; const STAGING_AUTH_DOMAIN = '.ghosterystage.com';