Firefox Extension

1 of 23 02/05/08 00:49

Firefox Extension

thinker@branda.to

Firefox Extension

2 of 23 02/05/08 00:49

XUL

Firefox Extension

3 of 23 02/05/08 00:49

Window

<?xml version="1.0"?><?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="findfile-window" title="Find Files" orient="horizontal" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"><!-- Other elements go here --> <button id="find-button" label="Find" oncommand="alert('hello');"/> <button id="cancel-button" label="Cancel"/></window>

Firefox Extension

4 of 23 02/05/08 00:49

View

How to view a window?

firefox -chrome URL

chrome

resource

http

file

relative path

window.open(url,windowname,flags);

EX.

firefox -chrome test.xul

Firefox Extension

5 of 23 02/05/08 00:49

Tree

<?xml version="1.0"?><?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="findfile-window" title="Find Files" orient="horizontal" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<tree flex="1">

<treecols> <treecol id="sender" label="Sender" flex="1"/> <treecol id="subject" label="Subject" flex="2"/> </treecols>

<treechildren> <treeitem> <treerow> <treecell label="joe@somewhere.com"/> <treecell label="Top secret plans"/> </treerow> </treeitem> <treeitem> <treerow> <treecell label="mel@whereever.com"/> <treecell label="Let's do lunch"/> </treerow> </treeitem> </treechildren>

</tree></window>

Firefox Extension

6 of 23 02/05/08 00:49

Merge Point

A element with id.

Insert

Remove

Modify

Attributes in overlay will override the element's value

Firefox Extension

7 of 23 02/05/08 00:49

Overlay

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>

<?xul-overlay href="chrome://findfile/content/toverlay.xul"?>

<window title="Stop and Go" id="test-window" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<box id="singlebox"> <button id="gobutton" label="Go"/> <button id="stopbutton" label="Stop"/> </box>

</window>

toverlay.xul

<?xml version="1.0"?>

<overlay id="toverlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<box id="singlebox"> <button id="backbutton" label="Back"/> <button id="forwardbutton" label="Forward"/> </box>

</overlay>

see ex4/

Firefox Extension

8 of 23 02/05/08 00:49

XUL More

DOM

script tag

XBL

See

http://developer.mozilla.org/en/docs/XUL_Tutorial

Firefox Extension

9 of 23 02/05/08 00:49

Package

A ZIP archive of

manifest files;

install.rdf,

chrome.manifest,

XUL files,

CSS files,

......

Firefox Extension

10 of 23 02/05/08 00:49

Layout

Package layout

install.rdf

chrome.manifest

content/

*.xul

*.js

skin/

*.css

locale/

*.dtd

components/

Firefox Extension

11 of 23 02/05/08 00:49

install.rdf

Install manifest

is information about an addon as it is being installed.

<?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"> <!-- required properties --> <em:id>test@branda.to</em:id> <em:version>1.0.0</em:version> <em:type>2</em:type> <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> <em:name>Test Program</em:name> </Description></RDF>

Firefox Extension

12 of 23 02/05/08 00:49

chrome.manifest

content test content/overlay chrome://test/content/test.xul \ chrome://test/content/toverlay.xul

Map Chrome URIs to direcotries

Merage toverlay.xul to test.xul

Firefox Extension

13 of 23 02/05/08 00:49

ex5

See

ex5/

Firefox Extension

14 of 23 02/05/08 00:49

Test

Create a file

'/your/profile/extensions/<package_name>'

contain a line '/path/to/your/package/'

Turn off XUL cache

pref("nglayout.debug.disable_xul_cache", true);

Compress (ZIP) files into a .xpi

Open and install it with Firefox

Firefox Extension

15 of 23 02/05/08 00:49

Chrome

Chrome is the set of user interface elements of the

application window that are outside of a window's

content area. - from http://0rz.tw/443DQ

Also

http://developer.mozilla.org/en/docs/Chrome

Firefox Extension

16 of 23 02/05/08 00:49

Provider

Chrome provider

Types

Content

Locale

Skin

Firefox Extension

17 of 23 02/05/08 00:49

Registery

chrome.manifest

locations

root of extension,

theme, and

chrome/*.manifest

Map chrome URI to disk path.

Firefox Extension

18 of 23 02/05/08 00:49

Chrome URI

chrome://<package>/<part>/......

Part

Content

Locale

Skin

Elevate your privileges

Firefox Extension

19 of 23 02/05/08 00:49

Others

Firefox Extension

20 of 23 02/05/08 00:49

Pref.

Default Preferences

defaults/preferences/

*.js

pref("extensions.sample.username", "Joe"); //a string prefpref("extensions.sample.sort", 2); //an int prefpref("extensions.sample.showAdvanced", true); //a boolean pref

Firefox Extension

21 of 23 02/05/08 00:49

Use Pref.

var prefs = Components.classes["@mozilla.org/preferences-service;1"]. getService(Components.interfaces.nsIPrefBranch);

var tabsMode; if (prefs.getPrefType("browser.tabs.loadInBackground") == prefs.PREF_BOOL){ tabsMode = prefs.getBoolPref("browser.tabs.loadInBackground"); } alert(tabsMode);

Firefox Extension

22 of 23 02/05/08 00:49

Pref. Funcs

nsIPrefService

getBranch()

nsIPrefBranch

String

PREF_STRING, getCharPref(), setCharPref()

Boolean

PREF_BOOL, getBoolPref(), setBoolPref()

Integer

PREF_INT, getIntPref(), setIntPref()

http://0rz.tw/743G1

http://0rz.tw/bd3Cm

Firefox Extension

23 of 23 02/05/08 00:49

App

firefox -chrome URL

Load an URL instead of default UI as start window.

see

http://developer.mozilla.org/en/docs/Chrome