Browser Extension, Firefox, Javascript, Useful-New-Tab-Page

Firefox Useful New Tab Page Now in the Public Index at the Mozilla AMO

Firefox Useful New Tab Page

Firefox Useful New Tab Page

Firefox Useful New Tab Page addon is out of experimental hosting at Mozilla now and is available here; https://addons.mozilla.org/en-US/firefox/addon/useful-new-tab-page/

I also placed the source code for it on Github here: https://github.com/timtocci/Firefox-Useful-New-Tab-Page in case anyone wants to check out the source code.

Standard
Browser Extension, Firefox, Google-Music-Search, Google-Open-Storage-Search, Javascript

Firefox Extension – Google-Music-Search v0.2

Firefox Google-Music-Search


Firefox Google-Music-Search running on Crunchbang Linux


Google Music Search provides a simple way to search for music and files on google.com. There are two different types of queries to run: one to search for music files, and one to search for anything else stored in open indexed storage. Both open a tab in the browser and display search results from google.com. Firefox Google Music Search extension is based the Chrome Google Music Search and Chrome Open Storage Search extensions.

package.json

{
  "name": "google-music-search",
  "fullName": "Google-Music-Search",
  "id": "jid1-mIB68YB7TCOYZg",
  "description": "Makes searching for music and files on Google simple",
  "author": "Timothy Tocci - timothytocci.com",
  "homepage":"https://timothytocci.com/",
  "license": "MPL 2.0",
  "version": "0.2"
}

main.js


var widgets = require("sdk/widget");
var tabs = require("sdk/tabs");
var data = require("sdk/self").data;
var widget = widgets.Widget({
  id: "google-music-search",
  label: "Google Music Search",
  contentURL: data.url("google.png"),
  onClick: function() {
	searchdialog.show();
  }
});
var searchdialog = require("sdk/panel").Panel({
  width:480,
  height:272,
  contentURL: data.url("searchdialog.html")
});
var helpdialog = require("sdk/panel").Panel({
  width:640,
  height:480,
  contentURL: data.url("helpdialog.html")
});
searchdialog.port.on("doquery", function(url) {
  console.log(url);
  hidedialog();
  tabs.open(url);
});
function hidedialog(){
	searchdialog.hide();
}
searchdialog.port.on("helpclicked", function() {
    showhelp();
});
function showhelp(){
	helpdialog.show();
}
function closehelp(){
	helpdialog.hide();
}
helpdialog.port.on("gohome", function() {
	console.log("gohome");
    tabs.open("https://timothytocci.com/");
});
helpdialog.port.on("gocmusic", function() {
	console.log("gocmusic");
    tabs.open("https://timothytocci.com/2013/02/01/google-chrome-extension-google-music-search-an-omnibox-extension/");
});
helpdialog.port.on("gocoss", function() {
	console.log("gocoss");
    tabs.open("https://timothytocci.com/2013/02/03/google-chrome-extension-google-open-storage-search-an-omnibox-extension/");
});

helpdialog.html


