FireFoxアドオンの作り方

思い立って調べたのでまとめておくです。
調べていると、FireFox3.0だとうまくいかない方法が結構あったので気をつけるべし。
chrome.manifestが必要です。
あと、固め方もちょっと違ってます。

＜必要ファイル＞
-install.rdf
-chrome.manifest
-/content
-Test.js
-Test_Overlay.xul


(◆install.rdf)

<?xml version="1.0"?>
RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#" 
         xmlns:em="http://www.mozilla.org/2004/em-rdf#">

  <RDF:Description RDF:about="urn:mozilla:install-manifest">
  
    <em:id>{4ca57b4b-f288-4002-96b1-993a069b3c9e}</em:id><==作成したAddonのGIDになるので自分で設定 *1 GID自動作成サイト　http://extensions.roachfiend.com/cgi-bin/guid.pl
    <em:name>Test</em:name>
    <em:version>0.1</em:version>
    <em:description>test</em:description>
    <em:creator>uly</em:creator>

    <!-- firefox -->
    <em:targetApplication>
       <RDF:Description em:id="{ec8030f7-c20a-464f-9b0e-13a3a9e97384}"  <==firefox のGID ここは固定
                    em:minVersion="1.5"
                    em:maxVersion="3.0.*" />　　<==アドオンが提供するFireFoxのバージョンを設定
    </em:targetApplication>
    <!-- flock -->
    <em:targetApplication>
       <RDF:Description em:id="{4ca57b4b-f288-4002-96b1-993a069b3c9e}"
                     em:minVersion="0.1"
                     em:maxVersion="1.0" />　
    </em:targetApplication>

  </RDF:Description>

</RDF:RDF>

(◆chrome.manifest)

content Test content/ <==ファイルのある所在を記載
overlay chrome://browser/content/browser.xul chrome://Test/content/Test_Overlay.xul　<==オーバーレイのある所在を記載


(◆/content/Test_Overlay.xul)
アドオンが表示される場所を設定

<?xml version="1.0"?>

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

<script type="application/x-javascript" src="chrome://Test/content/Test.js"> <==使用するjsの場所を設定
</script>

<keyset id="mainKeyset">
  <key id="Test" modifiers="alt" key="R" oncommand="Test();"/>
</keyset>

<popup id="contentAreaContextMenu">  <==右クリックメニューに表示
  <menuitem id="Test" label="猫科" accesskey="R"
  insertafter="context-bookmarkpage" oncommand="Test();"/>　　<==メニューを押されたときに実行するfunction
</popup>

</overlay>

(◆/content/Test.js)
実際に機能をここに書く
mozilaの独自のDOMを仕様なので通常のjavascriptとは若干異なる

function Test(){
 var w = window._content; <==ここらへん
 var d = w.document;　<== ここらへん
 d.body.innerHTML=d.body.innerHTML.replace(/ね/g,'にゃ');

 d.body.innerHTML ="<div style='background-color:#ffdaff;color:#ff6699;font-size:12px'>" + d.body.innerHTML + "</div>";
}

＜ファイルの固め方～インストール方法＞

install.rdf
chrome.manifest
/content

の3ファイルをzipで固める。（上位のフォルダでzipにしてしまうとうまくいきません）

Test.zipを作成後、zipの拡張子をxpiに変更

作ったTest.xpiをFireFoxブラウザにドラッグ＆ドロップ

インストール開始！再起動したらインストール完了！


【参考URL】
チュートリアル https://developer.mozilla.org/Ja/XUL_TutorialXUL
GID自動作成サイト　http://extensions.roachfiend.com/cgi-bin/guid.pl

firefoxの中身
ブラウザのアドレスバーに
chrome://browser/content/browser.xul　と入力
firebugなどで調査するとmozilaのDOMを見ることができます。


＜FireFoxがハングしてしまったら＞
スタート → プログラム → Mozilla Firefox → Mozilla Firefox (Safe Mode) と行き、Firefox をセーフモードで起動する。
次に ツール → 拡張機能 → [失敗した拡張を選択して右クリック] → 削除 とし、アンインストールする。
FireFox再起動で元通り