Add an example for using the bookmarks API

bookmark-it/README.md

@@ -0,0 +1,20 @@
+# bookmark-it
+
+> This example uses APIs that are available from Firefox 47 onwards.
+
+## What it does
+
+Displays a simple button in the menu bar that toggles a bookmark for the currently active tab.
+
+To display the button, the extension registers a [browserAction](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/browserAction) in the manifest.
+
+A background script will listen for tab events and update the browserAction icon correspondingly. It also listens for `browserAction.onClicked` events to create or remove a bookmark when the user has clicked the icon.
+
+## What it shows
+
+* how to use the various `bookmarks` functions
+  * create a bookmark
+  * remove a bookmark
+  * search bookmarks by url
+* how to register a browserAction
+* how to listen for tab changes

bookmark-it/background.js

@@ -0,0 +1,64 @@
+var currentTab;
+var currentBookmark;
+
+/*
+ * Updates the browserAction icon to reflect whether the current page
+ * is already bookmarked.
+ */
+function updateIcon() {
+  chrome.browserAction.setIcon({
+    path: currentBookmark ? {
+      19: "icons/star-filled-19.png",
+      38: "icons/star-filled-38.png"
+    } : {
+      19: "icons/star-empty-19.png",
+      38: "icons/star-empty-38.png"
+    },
+    tabId: currentTab.id
+  });
+}
+
+/*
+ * Add or remove the bookmark on the current page.
+ */
+function toggleBookmark() {
+  if (currentBookmark) {
+    chrome.bookmarks.remove(currentBookmark.id);
+    currentBookmark = null;
+    updateIcon();
+  } else {
+    chrome.bookmarks.create({title: currentTab.title, url: currentTab.url}, function(bookmark) {
+      currentBookmark = bookmark;
+      updateIcon();
+    });
+  }
+}
+
+chrome.browserAction.onClicked.addListener(toggleBookmark);
+
+/*
+ * Switches currentTab and currentBookmark to reflect the currently active tab
+ */
+function updateTab() {
+  chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
+    if (tabs[0]) {
+      currentTab = tabs[0];
+
+      chrome.bookmarks.search({url: currentTab.url}, (bookmarks) => {
+        currentBookmark = bookmarks[0];
+        updateIcon();
+      });
+    }
+  });
+}
+
+// TODO listen for bookmarks.onCreated and bookmarks.onRemoved once Bug 1221764 lands
+
+// listen to tab URL changes
+chrome.tabs.onUpdated.addListener(updateTab);
+
+// listen to tab switching
+chrome.tabs.onActivated.addListener(updateTab);
+
+// update when the extension loads initially
+updateTab();

bookmark-it/icons/LICENSE

@@ -0,0 +1 @@
+All images in this folder were created by Johann Hofmann. The creator waives all rights to the images under the CC0 Public Domain Dedication. https://creativecommons.org/publicdomain/zero/1.0/

bookmark-it/manifest.json

@@ -0,0 +1,33 @@
+{
+  "manifest_version": 2,
+  "name": "Bookmark it!",
+  "version": "1.0",
+  "description": "A simple bookmark button",
+  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/bookmark-it",
+  "icons": {
+    "48": "icons/bookmark-it.png",
+    "96": "icons/bookmark-it@2x.png"
+  },
+
+  "applications": {
+    "gecko": {
+      "id": "bookmark-it-extension@mozilla.org",
+      "strict_min_version": "47.0a1"
+    }
+  },
+
+  "permissions": [
+    "bookmarks",
+    "tabs"
+  ],
+
+  "browser_action": {
+    "default_icon": "icons/star-empty-38.png",
+    "default_title": "Bookmark it!"
+  },
+
+  "background": {
+    "scripts": ["background.js"]
+  }
+
+}