スポンサーサイト
投稿日時 : -------- --:--
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
-------- --:-- | スポンサー広告
中央管理型イベントマネージャ『evtmgr.js』 0.05 beta
投稿日時 : 2008-10-26 14:47
 Javascriptのメモリリークレスな中央管理型イベントマネージャモジュールのevtmgr.jsのバージョン0.05betaを公開します。
 

■evtmgr.js 0.05 beta 変更点

  • イベント登録時に必須だった登録オブジェクトのinstプロパティをオプションに。instプロパティ指定無しの場合はelemプロパティの参照先HTMLElementが自動格納される。
  • instプロパティが必須ではなくなった影響で各関数を微調整。
 

■evtmgr.js 0.05 beta のダウンロード

 使用は自己責任でお願いします。evtmgr.jsが原因で発生したいかなる損害に対しても作者itmstはその責任を負いません。
 
evtmgr.js 0.05 beta (2008/10/26 11:31) 動作確認 : Firefox 3.0.0 - 3.0.3/ Firefox 2.0.0.14 / Opera 9.50 - 9.61 / Safari 3.1.2 / IE 7.0 / IE 6.0 / IE 5.5 / Mozilla 1.8b / NN 9.0.0.5
 

■evtmgr.jsの導入方法の簡単な説明

 通常の外部jsファイルと同じようにSCRIPT要素のsrcでURL指定するだけです。ロードを実行したコンテキストのグローバルオブジェクトに「evtmgr」というプロパティが追加されるので、後は「evtmgr.methodName()」や「evtmgr.propertyName」という感じでevtmgr.jsの機能を利用できます。
<html>
<head>
<script type="text/javascript" src="evtmgr.js"></script>
<script>
//ここでevtmgr.add()などを使用する
</script>
</head>
<body></body>
</html>
 

■最も基本的なイベント登録コード

 instプロパティがオプションになったことでイベント登録コードがaddEventListener()使用時と近いものになりました。最も基本的なイベント登録のサンプルコードを紹介しておきます。以下のコードで「document要素でonclickイベントが発生したらonEvent関数を呼ぶ」という意味になります。
<html>
<script type="text/javascript" src="evtmgr.js"></script>
<script>
//イベント発生時に呼ばれる関数
function onEvent(){alert("クリック!");}

//evtmgr.add()メソッドを使ってイベント登録
evtmgr.add({elem:document,type:"click",func:onEvent});
</script>
</html>
これはaddEventListenerを使った以下のコードと「基本的には」同じです。
<html>
<script type="text/javascript" src="evtmgr.js"></script>
<script>
//イベント発生時に呼ばれる関数
function onEvent(){alert("クリック!");}

//addEventListener()メソッドを使ってイベント登録
document.addEventListener("click",onEvent,false);
</script>
</html>
このサンプルだけ見るとただ複雑になっただけのように思えるかもしれませんが、evtmgr.jsは「イベントタイプ」や「呼び出す関数」などをキーとして登録オブジェクト(イベント関連情報をひとまとめにしたオブジェクト)を検索し抽出する機能や、条件に一致するイベントの一括削除、ガーベッジコレクション機能などの柔軟で強力なイベント中央管理機能を提供します。子ウィンドウのイベントも中央で一元管理できます。詳細はevtmgr.js ドキュメントデモページ(手抜きです)を参照してください。
 

■0.05betaで使用可能なメソッド・プロパティ一覧

 詳細はevtmgr.js ドキュメントを参照してください。
 
メソッド
  • add イベント登録
  • remove イベント削除
  • find 登録オブジェクト検索
  • selectRemove 条件一致登録オブジェクト一括削除
  • removeAll 全イベント削除
  • getIdList IDリスト取得
  • selectById IDから登録オブジェクト参照
  • selectAll 全登録オブジェクトリスト
  • isGarbage ガーベッジ化登録オブジェクト判定
  • selectGarbage ガーベッジ化登録オブジェクトリスト
  • isOverlap 重複登録チェック
  • gc ガーベッジコレクション実行
  • gcAutoStart ガーベッジコレクション自動実行開始
  • gcAutoStop ガーベッジコレクション自動実行停止
  • exec イベント発生時関数実行
  • chkArg 登録オブジェクトプロパティチェック
  • isDuck 類似オブジェクト判定
  • uid ユニークID生成
プロパティ
  • browser 使用可能メソッドフラグ
  • list 登録オブジェクト格納用
  • overlap イベント重複登録許可/非許可フラグ
  • gcInterval ガーベッジコレクション自動実行間隔
  • gcAutoHandle ガーベッジコレクション自動実行状態
  • ongc ガーベッジコレクション実行時呼び出し関数

■従来通りinstプロパティも使える

 今まで通りinstプロパティを使ってfuncプロパティ指定の関数を呼び出すときにthisに設定されるObjectを明示的に指定することもできます。
<html>
<script type="text/javascript" src="evtmgr.js"></script>
<script>
var msg = "foo"
function showMsg(){
	alert(this.msg); //「bar」と表示される

}
var myObject = {msg:"bar"};
evtmgr.add({
	type:"click",
	elem:window,
	func:showMsg,
	inst:myObject //実行スコープをmyObjectに
});
</script>
</html>
このコードでwindowでclickイベントを捕捉するとwindow.msgの「foo」ではなくmyObject.msgの「bar」が表示されます。instプロパティの指定がなければwindow.msgの「foo」が表示されます。
 

■XULアプリでも全く同じように使用できそう

 Dropfox作ってる時に試してみたんですが、XULアプリ中でも何の問題もなく動作しそうです。
 

■ドキュメントとデモページ

ドキュメント
手抜きなデモページ
 
 
スポンサーサイト
2008-10-26 14:47 | evtmgr.js | Comment(0) | Trackback(0)
Comment
コメントを書く
#

管理者にだけ表示
Trackback
Trackbak URL:http://itmst.blog71.fc2.com/tb.php/148-0f7aeba0
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。