diff --git a/source/background.js b/source/background.js index af4eb10..b78c593 100644 --- a/source/background.js +++ b/source/background.js @@ -122,6 +122,38 @@ chrome.runtime.onMessage.addListener( return true; } - }); + } +); +/** + * This listener does two things: + * - Opens the ThreatSlayer welcome page on installing the extension, and + * - Opens the welcome page on update + */ +chrome.runtime.onInstalled.addListener(function openWelcomeTab(details) { + const reason = details.reason + console.log('reason', reason); + + switch (reason) { + // user has installed ThreatSlayer + case 'install': + chrome.tabs.create({ + // TODO change this URL + url: 'https://yahoo.com' + }); + break; + // user has updated their ThreatSlayer version + case 'update': + chrome.tabs.create({ + // TODO change this URL + url: 'https://yahoo.com' + }); + break; + case 'chrome_update': + case 'shared_module_update': + default: + break; + } +}); + \ No newline at end of file diff --git a/source/dashboard.html b/source/dashboard.html index 9f0e147..10ebe6c 100644 --- a/source/dashboard.html +++ b/source/dashboard.html @@ -12,7 +12,6 @@ border: 30px solid #9336E5; text-align: center; font-family: 'THICCBOI-Bold'; - font-size: 123px; line-height: 310px; margin: auto; } @@ -41,7 +40,6 @@ } .statistic-value { font-family: 'THICCBOI'; - font-size: 56px; color: #222222; margin-top: 0; } @@ -81,7 +79,7 @@
Malicious Sites Detected
-+
0
diff --git a/source/static/dashboard.js b/source/static/dashboard.js index 16f440e..e9ab835 100644 --- a/source/static/dashboard.js +++ b/source/static/dashboard.js @@ -1,23 +1,68 @@ // convenience function to stringify large numbers to local formats with commas etc. const formatNumber = (num) => new Intl.NumberFormat().format(num); +// takes an integer and returns a string to set font size +const getFontSizeForTotal = (num) => { + const oneToThreeDigits = '123px'; + const fourDigits = '110px'; + const fiveDigits = '90px'; + const sixDigits = '75px'; + const sevenDigits = '60px'; + + let result; + + if (num >= 10**6) { + result = sevenDigits; + } else if (num >= 10**5) { + result = sixDigits; + } else if (num >= 10**4) { + result = fiveDigits; + } else if (num >= 10**3) { + result = fourDigits; + } else { + result = oneToThreeDigits; + } + + return result; +}; + +// takes an integer and returns a string to set font size +const getFontSizeForUnique = (num) => { + const defaultSize = '56px'; + const sixDigits = '40px'; + + let result; + + if (num >= 10**6) { + result = sixDigits; + } else { + result = defaultSize; + } + + return result; +}; + window.addEventListener("load", async function() { // get dashboard number for total URLs visited from local storage chrome.storage.local.get(["totalURLsVisited"]).then((result) => { const {totalURLsVisited = 1} = result; - // get HTML elements of dashboard numbers to fill in - const localUniqueURLsScannedCount = document.getElementById("local-unique-urls-scanned-count"); + // get HTML elements for total and unique URL counts const localURLsScannedCount = document.getElementById("local-urls-scanned-count"); + const localUniqueURLsScannedCount = document.getElementById("local-unique-urls-scanned-count"); - // Ratio 0.177 based on Interlock data sources - const uniqueURLsVisited = Math.ceil(totalURLsVisited * 0.177) || 1; - + // set and format *total* URLs const formattedTotalURLsVisited = formatNumber(totalURLsVisited); + + localURLsScannedCount.style.fontSize = getFontSizeForTotal(totalURLsVisited); + localURLsScannedCount.innerHTML = formattedTotalURLsVisited; + + // set and format unique URLs + const uniqueURLsVisited = Math.ceil(totalURLsVisited * 0.177) || 1; // Ratio 0.177 based on Interlock data sources const formattedUniqueURLsVisited = formatNumber(uniqueURLsVisited); + localUniqueURLsScannedCount.style.fontSize = getFontSizeForUnique(uniqueURLsVisited); localUniqueURLsScannedCount.innerHTML = `≈ ${formattedUniqueURLsVisited}`; - localURLsScannedCount.innerHTML = formattedTotalURLsVisited; }); // get dashboard number for malicious URLs visited from local storage @@ -70,7 +115,6 @@ window.addEventListener("load", async function() { toggleLabel.style.opacity = 0.4; notYet.style.display = 'inherit'; }, 250); - } }