Firefox - building an extension
Here’s an update to this post 7/6/2008:
Use this link from firefox and in particular Setup the Development Environment.
—-
I used this link as a model for creating an extension which put a button on FF’s address bar: Building an extension
I more or less followed those instructions: Firefox user interface is written as a .xul file, pronounced “zool”. As explained in Building an extension in the “Chrome URI’s” section you can even execute the browser ui in the browser. Place “chrome://browser/content/browser.xul” in the browser address bar.
To add a new user interface element you create an overlay and basicly dynamically modify the browser.xul file. An overlay is an .xul file which defines a location where the new interface element is to be located and then what it is to do. Finding the location to insert isn’t difficult, the main UI document on my Ubuntu system it is located at at /usr/share/firefox/chrome/browser/content/browser/browser.xul
In the example they modified the status line which is can be found in browser.xul by searching for “statusbar”. Since I wanted to modify the address url I looked around and found that there is a texbox with the id=”urlbar”. So the prgs/fx/sl/chrome/content/sample.xul file contains the following:
<textbox id=”urlbar”>
<button insertafter=”page-proxy-dec” id=”my-button” label=”sl”
oncommand=”alert(’You pressed me!’); return false;”/>
</texbox>
Which adds a button with the label “sl” to the address bar and when pressed displays an allert with “You pressed me!”. So the following steps will get you the same thing:
1) Created my “extension” in ~/prgs/fx/sl which have the following 3 files:
chrome.manifest
install.rdf
chrome/content/sl.xul
2) The content of the files are:
wink@ic2d1:~/prgs/fx/sl$ cat chrome.manifest
content sl chrome/content/
overlay chrome://browser/content/browser.xul chrome://sl/content/sl.xul
wink@ic2d1:~/prgs/fx/sl$ cat install.rdf
<?xml version=”1.0″?>
<RDF xmlns=”http://www.w3.org/1999/02/22-rdf-syntax-ns#”
xmlns:em=”http://www.mozilla.org/2004/em-rdf#”><Description about=”urn:mozilla:install-manifest”>
<em:id>sl@saville.com</em:id>
<em:version>1.0</em:version>
<em:type>2</em:type><!– Target Application this extension can install into,
with minimum and maximum supported versions. –>
<em:targetApplication>
<Description>
<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
<em:minVersion>1.5</em:minVersion>
<em:maxVersion>2.0.0.*</em:maxVersion>
</Description>
</em:targetApplication><!– Front End MetaData –>
<em:name>sl</em:name>
<em:description>Shared link<em:description>
<em:creator>Wink Saville</em:creator>
<em:homepageURL>http://www.saville.com/</em:homepageURL>
</Description>
</RDF>
wink@ic2d1:~/prgs/fx/sl$ cat chrome/content/sl.xul
<?xml version=”1.0″?>
<overlay id=”sample”
xmlns=”http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul”>
<textbox id=”urlbar”>
<button id=”my-button” label=”sl”
oncommand=”alert(’You pressed me!’); return false;”/>
</texbox>
</overlay>
3) To install the extension added sample@foo.net to the extensions directory:
wink@ic2d1:~/prgs/fx/sl$ cat ~/.mozilla/firefox/fbgu8siq.default/extensions/sl@saville.com
/home/wink/prgs/fx/sl
This is just the path to my extension
4) To actually get the url of the current page, this looks like the definitive source. and it says the best is window.content.location.href. I also tried document.getElementById(’urlbar’).value which also looks to have worked.