MDCの日本語版と英語版を切り替えるFirefox拡張機能を作成する (その2)
前回に引き続き、MDCの日本語版と英語版を切り替えるFirefox拡張機能を作成する。簡単に復習すると、要するにURL文字列のjaとenを切り換える機能を作れば良いだけだ。
参考資料
最近は拡張開発業界(?)が盛り上がっているようで、参考資料が増えてきている。いいことだ。
今年の8月、ついに発売された。特に3章「Firefox 3向けの拡張機能開発テクニック」が役に立つ。というか、本格的すぎて理解しきれていない。今回は「標準ライブラリ FUELを活用する」というhackを参考にした。
いつの間にかこんな良さげな連載が始まっていた。このブログよりよっぽど役に立つので、参考にしまくる。
作成ファイル一覧
今回作成したファイルは以下の通り。
chrome.manifest install.rdf chrome/content/main.xul chrome/content/switch_page_locale.js
このうち、「chrome.manifest」と「install.rdf」は今までを見て適当に作ってほしい。ちょっと名前を書き換えるぐらいなので、詳しい内容は省略する。また、見ての通り作成する拡張機能の名前は「Switch Page Locale」とした。
JavaScriptファイル作成
まず、JavaScriptファイル(switch_page_locale.js)を作成する。これが拡張機能の本体になる。
var SwitchPageLocale = { switchLocaleCurrenTab: function() { SwitchPageLocale.switchLocale(false); }, switchLocaleNewTab: function() { SwitchPageLocale.switchLocale(true); }, switchLocale: function(newTab) { // URI置き換えの対象となるホスト名 var targetHost = "developer.mozilla.org"; // URIの置き換え対象となる文字列の定義 var replaceStr = [ {oldStr: "/en/", newStr: "/ja/"}, {oldStr: "/ja/", newStr: "/en/"}, ]; // 現在のタブのnsIURIオブジェクト var currentUri = Application.activeWindow.activeTab.uri; if (currentUri.host == targetHost) { var newUri = currentUri.clone(); for each (var item in replaceStr) { if (currentUri.path.match(item.oldStr)) { // 置き換え対象となる文字列が含まれていた場合 // pathを置き換える newUri.path = currentUri.path.replace( item.oldStr, item.newStr); if (newTab) { // 新しいタブとして開く Application.activeWindow.open(newUri); } else { // 現在のタブに新しいページを読み込む Application.activeWindow.activeTab.load(newUri); } break; } } } }, };
まず var SwitchPageLocale = { ... }; という風に一つの大きい{}でくくられている。この{ ... }は「オブジェクトリテラル」と言って、この中括弧でオブジェクトを記述し、SwitchPageLocaleという変数に代入している。そして、そのオブジェクトの中には「プロパティ名:プロパティ値」という形式で3つのプロパティが定義されている。
なぜこんなことをするのかというと、変数、関数の名前の衝突を避けるためだ。例えば1つめの関数には、SwitchPageLocale.switchLocaleCurrenTab という名前でアクセスし、頭のSwitchPageLocaleというオブジェクト名は省略できない。これにより、他の拡張機能なんかで同じ名前の関数が定義されていたとしても、今回作成した関数と区別がつけれるようになる。
もっとも、このオブジェクト名が衝突してしまう可能性はあるが、そんな時は運が悪かったと思ってあきらめることにする。なるべくあやしげな名前をつけておこう。この辺は「Firefox 3ではじめる拡張機能開発」の第3回 機能を実装する(中編)を参考にした。
コードの内容だが、メインとなるのは3つ目のswitchLocale関数だ。この関数内では、噂の「FUEL」を使っている。お手元のFirefox 3 Hacks 110ページを開いてほしい。ここから数ページに渡って、現在タブのnsIURIオブジェクトを取得する方法が書かれている。それが「Application.activeWindow.activeTab.uri」という部分だ。残念ながらnsIURIの説明は載っていないので、MDCのページも参考にした。その下のコードでは、HOST名が「developer.mozilla.org」だったら/ja/と/en/を入れ替えたページに移動する、という処理を行っている。これで英語版と日本語版の切り換えができるはずだ。
XULファイル作成
<?xml version="1.0"?> <overlay id="switch_page_locale-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script type="application/javascript" src="chrome://switch_page_locale/content/switch_page_locale.js"></script> <popup id="contentAreaContextMenu"> <menuitem id="taghelper-menu" label="switch page locale" oncommand="SwitchPageLocale.switchLocaleCurrenTab();" /> </popup> </overlay>
JavaScriptファイルで「ページを切り換える」というメイン処理を作成したので、今度はその処理を呼び出すUIを作成する。今回は単純に右クリックメニューに追加した。まずscript要素で作成したJavaScriptファイルを指定し、右クリックメニューを選択するとその関数を呼び出すようにしている。詳しくは第2回 機能を実装する(前編)を参考にしてほしい。
実はこれはまだ未完成だ。本当は今のタブ、新しいタブのどちらで開くかを選択できるようにしたい。今後のお楽しみとしてとっておくことにする。