I released my first Firefox plugin today. It is awaiting review, but if you are adventurous, you can install it right now. Go on, try it.
After I had written the Chrome version yesterday, Manish suggested that I should write one for Firefox. There already exist Firfox plugins that does exactly what GetCache does, but I decided to go ahead and write it for fun. And of course, the fact that I could publish it without having to sign up with my Credit Card information was enticing.
There are three approaches to write a Firefox plugin:
- Traditional extensions - Uses JAvaScript and XUL.
- Jetpacks - Uses HTML, CSS and JavaScript.
- Bootstrapped extensions
I decided to go the Jetpack because the development process and technologies were similar to Chrome plugins. And I had no prior experience with XUL. Once I had downloaded the SDK and set it up, things were pretty easy. The API is well documented.
The API
The bulk of the code is JavaScript. The API is easy to use. The following snippet adds a widget to the Addon toolbar at the bottom of the Firefox window:
var createWidget = function () {
new Widget({
id: "sdqali-getcache",
label: "Get Google's cached version of the current page..",
contentURL: self.data.url ("images/icon.png"),
onClick: function(event) {
loadCachedPage ();
}
});
};
Adding context menu entries
While things were pretty smooth overall, I ran in to a weird edge
case. I wanted a context menu entry that would load the Google cache
page, and I wanted this entry to be available regardless of whether the
user has selected some text in the page or not. The API uses the notion
of
Contexts
o decide when the menu entry will be available. While the API says that
I can use an arrays of Contexts, I had no success with it. I ended up
creating two context menu entries, one attached to the PageContext and
one attached to the SelectionContext.
Source
I used this beautiful icon by Sergio Sanchez Lopez. Since it comes with a GPL license, the plugin is also licensed under GPL. I have put the source code on Github.