/*
	main_img.js
		by k@20110726
*/

// define
var K_ADD_OVER_STR		= "_f2";
var K_ADD_HERE_STR		= "_f3";
var K_MI_AUTO_PLAY_WAIT	= 5000;// 10sec


$(function(){
	//------------------------
	// 初期化処理
	//------------------------
	//---- default画像を最前面へ ----
	var main_img	= $('.main_img li').get(0);
	// 先頭要素を末尾に移動（z-index:autoの場合、末尾が最前面）
	$(main_img).appendTo('.main_img');
	
	//---- class名付加 ----
	$('.main_img li').each(function(){
		var now_class = $(this).attr('class');
		now_class = ( now_class.length > 0 ) ? now_class + ' ' : now_class;
		var new_class = now_class + 'img' + $(this).index();
		$(this).attr('class', new_class);
	});
	
	//---- 順序の入れ替え ----
	//main_img	= $('.main_img li').get(0);
	// 先頭要素を末尾に移動（z-index:autoの場合、末尾が最前面）
	//$(main_img).appendTo('.main_img');
	
	// すべてを表示
	$('.main_img li').css('visibility','visible');
	
	
	//// 1つ目をf3へ
	//var btn1	= $('.mv_btns li').children().children().get(0);
	//var src1	= $(btn1).attr('src');
	//var src1_f3 = get_added_str( src1, K_ADD_HERE_STR );
	//$(btn1).attr('src', src1_f3);
	
	
	// オートプレイ start
	var n_mi	= $('.main_img li').length;
	var ap_no	= 0;
	var ap_id	= setInterval(function(){
					change_mi(ap_no);
					ap_no = (ap_no < n_mi-2) ? ap_no+1 : 0;
				}, K_MI_AUTO_PLAY_WAIT );
	
	
	
	//------------------------
	// ボタンのイベント設定
	//------------------------
	// down
	$('.mv_btns li').each(function(){
		
		//---- f1, f2ファイル名取得 ----
		var btn		= $(this);
		var btn_a	= $(this).children();
		var btn_img	= $(this).children().children().get(0);
		var file_f1	= $(btn_img).attr('src');
		file_f1		= file_f1.replace(K_ADD_OVER_STR, '');
		file_f1		= file_f1.replace(K_ADD_HERE_STR, '');
		var file_f2	= get_added_str( file_f1, K_ADD_OVER_STR );
		var file_f3	= get_added_str( file_f1, K_ADD_HERE_STR );
		
		var i = 0;
		//---- over ----
		$(btn_a).mouseover(function(){
			var now_mi		= $('.main_img li').get($('.main_img li').length-1);
			var now_class	= $(now_mi).attr('class');
			var now_no		= now_class.replace('img','');
			
			var new_no		 = $(btn).index();
			var new_mi		= $('.main_img li').get(new_no);
			var new_class	= $(new_mi).attr('class');
			//alert( now_class + ' =? ' +  new_class + ' -> ' + now_class.indexOf(new_class) );
			// 既に末端の場合は処理しない
			if( now_class.indexOf(new_class) != -1 )
			{
				return(1);
			}
			//---- 対象の要素の処理 ----
			var imgx		= 'img'+new_no;
			var mi_new_css	= '.main_img .' + imgx;
			//alert(imgx);
			//alert($(mi_new_css).html());
			// 非表示にして末尾に移動
			$(mi_new_css).css('display','none');
			$(mi_new_css).appendTo('.main_img');
			
			// フェードイン
			$(mi_new_css).fadeIn(500, function(){
				//$(this).css('display','block');
			});
			
			// すべてのボタンをf1へ
			set_all_btns_f1();
			// ボタンをf3に書き換え
			$(btn_img).attr('src', file_f3);
			//alert($(btn_img).html());
			
			// 現在のオートプレイ 破棄
			clearInterval(ap_id);

			// オートプレイ start
			ap_no = (new_no < n_mi-2) ? new_no+1 : 0;
			//alert(ap_no);
			ap_id = setInterval(function(){
					change_mi(ap_no);
					ap_no = (ap_no < n_mi-2) ? ap_no+1 : 0;
					
				}, K_MI_AUTO_PLAY_WAIT );
			
		});
	
		//---- out ----
		$(btn_a).mouseout(function(){
			/*var now_src = $(btn_img).attr('src');
			// f3ではない場合
			if( now_src.indexOf('_f3.') < 0 )
			{
				// 置き換え
				$(btn_img).attr('src', file_f1);
			}*/
		});
		
		
		//---- down ----
		$(this).mousedown(function(){
			/*// 既に末端の場合は処理しない
			var now_mi		= $('.main_img li').get($('.main_img li').length-1);
			var now_class	= $(now_mi).attr('class');
			var now_no		= now_class.replace('img','');
			var new_mi		= $(this).children().children().get(0);
			var new_class	= 'img' + $(this).index();
			//alert( now_class + '?' +  new_class + ' = ' + now_class.indexOf(new_class) );
			if( now_class.indexOf(new_class) != -1 )
			{
				return(1);
			}
			//---- 対象の要素の処理 ----
			var imgx = 'img'+$(this).index();
			var mi_new_css = '.main_img .' + imgx;
			//alert(imgx);
			//alert($(mi_new_css).html());
			// 非表示にして末尾に移動
			$(mi_new_css).css('display','none');
			$(mi_new_css).appendTo('.main_img');
			
			// フェードイン
			$(mi_new_css).fadeIn(500);
			
			// すべてのボタンをf1へ
			set_all_btns_f1();
			// ボタンをf3に書き換え
			$(btn_img).attr('src', file_f3);
			//alert($(btn_img).html());*/
		});
	});
	
});

