diff --git a/README.md b/README.md
new file mode 100644
index 0000000..488025f
--- /dev/null
+++ b/README.md
@@ -0,0 +1,4 @@
+## Developing Google Chrome Extensions Source Code
+
+Here's the source code for the Nettuts+ article on Developing Google Chrome
+Extensions, written by Krasimir Tsonev.
\ No newline at end of file
diff --git a/background.js b/background.js
new file mode 100755
index 0000000..2fd5443
--- /dev/null
+++ b/background.js
@@ -0,0 +1,41 @@
+// omnibox
+chrome.omnibox.onInputChanged.addListener(function(text, suggest) {
+ suggest([
+ {content: "color-divs", description: "Make everything red"}
+ ]);
+});
+chrome.omnibox.onInputEntered.addListener(function(text) {
+ if(text == "color-divs") colorDivs();
+});
+
+// listening for an event / one-time requests
+// coming from the popup
+chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
+ switch(request.type) {
+ case "color-divs":
+ colorDivs();
+ break;
+ }
+ return true;
+});
+
+// listening for an event / long-lived connections
+// coming from devtools
+chrome.extension.onConnect.addListener(function (port) {
+ port.onMessage.addListener(function (message) {
+ switch(port.name) {
+ case "color-divs-port":
+ colorDivs();
+ break;
+ }
+ });
+});
+
+// send a message to the content script
+var colorDivs = function() {
+ chrome.tabs.getSelected(null, function(tab){
+ chrome.tabs.sendMessage(tab.id, {type: "colors-div", color: "#F00"});
+ // setting a badge
+ chrome.browserAction.setBadgeText({text: "red!"});
+ });
+}
\ No newline at end of file
diff --git a/browseraction/popup.html b/browseraction/popup.html
new file mode 100755
index 0000000..f4ab738
--- /dev/null
+++ b/browseraction/popup.html
@@ -0,0 +1,4 @@
+
+
+
+
\ No newline at end of file
diff --git a/browseraction/popup.js b/browseraction/popup.js
new file mode 100755
index 0000000..bca6976
--- /dev/null
+++ b/browseraction/popup.js
@@ -0,0 +1,7 @@
+window.onload = function() {
+ document.getElementById("button").onclick = function() {
+ chrome.extension.sendMessage({
+ type: "color-divs"
+ });
+ }
+}
\ No newline at end of file
diff --git a/content.js b/content.js
new file mode 100755
index 0000000..c1c523d
--- /dev/null
+++ b/content.js
@@ -0,0 +1,14 @@
+chrome.extension.onMessage.addListener(function(message, sender, sendResponse) {
+ switch(message.type) {
+ case "colors-div":
+ var divs = document.querySelectorAll("div");
+ if(divs.length === 0) {
+ alert("There are no any divs in the page.");
+ } else {
+ for(var i=0; i
\ No newline at end of file
diff --git a/devtools/devtools.js b/devtools/devtools.js
new file mode 100755
index 0000000..75624b3
--- /dev/null
+++ b/devtools/devtools.js
@@ -0,0 +1,8 @@
+chrome.devtools.panels.create(
+ "Yeah",
+ "icons/16x16.png",
+ "devtools/devtoolscontent.html",
+ function() {
+
+ }
+);
\ No newline at end of file
diff --git a/devtools/devtoolscontent.html b/devtools/devtoolscontent.html
new file mode 100755
index 0000000..4f09e1d
--- /dev/null
+++ b/devtools/devtoolscontent.html
@@ -0,0 +1,4 @@
+
+
+
+
\ No newline at end of file
diff --git a/devtools/devtoolscontent.js b/devtools/devtoolscontent.js
new file mode 100755
index 0000000..5854387
--- /dev/null
+++ b/devtools/devtoolscontent.js
@@ -0,0 +1,6 @@
+window.onload = function() {
+ var port = chrome.extension.connect({ name: "color-divs-port" });
+ document.getElementById("button").onclick = function() {
+ port.postMessage({ type: "color-divs"});
+ }
+}
\ No newline at end of file
diff --git a/icons/128x128.png b/icons/128x128.png
new file mode 100755
index 0000000..3fe43da
Binary files /dev/null and b/icons/128x128.png differ
diff --git a/icons/16x16.png b/icons/16x16.png
new file mode 100755
index 0000000..8ca85bb
Binary files /dev/null and b/icons/16x16.png differ
diff --git a/icons/19x19.png b/icons/19x19.png
new file mode 100755
index 0000000..db62151
Binary files /dev/null and b/icons/19x19.png differ
diff --git a/icons/38x38.png b/icons/38x38.png
new file mode 100755
index 0000000..f7d3c3b
Binary files /dev/null and b/icons/38x38.png differ
diff --git a/icons/48x48.png b/icons/48x48.png
new file mode 100755
index 0000000..1c4ad27
Binary files /dev/null and b/icons/48x48.png differ
diff --git a/icons/icon.psd b/icons/icon.psd
new file mode 100755
index 0000000..d7e05c2
Binary files /dev/null and b/icons/icon.psd differ
diff --git a/manifest.json b/manifest.json
new file mode 100755
index 0000000..4474be1
--- /dev/null
+++ b/manifest.json
@@ -0,0 +1,36 @@
+{
+ "name": "BrowserExtension",
+ "version": "0.0.1",
+ "manifest_version": 2,
+ "description" : "Description ...",
+ "icons": { "16": "icons/16x16.png", "48": "icons/48x48.png", "128": "icons/128x128.png" },
+
+ "omnibox": { "keyword" : "yeah" },
+
+ "browser_action": {
+ "default_icon": {
+ "19": "icons/19x19.png",
+ "38": "icons/38x38.png"
+ },
+ "default_title": "That's the tool tip",
+ "default_popup": "browseraction/popup.html"
+ },
+
+ "background": {
+ "scripts": ["background.js"],
+ "persistent": false
+ },
+
+ "chrome_url_overrides" : {
+ "newtab": "newtab/newtab.html"
+ },
+
+ "content_scripts": [
+ {
+ "matches": ["http://*/*", "https://*/*"],
+ "js": ["content.js"]
+ }
+ ],
+
+ "devtools_page": "devtools/devtools.html"
+}
\ No newline at end of file
diff --git a/newtab/newtab.html b/newtab/newtab.html
new file mode 100755
index 0000000..0b45b43
--- /dev/null
+++ b/newtab/newtab.html
@@ -0,0 +1,28 @@
+
+
+
+
+
+ Yeah, that's my awesome new tab page!
+
+
\ No newline at end of file