Browser Extension, Google Chrome, Javascript, Share-It

Share-it A Google Chrome Extension for Sharing a Page on Multiple Websites

manifest.json

{
  "name": "Share-it",
  "description": "Adds context menu items to share the current page on a number of websites",
  "version": "0.2",
  "permissions": ["contextMenus"],
  "background": {
    "scripts": ["app.js"]
  },
  "icons" : {
		"16" : "favicon.ico",
		"32" : "peopleicon32.png",
		"48" : "peopleicon48.png",
		"128" : "peopleicon128.png"
	},
  "manifest_version": 2
}

app.js

var hp = chrome.contextMenus.create({"title": "Share-it"});
chrome.contextMenus.create({"title": "facebook.com", "contexts":["page"], "parentId": hp, "onclick": facebookIt});
function facebookIt(i, t){
	var createProperties = {url: "http://www.facebook.com/sharer.php?u="+ encodeURI(t.url) + "&src=" + encodeURIComponent("Share-it")};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "twitter.com", "contexts":["page"], "parentId": hp, "onclick": twitterIt});
function twitterIt(i, t){
	var createProperties = {url: "https://twitter.com/share?url="+ encodeURI(t.url) + "&text=" + encodeURIComponent(t.title)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "plus.google.com", "contexts":["page"], "parentId": hp, "onclick": googleplusIt});
function googleplusIt(i, t){
	// var createProperties = {url: "https://plusone.google.com/_/+1/confirm?hl=en&url="+ encodeURI(t.url)};
	var createProperties = {url: "https://plusone.google.com/share?url="+ encodeURI(t.url)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "linkedin.com", "contexts":["page"], "parentId": hp, "onclick": linkedinIt});
function linkedinIt(i, t){
	var createProperties = {url: "http://www.linkedin.com/cws/share?url="+ encodeURI(t.url)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "digg.com", "contexts":["page"], "parentId": hp, "onclick": diggIt});
function diggIt(i, t){
	var createProperties = {url: "http://digg.com/submit?url="+ encodeURI(t.url) + "&title=" + encodeURIComponent(t.title)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "myspace.com", "contexts":["page"], "parentId": hp, "onclick": myspaceIt});
function myspaceIt(i, t){
	var createProperties = {url: "http://www.myspace.com/Modules/PostTo/Pages/?u="+ encodeURI(t.url)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "stumbleupon.com", "contexts":["page"], "parentId": hp, "onclick": stumbleuponIt});
function stumbleuponIt(i, t){
	var createProperties = {url: "http://www.stumbleupon.com/submit?url="+ encodeURI(t.url)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "tumblr.com", "contexts":["page"], "parentId": hp, "onclick": tumblrIt});
function tumblrIt(i, t){
	var createProperties = {url: "http://www.tumblr.com/share?v=3&u="+ encodeURI(t.url) + "&t=" + encodeURIComponent(t.title)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "friendfeed.com", "contexts":["page"], "parentId": hp, "onclick": friendfeedIt});
function friendfeedIt(i, t){
	var createProperties = {url: "http://www.friendfeed.com/share?url="+ encodeURI(t.url) + "&title=" + encodeURIComponent(t.title)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "fark.com", "contexts":["page"], "parentId": hp, "onclick": farkIt});
function farkIt(i, t){
	var createProperties = {url: "http://cgi.fark.com/cgi/fark/farkit.pl?u="+ encodeURI(t.url) + "&h=" + encodeURIComponent(t.title)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "blinklist.com", "contexts":["page"], "parentId": hp, "onclick": blinklistIt});
function blinklistIt(i, t){
	var createProperties = {url: "http://www.blinklist.com/index.php?Action=Blink/Addblink.php&Url="+ encodeURI(t.url) + "&Title=" + encodeURIComponent(t.title)};
	chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "plurk.com", "contexts":["page"], "parentId": hp, "onclick": plurkIt});
function plurkIt(i, t){
	var createProperties = {url: "http://plurk.com/?qualifier=shares&status=" + encodeURIComponent(t.title) + "%20%2D%20" + encodeURI(t.url)};
	chrome.tabs.create(createProperties);
}

