provide an example using the history api

This commit is contained in:
Andy McKay
2016-06-06 16:57:30 -07:00
parent 911053e825
commit e6bbf3d41b
6 changed files with 123 additions and 0 deletions

11
history-deleter/README.md Normal file
View File

@@ -0,0 +1,11 @@
# History deleter
## What it does
This extension includes a page action with a popup specified as "history.html". The page action will not appear on about:... pages.
The popup shows a list of 5 history entries for the current domain. It provides a clear button to delete all entries for that domain.
## What it shows
How to use the history API.

View File

@@ -0,0 +1,5 @@
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
if (!tab.url.match(/^about:/)) {
chrome.pageAction.show(tab.id);
}
});

View File

@@ -0,0 +1,4 @@
html, body {
margin: 0.2em;
width: 350px;
}

View File

@@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="history.css"/>
</head>
<body>
<p>History for this domain (limited to 5 results):</p>
<p id="history"></p>
<p><a href="#" id="clear">Clear history for this domain</a></p>
<script src="history.js"></script>
</body>
</html>

View File

@@ -0,0 +1,63 @@
// A useful way to extract the domain from a url.
function get_hostname(url) {
var a = document.createElement('a');
a.href = url;
return a.hostname;
}
function no_history(hostname) {
document.getElementById('history').innerHTML = `No history for ${hostname}.`;
}
// When the page is loaded find the current tab and then use that to query
// the history.
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
var list = document.getElementById('history');
var hostname = get_hostname(tabs[0].url);
chrome.history.search(
// Search for all history entries for the current windows domain.
{text: hostname, maxResults: 5},
function(results) {
// What to show if there are no results.
if (results.length < 1) {
no_history(hostname);
} else {
// Because this could be a lot of entries, lets limit it to 5.
for (var k in results) {
var history = results[k];
var li = document.createElement('p');
var url = document.createTextNode(history.url);
li.appendChild(url);
list.appendChild(li);
}
}
}
);
});
function clearAll(e) {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
var hostname = get_hostname(tabs[0].url);
if (!hostname) {
// Don't try and delete history when there's no hostname.
return;
}
chrome.history.search(
{text: hostname},
// Search will return us a list of histories for this domain.
// Loop through them and delete them one by one.
function(results) {
for (k = 0; k < results.length; k++) {
chrome.history.deleteUrl({url: results[k].url});
}
// Clear out the UI.
no_history(hostname);
}
);
});
e.preventDefault();
}
document.getElementById('clear').addEventListener('click', clearAll);

View File

@@ -0,0 +1,24 @@
{
"applications": {
"gecko": {
"id": "history-deleter@mozilla.com"
}
},
"background": {
"scripts": ["background.js"]
},
"description": "Gives a popup to list and delete history on a domain.",
"homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/history-deleter",
"page_action": {
"default_title": "History deleter",
"default_popup": "history.html"
},
"permissions": [
"activeTab",
"history",
"tabs"
],
"manifest_version": 2,
"name": "History Deleter",
"version": "1.0"
}