Remove examples from gh-pages

apply-css/README.md

@@ -1,21 +0,0 @@
-# apply-css
-
-**This add-on injects CSS into web pages. The `addons.mozilla.org` domain disallows this operation, so this add-on will not work properly when it's run on pages in the `addons.mozilla.org` domain.**
-
-## What it does
-
-This extension includes:
-
-* a background script, "background.js"
-* a page action
-
-It adds the [page action](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/pageAction)
-to every tab the user opens. Clicking the page action
-for a tab applies some CSS using [tabs.insertCSS](https://developer.mozilla.org/docs/Mozilla/Add-ons/WebExtensions/API/tabs/insertCSS).
-
-Clicking again removes the CSS using [tabs.removeCSS](https://developer.mozilla.org/docs/Mozilla/Add-ons/WebExtensions/API/tabs/removeCSS).
-
-## What it shows
-
-* some basic page action functions
-* how to apply and remove CSS.

apply-css/background.js

@@ -1,69 +0,0 @@
-const CSS = "body { border: 20px solid red; }";
-const TITLE_APPLY = "Apply CSS";
-const TITLE_REMOVE = "Remove CSS";
-const APPLICABLE_PROTOCOLS = ["http:", "https:"];
-
-/*
-Toggle CSS: based on the current title, insert or remove the CSS.
-Update the page action's title and icon to reflect its state.
-*/
-function toggleCSS(tab) {
-
-  function gotTitle(title) {
-    if (title === TITLE_APPLY) {
-      browser.pageAction.setIcon({tabId: tab.id, path: "icons/on.svg"});
-      browser.pageAction.setTitle({tabId: tab.id, title: TITLE_REMOVE});
-      browser.tabs.insertCSS({code: CSS});
-    } else {
-      browser.pageAction.setIcon({tabId: tab.id, path: "icons/off.svg"});
-      browser.pageAction.setTitle({tabId: tab.id, title: TITLE_APPLY});
-      browser.tabs.removeCSS({code: CSS});
-    }
-  }
-
-  var gettingTitle = browser.pageAction.getTitle({tabId: tab.id});
-  gettingTitle.then(gotTitle);
-}
-
-/*
-Returns true only if the URL's protocol is in APPLICABLE_PROTOCOLS.
-*/
-function protocolIsApplicable(url) {
-  var anchor =  document.createElement('a');
-  anchor.href = url;
-  return APPLICABLE_PROTOCOLS.includes(anchor.protocol);
-}
-
-/*
-Initialize the page action: set icon and title, then show.
-Only operates on tabs whose URL's protocol is applicable.
-*/
-function initializePageAction(tab) {
-  if (protocolIsApplicable(tab.url)) {
-    browser.pageAction.setIcon({tabId: tab.id, path: "icons/off.svg"});
-    browser.pageAction.setTitle({tabId: tab.id, title: TITLE_APPLY});
-    browser.pageAction.show(tab.id);
-  }
-}
-
-/*
-When first loaded, initialize the page action for all tabs.
-*/
-var gettingAllTabs = browser.tabs.query({});
-gettingAllTabs.then((tabs) => {
-  for (tab of tabs) {
-    initializePageAction(tab);
-  }
-});
-
-/*
-Each time a tab is updated, reset the page action for that tab.
-*/
-browser.tabs.onUpdated.addListener((id, changeInfo, tab) => {
-  initializePageAction(tab);
-});
-
-/*
-Toggle CSS when the page action is clicked.
-*/
-browser.pageAction.onClicked.addListener(toggleCSS);

apply-css/icons/LICENSE

@@ -1,2 +0,0 @@
-These icons are taken from the "Material Design" iconset designed by Google:
-https://google.github.io/material-design-icons/.

apply-css/icons/off.svg

@@ -1 +0,0 @@
-<?xml version="1.0" ?><svg height="20px" version="1.1" viewBox="0 0 20 20" width="20px" xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" xmlns:xlink="http://www.w3.org/1999/xlink"><title/><desc/><defs/><g fill="none" fill-rule="evenodd" id="Page-1" stroke="none" stroke-width="1"><g fill="#FF0000" id="Core" transform="translate(-170.000000, -86.000000)"><g id="check-circle-outline-blank" transform="translate(170.000000, 86.000000)"><path d="M10,0 C4.5,0 0,4.5 0,10 C0,15.5 4.5,20 10,20 C15.5,20 20,15.5 20,10 C20,4.5 15.5,0 10,0 L10,0 Z M10,18 C5.6,18 2,14.4 2,10 C2,5.6 5.6,2 10,2 C14.4,2 18,5.6 18,10 C18,14.4 14.4,18 10,18 L10,18 Z" id="Shape"/></g></g></g></svg>

apply-css/icons/on.svg

@@ -1 +0,0 @@
-<?xml version="1.0" ?><svg height="20px" version="1.1" viewBox="0 0 20 20" width="20px" xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" xmlns:xlink="http://www.w3.org/1999/xlink"><title/><desc/><defs/><g fill="none" fill-rule="evenodd" id="Page-1" stroke="none" stroke-width="1"><g fill="#FF0000" id="Core" transform="translate(-338.000000, -338.000000)"><g id="radio-button-on" transform="translate(338.000000, 338.000000)"><path d="M10,5 C7.2,5 5,7.2 5,10 C5,12.8 7.2,15 10,15 C12.8,15 15,12.8 15,10 C15,7.2 12.8,5 10,5 L10,5 Z M10,0 C4.5,0 0,4.5 0,10 C0,15.5 4.5,20 10,20 C15.5,20 20,15.5 20,10 C20,4.5 15.5,0 10,0 L10,0 Z M10,18 C5.6,18 2,14.4 2,10 C2,5.6 5.6,2 10,2 C14.4,2 18,5.6 18,10 C18,14.4 14.4,18 10,18 L10,18 Z" id="Shape"/></g></g></g></svg>

apply-css/manifest.json

@@ -1,23 +0,0 @@
-{
-
-  "description": "Adds a page action to toggle applying CSS to pages.",
-  "manifest_version": 2,
-  "name": "apply-css",
-  "version": "1.0",
-  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/apply-css",
-
-  "background": {
-    "scripts": ["background.js"]
-  },
-
-  "page_action": {
-    "default_icon": "icons/off.svg",
-    "browser_style": true
-  },
-  
-  "permissions": [
-    "activeTab",
-    "tabs"
-  ]
-
-}

beastify/README.md

@@ -1,32 +0,0 @@
-# beastify
-
-**This add-on injects JavaScript into web pages. The `addons.mozilla.org` domain disallows this operation, so this add-on will not work properly when it's run on pages in the `addons.mozilla.org` domain.**
-
-## What it does ##
-
-The extension includes:
-
-* a browser action with a popup including HTML, CSS, and JS
-* a content script
-* three images, each of a different beast, packaged as web accessible resources
-
-When the user clicks the browser action button, the popup is shown, enabling
-the user to choose one of three beasts.
-
-When they choose a beast, the extension injects the content script into
-the current page, and sends the content script a message containing
-the name of the chosen beast.
-
-When the content script receives this message, it replaces the current page
-content with an image of the chosen beast.
-
-When the user clicks the reset button, the page reloads, and reverts to its original form.
-
-## What it shows ##
-
-* write a browser action with a popup
-* give the popup style and behavior using CSS and JS
-* inject a content script programmatically using `tabs.executeScript()`
-* send a message from the main extension to a content script
-* use web accessible resources to enable web pages to load packaged content
-* reload web pages

beastify/content_scripts/beastify.js

@@ -1,37 +0,0 @@
-/*
-beastify():
-* removes every node in the document.body,
-* then inserts the chosen beast
-* then removes itself as a listener 
-*/
-function beastify(request, sender, sendResponse) {
-  removeEverything();
-  insertBeast(request.beastURL);
-  browser.runtime.onMessage.removeListener(beastify);
-}
-
-/*
-Remove every node under document.body
-*/
-function removeEverything() {
-  while (document.body.firstChild) {
-    document.body.firstChild.remove();
-  }
-}
-
-/*
-Given a URL to a beast image, create and style an IMG node pointing to
-that image, then insert the node into the document.
-*/
-function insertBeast(beastURL) {
-  var beastImage = document.createElement("img");
-  beastImage.setAttribute("src", beastURL);
-  beastImage.setAttribute("style", "width: 100vw");
-  beastImage.setAttribute("style", "height: 100vh");
-  document.body.appendChild(beastImage);
-}
-
-/*
-Assign beastify() as a listener for messages from the extension.
-*/
-browser.runtime.onMessage.addListener(beastify);

beastify/icons/LICENSE

@@ -1,4 +0,0 @@
-
-The icon "beasts-32.png" is taken from the IconBeast Lite iconset, and used under the terms of its license (http://www.iconbeast.com/faq/), with a link back to the website: http://www.iconbeast.com/free/.
-
-The icon "beasts-48.png" is taken from Aha-Soft’s Free Retina iconset, and used under the terms of its license (http://www.aha-soft.com/free-icons/free-retina-icon-set/), with a link back to the website: http://www.aha-soft.com/.

beastify/manifest.json

@@ -1,28 +0,0 @@
-{
-
-  "description": "Adds a browser action icon to the toolbar. Click the button to choose a beast. The active tab's body content is then replaced with a picture of the chosen beast. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#beastify",
-  "manifest_version": 2,
-  "name": "Beastify",
-  "version": "1.0",
-  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/beastify",
-  "icons": {
-    "48": "icons/beasts-48.png"
-  },
-
-  "permissions": [
-    "activeTab"
-  ],  
-
-  "browser_action": {
-    "default_icon": "icons/beasts-32.png",
-    "default_title": "Beastify",
-    "default_popup": "popup/choose_beast.html"
-  },
-  
-  "web_accessible_resources": [
-    "beasts/frog.jpg",
-    "beasts/turtle.jpg",
-    "beasts/snake.jpg"
-  ]
-
-}

beastify/popup/choose_beast.css

@@ -1,27 +0,0 @@
-html, body {
-  width: 100px;
-}
-
-.button {
-  margin: 3% auto;
-  padding: 4px;
-  text-align: center;
-  font-size: 1.5em;
-  cursor: pointer;
-}
-
-.beast:hover {
-  background-color: #CFF2F2;
-}
-
-.beast {
-  background-color: #E5F2F2;
-}
-
-.clear {
-  background-color: #FBFBC9;
-}
-
-.clear:hover {
-  background-color: #EAEA9D;
-}

beastify/popup/choose_beast.html

@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-
-<html>
-  <head>
-    <meta charset="utf-8">
-    <link rel="stylesheet" href="choose_beast.css"/>
-  </head>
-
-<body>
-  <div class="button beast">Frog</div>
-  <div class="button beast">Turtle</div>
-  <div class="button beast">Snake</div>
-  <div class="button clear">Reset</div>
-  <script src="choose_beast.js"></script>
-</body>
-
-</html>

beastify/popup/choose_beast.js

@@ -1,48 +0,0 @@
-/*
-Given the name of a beast, get the URL to the corresponding image.
-*/
-function beastNameToURL(beastName) {
-  switch (beastName) {
-    case "Frog":
-      return browser.extension.getURL("beasts/frog.jpg");
-    case "Snake":
-      return browser.extension.getURL("beasts/snake.jpg");
-    case "Turtle":
-      return browser.extension.getURL("beasts/turtle.jpg");
-  }
-}
-
-/*
-Listen for clicks in the popup.
-
-If the click is on one of the beasts:
-  Inject the "beastify.js" content script in the active tab.
-
-  Then get the active tab and send "beastify.js" a message
-  containing the URL to the chosen beast's image.
-
-If it's on a button wich contains class "clear":
-  Reload the page.
-  Close the popup. This is needed, as the content script malfunctions after page reloads.
-*/
-document.addEventListener("click", (e) => {
-  if (e.target.classList.contains("beast")) {
-    var chosenBeast = e.target.textContent;
-    var chosenBeastURL = beastNameToURL(chosenBeast);
-
-    browser.tabs.executeScript(null, {
-      file: "/content_scripts/beastify.js"
-    });
-
-    var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
-    gettingActiveTab.then((tabs) => {
-      browser.tabs.sendMessage(tabs[0].id, {beastURL: chosenBeastURL});
-    });
-  }
-  else if (e.target.classList.contains("clear")) {
-    browser.tabs.reload();
-    window.close();
-
-    return;
-  }
-});

bookmark-it/README.md

@@ -1,20 +0,0 @@
-# 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

@@ -1,69 +0,0 @@
-var currentTab;
-var currentBookmark;
-
-/*
- * Updates the browserAction icon to reflect whether the current page
- * is already bookmarked.
- */
-function updateIcon() {
-  browser.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) {
-    browser.bookmarks.remove(currentBookmark.id);
-    currentBookmark = null;
-    updateIcon();
-  } else {
-    var creating = browser.bookmarks.create({title: currentTab.title, url: currentTab.url});
-    creating.then(function(bookmark) {
-      currentBookmark = bookmark;
-      updateIcon();
-    });
-  }
-}
-
-browser.browserAction.onClicked.addListener(toggleBookmark);
-
-/*
- * Switches currentTab and currentBookmark to reflect the currently active tab
- */
-function updateActiveTab(tabs) {
-
-  function updateTab(tabs) {
-    if (tabs[0]) {
-      currentTab = tabs[0];
-      var searching = browser.bookmarks.search({url: currentTab.url});
-      searching.then((bookmarks) => {
-        currentBookmark = bookmarks[0];
-        updateIcon();
-      });
-    }
-  }
-
-  var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
-  gettingActiveTab.then(updateTab);
-}
-
-// TODO listen for bookmarks.onCreated and bookmarks.onRemoved once Bug 1221764 lands
-
-// listen to tab URL changes
-browser.tabs.onUpdated.addListener(updateActiveTab);
-
-// listen to tab switching
-browser.tabs.onActivated.addListener(updateActiveTab);
-
-// update when the extension loads initially
-updateActiveTab();

bookmark-it/icons/LICENSE

@@ -1 +0,0 @@
-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

@@ -1,26 +0,0 @@
-{
-  "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"
-  },
-
-  "permissions": [
-    "bookmarks",
-    "tabs"
-  ],
-
-  "browser_action": {
-    "default_icon": "icons/star-empty-38.png",
-    "default_title": "Bookmark it!"
-  },
-
-  "background": {
-    "scripts": ["background.js"]
-  }
-
-}

borderify/README.md

@@ -1,16 +0,0 @@
-# borderify
-
-**This add-on injects JavaScript into web pages. The `addons.mozilla.org` domain disallows this operation, so this add-on will not work properly when it's run on pages in the `addons.mozilla.org` domain.**
-
-## What it does
-
-This extension just includes:
-
-* a content script, "borderify.js", that is injected into any pages
-under "mozilla.org/" or any of its subdomains
-
-The content script draws a border around the document.body.
-
-## What it shows
-
-* how to inject content scripts declaratively using manifest.json

borderify/borderify.js

@@ -1,4 +0,0 @@
-/*
-Just draw a border round the document.body.
-*/
-document.body.style.border = "5px solid red";

borderify/icons/LICENSE

@@ -1 +0,0 @@
-The icon “border-48.png” is taken from the Google Material Design iconset, and is used under the terms of the Creative Commons Attribution-ShareAlike license: http://creativecommons.org/licenses/by-sa/3.0/.

borderify/manifest.json

@@ -1,19 +0,0 @@
-{
-
-  "description": "Adds a solid red border to all webpages matching mozilla.org. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#borderify",
-  "manifest_version": 2,
-  "name": "Borderify",
-  "version": "1.0",
-  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/borderify",
-  "icons": {
-    "48": "icons/border-48.png"
-  },
-
-  "content_scripts": [
-    {
-      "matches": ["*://*.mozilla.org/*"],
-      "js": ["borderify.js"]
-    }
-  ]
-
-}

build/README.md

@@ -1,13 +0,0 @@
-This is a built version of most of the extensions in this repository. It excludes:
-
-* webpack-modules: because this one is all about building the module using webpack
-
-Because the extensions mostly have no application id, they can be signed by anyone on addons.mozilla.org. We haven't checked in or stored those ids so you can rebuild them if you'd like. We don't expect end users to be expecting these examples to update automatically (which is what the id is for).
-
-A couple do have ids. You can still sign them yourself by changing the application id. If you'd like to sign them officially and add them to this repo, contact @andymckay or @wbamberg and they can do it for you.
-
-If an extension changes and you'd like to rebuild it, then you should probably update the version number before building it.
-
-To build a new version of the extension use the web-ext sign command, for example:
-
-    pushd ../commands/ && web-ext sign --artifacts-dir ../build && popd

chill-out/README.md

@@ -1,26 +0,0 @@
-# chill-out
-
-## What it does
-
-After N seconds of inactivity (defined as the user not having navigated
-or switched away from the active tab) display a
-[page action](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/pageAction)
-for that tab.
-
-When the user clicks the page action,
-navigate to http://chilloutandwatchsomecatgifs.com/.
-
-"N" is set to 6 seconds in this example. Such a short period is chosen to make
-the extension's behavior more obvious, but this is not recommended in real life.
-Note that in Chrome, alarms cannot be set for less than a minute. In Chrome:
-
-* if you install this extension "unpacked", you'll see a warning
-in the console, but the alarm will still go off after 6 seconds
-* if you package the extension and install it, then the alarm will go off after
-a minute.
-
-## What it shows
-
-* how to use various `tabs` functions
-* how to show/hide a page action
-* how to set alarms and handle alarms going off

chill-out/background.js

@@ -1,74 +0,0 @@
-/*
-DELAY is set to 6 seconds in this example. Such a short period is chosen to make
-the extension's behavior more obvious, but this is not recommended in real life.
-Note that in Chrome, alarms cannot be set for less than a minute. In Chrome:
-
-* if you install this extension "unpacked", you'll see a warning
-in the console, but the alarm will still go off after 6 seconds
-* if you package the extension and install it, then the alarm will go off after
-a minute.
-*/
-var DELAY = 0.1;
-var CATGIFS = "http://chilloutandwatchsomecatgifs.com/";
-
-/*
-Restart alarm for the currently active tab, whenever background.js is run.
-*/
-var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
-gettingActiveTab.then((tabs) => {
-  restartAlarm(tabs[0].id);
-});
-
-/*
-Restart alarm for the currently active tab, whenever the user navigates.
-*/
-browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
-  if (!changeInfo.url) {
-    return;
-  }
-  var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
-  gettingActiveTab.then((tabs) => {
-    if (tabId == tabs[0].id) {
-      restartAlarm(tabId);
-    }
-  });
-});
-
-/*
-Restart alarm for the currently active tab, whenever a new tab becomes active.
-*/
-browser.tabs.onActivated.addListener((activeInfo) => {
-  restartAlarm(activeInfo.tabId);
-});
-
-/*
-restartAlarm: clear all alarms,
-then set a new alarm for the given tab.
-*/
-function restartAlarm(tabId) {
-  browser.pageAction.hide(tabId);
-  browser.alarms.clearAll();
-  var gettingTab = browser.tabs.get(tabId);
-  gettingTab.then((tab) => {
-    if (tab.url != CATGIFS) {
-      browser.alarms.create("", {delayInMinutes: DELAY});
-    }
-  });
-}
-
-/*
-On alarm, show the page action.
-*/
-browser.alarms.onAlarm.addListener((alarm) => {
-  var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
-  gettingActiveTab.then((tabs) => {
-    browser.pageAction.show(tabs[0].id);
-  });
-});
-
-/*
-On page action click, navigate the corresponding tab to the cat gifs.
-*/
-browser.pageAction.onClicked.addListener(function () {
-  browser.tabs.update({url: CATGIFS});
-});

