Wednesday, 27 August 2008

Ubiquity: Firefox Command Line Awesomeness

Ubiquity - "a Mozilla Labs experiment into connecting the Web with language in an attempt to find new user interfaces that could make it possible for everyone to do common Web tasks quicker and easier."

Getting started

Install the Plugin, which will restart Firefox / Mozilla.
*Note: if you are using a Mac you'll need to install Growl to get the notifications to work. Windows works out of the box, popping up those little toaster notifications in the bottom right of your screen. No messages on Linux just yet, but I'm sure there is someone out there clever enough to get this working or know how to get it working.

Once restarted, hit CTRL+SPACE for Windows or OPTION+SPACE for Mac and you'll see Ubiquity pop up below your open tabs.

There are already quite a few commands built in (type "command-list" into Ubiquity to see them all), follow this tutorial to get up and running.

One of the sweet things about it is creating your own commands using the command editor ("command-editor" in Ubiquity). Just create your command in the editor using Javascript and the tutorial provided and without needing to restart the browser, it's ready to use.

I've been mucking about with it today and created a Ruby-Doc search command just to kick the tyres:
var noun_type_ruby_keyword = {
_name: "ruby keyword",
suggest: function( text, html ) {
var suggestions = [CmdUtils.makeSugg(text)];
return suggestions;
}
}

CmdUtils.CreateCommand({
name: "ruby-api",
takes: {keyword: noun_type_ruby_keyword},
icon: "http://www.ruby-doc.org/_img/favicon.ico",
description: "Searches Ruby-Doc for the keyword(s)",
preview: function(pblock, directObject) {
searchTerm = jQuery.trim(directObject.text);

var pTemplate = "Searches Ruby-Doc for ${query}";
var pData = {query: searchTerm}
pblock.innerHTML = CmdUtils.renderTemplate(pTemplate, pData);
var url = "http://ajax.googleapis.com/ajax/services/search/web";
var params = { v: "1.0", q: searchTerm };

jQuery.get(url, params, function(data) {
var numToDisplay = 3;
var results = data.responseData.results.splice( 0, numToDisplay );

pblock.innerHTML = CmdUtils.renderTemplate( {file:"google-search.html"},
{results:results}
);
}, "json");
},
execute: function(directObject) {
var url = "http://www.google.com/search?q=site%3Awww.ruby-doc.org+{QUERY}"
var query = directObject.text;
var urlString = url.replace("{QUERY}", query);
Utils.openUrlInBrowser(urlString);
}
});

As you can see, it's got JQuery built in (along with many other helper functions) so it's easy to do Ajax and all sorts of goodness. I'm very impressed, especially as it's currently a Prototype - looking forward to future releases and the community of commands.