This one is a little more full featured as far as sharing is concerned. I may just give this one out so I added my site graphics so it looks a bit more professional. Demonstrates using a parent ‘folder’ for (sub) context menu items. Its pretty basic: create a handle (var hp) and a parent (which is nothing more than a context menu item with just a title) and use it in each child’s creation function inside the “parentId” property. I would have liked to put the proper site icons next to each menu item, but it does not work like that in Chrome. You can, however, use check boxes and radio buttons in the menu items. Maybe that will be included in the next version of Chrome (hopefully).

If you plan to use a library when creating your extension, be sure to use one that doesn’t use dynamic loading (unbuild dojo apps will not run in other words). In my opinion you should use straight javascript targeted at Chrome. This extension assumes its user is smart enough not to share a page that’s on the hard drive without hosting it on the Internet first (otherwise you’ll be sharing a file path). I could have used a Match Pattern in the “documentUrlPatterns” property in the creation function for each menu item that could check the scheme, but I didn’t bother. Its something you could use at your own discretion in your add-on.

Standard
Browser Extension, Google Chrome, Javascript, Look-It-Up

Look-it-up A Google Chrome Extension that Looks Up Selected Text on dictionary.com

manifest.json

{
  "name": "Look-it-up",
  "description": "Adds context menu item that looks up selected text on dictionary.com",
  "version": "0.1",
  "permissions": ["contextMenus"],
  "background": {
    "scripts": ["app.js"]
  },
  "manifest_version": 2
}

app.js

chrome.contextMenus.create({"title": "Look-it-up", "contexts":["selection"],"onclick": lookItUp});
function lookItUp(i, t){
	var createProperties = {url: "http://www.dictionary.com/cgi-bin/dict.pl?term=" + encodeURIComponent(i.selectionText)};
	chrome.tabs.create(createProperties);
}

Simple Google Chrome Extension that looks up selected text on dictionary.com. Obviously you should only select one word as dictionary.com will not define more than one. Same as Google-Translate-it, demonstrates getting selected text and processing it in a GET request.

Standard
Browser Extension, Google Chrome, Javascript, Plurk-It

Plurk-it A Simple Google Chrome Extension for using Plurk.com

manifest.json

 {
"name": "Plurk-it", "description": "Adds context menu item that shares the current page on Plurk. If text is selected, provides a context menu item to search plurk posts for the selected text.",
"version": "0.1",
"permissions": ["contextMenus"],
"background": { "scripts": ["app.js"] },
"manifest_version": 2
}

app.js

chrome.contextMenus.create({"title": "Plurk-it", "contexts":["page"],"onclick": plurkIt});
function plurkIt(i, t){
var createProperties = {url: "http://plurk.com/?qualifier=shares&status=" + encodeURIComponent(t.title) + "%20%2D%20" + encodeURI(t.url)};
chrome.tabs.create(createProperties);
}
chrome.contextMenus.create({"title": "Search Plurks", "contexts":["selection"],"onclick": searchPlurks});
function searchPlurks(i, t){
var createProperties = {url: "http://www.plurk.com/search?q=" + encodeURIComponent(i.selectionText)};
chrome.tabs.create(createProperties);
}

Another simple add-on that makes using Plurk.com easier. Demonstrates getting tab info (title and url) passed to the context menu click handler function. In case you didn’t know, Plurk was the first to timeline user posts (long before facebook did).

Standard
Browser Extension, Google Chrome, Google-Translate-It, Javascript

Google-Translate-it A Google Chrome Extension in Five Elegant Lines Of Javascript

manifest.json

{
  "name": "Google-Translate-it",
  "description": "Adds context menu that, when text is selected, opens up a new tab with the google translation tool.",
  "version": "0.1",
  "permissions": ["contextMenus"],
  "background": {
    "scripts": ["app.js"]
  },
  "manifest_version": 2
}

app.js

chrome.contextMenus.create({"title": "Google-Translate-it", "contexts":["selection"],"onclick": translateIt});
function translateIt(i, t){
	var createProperties = {url: "http://translate.google.com/?q=" + encodeURIComponent(i.selectionText)};
	chrome.tabs.create(createProperties);
}

Yeah, I know, I could have used an anonymous function which would have made it four lines of javascript. The extra line is there for beauty.

Standard