/* addEvent_RollOver | 汎用Javascript */
/* Version 1.0, Renewed 08/04/12 */

/*
  ----------------------------------------------------------------------
	== 搭載機能 ==
	・<a>タグ内の<img>に対し、ロールオーバー画像を設定
	　但し、該当するファイルがないときはイベントを追加しない
  ----------------------------------------------------------------------
*/


// グローバル変数設定
// 変更可能 - デフォルト付加名
var RO_PREFIX = ''; // デフォルト付加名（ファイル名先頭）
var RO_SUFFIX = '_ro'; // デフォルト付加名（ファイル名後尾）
var RO_CLASS = 'ro-class'
	
// 変更不可 - 作業変数
var IMAGES_COUNT = 0; // <a>タグ内の総画像枚数
var BUTTON_IMAGES_ARRAY = new Array(); // 通常ボタン画像名リスト
var RO_IMAGES_ARRAY = new Array(); // ロールオーバー画像名リスト

// イベント追加
function addEvent( target_object, event_name, function_name )
{
	if( window.addEventListener )
	{
		target_object.addEventListener( event_name, function_name, false );
	} else {
		target_object.attachEvent( 'on' + event_name, function_name );
	}
}

// イベント削除
function removeEvent( target_object, event_name, function_name )
{
	if( window.removeEventListener ) // for FF, Safari, etc
	{
		target_object.removeEventListener( event_name, function_name, false );
	} else { // for IE
		target_object.detachEvent( 'on' + event_name, function_name );
	}
}

// イベントバブルアップ停止
function cancelEvent( event_object )
{
	if( window.addEventListener ) // for FF, Safari, etc
	{
		event_object.stopPropagation();
	} else { // for IE
		window.event.cancelBubble = true;
	}
}

// マウスオーバーイベントを追加
function addEventMouseOperation()
{
	// <a>タグをリストアップ
	var elem_a_nodes = document.getElementsByTagName('a');
	for( var i = 0; i < elem_a_nodes.length; i++ )
	{
		// <a>タグ内の<img>をリストアップ
		var elem_image_nodes = elem_a_nodes[i].getElementsByTagName('img');
		for( var j = 0; j < elem_image_nodes.length; j++ )
		{
			// <img>のクラス名および<a>タグにリンク先が空ではないかをチェック
			if( elem_image_nodes[j].className == RO_CLASS && elem_a_nodes[i].href != "" )
			{
				BUTTON_IMAGES_ARRAY[ IMAGES_COUNT ] = new Image();
				RO_IMAGES_ARRAY[ IMAGES_COUNT ] = new Image();

				BUTTON_IMAGES_ARRAY[ IMAGES_COUNT ].src = elem_image_nodes[j].src;
				RO_IMAGES_ARRAY[ IMAGES_COUNT ].src = elem_image_nodes[j].src.replace( /((?:.*\/)*)(.+)\.(.+)$/, "$1" + RO_PREFIX + "$2" + RO_SUFFIX + ".$3"); // ロールオーバー画像名を設定

				if( RO_IMAGES_ARRAY[ IMAGES_COUNT ].complete )
				{
					addEvent( elem_image_nodes[j], "mouseover", swapImage );
					addEvent( elem_image_nodes[j], "mouseout", swapImage );
				}

				IMAGES_COUNT++;
			}
		}
	}
}

// 画像入れ替え
function swapImage( event )
{
	if( event.target ) // for FF, Safari, etc
	{
		for( i = 0; i < IMAGES_COUNT; i++ )
		{
			if( BUTTON_IMAGES_ARRAY[i].src == event.target.src )
			{
				event.target.src = RO_IMAGES_ARRAY[i].src;
			} else if( RO_IMAGES_ARRAY[i].src == event.target.src ) {
				event.target.src = BUTTON_IMAGES_ARRAY[i].src;
			}
		}
	} else { // for IE
		for( i = 0; i < IMAGES_COUNT; i++ )
		{
			if( BUTTON_IMAGES_ARRAY[i].src == event.srcElement.src )
			{
				event.srcElement.src = RO_IMAGES_ARRAY[i].src;
			} else if( RO_IMAGES_ARRAY[i].src == event.srcElement.src ) {
				event.srcElement.src = BUTTON_IMAGES_ARRAY[i].src;
			}
		}
	}
}

// ページを全て読み込んだ後（画像含む）に初期化関数を実行
window.onload = function()
{
	addEventMouseOperation();
};