拡張機能の例: ページが切り替わったタイミングを知る

リンクをクリックしたりして，ページが切り替わったタイミングを知るための手段の１つです．ここでは，Locationが変わったイベントを利用できるようにイベントリスナに登録します．

サンプルと言うことで，URLが変わったタイミングでalertダイアログを出すようにしています．鬱陶しいので一度見たら即消すことをお勧めします．

addProgressListener, removeProgressListener, addEventListener, removeEventListener

ファイルの構成

locationchange.xpiを一度ダウンロードしてからアドオンのリストにドロップしてください．

helloworld

[locationchange.xpi]
 + install.rdf
 + chrome.manifest
 + [chrome]
    + [content]
       - locationchange.xul
       - locationchange.js

基本情報

install.rdf

<?xml version="1.0"?>
<RDF:RDF xmlns:em="http://www.mozilla.org/2004/em-rdf#"
         xmlns:NC="http://home.netscape.com/NC-rdf#"
         xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<RDF:Description RDF:about="urn:mozilla:install-manifest">
	<em:id>locationchange@serikashiki.kis-lab.com</em:id>
	<em:type>2</em:type>
	<em:name>locationchange</em:name>
	<em:version>0.1.0.0</em:version>
	<em:targetApplication>
		<RDF:Description
			em:id="{ec8030f7-c20a-464f-9b0e-13a3a9e97384}"
			em:minVersion="2.0.0.0"
			em:maxVersion="2.*" />
	</em:targetApplication>

	<em:description>Show URI on Location Change</em:description>
	<em:creator>Serika</em:creator>
	<em:homepageURL>http://www.kis-lab.com/serikashiki/</em:homepageURL>
</RDF:Description>
</RDF:RDF>

chrome.manifest

content	locationchange	chrome/content/

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

内容

locationchange.xul

単にJavaScriptを読み込ませるだけです．なので，特に説明は無し．

locationchange.xul

01: <?xml version="1.0"?>
02: <overlay id="locationchange"
03: 	xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
04: 	xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
05: 
06: 	<script type="application/x-javascript" src="locationchange.js"></script>
07: </overlay>

locationchange.js

Locationが変わったときのメソッドの定義と，listenerへの登録です． unloadに合わせてlistenerから削除することを忘れないようにしましょう．

locationchange.js

01: const _locationchangeListener = {
02: 	onStatusChange: function(){},
03: 	onProgressChange: function(){},
04: 	onLocationChange: function(aWebProgress, aRequest, aLocation){
05: 		alert("New URL: "+ aLocation.asciiSpec);
06: 	},
07: 	onStateChange: function(){},
08: 	onSecurityChange: function(){}
09: };
10: function _locationchangeInstall(event) {
11: 	var b = getBrowser();
12: 	b.addProgressListener(_locationchangeListener);
13: }
14: function _locationchangeUnInstall(event) {
15: 	var b = getBrowser();
16: 	if(b){
17: 		b.removeProgressListener(_locationchangeListener);
18: 	}
19: 	window.removeEventListener("load", _locationchangeInstall, false);
20: }
21: 
22: window.addEventListener("load", _locationchangeInstall, false);
23: window.addEventListener("unload", _locationchangeUnInstall,false);

01: _locationchangeListenerという名前でlistenerに登録する関数群を定義
02,03,07,08: これらのイベントは必要ないので何もしない
04: Locationが変更されたときに呼び出される関数の定義
    詳しくは，MDC: nsIWebProgressListener参照
05: 新しいURLを取り出してURLを警告ダイアログに表示
10: ブラウザのlistenerに関数を登録するための関数
12: 実際にlistenerに登録
14: ブラウザのlistenerから関数を削除するための関数
17: 12行目において登録した関数を削除
19: 22行目において登録するページのロード時に呼ばれる関数を削除
22: ページのロード時に呼ぶように関数を登録
23: ページのアンロード時に呼ぶように関数を登録

記

このページを作成するに当たり，NoScriptを参考にしました．