diff --git a/inpage-toolbar-ui/README.md b/inpage-toolbar-ui/README.md deleted file mode 100644 index 29d5b80..0000000 --- a/inpage-toolbar-ui/README.md +++ /dev/null @@ -1,27 +0,0 @@ -# inpage-toolbar-ui - -## What it does ## - -The extension includes: - -* a browser action which enables/disables the in-page toolbar -* a content script which creates/removes the in-page toolbar iframe -* the toolbar ui resources, packaged as web accessible resources - -When the user clicks the browser action button, a toolbar is shown/hidden -in the current web page. - -The toolbar UI is packaged in the add-on resources, exposed to the current -web page as a web accessible resource and injected into the page by the -content script by creating and injecting into the page an iframe which -points to the toolbar UI page. - -## What it shows ## - -How to expose an in-page toolbar UI by creating an iframe: - -* use web accessible resources to enable web pages to load packaged content -* use a content script to create and inject in a web page an iframe which points to the - packaged content -* use the same API enabled in content scripts (but from the add-on iframe) - to exchange messages directly with the add-on background page diff --git a/inpage-toolbar-ui/background.js b/inpage-toolbar-ui/background.js deleted file mode 100644 index 49aab61..0000000 --- a/inpage-toolbar-ui/background.js +++ /dev/null @@ -1,17 +0,0 @@ -// Send a message to the current tab's content script. -function toggleToolbar() { - chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) { - chrome.tabs.sendMessage(tabs[0].id, "toggle-in-page-toolbar"); - }); -} - -// Handle the browser action button. -chrome.browserAction.onClicked.addListener(toggleToolbar); - -// Handle connections received from the add-on toolbar ui iframes. -chrome.runtime.onConnect.addListener(function (port) { - if (port.sender.url == chrome.runtime.getURL("toolbar/ui.html")) { - // Handle port messages received from the connected toolbar ui frames. - port.onMessage.addListener(toggleToolbar); - } -}); diff --git a/inpage-toolbar-ui/contentscript.js b/inpage-toolbar-ui/contentscript.js deleted file mode 100644 index e99e84e..0000000 --- a/inpage-toolbar-ui/contentscript.js +++ /dev/null @@ -1,36 +0,0 @@ -var toolbarUI; - -// Create the toolbar ui iframe and inject it in the current page -function initToolbar() { - var iframe = document.createElement("iframe"); - iframe.setAttribute("src", chrome.runtime.getURL("toolbar/ui.html")); - iframe.setAttribute("style", "position: fixed; top: 0; left: 0; z-index: 10000; width: 100%; height: 36px;"); - document.body.appendChild(iframe); - - return toolbarUI = { - iframe: iframe, visible: true - }; -} - -function toggleToolbar(toolbarUI) { - if (toolbarUI.visible) { - toolbarUI.visible = false; - toolbarUI.iframe.style["display"] = "none"; - } else { - toolbarUI.visible = true; - toolbarUI.iframe.style["display"] = "block"; - } -} - -// Handle messages from the add-on background page (only in top level iframes) -if (window.parent == window) { - chrome.runtime.onMessage.addListener(function(msg) { - if (msg == "toggle-in-page-toolbar") { - if (toolbarUI) { - toggleToolbar(toolbarUI); - } else { - toolbarUI = initToolbar(); - } - } - }); -} diff --git a/inpage-toolbar-ui/icons/32.png b/inpage-toolbar-ui/icons/32.png deleted file mode 100644 index 20345a7..0000000 Binary files a/inpage-toolbar-ui/icons/32.png and /dev/null differ diff --git a/inpage-toolbar-ui/icons/48.png b/inpage-toolbar-ui/icons/48.png deleted file mode 100644 index e9896d2..0000000 Binary files a/inpage-toolbar-ui/icons/48.png and /dev/null differ diff --git a/inpage-toolbar-ui/manifest.json b/inpage-toolbar-ui/manifest.json deleted file mode 100644 index c0fe3f7..0000000 --- a/inpage-toolbar-ui/manifest.json +++ /dev/null @@ -1,40 +0,0 @@ -{ - "description": "Adds a browser action icon to the toolbar. Click the button to inject an in-page toolbar UI into the current webpage. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#inpage-toolbar-ui", - "manifest_version": 2, - "name": "In Page Toolbar UI", - "version": "1.0", - "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/inpage-toolbar-ui", - "icons": { - "48": "icons/48.png" - }, - - "permissions": [], - - "background": { - "scripts": ["background.js"] - }, - - "browser_action": { - "default_icon": "icons/32.png", - "default_title": "In Page Toolbar" - }, - - "content_scripts": [ - { - "js": ["contentscript.js"], - "run_at": "document_idle", - "matches": [""] - } - ], - - "web_accessible_resources": [ - "toolbar/ui.html" - ], - - "applications": { - "gecko": { - "id": "inpage-toolbar-ui@mozilla.org", - "strict_min_version": "46.0" - } - } -} diff --git a/inpage-toolbar-ui/toolbar/ui.css b/inpage-toolbar-ui/toolbar/ui.css deleted file mode 100644 index 9a81ae4..0000000 --- a/inpage-toolbar-ui/toolbar/ui.css +++ /dev/null @@ -1,62 +0,0 @@ -body { - overflow: hidden; - color: black; - background: rgba(255,255,255,0.9); -} - -#rainbow { - background: linear-gradient(0deg, rgba(217,26,18,0.70) 15%, rgba(225,51,0,0.70) 15%, rgba(255, 127, 20, 0.70) 16%, rgba(242, 171, 3, 0.70) 32%, rgba(235, 192, 0, 0.70) 32%, rgba(250, 222, 0, 0.70) 33%, rgba(239, 255, 3, 0.70) 48%, rgba(86, 252, 2, 0.70) 49%, rgba(82, 255, 1, 0.70) 66%, rgba(74, 222, 126, 0.70) 67%, rgba(59, 170, 242, 0.70) 67%, rgba(59, 170, 242, 0.70) 84%, rgba(115, 55, 247, 0.70) 84%, rgba(107, 64, 242, 0.70) 100%); - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 6px; -} - -#title { - font-weight: bold; - font-size: 1em; -} - -.whimsy { - width: 36px; - height: 36px; -} - -/* Toggle Button. */ - -#toggle { - top: 8px; - right: 4px; - position: absolute; - margin: 0 1em; - text-decoration: underline; - border-radius: 1em; - background: transparent linear-gradient(0deg, rgb(255, 162, 0), rgba(189, 122, 6, 0.66)); -} - -/* Annoying animation. */ - -@keyframes wobbling { - 50% { - transform: translateY(-13px); - } - - 100% { - transform: translateY(0px); - } -} - -.wobbling { - display: inline-block; - vertical-align: middle; - transform: translateZ(0); - box-shadow: 0 0 1px rgba(0, 0, 0, 0); - backface-visibility: hidden; - - animation-name: wobbling; - animation-duration: 1.25s; - animation-timing-function: linear; - animation-iteration-count: infinite; - animation-fill-mode: both; -} diff --git a/inpage-toolbar-ui/toolbar/ui.html b/inpage-toolbar-ui/toolbar/ui.html deleted file mode 100644 index 981bcf3..0000000 --- a/inpage-toolbar-ui/toolbar/ui.html +++ /dev/null @@ -1,17 +0,0 @@ - - - - - - - - -
- - In-Page "Amazing and super-useful" Toolbar -
- - - - diff --git a/inpage-toolbar-ui/toolbar/ui.js b/inpage-toolbar-ui/toolbar/ui.js deleted file mode 100644 index 4d67626..0000000 --- a/inpage-toolbar-ui/toolbar/ui.js +++ /dev/null @@ -1,8 +0,0 @@ -// Connect to the background page. -var port = chrome.runtime.connect(); - -// Handle click events on the toolbar button. -document.querySelector("#toggle").addEventListener("click", function() { - // Ask the background page to toggle the toolbar on the current tab - port.postMessage("toggle-in-page-toolbar"); -}); diff --git a/inpage-toolbar-ui/toolbar/whimsy.png b/inpage-toolbar-ui/toolbar/whimsy.png deleted file mode 100644 index 261ee19..0000000 Binary files a/inpage-toolbar-ui/toolbar/whimsy.png and /dev/null differ