// 対象noのイメージに切り替え
function change_mi(no)
{	
	var btn		= $('.mv_btns li').get(no);
	var btn_a	= $(btn).children();
	var btn_img	= $(btn).children().children().get(0);

	//---- f1, f2ファイル名取得 ----
	var file_f1	= $(btn_img).attr('src');
	file_f1		= file_f1.replace(K_ADD_OVER_STR, '');
	file_f1		= file_f1.replace(K_ADD_HERE_STR, '');
	var file_f2	= get_added_str( file_f1, K_ADD_OVER_STR );
	var file_f3	= get_added_str( file_f1, K_ADD_HERE_STR );
	
	//---- 対象の要素の処理 ----
	var imgx		= 'img'+no;
	var mi_new_css	= '.main_img .' + imgx;
	//alert(imgx);
	//alert($(mi_new_css).html());
	// 非表示にして末尾に移動
	$(mi_new_css).css('display','none');
	$(mi_new_css).appendTo('.main_img');
	
	// フェードイン
	$(mi_new_css).fadeIn(500, function(){
		//$(this).css('display','block');
	});
	
	// すべてのボタンをf1へ
	set_all_btns_f1();
	// ボタンをf3に書き換え
	$(btn_img).attr('src', file_f3);
	//alert($(btn_img).html());
}


// ファイル名+任意文字列+拡張子を返す
function get_added_str( str, add_str )
{
	var len				= 0;
	var pos				= 0;
	var base			= "";
	var ex				= "";
	var return_str		= "";
	//alert('str= ' + str);
	//alert('add_str= ' + add_str);
	// パラメータ等の退避(省略)
	
	// (パス＋ファイル名)と拡張子の分離
	len		= str.length;
	pos		= str.lastIndexOf('.');
	base	= str.substring( 0, pos );
	ex		= str.substring( pos );
	
	return_str	= base + add_str + ex;
	
	// 処理
	return( return_str );
}

// すべてのボタンをf1にする
function set_all_btns_f1()
{
	$('.mv_btns li').each(function(){
		var btn_a	= $(this).children();
		var btn_img	= $(this).children().children().get(0);
		var now_src	= $(btn_img).attr('src');
		var new_src = now_src.replace( K_ADD_HERE_STR, '' );
		
		$(btn_img).attr('src', new_src);
	});
}