<html>
    <head>
        <style>
            body {
                background-color: white;
            }
            
            input {
                height: 30px;
                width: 450px;
            }
			#home{
				color:blue;
				text-decoration:underline;
				cursor:hand;
			}
			#cmusic{
				color:blue;
                text-decoration:underline;
                cursor:hand;
			}
			#coss{
				color:blue;
                text-decoration:underline;
                cursor:hand;
			}
            #intro{
            	font-size: large;
            }
			.queries{
				font-size:large;
				font-weight:bold;
			}
			.qlist li{
				list-style: url(google.png);
			}
            .blue {
                color: blue;
            }
            
            .red {
                color: red;
            }
            
            .orange {
                color: orange;
            }
            
            .green {
                color: green;
            }
        </style>
    </head>
    <body>
        <center>
            <h1><span class="blue">G</span><span class="red">o</span><span class="orange">o</span><span class="blue">g</span><span class="green">l</span><span class="red">e</span>-<span class="blue">M</span><span class="red">u</span><span class="orange">s</span><span class="blue">i</span><span class="green">c</span>-<span class="blue">S</span><span class="red">e</span><span class="orange">a</span><span class="blue">r</span><span class="green">c</span><span class="red">h</span></h1>
            <p id="intro">
                Google Music Search provides a simple way to search for music and files on google.com. 
				There are two different types of queries to run: one to search for music files, and one to search for anything stored in open indexed storage. 
				Both open a tab in the browser and display search results from google.com. 
				Firefox Google Music Search extension is based the <a id="cmusic">Chrome Google Music Search</a> and <a id="coss">Chrome Open Storage Search</a> extensions. 
				Google Music Search was written by <a id="home">Timothy Tocci</a>.
            </p>
        </center>
        <p>
            To search for music files simply provide a band or artist name press the Music Search Button. To search for other filetypes; you must first specify the filetypes you are looking for. Filetypes can be ORed together using the pipe (|) character. After the filetypes you must enter a space. Anything before the first space in the query is considered the filetype(s). Then enter the query term for the file(s) you are searching for and press the Open Storage Search button.
        </p>
		<h4>Examples</h4>
		<ul class="qlist"><li><span class="queries">gif|jpg|png homecoming queen</span></li>
		<li><span class="queries">flv|mov|mp4 first steps</span></li>
		<li><span class="queries">torrent sometorrentfile</span> <-- May also act as a torrent weasel (depends on seed host)</li></ul>
    </body>
    <script type="text/javascript">
        window.onload = function(){
            var homelink = document.getElementById("home");
            homelink.addEventListener("click", function(){
                addon.port.emit("gohome","");
            }, false);
			
			var cmusiclink = document.getElementById("cmusic");
            cmusiclink.addEventListener("click", function(){
                addon.port.emit("gocmusic","");
            }, false);
			
			var cosslink = document.getElementById("coss");
            cosslink.addEventListener("click", function(){
                addon.port.emit("gocoss","");
            }, false);
        }
    </script>
</html>


searchdialog.html


<html>
    <head>
        <style>
            body {
                background-color: white;
            }
           
            input {
                height: 30px;
                width: 450px;
            }
            
            #goo {
                padding-top: 20px;
            }
			.blabels{
				font-size:large;
			}
        </style>
        
    </head>
    <body>
        <center>
            <div id="goo">
                <img src="google_logo_front.png"/>
            </div>
            <br/>
            <div>
                <input name="query" id="query" type="text" align="center" placeholder="enter a bandname or filetype and query"/>
                <br/>
                <button id="music">
                	<span class="blabels">Music Search</span>
                </button>
                <button id="storage">
                	<span class="blabels">Open Storage Search</span>
                </button>
				<button id="help">
                    <span class="blabels">Help/About</span>
                </button>
            </div>
        </center>
    </body>
	<script type="text/javascript">
           window.onload = function () {
                var btnmusic = document.getElementById("music");
                btnmusic.addEventListener("click", function(){
                    var input = document.getElementById("query");
                    var text = input.value;
					if(input.value == ""){return}
                    var query = 'intitle:index.of +?last modified? +?parent directory? +(mp3|wma|ogg|wav) +"' + text + '" -htm -html -php -asp -jsp -"Passwords"';
                    doquery(query);
                }, false);
                var btnstorage = document.getElementById("storage");
                btnstorage.addEventListener("click", function(){
                    var input = document.getElementById("query");
					if(input.value == ""){return}
                    var temp = input.value.split(" ", 2);
                    var filetype = temp[0];
                    text = temp[1];
                    var query = 'intitle:index.of +?last modified? +?parent directory? +(' + filetype + ') +"' + text + '" -htm -html -php -asp -jsp -"Passwords"';
                    doquery(query);
                }, false);
				
				var btnhelp = document.getElementById("help");
                btnhelp.addEventListener("click", function(){
					addon.port.emit("helpclicked");
				},true);
					
            }
            function doquery(query){
                url = "https://www.google.com/search?q=" + encodeURIComponent(query);
                addon.port.emit("doquery", url);
            }
        </script>
