firefox插件开发之一

简单扩展之一 overlay

FF 的插件的基本目录结构如下：

/chrome

---/content

---/sample.xul

/install.rdf

/chrome.manifest

基本原理很简单，需要的基础的三个配置文件就可以了，

一、首先介绍安装文件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#">


这三行相对固定——本例中用于引入RDF的命名空间。


<Description about="urn:mozilla:install-manifest">
标记下的内容是文件内容的实质性描述，


<em:id>{4BBDD651-70CF-4821-84F8-2B918CF89CA4}</em:id>
插件的唯一描述符， 用于标示唯一的扩展，此标记的内容在1.5以前的版本中要求GUID格式，1.5以后是extension@domain形式，到现在为止firefox已经出到了2.0.0.5，firefox3的beta版本已经出来了，所以知道后一种格式就ok了，本例中填了一个简单的内容sample@foo.net


<em:version>1.0</em:version>
插件版本号


<em:type>2</em:type>
标示当前这个xpi安装包的类型，2表示扩展，4表示主题，8表示本体化，16标示Plugin。本例是一个扩展，所以选2。




<!-- Target Application this extension can install into,


with minimum and maximum supported versions. -->


<em:targetApplication>这个标记用来标示当前的安装所包适用的Mozilla平台，访问一下Mozilla的主页，你会发现很多基于Mozilla的软件，而这个标签下的子标记id则标示了哪个软件可以安装当前的这个xpi，他是GUID形式的。


<Description>


<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>


<em:minVersion>1.0+</em:minVersion>
这对标签用于标示当前安装包的适用版本范围，


<em:maxVersion>2.0.0.5</em:maxVersion>


</Description>


</em:targetApplication>




<!-- Front End MetaData -->


<em:name>Sample!</em:name> 标签标示xpi的名字。


<em:description>A test extension</em:description>


<em:creator>Hotcat</em:creator>


<em:homepageURL>http://www.foo.com/</em:homepageURL>


</Description>


</RDF>

二、其次介绍负责注册的文件chrome.manifest

代码如下 ：

# content package

content bibikan
chrome/content/

这是资源注册，本例中注册了一个content包，名字为bibikan，后面的chrome/content/表示一个路径，

# overlay package

overlay
chrome://browser/content/browser.xul
chrome://bibikan/content/overlay.xul

表示一个覆盖，格式也很简单，overlay 标准资源 自定义资源。本例中用bibikan/content/overlay.xul中的元素覆盖browser.xul中的元素。

interfaces components/BBKLocal.xpt

binary-component components/BBKXPCOM.dll

contract @www.bibikan.cn/BBKLocal;1 {cc2bce70,7d55,11e0,a411,0800200c9a66}

三、最后介绍sample.xul

XUL是XML用户界面语言,是对XML的一种扩展，所以XUL也是一种XML，也要符合XML的语法规范，这一行是每一个XML都有的。

代码如下;

<?xml version="1.0"?>

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

这句说明他是一个overlay，xmlns是一个命名空间，默认情况下，overlay所有子标记都继承这个命名空间。

<script type="application/x-javascript" src="overlay.js"/>

</overlay>

1.javascript的脚本声明：type写成application/x-javascript表示js脚本，src表示当前xul文件要用到的js脚本的位置，这里用的是相对地址，根据习惯，js文件和xul文件放在同一个文件夹——content文件夹下。

2、overlay.js中就可以用JS添加一些对页面事件的响应

window.addEventListener("load", function(){ alert("page load");},false);

window.addEnventListener("pagehide", function(){alert("page leave")}, false);

以及DOMContLoaded事件响应函数等等 另外还有 pageshow 事件响应函数，load事件响应函数只是在 firefox第一次打开的时候响应新建一个tab页MS没有响应此事件，反而响应了 pagehide事件，当时我就纳闷了..难道是firefox截获了load事件响应函数？

听说 ff1.5开始采用了跟opera类似的高速缓存机制，多数情况下，页面被完整的cache起来（例外情况如https, cache-control以及带有unload页面）知道浏览器关闭，这使得bf(back/forward)响应飞快，但是有一个情况，在bf时不再触发onload事件，并且也不执行inline的脚本，

为此ff1.5为此增加了两个事件 pageshow 和pagehide事件，为恢复页面的state提供处理函数