// =============================================================================
// 画像ロールオーバー管理クラス
// =============================================================================
/*
   MultipleImage クラス

   最終更新日:2004年2月25日(木)
   -----------------------------------------------------------------------------

   依存
	sniffer.js

   -----------------------------------------------------------------------------

   コンストラクタの引数
	String url		- "on"と"off"だけの切り替えであれば、
				  コンストラクタに画像のパスを二つ渡すと、
				  勝手に"on"と"off"の状態を設定します。

				  "off"の画像ファイル名だけを一つ渡すと、
				  OVEREDIMAGESUFFIXで設定された接尾辞を"_"の後にくっつけて
				  "on"用の状態も作ります（addStateします）。
				  
   -----------------------------------------------------------------------------

   設定
	String OVEREDIMAGESUFFIX	- ロールオーバー時の画像ファイル名の接尾辞
					  （コンストラクタ関数に引数を一つだけ渡した時の処理）

   -----------------------------------------------------------------------------

   メソッド
	- init( [url, url] )
		初期化

	- setImageObject( imageObject )
		Imageオブジェクトを設定する。

	- addState( state, url )
		画像の状態を追加する。

	- attachEventToParent( eventname, state )
		画像の親アンカーにイベントを追加し、対応した状態を設定する。

	- changeTo( state )
		状態を変更する。

*/
// =============================================================================
if(sniffer.DOMable()) {



// -----------------------------------------------------------------------------
/*
   コンストラクタ
*/
function MultipleImage() {
	this.imageObject = null;
	this.states = null;
	this.rollover = false;

	if(arguments.length == 0)
	{
		this.init();
	}
	else
	{
		this.init();
		if(arguments.length == 2) {
			this.addState("on", arguments[0]);
			this.addState("off", arguments[1]);
		}
		else if(arguments.length == 1) {
			if(arguments[0].search(/.gif/i) > -1)	this.addState("on", arguments[0].replace(/.gif/i, "_"+this.OVEREDIMAGESUFFIX+".gif"));
			else if(arguments[0].search(/.jpg/i) > -1)	this.addState("on", arguments[0].replace(/.jpg/i, "_"+this.OVEREDIMAGESUFFIX+".jpg"));
			this.addState("off", arguments[0]);
		}
		this.rollover = true;
	}
}
// -----------------------------------------------------------------------------



// -----------------------------------------------------------------------------
/*
   動作設定
*/
MultipleImage.prototype.OVEREDIMAGESUFFIX = "on";	//ロールオーバー時画像の接尾辞
// -----------------------------------------------------------------------------



// -----------------------------------------------------------------------------
/*
   initメソッド
   	Null multipleImage.init()
*/
MultipleImage.prototype.init = function() {
	this.imageObject = new Object();
	this.states = new Object();
}
// -----------------------------------------------------------------------------



// -----------------------------------------------------------------------------
/*
   addStateメソッド
	Null multipleImage.addState( state, url )

		String state		-	新たに加える状態
		String url		-	その状態用の画像ファイルのURL
*/
MultipleImage.prototype.addState = function( state, url ) {
	this.states[state] = new Image();
	this.states[state].src = url;
}
// -----------------------------------------------------------------------------



// -----------------------------------------------------------------------------
/*
   attachEventToParentメソッド
	Null multipleImage.attachEventToParent( eventname, state )

		String eventname	-	親エレメントに付加するイベント
		String state		-	そのイベントが発生した際に表示される状態
*/
MultipleImage.prototype.attachEventToParent = function( eventname, state ) {
	var parentAnchor = this.imageObject.parentNode;

	var self = this;
	if(typeof parentAnchor.addEventListener != "undefined")
	{
		parentAnchor.addEventListener(eventname, function(){self.changeTo(state)}, false);
	}
	else if(typeof parentAnchor.attachEvent != "undefined")
	{
		parentAnchor.attachEvent("on"+eventname, function(){self.changeTo(state)});
	}
	else
	{
		parentAnchor["on"+eventname] = function() {self.changeTo(state);};
	}
}
// -----------------------------------------------------------------------------



// -----------------------------------------------------------------------------
/*
   setImageObjectメソッド
	Null multipleImage.setImageObject( imageObject )

		Image imageObject	-	変更される画像オブジェクト
*/
MultipleImage.prototype.setImageObject = function( imageObject ) {
	this.imageObject = imageObject;
	
	//onとoffだけの簡易型の場合、ここでイベント付加
	if( this.rollover )
	{
		this.attachEventToParent( "mouseover", "on" );
		this.attachEventToParent( "mouseout", "off" );
	}
}
// -----------------------------------------------------------------------------



// -----------------------------------------------------------------------------
/*
   changeToメソッド
	Null multipleImage.changeTo( state )

		String state		-	変更したい状態
*/
MultipleImage.prototype.changeTo = function( state ) {
	if(this.imageObject)
	{
		this.imageObject.src = this.states[state].src;
	}
}
// -----------------------------------------------------------------------------



}