chill-out/icons/LICENSE

@@ -1,3 +0,0 @@
-The icon "chillout-32.png" is taken from the IconBeast Lite iconset, and used under the terms of its license (http://www.iconbeast.com/faq/), with a link back to the website: http://www.iconbeast.com/free/.
-
-The icon "chillout-48.png" is taken from Aha-Soft’s Free Retina iconset, and used under the terms of its license (http://www.aha-soft.com/free-icons/free-retina-icon-set/), with a link back to the website: http://www.aha-soft.com/.

chill-out/manifest.json

@@ -1,25 +0,0 @@
-{
-  "manifest_version": 2,
-  "name": "chillout-page-action",
-  "version": "1.0",
-  "description": "Show a page action after a period of inactivity. Show cat gifs when the page action is clicked.",
-  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/chill-out",
-  "icons": {
-    "48": "icons/chillout-48.png"
-  },
-
-  "permissions": [
-    "alarms",
-    "tabs"
-  ],
-
-  "page_action": {
-    "default_icon": "icons/chillout-32.png",
-    "default_title": "Chill out"
-  },
-
-  "background": {
-    "scripts": ["background.js"]
-  }
-
-}

commands/README.md

@@ -1,13 +0,0 @@
-# commands
-
-This extension includes:
-
-* a background script, "background.js"
-
-All it does is:
-
-* register a shortcut (Ctrl+Shift+U) to send a command to the extension (Command+Shift+U on a Mac).",
-
-It shows:
-
-* how to use chrome.commands to register keyboard shortcuts for your extension.

commands/background.js

@@ -1,28 +0,0 @@
-/**
- * Returns all of the registered extension commands for this extension
- * and their shortcut (if active).
- *
- * Since there is only one registered command in this sample extension,
- * the returned `commandsArray` will look like the following:
- *    [{
- *       name: "toggle-feature",
- *       description: "Send a 'toggle-feature' event to the extension"
- *       shortcut: "Ctrl+Shift+U"
- *    }]
- */
-var gettingAllCommands = browser.commands.getAll();
-gettingAllCommands.then((commands) => {
-  for (command of commands) {
-    console.log(command);
-  }
-});
-
-/**
- * Fired when a registered command is activated using a keyboard shortcut.
- *
- * In this sample extension, there is only one registered command: "Ctrl+Shift+U".
- * On Mac, this command will automatically be converted to "Command+Shift+U".
- */
-browser.commands.onCommand.addListener((command) => {
-  console.log("onCommand event received for message: ", command);
-});

commands/manifest.json

@@ -1,17 +0,0 @@
-{
-  "name": "Sample Commands Extension",
-  "description": "Press Ctrl+Shift+U to send an event (Command+Shift+U on a Mac).",
-  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/commands",
-  "manifest_version": 2,
-  "version": "1.0",
-  "background": {
-    "scripts": ["background.js"]
-  },
-
-  "commands": {
-    "toggle-feature": {
-      "suggested_key": { "default": "Ctrl+Shift+U" },
-      "description": "Send a 'toggle-feature' event to the extension"
-    }
-  }
-}

context-menu-demo/README.md

@@ -1,31 +0,0 @@
-# context-menu-demo
-
-A demo of the [contextMenus API](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/contextMenus/).
-
-**This add-on injects JavaScript into web pages. The `addons.mozilla.org` domain disallows this operation, so this add-on will not work properly when it's run on pages in the `addons.mozilla.org` domain.**
-
-## What it does
-
-This add-on adds several items to the browser's context menu:
-
-* one shown when there is a selection in the page, that logs the selected text
-to the browser console when clicked.
-* one shown in all contexts, that is removed when clicked.
-* two "radio" items that are shown in all contexts.
-These items are grouped using a separator item on each side.
-One radio item adds a blue border to the page, the other adds a green border.
-Note that these buttons only work on normal web pages, not special pages
-like about:debugging.
-* one "checkbox" item, shown in all contexts, whose title is updated when the
-item is clicked.
-
-## What it shows
-
-* How to create various types of context menu item:
-  * normal
-  * radio
-  * separator
-  * checkbox
-* How to use contexts to control when an item appears.
-* How to update an item's properties.
-* How to remove an item.

context-menu-demo/_locales/en/messages.json

@@ -1,42 +0,0 @@
-{
-  "extensionName": {
-    "message": "Context menu demo",
-    "description": "Name of the extension."
-  },
-
-  "extensionDescription": {
-    "message": "Demonstrates the contextMenus API.",
-    "description": "Description of the add-on."
-  },
-
-  "contextMenuItemSelectionLogger": {
-    "message": "Log '%s' to the browser console",
-    "description": "Title of context menu item that logs the selected text when clicked."
-  },
-
-  "contextMenuItemRemoveMe": {
-    "message": "Remove me!",
-    "description": "Title of context menu item that removes itself when clicked."
-  },
-
-  "contextMenuItemGreenify": {
-    "message": "Greenify",
-    "description": "Title of context menu item that adds a green border when clicked."
-  },
-
-  "contextMenuItemBluify": {
-    "message": "Bluify",
-    "description": "Title of context menu item that adds a green border when clicked."
-  },
-
-  "contextMenuItemCheckMe": {
-    "message": "Check me",
-    "description": "Title of context menu item when the item is checked."
-  },
-
-  "contextMenuItemUncheckMe": {
-    "message": "Uncheck me",
-    "description": "Title of context menu item when the item is unchecked."
-  }
-
-}

context-menu-demo/background.js

@@ -1,141 +0,0 @@
-/*
-Called when the item has been created, or when creation failed due to an error.
-We'll just log success/failure here.
-*/
-function onCreated(n) {
-  if (browser.runtime.lastError) {
-    console.log(`Error: ${browser.runtime.lastError}`);
-  } else {
-    console.log("Item created successfully");
-  }
-}
-
-/*
-Called when the item has been removed.
-We'll just log success here.
-*/
-function onRemoved() {
-  console.log("Item removed successfully");
-}
-
-/*
-Called when there was an error.
-We'll just log the error here.
-*/
-function onError(error) {
-  console.log(`Error: ${error}`);
-}
-
-/*
-Create all the context menu items.
-*/
-browser.contextMenus.create({
-  id: "log-selection",
-  title: browser.i18n.getMessage("contextMenuItemSelectionLogger"),
-  contexts: ["selection"]
-}, onCreated);
-
-browser.contextMenus.create({
-  id: "remove-me",
-  title: browser.i18n.getMessage("contextMenuItemRemoveMe"),
-  contexts: ["all"]
-}, onCreated);
-
-browser.contextMenus.create({
-  id: "separator-1",
-  type: "separator",
-  contexts: ["all"]
-}, onCreated);
-
-browser.contextMenus.create({
-  id: "greenify",
-  type: "radio",
-  title: browser.i18n.getMessage("contextMenuItemGreenify"),
-  contexts: ["all"],
-  checked: true
-}, onCreated);
-
-browser.contextMenus.create({
-  id: "bluify",
-  type: "radio",
-  title: browser.i18n.getMessage("contextMenuItemBluify"),
-  contexts: ["all"],
-  checked: false
-}, onCreated);
-
-browser.contextMenus.create({
-  id: "separator-2",
-  type: "separator",
-  contexts: ["all"]
-}, onCreated);
-
-var checkedState = true;
-
-browser.contextMenus.create({
-  id: "check-uncheck",
-  type: "checkbox",
-  title: browser.i18n.getMessage("contextMenuItemUncheckMe"),
-  contexts: ["all"],
-  checked: checkedState
-}, onCreated);
-
-/*
-Set a colored border on the document in the given tab.
-
-Note that this only work on normal web pages, not special pages
-like about:debugging.
-*/
-var blue = 'document.body.style.border = "5px solid blue"';
-var green = 'document.body.style.border = "5px solid green"';
-
-function borderify(tabId, color) {
-  browser.tabs.executeScript(tabId, {
-    code: color
-  });
-}
-
-/*
-Toggle checkedState, and update the menu item's title
-appropriately.
-
-Note that we should not have to maintain checkedState independently like
-this, but have to because Firefox does not currently pass the "checked"
-property into the event listener.
-*/
-function updateCheckUncheck() {
-  checkedState = !checkedState;
-  if (checkedState) {
-    browser.contextMenus.update("check-uncheck", {
-      title: browser.i18n.getMessage("contextMenuItemUncheckMe"),
-    });
-  } else {
-    browser.contextMenus.update("check-uncheck", {
-      title: browser.i18n.getMessage("contextMenuItemCheckMe"),
-    });
-  }
-}
-
-/*
-The click event listener, where we perform the appropriate action given the
-ID of the menu item that was clicked.
-*/
-browser.contextMenus.onClicked.addListener(function(info, tab) {
-  switch (info.menuItemId) {
-    case "log-selection":
-      console.log(info.selectionText);
-      break;
-    case "remove-me":
-      var removing = browser.contextMenus.remove(info.menuItemId);
-      removing.then(onRemoved, onError);
-      break;
-    case "bluify":
-      borderify(tab.id, blue);
-      break;
-    case "greenify":
-      borderify(tab.id, green);
-      break;
-    case "check-uncheck":
-      updateCheckUncheck();
-      break;
-  }
-});

context-menu-demo/icons/LICENSE

@@ -1,2 +0,0 @@
-
-The "page-32.png" and "page-48.png" icons are taken from the miu iconset created by Linh Pham Thi Dieu, and are used under the terms of its license: http://linhpham.me/miu/.

context-menu-demo/manifest.json

@@ -1,24 +0,0 @@
-{
-
-  "manifest_version": 2,
-  "name": "__MSG_extensionName__",
-  "description": "__MSG_extensionDescription__",
-  "version": "1.0",
-  "default_locale": "en",
-
-  "background": {
-    "scripts": ["background.js"]
-  },
-  
-  "permissions": [
-    "contextMenus",
-    "activeTab"
-  ],
-  
-  "icons": {
-    "16": "icons/page-16.png",
-    "32": "icons/page-32.png",
-    "48": "icons/page-48.png"
-  }
-
-}

cookie-bg-picker/README.md

@@ -1,38 +0,0 @@
-# Cookie BG Picker
-A background customizer WebExtension — click a button in the browser UI and select from a range of background image tiles and colors to customize the look of any web page you are on.
-
-The WebExtension also uses cookies to save preferences for each site you customize, provided the cookie is able to be saved. On your return, your customizations will be remembered.
-
-Works in Firefox 47+, and will also work as a Chrome extension, out of the box.
-
-**This add-on injects JavaScript into web pages. The `addons.mozilla.org` domain disallows this operation, so this add-on will not work properly when it's run on pages in the `addons.mozilla.org` domain.**
-
-## What it does
-
-This extension includes:
-
-* A browser action that creates a popup — within the popup is:
-	* Several buttons to select different background images.
-	* A color picker input element to select a new background color.
-	* A reset button to remove any customizations that have been set.
-	* Functions to save customization preferences into cookies for each site visited and customized.
-	* Functions to send messages to the content script (see below) containing style information so that style customizations can be applied to the pages.
-* A background script to retrieve any cookies previously set by the WebExtension for each page visited, and if so send messages to the content script (see below) containing style information so that previously saved style customizations can be applied to pages as soon as they are visited in the browser. The background script also injects the content script into each page visited.
-* A content script that is injected into every page visited. Its function is to receive messages from the browser action and background scripts and apply the style information contained within to the current page.
-
-		
-Cookie BG Picker uses the WebExtension:
-
-* [cookies API](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/cookies) to save/retrieve/remove the cookies.
-* [tabs API](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs) to retrieve information about the current tab (whenever a new URL is loaded and at each significant point thereafter), inject the content script into it, and to send messages between the browser action/background script and the content script.
-* [runtime API](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/runtime) to receive and handle messages sent to the content script.
-
-## What it shows
-
-* How to persist data via cookies using a WebExtension.
-* How to send messages between browser actions/background scripts and content scripts.
-
-## Acknowledgements
-
-* WebExtension icon courtesy of [icons8.com](http://icons8.com).
-* Transparent background images taken from [Transparent Textures](https://www.transparenttextures.com/).

cookie-bg-picker/background_scripts/background.js

@@ -1,30 +0,0 @@
-/* Retrieve any previously set cookie and send to content script */
-
-browser.tabs.onUpdated.addListener(cookieUpdate);
-
-function getActiveTab() {
-  return browser.tabs.query({active: true, currentWindow: true});
-}
-
-function cookieUpdate(tabId, changeInfo, tab) {
-  getActiveTab().then((tabs) => {
-    /* inject content script into current tab */
-
-    browser.tabs.executeScript(null, {
-      file: "/content_scripts/updatebg.js"
-    });
-
-    // get any previously set cookie for the current tab 
-    var gettingCookies = browser.cookies.get({
-      url: tabs[0].url,
-      name: "bgpicker"
-    });
-    gettingCookies.then((cookie) => {
-      if(cookie) {
-        var cookieVal = JSON.parse(cookie.value);
-        browser.tabs.sendMessage(tabs[0].id, {image: cookieVal.image});
-        browser.tabs.sendMessage(tabs[0].id, {color: cookieVal.color});
-      }
-    });
-  }); 
-}

cookie-bg-picker/content_scripts/updatebg.js

@@ -1,19 +0,0 @@
-var html = document.querySelector('html');
-var body = document.querySelector('body');
-
-browser.runtime.onMessage.addListener(updateBg);
-
-function updateBg(request, sender, sendResponse) {
-  if(request.image) {
-    html.style.backgroundImage = 'url(' + request.image + ')';
-    body.style.backgroundImage = 'url(' + request.image + ')';
-  } else if(request.color) {
-    html.style.backgroundColor = request.color;
-    body.style.backgroundColor = request.color;
-  } else if (request.reset) {
-    html.style.backgroundImage = '';
-    html.style.backgroundColor = '';
-    body.style.backgroundImage = '';
-    body.style.backgroundColor = '';
-  }
-}

cookie-bg-picker/manifest.json

@@ -1,40 +0,0 @@
-{
-
-  "manifest_version": 2,
-  "name": "Cookie BG Picker",
-  "version": "1.0",
-
-  "description": "Allows the user to customize the background color and pattern of their sites. Also saves their preferences via cookies where possible.",
-  "icons": {
-    "48": "icons/bgpicker-48.png"
-  },
-
-  "permissions": [
-      "tabs",
-      "cookies",
-      "<all_urls>"
-  ],
-
-  "web_accessible_resources": [
-      "popup/images/bullseyes.png",
-      "popup/images/starring.png",
-      "popup/images/subtle.png",
-      "popup/images/tactilenoise.png",
-      "popup/images/triangles.png",
-      "popup/images/triangles2.png",
-      "popup/images/washi.png",
-      "popup/images/whitey.png"
-  ],
-
-  "browser_action": {
-    "default_icon": {
-     "32" : "icons/bgpicker-32.png"
-    },
-    "default_title": "BG Picker",
-    "default_popup": "popup/bgpicker.html"
-  },
-
-  "background": {
-    "scripts": ["background_scripts/background.js"]
-  }
-}

cookie-bg-picker/popup/bgpicker.css

@@ -1,39 +0,0 @@
-/* General styling */
-
-* {
-  box-sizing: border-box;
-}
-
-html {
-  font-family: sans-serif;
-  font-size: 10px;
-  background: rgb(150,150,150);
-  height: 88px;
-  margin: 0;
-}
-
-body {
-  width: 208px;
-  margin: 0 auto;
-  height: inherit;
-}
-
-.bg-container button {
-  display: inline-block;
-  width: 50px;
-  height: 30px;
-  margin: 1px;
-}
-
-.color-reset {
-  width: 208px;
-  height: 20px;
-}
-
-input, .color-reset button {
-  display: block;
-  width: 48%;
-  height: 110%;
-  float: left;
-  margin: 0 1% 1% 1%;
-}

cookie-bg-picker/popup/bgpicker.html

@@ -1,20 +0,0 @@
-<!DOCTYPE html>
-
-<html>
-  <head>
-    <meta charset="utf-8">
-    <link rel="stylesheet" href="bgpicker.css"/>
-  </head>
-
-<body>
-  <div class="bg-container">
-    <button class="bullseyes"></button><button class="subtle"></button><button class="tactilenoise"></button><button class="triangles"></button><button class="triangles2"></button><button class="washi"></button><button class="starring"></button><button class="whitey"></button>
-  </div>
-  <div class="color-reset">
-    <input type="text" placeholder="Enter color value"><button>Reset</button>
-  </div>
-
-  <script src="bgpicker.js"></script>
-</body>
-
-</html>

cookie-bg-picker/popup/bgpicker.js

@@ -1,75 +0,0 @@
-/* initialise variables */
-
-var bgBtns = document.querySelectorAll('.bg-container button');
-var colorPick = document.querySelector('input');
-var reset = document.querySelector('.color-reset button');
-var cookieVal = { image : '',
-                  color : '' };
-
-function getActiveTab() {
-  return browser.tabs.query({active: true, currentWindow: true});
-}
-
-/* apply backgrounds to buttons */
-/* add listener so that when clicked, button applies background to page HTML */
-
-for(var i = 0; i < bgBtns.length; i++) {
-  var imgName = bgBtns[i].getAttribute('class');
-  var bgImg = 'url(\'images/' + imgName + '.png\')';
-  bgBtns[i].style.backgroundImage = bgImg;
-
-  bgBtns[i].onclick = function(e) {
-    getActiveTab().then((tabs) => {
-      var imgName = e.target.getAttribute('class');
-      var fullURL = browser.extension.getURL('popup/images/'+ imgName + '.png');
-      browser.tabs.sendMessage(tabs[0].id, {image: fullURL});
-
-      cookieVal.image = fullURL;
-      browser.cookies.set({
-        url: tabs[0].url,
-        name: "bgpicker", 
-        value: JSON.stringify(cookieVal)
-      })
-    });
-  }
-}
-
-/* apply chosen color to HTML background */
-
-colorPick.onchange = function(e) {
-  getActiveTab().then((tabs) => {
-    var currColor = e.target.value;
-    browser.tabs.sendMessage(tabs[0].id, {color: currColor});
-
-    cookieVal.color = currColor;
-    browser.cookies.set({
-      url: tabs[0].url,
-      name: "bgpicker", 
-      value: JSON.stringify(cookieVal)
-    })
-  });
-}
-
-/* reset background */
-
-reset.onclick = function() {
-  getActiveTab().then((tabs) => {
-    browser.tabs.sendMessage(tabs[0].id, {reset: true});
-
-    cookieVal = { image : '',
-                  color : '' };
-    browser.cookies.remove({
-      url: tabs[0].url,
-      name: "bgpicker" 
-    })
-  });
-}
-
-/* Report cookie changes to the console */
-
-browser.cookies.onChanged.addListener((changeInfo) => {
-  console.log(`Cookie changed:\n
-              * Cookie: ${JSON.stringify(changeInfo.cookie)}\n
-              * Cause: ${changeInfo.cause}\n
-              * Removed: ${changeInfo.removed}`);
-});

embedded-webextension-bootstrapped/README.md

@@ -1,14 +0,0 @@
-This is an example of how to use [embedded WebExtensions](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Embedded_WebExtensions) to convert a legacy [Bootstrapped extension](https://developer.mozilla.org/en-US/Add-ons/Bootstrapped_extensions) to a  [WebExtension](https://developer.mozilla.org/en-US/Add-ons/WebExtensions) in stages, and migrate the legacy add-on's data so it's accessible by the WebExtension.
-
-The legacy add-on contains:
-
-- some user data stored in the Firefox preferences
-- a button in the toolbar
-
-When the button is pressed, the add-on displays a panel containing the stored data. 
-
-This directory contains three versions of the add-on.
-
-- **step0-legacy-addon**: the initial add-on, written entirely using the bootstrapped extension method.
-- **step1-hybrid-addon**: a hybrid consisting of a bootstrapped extension containing an embedded WebExtension. The bootstrapped extension reads the stored data and sends it to the embedded WebExtension. The embedded WebExtension stores the data using the [`storage`](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/storage) API, and also implements the UI.
-- **step2-pure-webextension**: the final version, written entirely using the WebExtensions method. This version can be deployed after the hybrid version has migrated the stored data to the `storage` API. 

embedded-webextension-bootstrapped/step0-legacy-addon/bootstrap.js

@@ -1,16 +0,0 @@
-"use strict";
-
-function startup(data) {
-  Components.utils.import("chrome://original-bootstrap-addon-id/content/AddonPrefs.jsm");
-  Components.utils.import("chrome://original-bootstrap-addon-id/content/AddonUI.jsm");
-
-  AddonPrefs.set("super-important-user-setting", "char", "addon preference content");
-  AddonUI.init(data);
-}
-
-function shutdown(data) {
-  AddonUI.shutdown(data);
-
-  Components.utils.unload("chrome://original-bootstrap-addon-id/content/AddonUI.jsm");
-  Components.utils.unload("chrome://original-bootstrap-addon-id/content/AddonPrefs.jsm");
-}

embedded-webextension-bootstrapped/step0-legacy-addon/chrome.manifest

@@ -1 +0,0 @@
-content original-bootstrap-addon-id chrome/

embedded-webextension-bootstrapped/step0-legacy-addon/chrome/AddonPrefs.jsm

@@ -1,41 +0,0 @@
-"use strict";
-
-var EXPORTED_SYMBOLS = ["AddonPrefs"];
-
-Components.utils.import("resource://gre/modules/Services.jsm");
-
-const BASE_PREF = "extensions.original-bootstrap-addon-id.";
-
-function get(key, type = "char") {
-  key = BASE_PREF + key;
-
-  switch(type) {
-  case "char":
-    return Services.prefs.getCharPref(key);
-  case "bool":
-    return Services.prefs.getBoolPref(key);
-  case "int":
-    return Services.prefs.getIntPref(key);
-  }
-
-  throw new Error(`Unknown type: ${type}`);
-}
-
-function set(key, type, value) {
-  key = BASE_PREF + key;
-
-  switch(type) {
-  case "char":
-    return Services.prefs.setCharPref(key, value);
-  case "bool":
-    return Services.prefs.setBoolPref(key, value);
-  case "int":
-    return Services.prefs.setIntPref(key, value);
-  }
-
-  throw new Error(`Unknown type: ${type}`);
-}
-
-var AddonPrefs = {
-  get, set,
-};

embedded-webextension-bootstrapped/step0-legacy-addon/chrome/AddonUI.jsm

@@ -1,65 +0,0 @@
-"use strict";
-
-var EXPORTED_SYMBOLS = ["AddonUI"];
-
-Components.utils.import("resource:///modules/CustomizableUI.jsm");
-
-Components.utils.import("chrome://original-bootstrap-addon-id/content/AddonPrefs.jsm");
-
-const BUTTON_ID = "original-bootstrap-addon-id--toolbar-button";
-const BUTTON_ICON_URL = "chrome://original-bootstrap-addon-id/content/icons/icon-32.png";
-
-const PANEL_ID = "original-bootstrap-addon-id--popup-panel";
-
-function createPanel(node) {
-  var doc = node.ownerDocument;
-
-  var panel = doc.createElement("panel");
-  panel.setAttribute("type", "arrow");
-  panel.setAttribute("id", PANEL_ID);
-  panel.setAttribute("flip", "slide");
-  panel.setAttribute("hidden", true);
-  panel.setAttribute("position", "bottomcenter topright");
-  var panelContent = doc.createElement("label");
-  panelContent.textContent = AddonPrefs.get("super-important-user-setting");
-  panel.appendChild(panelContent);
-
-  return panel;
-}
-
-function defineButtonWidget() {
-  let buttonDef = {
-    id : BUTTON_ID,
-    type : "button",
-    defaultArea : CustomizableUI.AREA_NAVBAR,
-    label : "button label",
-    tooltiptext : "button tooltip",
-    onCreated : function (node) {
-      node.setAttribute('image', BUTTON_ICON_URL);
-
-      const panel = createPanel(node);
-      node.appendChild(panel);
-
-      node.addEventListener("click", () => {
-        panel.setAttribute("hidden", false);
-        panel.openPopup(node, panel.getAttribute("position"), 0, 0, false, false);
-      });
-    }
-  };
-
-  CustomizableUI.createWidget(buttonDef);
-};
-
-
-
-function init({id}) {
-  defineButtonWidget(BUTTON_ID);
-}
-
-function shutdown({id}) {
-  CustomizableUI.destroyWidget(BUTTON_ID);
-}
-
-var AddonUI = {
-  init, shutdown,
-};

embedded-webextension-bootstrapped/step0-legacy-addon/chrome/icons/LICENSE

@@ -1 +0,0 @@
-The icon "icon-32.png" is taken from the IconBeast Lite iconset, and used under the terms of its license (http://www.iconbeast.com/faq/), with a link back to the website: http://www.iconbeast.com/free/.