94
edits
Abimanyuraja (talk | contribs) (Added tutorial for pageload and startup) |
|||
Line 476: | Line 476: | ||
= Interacting with Other Extensions = | = Interacting with Other Extensions = | ||
There isn't much to say here besides that it's easy. For example, here's a command which interfaces with the FoxyTunes plugin: letting you play/pause your favorite music player. | There isn't much to say here besides that it's easy. For example, here's a command (thanks to Abimanyu Raja for writing this code) which interfaces with the FoxyTunes plugin: letting you play/pause your favorite music player. Interfacing with other extensions, too, is easy because you can view the source code for every Firefox extension. | ||
<pre> | <pre> | ||
// | //Check if FoxyTunes is installed | ||
if(window.foxytunesDispatchPlayerCommand){ | if(window.foxytunesDispatchPlayerCommand){ | ||
function cmd_play_song(){ foxy_tunes_action("Play"); } | function cmd_play_song(){ foxy_tunes_action("Play"); } | ||
function cmd_pause_song(){ foxy_tunes_action("Pause"); } | function cmd_pause_song(){ foxy_tunes_action("Pause"); } | ||
Line 489: | Line 490: | ||
window.foxytunesDispatchPlayerCommand(action, true); | window.foxytunesDispatchPlayerCommand(action, true); | ||
} | } | ||
} | |||
</pre> | |||
= Running on page load and startup = | |||
In order to run some code on page load, you simply have to prefix your function with <code>pageLoad_</code>. Say, for example, you want to say "Hi" everytime a page is loaded: | |||
<pre> | |||
function pageLoad_hi(){ | |||
displayMessage("hi"); | |||
} | |||
</pre> | |||
Similarly, if you want to run some code everytime Firefox starts up, you just have to prefix the function with <code>startup_</code> | |||
The awesome thing about these functions is the ability to develop Firefox extensions (that have require minimal UI) in lesser lines of code (no need to worry about chrome.manifest or install.rdf). Another added benefit is that you never have to restart your Firefox during development unless of course, you are running code on Firefox startup. Currently, after you change some code, invoke Ubiquity and close it, then all the code should have been updated. | |||
Here's the code for a Ubiquity Command that makes use of pageLoad and startup to recreate the functionality of the [https://addons.mozilla.org/en-US/firefox/addon/339 Search Keys extension] by Jesse Ruderman. In line with Ubiquity's aim to let you do things quicker using your keyboard, this command lets you go to search results on Google by just pressing a number. It'll add hints to show the number of each link. | |||
http://img388.imageshack.us/img388/3086/picture5eo9.png | |||
<pre> | |||
//A lot of this code is borrowed from Search Keys extension | |||
//Many thanks to Jeese Ruderman | |||
function startup_keyscape() { | |||
window.addEventListener("keydown", keyscape_down, true); | |||
} | |||
function pageLoad_keyscape(doc){ | |||
var uri = Utils.url(doc.documentURI); | |||
//If we are on about: or chrome://, just return | |||
if(uri.scheme != "http") | |||
return; | |||
//Check if the page we are on is google | |||
if( keyscape_isGoogle(uri) ){ | |||
for(var num=1; num<=10; num++){ | |||
var link = jQuery(doc.body).find('a.l')[num-1]; | |||
if( link ){ | |||
//TODO: convert to jquery | |||
var hint = doc.createElementNS("http://www.w3.org/1999/xhtml", "span"); | |||
hint.style.color = "blue"; | |||
hint.style.background = "white"; | |||
hint.style.padding = "1px 2px 1px 2px"; | |||
hint.style.marginLeft = ".5em"; | |||
hint.appendChild(doc.createTextNode(num == 10 ? 0 : num)); | |||
link.parentNode.insertBefore(hint, link.nextSibling); | |||
} | |||
} | |||
} | |||
} | |||
function keyscape_isGoogle(uri){ | |||
return uri.host.indexOf("google") != -1 | |||
&& (uri.path.substr(0,8) == "/search?" || uri.path.substr(0,8) == "/custom?"); | |||
} | } | ||
function keyscape_down(event){ | |||
var doc = Application.activeWindow.activeTab.document; | |||
var uri = Utils.url(doc.documentURI); | |||
if( keyscape_isGoogle(uri) ){ | |||
var key = parseInt(event.keyCode || event.charCode); | |||
var num; | |||
if(48 <= key && key <= 57) //number keys | |||
num = key - 48; | |||
else if(96 <= key && key <= 105) //numeric keypad with numlock on | |||
num = key - 96; | |||
else | |||
return; | |||
//NOTE the fact that we must get from window, document variable is not initiated | |||
//Don't do anything if we are in a textbox | |||
//or some other related elements | |||
var elt = window.document.commandDispatcher.focusedElement; | |||
if (elt) { | |||
var ln = new String(elt.localName).toLowerCase(); | |||
if (ln == "input" || ln == "textarea" || ln == "select" || ln == "isindex") | |||
return; | |||
} | |||
//Get the link url from the search results page | |||
var url_dest = jQuery(doc.body).find('a.l').eq(num-1).attr('href'); | |||
if(event.altKey){ | |||
//Open in new tab | |||
Application.activeWindow.open(Utils.url(url_dest)); | |||
}else{ | |||
//Open in same tab | |||
doc.location.href = url_dest; | |||
} | |||
} | |||
} | |||
</pre> | </pre> | ||
If Ubiquity does indeed become ubiquitous, a lot of extensions can be re-written as Ubiquity commands. This is much nicer for the end-user, as well, because the Ubiquity command installation process is a lot more humane. | |||
= Conclusion = | = Conclusion = |
edits