example of using topSites and chrome_url_override (#176)

* example of using topSites and chrome_url_override

* fixups suggested by @wbamberg
This commit is contained in:
Andy McKay
2017-01-30 17:16:54 -08:00
committed by wbamberg
parent ed31c81945
commit 590dac4989
5 changed files with 75 additions and 0 deletions

9
top-sites/README.md Normal file
View File

@@ -0,0 +1,9 @@
# Top Sites
## What it does
This extension replaces the built-in page shown when the user opens a new tab without specifying a page to load (for example, when the user presses Ctrl+T). The replacement page is populated with links taken from the topSites API.
# What it shows
How to use chrome_url_overrides and the topSites API.

6
top-sites/bootstrap.min.css vendored Normal file

File diff suppressed because one or more lines are too long

16
top-sites/manifest.json Normal file
View File

@@ -0,0 +1,16 @@
{
"manifest_version": 2,
"name": "Override examples",
"version": "0.1",
"chrome_url_overrides": {
"newtab": "sites.html"
},
"permissions": [
"topSites"
],
"applications": {
"gecko": {
"strict_min_version": "54.0a1"
}
}
}

21
top-sites/sites.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="bootstrap.min.css"/>
</head>
<body>
<div class="container">
<h3>Top Site and new tab override example</h3>
<p>For more examples see this
<a href="https://github.com/mdn/webextensions-examples">github repository</a>
or check the <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions">WebExtension
documentation</a>.
</p>
<div id="site-list">
</div>
</div>
<script src="sites.js"></script>
</body>
</html>

23
top-sites/sites.js Normal file
View File

@@ -0,0 +1,23 @@
browser.topSites.get()
.then((sites) => {
var div = document.getElementById('site-list');
if (!sites.length) {
div.innerText = 'No sites returned from the topSites API.';
return;
}
let ul = document.createElement('ul');
ul.className = 'list-group';
for (let site of sites) {
let li = document.createElement('li');
li.className = 'list-group-item';
let a = document.createElement('a');
a.href = site.url;
a.innerText = site.title || site.url;
li.appendChild(a);
ul.appendChild(li);
}
div.appendChild(ul);
});