/********************************************************************************

	ロールオーバーセッター
		作成者	Masashi Kikkawa

	【説明】
		img要素もしくはinput（type=image）要素のclass属性に「rollover」を入れると
		マウスオーバー時に元のファイル名に「_on」を付けたファイルで置き換える。
		クリッカブルマップを使用する場合は必ずimg要素にid属性を指定すること。
		置き換える画像はarea要素の記述順に「_on1、_on2、…」とする。

	【更新履歴】
		2007.09.26 v.1.02
			v.1.01の改良で、MacIEで動作しなくなっていたバグを修正。
		2007.08.04 v.1.01
			input要素のタイプがimageのものに対応。
			ソースを全面書き直し
		2007.06.16 v.1.00
			公開。

********************************************************************************/



//_______________________________________________________________________________
//	ロールオーバー
var	eoRollOver	=	new class_eoRollOver();
function	class_eoRollOver()
{
	this.objOnload	=	window.onload;	//	既存のonloadイベント

	this.aPreLoad	=	[];	//	プリロード用

	//___________________________________________________________________________
	//	ロールオーバー初期化
	this.Init	=	function()
	{
		var	aImgList	=	new Array();
		var	aInputList	=	new Array();
		var	aImgStock	=	new Array();

		//	既存のonLoadイベントを実行
		if( this.objOnload != null )	this.objOnload();

		//	対応チェック
		if( !document.getElementsByTagName )
		{
			return;
		}

		//	<input>の一覧を取得して検索
		aInputList	=	document.getElementsByTagName( 'input' );
		for( var i=0; i<aInputList.length; i++ )
		{
			//	タイプとクラス名判定
			if( aInputList[i].type == 'image' && aInputList[i].className == 'rollover' )
			{
				aImgStock[aImgStock.length]	=	aInputList[i];
			}
		}

		//	<img>の一覧を取得して検索
		aImgList	=	document.getElementsByTagName( 'img' );
		for( var i=0; i<aImgList.length; i++ )
		{
			//	クラス名判定
			if( aImgList[i].className == 'rollover' )
			{
				aImgStock[aImgStock.length]	=	aImgList[i];
			}
		}

		//	イベントセット
		for( var i=0; i<aImgStock.length; i++ )
		{
			//	ファイル名を取得
			var	vSrc		=	aImgStock[i].getAttribute( 'src' );
			var	vImgName	=	vSrc.substring( 0, vSrc.lastIndexOf('.') );
			var	vImgEx		=	vSrc.substring( vSrc.lastIndexOf('.'), vSrc.length );

			//	クリッカブル判定
			if( !aImgStock[i].useMap )
			{	//	通常の画像の場合
				this._InitImage( aImgStock[i], vImgName, vImgEx );
			}
			else
			{	//	クリッカブルマップの場合
				this._InitMap( aImgStock[i], vImgName, vImgEx );
			}
		}
	};

	//___________________________________________________________________________
	//	画像初期化
	this._InitImage	=	function( objImg, vImgName, vImgEx )
	{
		var	vPreLoad;

		//	アトリビュートにセット
		objImg.setAttribute( 'src_off', vImgName + vImgEx );
		objImg.setAttribute( 'src_on', vImgName + '_on' + vImgEx );

		//	プリロード
		this._PreLoad( objImg.getAttribute( 'src_on' ) );

		//	イベント設定
		objImg.onmouseover	=	function()
		{
			this.setAttribute( 'src', this.getAttribute( 'src_on' ) );
		}
		objImg.onmouseout	=	function()
		{
			this.setAttribute( 'src', this.getAttribute( 'src_off' ) );
		}
	};

	//___________________________________________________________________________
	//	クリッカブルマップ初期化
	this._InitMap	=	function( objImg, vImgName, vImgEx )
	{
		var	aMapList;
		var	aAreaList;
		var	vPreLoad;

		//	IDセット判定
		if( !objImg.id )
		{	//	エラー
			alert( '◆ロールオーバーセッター エラー◆\nクリッカブルマップを使う場合は<img>にIDを指定してください。' );
			return;
		}

		//	mapの一覧を取得して検索
		aMapList	=	document.getElementsByTagName( 'map' );
		for( var j=0; j<aMapList.length; j++ )
		{
			//	対象マップ判定
			if( '#' + aMapList[j].name == objImg.useMap )
			{
				//	使用しているmapのarea一覧を取得して検索
				aAreaList	=	aMapList[j].getElementsByTagName( 'area' );
				for( var k=0; k<aAreaList.length; k++ )
				{
					//	アトリビュートにセット
					aAreaList[k].setAttribute( 'src_off', vImgName + vImgEx );
					aAreaList[k].setAttribute( 'src_on', vImgName + '_on' + (k+1) + vImgEx );
					aAreaList[k].setAttribute( 'tgt_id', objImg.id );

					//	プリロード
					this._PreLoad( aAreaList[k].getAttribute( 'src_on' ) );

					//	イベント設定
					aAreaList[k].onmouseover	=	function()
					{
						document.getElementById( this.getAttribute('tgt_id') ).setAttribute( 'src', this.getAttribute( 'src_on' ) );
					}
					aAreaList[k].onmouseout	=	function()
					{
						document.getElementById( this.getAttribute('tgt_id') ).setAttribute( 'src', this.getAttribute( 'src_off' ) );
					}
				}
			}
		}
	};

	//___________________________________________________________________________
	//	画像のプリロード
	this._PreLoad	=	function( vSrc )
	{
		this.aPreLoad[this.aPreLoad.length]			=	new Image();
		this.aPreLoad[this.aPreLoad.length-1].src	=	vSrc;
	}
}




//_______________________________________________________________________________
//	window.onloadにセット
window.onload	=	function()
{
	//	ロールオーバー初期化
	eoRollOver.Init();
}