</html>

Click to Install Most Recent Version

Standard
Browser Extension, Firefox, Javascript, Share-It

Firefox Extension – Share-it 0.6 Context Menu

Share-it provides a context menu that allows the user to share the current page with a number of different websites that allow for link submissions. Share-it currently shares a web page on: facebook, twitter, google plus, linkedin, digg, stumbleupon, tumblr, friendfeed, fark, blinklist, and plurk. There is an options page that will allow the user to turn on or off the menu items they choose to use. Very simple and minimalistic design.

Share-it Context Menu Opened Up In Firefox

Share it Options Dialog Opened Up In Firefox

package.json

{
  "name": "share-it",
  "fullName": "Share-it",
  "id": "jid1-Kl2M45Ix2rhGtA",
  "description": "Adds context menu items to share the current page on a number of websites ",
  "author": "Timothy Tocci - timothytocci.com",
  "homepage": "https://timothytocci.com/",
  "license": "MPL 2.0",
  "version": "0.5"
}

main.js


var cm = require("sdk/context-menu");
var data = require("sdk/self").data;
var tabs = require("sdk/tabs");
var SS = require("simple-storage");

popupPanel = require("panel").Panel({
        height: 500,
        contentURL: data.url("options.html")
    });
popupPanel.port.on("optionsstarted", function () {
	console.log("optionsstarted received");
    popupPanel.port.emit("entrylist", entries);
});
popupPanel.port.on("setActive", function (menu) {
    setActive(menu);
});
popupPanel.port.on("setInactive", function (menu) {
    setInactive(menu);
});
var defaultentries = [
	{
	"menu":"facebook.com",
	"active":1,
	"ustr":"http://www.facebook.com/sharer.php?u={{URL}}&src={{TITLE}}"
	},{
	"menu":"twitter.com",
	"active":1,
	"ustr":"https://twitter.com/share?url={{URL}}&text={{TITLE}}"
	},{
	"menu":"plus.google.com",
	"active":1,
	"ustr":"https://plusone.google.com/_/+1/confirm?hl=en&url={{URL}}"
	},{
	"menu":"linkedin.com",
	"active":1,
	"ustr":"http://www.linkedin.com/cws/share?url={{URL}}"
	},{
	"menu":"digg.com",
	"active":1,
	"ustr":"http://digg.com/submit?url={{URL}}&title={{TITLE}}"
	},{
	"menu":"stumbleupon.com",
	"active":1,
	"ustr":"http://www.stumbleupon.com/submit?url={{URL}}"
	},{
	"menu":"tumblr.com",
	"active":1,
	"ustr":"http://www.tumblr.com/share?v=3&u={{URL}}&t={{TITLE}}"
	},{
	"menu":"friendfeed.com",
	"active":1,
	"ustr":"http://www.friendfeed.com/share?url={{URL}}&title={{TITLE}}"
	},{
	"menu":"fark.com",
	"active":1,
	"ustr":"http://cgi.fark.com/cgi/fark/farkit.pl?u={{URL}}&h={{TITLE}}"
	},{
	"menu":"blinklist.com",
	"active":1,
	"ustr":"http://www.blinklist.com/index.php?Action=Blink/Addblink.php&Url={{URL}}&Title={{TITLE}}"
	},{
	"menu":"plurk.com",
	"active":1,
	"ustr":"http://plurk.com/?qualifier=shares&status={{TITLE}}%20%2D%20{{URL}}"
	},
];
var entries = {};
if (!SS.storage["entries"]) {
	SS.storage["entries"] = JSON.stringify(defaultentries);
}
entries = JSON.parse(SS.storage["entries"]);
function setActive(menu){
	console.log("setActive");
	var elen = entries.length;
	console.log(menu);
	for(i=0;i<elen;i++){
		if(entries[i]["menu"] == menu){
			entries[i]["active"] = 1;
		}
	}
	SS.storage["entries"] = JSON.stringify(entries);
}
function setInactive(menu){
	console.log("setInactive");
	var elen = entries.length;
	console.log(menu);
	for(i=0;i<elen;i++){
		if(entries[i]["menu"] == menu){
			entries[i]["active"] = 0;
		}
	}
	SS.storage["entries"] = JSON.stringify(entries);
}
var mitems = [];
var entlen = entries.length;
for (i=0;i<entlen;i++){ 	if(entries[i]["active"] == 1){ 		mitems.push(cm.Item({ label: entries[i]["menu"], data: entries[i]["ustr"] })); 	} } mitems.push(cm.Separator()); mitems.push(cm.Item({ label: "Options", data: "{{OPTIONS}}" })); cm.Menu({   label: "Share-it",   contentScriptFile: data.url("menuscript.js"),   items: mitems,   onMessage: function(data) {sendit(data);} }); function sendit(data){ 	if(data.lastIndexOf("{{OPTIONS}}")!==-1){ 		popupPanel.show(); 	}else{ 		var url = data; 		url = url.replace("{{URL}}", encodeURI(tabs.activeTab.url)); 		if(data.lastIndexOf("{{TITLE}}")>0){
			url = url.replace("{{TITLE}}", encodeURIComponent(tabs.activeTab.title));
		}
		tabs.open({
			url: url,
			onReady: function onReady(tab) {
				console.log(tab.title);
			}
		});
	}
}

