mark phillip markphillip.com the right tools for the right job building add-ons for firefox and...
TRANSCRIPT
Mark Phillipmarkphillip.com
The Right ToolsFor The Right JobBuilding Add-ons for Firefox and Fennec
I've never created a Firefox add-on
because...
”“I've never created
a Firefox add-on because I've been able to do most things I want to do using Greasemonkey / User Scripts.
”“I've never created
a Firefox add-on because I've never needed to.
”“Never created a ff
addon because the iPhone API is way too distracting.
Stats
1.5M Downloads/Day
1.5M Downloads/Day192M In Use
1.5M Downloads/Day192M In Use
1/3 of users have 1+
1.5M Downloads/Day192M In Use
1/3 of users have 1+1.6B Downloads
Just how big is1,656,860,490?
Firefox Culture?
AdBlock Plus
FirebugFlagfox
Download Statusbar
SkipScreen
”“I've never created
a Firefox add-on because I'm not a programmer.
XULXML User Interface Language
install.rdfchrome.manifest
main.xul
<?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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Firefox --> <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>1.5</em:minVersion> <em:maxVersion>3.5.*</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Firefox --> <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>1.5</em:minVersion> <em:maxVersion>3.5.*</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Firefox --> <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>1.5</em:minVersion> <em:maxVersion>3.5.*</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Firefox --> <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>1.5</em:minVersion> <em:maxVersion>3.5.*</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Firefox --> <em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>1.5</em:minVersion> <em:maxVersion>3.5.*</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Thunderbird --> <em:targetApplication> <Description> <em:id>{a463f10c-3994-11da-9945-000d60ca027b}</em:id> <em:minVersion>0.4</em:minVersion> <em:maxVersion>2.5</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
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>[email protected]</em:id> <em:version>1.0</em:version> <em:type>2</em:type> <em:name>Goodbye Cruel World</em:name> <em:description>Hello World is just too happy</em:description> <!-- Fennec --> <em:targetApplication> <Description> <em:id>{a23983c0-fd0e-11dc-95ff-0800200c9a66}</em:id> <em:minVersion>0.1</em:minVersion> <em:maxVersion>1.0.*</em:maxVersion> </Description> </em:targetApplication> </Description></RDF>
install.rdf
contentrefreshchrome/content/application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
overlaychrome://browser/content/browser.xul
chrome://refresh/content/main.xulapplication={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
chrome.manifest
contentrefreshchrome/content/application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
overlaychrome://browser/content/browser.xul
chrome://refresh/content/main.xulapplication={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
chrome.manifest
contentrefreshchrome/content/application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
overlaychrome://browser/content/browser.xul
chrome://refresh/content/main.xulapplication={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
chrome.manifest
There is no Dana,Only Zuul
<?xml version="1.0"?>
<overlay id="refresh" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbox id="navigator-toolbox"><label>I'm so emo.</label>
</toolbox>
</overlay>
main.xul
<?xml version="1.0"?>
<overlay id="refresh" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbox id="navigator-toolbox"><label>I'm so emo.</label>
</toolbox>
</overlay>
main.xul
<?xml version="1.0"?>
<overlay id="refresh" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbox id="status-bar"><toolbar id="ruwt-toolbar“>
<vbox><label>I'm so emo.</label><label onmouseover="alert('I love
Paramore.')" style="color:red;font-weight:bold">My fingernails are black.</label>
</vbox></toolbar>
</toolbox>
</overlay>
main.xul
<?xml version="1.0"?><?xml-stylesheet href="chrome://refresh/content/css/main.css"
type="text/css"?>
<overlay id="refresh" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbox id="status-bar"><toolbar id="ruwt-toolbar“>
<vbox><label>I'm so emo.</label><label onmouseover="alert('I love
Paramore.')" style="color:red;font-weight:bold">My fingernails are black.</label>
</vbox></toolbar>
</toolbox>
</overlay>
main.xul
<?xml version="1.0"?><?xml-stylesheet href="chrome://refresh/content/css/main.css"
type="text/css"?>
<overlay id="refresh" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="text/javascript" src="chrome://refresh/content/js/main.js"/>
<toolbox id="status-bar"><toolbar id="ruwt-toolbar“>
<vbox><label>I'm so emo.</label><label onmouseover="alert('I love
Paramore.')" style="color:red;font-weight:bold">My fingernails are black.</label>
</vbox></toolbar>
</toolbox>
</overlay>
main.xul
Packaging
<target name="widgets.mozilla.build" depends="init, clean" description="Builds Mozilla Toolbar .xpi install file">
<mkdir dir="${out.mozilla}"/><mkdir dir="${dist}"/>
<copy todir="${out.mozilla}"><fileset dir="${widgets.mozilla}"/>
</copy>
<zip destfile="${dist}/ruwt.xpi" basedir="${out.mozilla}"/></target>
ANT Build
set x=extension_namexcopy %x% build /i /e xcopy build\content build\chrome\content /i /ermdir /s /q build\content cd build\chrome7z a -tzip "%x%.jar" * -r -mx=0cd ..\.. rmdir /s /q build\chrome\contentrmdir /s /q build\chrome\localermdir /s /q build\chrome\skin replace chrome.manifest build cd build7z a -tzip "%x%.xpi" * -r -mx=9cd .. move build\%x%.xpi %x%.xpi rmdir /s /q build Windows Build
Deployment
Distribution
Statistics
Fennec
A Moment for JavaScript
Add-ons Tutorialhttps://developer.mozilla.org/en/Building_an_Extension
XUL Referencehttps://developer.mozilla.org/En/XUL
XUL IDEshttps://wiki.mozilla.org/XUL:IDE
Firefox Add-onshttps://addons.mozilla.org/en-US/firefox/
Fennec Add-onshttps://addons.mozilla.org/en-US/mobile/
This Talkhttp://markphillip.com/talks
Mark Phillipmarkphillip.com
Thanks!