/*
	ラジオボタン ver 0.7

	jQueryを使ったマウスオーバーによる画像切り替え。
	オーバー画像は必ず「-over」を付ける。
	class名に「radioswap」を付けたものが対象となる。
	rel属性をグループ名に使用

	URLが「http://～/～.html#1」のようになっていると２番目をアクティブにできる。
	番号は「0」から開始する

	<ul>
		<li><img src="～.gif" class="radioswap" rel="list,active" /></li>
		<li><img src="～.gif" class="radioswap" rel="list" /></li>
		<li><img src="～.gif" class="radioswap" rel="list" /></li>
	</ul>
	
	javascriptで外部からアクティブを指定することもできる。
	見た目が変わるだけで、クリック動作をするわけではない。
	
	jQRadioButton.setIndex( "グループ名", 1 );
	
	
*/

var jQRadioButton = {
	
	jq_radio_cache : {},	// 画像キャッシュ用
	jq_radio_active : {},	// 現在アクティブなオブジェクト
	jq_radio_list : {},		// オブジェクト自体を格納
	
	/**************************
	* 外部から指定 
	*/
	setIndex : function( rel, id ){
		var JQR = jQRadioButton;
		
		// 現在アクティブなものと一緒なら無視
		if( JQR.jq_radio_active[rel] == JQR.jq_radio_list[rel][id] ) return;
		
		// 現在アクティブなものを開放
		if( JQR.jq_radio_active[rel] ){
			JQR._setOut( JQR.jq_radio_active[rel] );
		}
		
		JQR.jq_radio_active[rel] = JQR.jq_radio_list[rel][id];
		JQR._setOver( JQR.jq_radio_active[rel] );
	},

	/**************************
	* 初期化
	*/
	init : function( target, i ){
		
		var JQR = jQRadioButton;
		var hash = location.hash.slice(1);

		// オブジェクト保存
		if( !JQR.jq_radio_list[target.rel] ) JQR.jq_radio_list[target.rel] = [];
		JQR.jq_radio_list[target.rel].push( target );

		// 画像キャッシュ
		JQR.jq_radio_cache[target.src] = new Image();
		JQR.jq_radio_cache[target.src].src = target.imgsrc_over;
		

		/* クリック */
		$(target).click( JQR._click );
		
		/* ロールオーバー */
		$(target).hover( JQR._rollOver, JQR._rollOut );
		
		// 初期状態でアクティブ指定されているか
		if( hash ){
			if( hash == JQR.jq_radio_list[target.rel].length-1 ){
				JQR._setOver( target );
				JQR.jq_radio_active[target.rel] = target;
			}
		}else{
			if( target.getAttribute('rel').split(',')[1] == 'active' ){
				JQR._setOver( target );
				JQR.jq_radio_active[target.rel] = target;
			}
		}

	},
	/**************************
	* クリック
	*/
	_click : function( e ){
		var JQR = jQRadioButton;
		var target = e.target;
		
		JQR.setIndex( target.rel, target.id );
	},
	/**************************
	* ロールオーバー
	*/
	_rollOver : function( e ){
		var JQR = jQRadioButton;
		var target = e.target;
		
		if( JQR.jq_radio_active[target.rel] != this ){
			JQR._setOver( target );
		}
	},
	/**************************
	* ロールアウト
	*/
	_rollOut : function( e ){
		var JQR = jQRadioButton;
		var target = e.target;

		if( JQR.jq_radio_active[target.rel] != this ){
			JQR._setOut( target );
		}
	},
	/**************************
	/* ロールアウトの動作 */
	_setOver : function( target ){
		target.src = target.imgsrc_over;
	},
	/* ロールアウトの動作 */
	_setOut : function( target ){
		target.src = target.imgsrc;
	}
};



$(function() {
	$("img.radioswap").each( function(i){
		var dotpos = this.src.lastIndexOf('.');
		this.imgsrc = this.src;
		this.imgsrc_over = this.src.substr(0,dotpos) + '-over.' + this.src.substr(dotpos+1);
		this.rel = this.getAttribute('rel').split(',')[0];	// グループ名
		this.id = i;		// 管理番号
		
		jQRadioButton.init( this, i );
	});
});