options.html


<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Share-it Options</title>
</head>
<style>
.green{color:green;}
.red{color:red;}
li{list-style-type: none;}
</style>
<body>
<h3>Share-it Context Menu Options</h3>
<ul id="menu">
</ul>
<div class="summary">Changes will take place the next time you start your browser. 
Or if you don't want to close the browser you could disable and reenable the Extension on the Plug-ins page.</div>
<p>Click anywhere outside this window to close it.</p>
</body>
<script type="text/javascript">
window.onload = function () {
	addon.port.emit("optionsstarted");
	var list = document.getElementById("menu");
	addon.port.on("entrylist", function (ckb) {
		for(i = 0; i < ckb.length; i++){
			if(ckb[i]["active"] == 1){
				var li = document.createElement("li");
				cbox = document.createElement("input");
				cbox.type = "checkbox";
				cbox.setAttribute("class","butt");
				cbox.checked = true;
				cbox.value = ckb[i]["menu"];
				var txtspan = document.createElement("span");
				txtspan.setAttribute("class","green");
				var mtxt = document.createTextNode(ckb[i]["menu"]);
				txtspan.appendChild(mtxt);
				li.appendChild(cbox);
				li.appendChild(txtspan);
				list.appendChild(li);
			}else{
				var li = document.createElement("li");
				cbox = document.createElement("input");
				cbox.type = "checkbox";
				cbox.setAttribute("class","butt");
				cbox.checked = false;
				cbox.value = ckb[i]["menu"];
				var txtspan = document.createElement("span");
				txtspan.setAttribute("class","red");
				var mtxt = document.createTextNode(ckb[i]["menu"]);
				txtspan.appendChild(mtxt);
				li.appendChild(cbox);
				li.appendChild(txtspan);
				list.appendChild(li);
			}
		}	
		as = document.getElementsByClassName("butt");
		for(i=0;i<as.length;i++){
			as[i].addEventListener("click",function(evt){
				if(evt.target.checked == true){
					addon.port.emit("setActive",evt.target.value);
				}else{
					addon.port.emit("setInactive",evt.target.value);
				}
			},false)
		}
	});
}
</script>
</html>

Click to Install Most Recent Version

Standard