667
edits
Changes
no edit summary
[[Dive into Mozilla]] > [[Dive into Mozilla Day 5]] > Modifying Firefox using an Extension Lab
'''...in progress...'''
However, unlike last time where we modified tabbrowser.xml directly, this time we will '''overlay''' our changes onto the browser at runtime, and alleviate the need for any direct changes to the code. This is possible using '''extensions'''.
Start by creating a new extension, either by hand, or using Ted Mielczarek's wonderful wizard:
http://ted.mielczarek.org/code/mozilla/extensionwiz/
Directory structure:
'''addtabbeside/'''
content.manifest
install.rdf
'''content/'''
firefoxOverlay.xul
overlay.js
Here is the '''content.manifest''' file:
content addtabbeside content/
overlay chrome://browser/content/browser.xul chrome://addtabbeside/content/firefoxOverlay.xul
Here is the '''install.rdf''' file for the extension:
<pre>
<?xml version="1.0" encoding="UTF-8"?>
<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>addtabbeside@senecac.on.ca</em:id>
<em:name>Add Tab Beside</em:name>
<em:version>0.1</em:version>
<em:creator>David Humphrey</em:creator>
<em:description>New tabs are created beside the current tab instead of at the end of the tab list.</em:description>
<em:targetApplication>
<Description>
<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <!-- firefox -->
<em:minVersion>2.0</em:minVersion>
<em:maxVersion>3.0a3pre</em:maxVersion> <!-- trunk build Feb 27, 2007 -->
</Description>
</em:targetApplication>
</Description>
</RDF>
</pre>
Here is firefoxOverlay.xul:
<pre>
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="chrome://addtabbeside/skin/overlay.css" type="text/css"?>
<!DOCTYPE overlay SYSTEM "chrome://addtabbeside/locale/addtabbeside.dtd">
<overlay id="addtabbeside-overlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script src="overlay.js"/>
</overlay>
</pre>
Load Listener code:
http://developer.mozilla.org/en/docs/Extension_Frequently_Asked_Questions#Why_doesn.27t_my_script_run_properly.3F
Reading through the rest of the '''moveTab''' method, we see that when a tab is successfully created, the '''TabOpen''' event is dispatched
(see ...)
// Dispatch a new tab notification. We do this once we're
// entirely done, so that things are in a consistent state
// even if the event listener opens or closes tabs.
var evt = document.createEvent("Events");
evt.initEvent("TabOpen", true, false);
t.dispatchEvent(evt);
return t;
This is useful information, because it tells us that if we want to know when a tab has been created, we have to add a listener for this event.
moveTabTo
http://lxr.mozilla.org/seamonkey/source/toolkit/content/widgets/tabbrowser.xml#1958
Create a file named: '''addtabbeside@senecac.on.ca'''
This file should contain the full path to your extension, for example:
C:\temp\addtabbeside
Now put this file in your development profile's extensions directory (NOTE: replace ''Username'' with your username and ''dev-profile'' with your development profile name):
C:\Documents and Settings\''Username''\Application Data\Mozilla\Firefox\Profiles\''dev-profile''\extensions
