add in managed example (#287)

* add in managed example

* Updated favourite-colour README to point to the storage.managed documentation
This commit is contained in:
Andy McKay
2017-10-24 16:34:28 -07:00
committed by wbamberg
parent b269b12a61
commit 17a58bc196
4 changed files with 28 additions and 5 deletions

View File

@@ -1,7 +1,23 @@
# Favourite Colour
Shows and stores your favourite colour, in storage.local
in the about:addons page for the add-on.
Shows and stores your favourite colour, in storage.sync in the about:addons page for the add-on.
Demonstrates: storing data with storage.local, runtime.openOptionsPage and
creating an options page.
Demonstrates:
* storing data with storage.sync
* reading data from storage.managed,
* creating an options page and opening it with `runtime.openOptionsPage()`.
To have Firefox read data from storage.managed, create a file with the following contents:
{
"name": "favourite-colour-examples@mozilla.org",
"description": "ignored",
"type": "storage",
"data": {
"colour": "management thinks it should be blue!"
}
}
Name the file `"favourite-colour-examples@mozilla.org.json"` and follow the instructions in the [`storage.managed` documentation](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/storage/managed) to make the file discoverable by the extension (on OS X and Linux this means copying it to a specific location, while on Windows it means creating a specific registry key pointing to the file's location).

View File

@@ -17,7 +17,8 @@
"version": "1.1",
"applications": {
"gecko": {
"id": "favourite-colour-examples@mozilla.org"
"id": "favourite-colour-examples@mozilla.org",
"strict_min_version": "57.0a1"
}
}
}

View File

@@ -6,6 +6,7 @@
</head>
<body>
<p>storage.managed colour: <b id="managed-colour">no value found</b></p>
<form>
<label>Favourite colour</label>
<input type="text" id="colour" >

View File

@@ -6,6 +6,11 @@ function saveOptions(e) {
}
function restoreOptions() {
var storageItem = browser.storage.managed.get('colour');
storageItem.then((res) => {
document.querySelector("#managed-colour").innerText = res.colour;
});
var gettingItem = browser.storage.sync.get('colour');
gettingItem.then((res) => {
document.querySelector("#colour").value = res.colour || 'Firefox red';