add in navigation types (#305)

This commit is contained in:
Andy McKay
2017-12-08 09:53:33 -08:00
committed by wbamberg
parent 5a10260adf
commit 8b5f320c1a
3 changed files with 56 additions and 27 deletions

View File

@@ -1,17 +1,30 @@
// Load existent stats with the storage API.
var gettingStoredStats = browser.storage.local.get("hostNavigationStats");
var gettingStoredStats = browser.storage.local.get();
gettingStoredStats.then(results => {
// Initialize the saved stats if not yet initialized.
if (!results.hostNavigationStats) {
if (!results.stats) {
results = {
hostNavigationStats: {}
host: {},
type: {}
};
}
const {hostNavigationStats} = results;
// Monitor completed navigation events and update
// stats accordingly.
browser.webNavigation.onCommitted.addListener((evt) => {
if (evt.frameId !== 0) {
return;
}
let transitionType = evt.transitionType;
results.type[transitionType] = results.type[transitionType] || 0;
results.type[transitionType]++;
// Persist the updated stats.
browser.storage.local.set(results);
});
browser.webNavigation.onCompleted.addListener(evt => {
// Filter out any sub-frame related navigation event
if (evt.frameId !== 0) {
@@ -20,8 +33,8 @@ gettingStoredStats.then(results => {
const url = new URL(evt.url);
hostNavigationStats[url.hostname] = hostNavigationStats[url.hostname] || 0;
hostNavigationStats[url.hostname]++;
results.host[url.hostname] = results.host[url.hostname] || 0;
results.host[url.hostname]++;
// Persist the updated stats.
browser.storage.local.set(results);

View File

@@ -2,7 +2,11 @@
<html>
<body>
<h3>Top navigated hosts:</h3>
<ul>
<ul id="hosts">
<li>No data collected yet...</li>
</ul>
<h3>Top navigation types:</h3>
<ul id="types">
<li>No data collected yet...</li>
</ul>
<script src="popup.js"></script>

View File

@@ -1,32 +1,44 @@
// Get the saved stats and render the data in the popup window.
var gettingStoredStats = browser.storage.local.get("hostNavigationStats");
gettingStoredStats.then(results => {
if (!results.hostNavigationStats) {
return;
}
const MAX_ITEMS = 5;
const {hostNavigationStats} = results;
const sortedHostnames = Object.keys(hostNavigationStats).sort((a, b) => {
return hostNavigationStats[a] <= hostNavigationStats[b];
function sorter(array) {
return Object.keys(array).sort((a, b) => {
return array[a] <= array[b];
});
}
if (sortedHostnames.length === 0) {
return;
function addElements(element, array, callback) {
while(element.firstChild) {
element.removeChild(element.firstChild);
}
let listEl = document.querySelector("ul");
while(listEl.firstChild)
listEl.removeChild(listEl.firstChild);
const MAX_ITEMS = 5;
for (let i=0; i < sortedHostnames.length; i++) {
for (let i=0; i < array.length; i++) {
if (i >= MAX_ITEMS) {
break;
}
const listItem = document.createElement("li");
const hostname = sortedHostnames[i];
listItem.textContent = `${hostname}: ${hostNavigationStats[hostname]} visit(s)`;
listEl.appendChild(listItem);
listItem.textContent = callback(array[i]);
element.appendChild(listItem);
}
}
var gettingStoredStats = browser.storage.local.get();
gettingStoredStats.then(results => {
if (results.type.length === 0 || results.host.length === 0) {
return;
}
let hostElement = document.getElementById("hosts");
let sortedHosts = sorter(results.host);
addElements(hostElement, sortedHosts, (host) => {
return `${host}: ${results.host[host]} visit(s)`;
});
let typeElement = document.getElementById("types");
let sortedTypes = sorter(results.type);
addElements(typeElement, sortedTypes, (type) => {
return `${type}: ${results.type[type]} use(s)`;
});
});