$(function(){

	var panelspeed = 1000;		//切り替りアニメーションの速度(ミリ秒)
	var autospeed = 5000;		//オートスライドの速度(ミリ秒) 0の場合はオートOFF
	var paneldefault = 0;		//初期画像 1番目は0
	var paneltype = 'hover';	//click OR hover(click:クリック切替、hover:マウスオーバー切替)

	var tmppanel = 'move';
	var nowpanel = paneldefault;
	var panel = $("#panelcontainer #panelmain li");
	var thumbnail = $("#panelcontainer #panelthumbnail li img");
	var panellength = panel.size();
	if(autospeed > 0){
		var auto = setTimeout(PanelMove,autospeed);
	}

	//初期化
	panel.each(function(i){
		$(this).css({
			position:"absolute",
			filter:"alpha(opacity=100)",
			opacity:"1",
			display:"block"
		});
		if(i != paneldefault){
			$(this).css({
				filter:"alpha(opacity=0)",
				opacity:"0",
				display:"none"
			});
		}
	});
	thumbnail.each(function(i){
		if(i == paneldefault){
			Change($(this),1);
			$(this).addClass("currentPanel");
		}
	});

	//サムネイルクリック
	thumbnail.click(function(){
		if(paneltype == 'click'){
			var index = thumbnail.index(this);
			tmppanel = index;
			PanelMove();
		}
	});

	//サムネイルマウスオーバー
	thumbnail.hover(
		function () {
			if(paneltype == 'hover'){
				var index = thumbnail.index(this);
				tmppanel = index;
				PanelMove();
			}
			Change($(this),1);
		},
		function () {
			if(!$(this).hasClass('currentPanel')){
				Change($(this));
			}
			if(!auto && autospeed > 0 && paneltype == 'hover'){
				tmppanel = 'move';
				auto = setTimeout(PanelMove,autospeed);
			}
		}
	);

	//パネル切り替え
	function PanelMove(){
		clearTimeout(auto);
		auto = '';
		if(isNaN(tmppanel)){
			var hoverflag = 0;
			nowpanel = nowpanel + 1;
		}else{
			var hoverflag = 1;
			nowpanel = tmppanel;
		}
		if(paneltype == 'click'){
			var hoverflag = 0;
		}
		if(nowpanel >= panellength){
			nowpanel = 0;
		}
		if(!$(thumbnail[nowpanel]).hasClass('currentPanel')){
			panel.each(function(i){
				if(i == nowpanel){
					if($(this).css("opacity") != 1){
						$(this).css("z-index","2");
						$(this).stop().fadeTo(panelspeed,1);
					}
				}else{
					if($(this).css("opacity") != 0){
						$(this).stop().fadeTo(panelspeed,0);
						$(this).css("z-index","1");
					}
				}
			});

			thumbnail.each(function(i){
				if(i == nowpanel){
					$(this).addClass("currentPanel");
					Change($(this),1);
				}else{
					$(this).removeClass("currentPanel");
					Change($(this));
				}
			});
		}
		if(!auto && !hoverflag && autospeed > 0){
			tmppanel = 'move';
			auto = setTimeout(PanelMove,autospeed);
		}
	}

	//画像ファイル名書き換え
	function Change(target,mode){
		var src = target.attr('src');
		if(mode){
			if(!src.match('_o.')){
				var src2 = src.replace('.', '_o.');
			}else{
				var src2 = src;
			}
		}else{
			var src2 = src.replace('_o.', '.');
		}
		target.attr('src',src2);
	}

});