/*
 * index slide banner クリック切り替え版
 * 
 * 
 *
 * 画像ファイル名規則
 * [バナー画像] bn_slide_x.jpg (W:760px H:238px)
 * [切り替えアイコン] bt_slide_xxxx.jpg(W:16px H:16px)
 * xxxx ---- HTMLのバナー画像(imgタグ)の属性relに設定したワード

 * バナー画像はHTML側に記述する。
 * アイコン画像は、バナー画像の個数によって自動的に生成する
 *
 *
 * Date:  2011/11/12
 * Author: PROPs & NK
 *
*/


var imageIndex=0;

var maxImgNum=0;

$(function(){

   $("#slide-banner>p").css({"position":"absolute","top":"0px"});
   $("#slide-banner>p:gt(0)").hide();
   
   maxImgNum = $("#slide-banner>p").size();//全枚数
   
   imageIndex = 0;
   
   $("#slide-banner>p:eq("+imageIndex+")").fadeIn(800);//最初の１枚目


   //切り替えアイコンボタン生成
   $('<ul>').appendTo('#main-visual');
   
   for(var i=1; i<=maxImgNum; i++){
   		$('<li>').attr('class','b'+i).appendTo('#main-visual>ul');
		var filename =  $("#slide-banner>p:eq("+(i-1)+") img").attr("rel");
   		$('<img />').attr('src','gif/top/bt_slide_'+filename+'.jpg').appendTo('#main-visual>ul>li.b'+i);
   }
    $("#main-visual>ul>li:gt(0)").css("opacity","0.5");
   $("#main-visual>ul>li:eq(0)").css("border","1px #ffffff solid");
   
   
   
   
   $('#main-visual>ul>li').hover(
								 
		function(){//on
			$(this).css("opacity","1.0"); 
			$("#slide-banner").stopTime();
		},			
		function(){//out
			if(imageIndex !=$(this).index()){
				$(this).css("opacity","0.5");
			}
			
			playSlide();
		}
	);

	$('#main-visual>ul>li').click(function(){
			changeSlide($(this).index());
			
	});
	

   $('#slide-banner>p').hover(
		function(){//on
			$("#slide-banner").stopTime();
		},			
		function(){//out
			playSlide();
		}
	);



	playSlide();

})


//タイマー切り替え
function playSlide(){
	
	$("#slide-banner").everyTime(4000,function(){
      var oldIndex= imageIndex;
	  
      imageIndex= ++imageIndex % $("#slide-banner>p").size();
	  
      $("#slide-banner>p:eq("+oldIndex+")").fadeOut(300);
      $("#slide-banner>p:eq("+imageIndex+")").fadeIn(500);
	  
	  $("#main-visual>ul>li:eq("+oldIndex+")").css("opacity","0.5").css("border","0");
	  $("#main-visual>ul>li:eq("+imageIndex+")").css("opacity","1.0").css("border","1px #ffffff solid");
	  
	});
}


//手動切り替え
function changeSlide(index){
	
	if(index != imageIndex){
		
      var oldIndex= imageIndex;
	  imageIndex = index;
	  
      $("#slide-banner>p:eq("+oldIndex+")").fadeOut(300);
      $("#slide-banner>p:eq("+imageIndex+")").fadeIn(500);
	}

	$("#main-visual>ul>li").css("opacity","0.5").css("border","0");
	$("#main-visual>ul>li:eq("+index+")").css("opacity","1.0").css("border","1px #ffffff solid");
}