Develop a Firefox extension 1.
Construct a development environment: Platform: Eclipse 3.4.1, SVN, Spket 1.6.16, Firefox 3.0 We will use the eclipse platform to develop this extension and control the version of the extension. To facilitate the development, we will also use another eclipse plug-in: Spket, a powerful tool for the XML and Javascript development. We shall first install the Subclipse plug-in, a eclipse SVN plug-in. To install this plug-in: Help -> Software Updates -> Available Software -> Add Site -> Location: http://subclipse.tigris.org/update_1.4.x -> Select ‘JavaHL Adapter(recommended)’ and ‘Subclipse(required)’ -> Install To install the Spket plug-in in eclipse: Help -> Software Updates -> Available Software -> Add Site -> Location: http://www.spket.com/update -> Select ‘Spket IDE’ -> Install. The web browser to test the plug-in will be firefox 3.0. To test the developed plug-in, we shall have to do the flowing steps for the firefox: 1. Create a new user profile. To create a new profile, first close all firefox then in the command line window, type ‘firefox -P’ to start the profile manager, create a new user profile, here we use the name ‘dev’. So in the future, we can use the command ‘firefox –P dev’ to start the firefox with the specified profile ‘dev’. 2. Firefox parameters settings. Type ‘about:config’ in the address bar, apply the following settings: javascript.options.showInConsole = true nglayout.debug.disable_xul_cache = true (*) browser.dom.window.dump.enabled = true (**) javascript.options.strict = true (*): don’t have to reload the .xul file to apply the modifications for the window and for the dialogue. (**): can use the ‘dump()’ statement for the output of the info in the console. 3. Some firefox extensions for the development of the extension:
‘Venkman’ for javascript ‘Extension Developer's Extension’ for the extension development ‘Chrome List’ for the visualization of the chrome components. ‘Firebug’ for the development of HTML, CSS, JS…
Development Languages: XUL, XML, CSS, Javascript XUL: XML User interface Language, is a language which uses XML to describe user interface.
2. Analysis of the firefox extension‘s structure The figure 1 shows a firefox extension’s basic directory structure:
figure 1.the basic structure of a firefox extension
In an extension, a XUL interface is generally made up of 3 parts: content: .xul file(s), which define the layout the user interface skin: .css and img file(s), which define the appearance of an application local: .dtd file(s), which define the strings for language localization In addition, the ‘chrome.maniest’ file is the ‘chrome’ (*) registered files list. And file ‘install.rdf’ is a installation description file for firefox.
3.
Some Samples extensions development Here are some useful links where we can find some sample extensions: https://developer.mozilla.org/En http://www.ibm.com/developerworks/web/library/wa-xul1/ http://www.borngeek.com/firefox/toolbar-tutorial/ or some other sites from google.
