$(function(){

	var flgTabClick = false;

	var objVisualBase = $("#mainVisual"); //キービジュアルベース
	var objVisualList = $("#mainVisual h1"); //キービジュアルリスト
	var objCategoryList = $("#mainVisual .contentArea"); //キービジュアル　カテゴリリスト
	var objTab = $("#mainVisual .visualContent li");
	var arrSetting = [
	    //サキナの美容法
		{"delay":1000,	"timeout":0		,"flag":"start"},
		{"delay":1000,	"timeout":2000	,"flag":""},
		{"delay":1000,	"timeout":2000	,"flag":""},
		{"delay":1000,	"timeout":0		,"flag":""},
		{"delay":1000,	"timeout":2000	,"flag":""},
		{"delay":1000,	"timeout":3000	,"flag":""},
		//サキナが選ばれる理由
		{"delay":1000,	"timeout":0		,"flag":"start"},
		{"delay":1000,	"timeout":2000	,"flag":""},
		{"delay":1000,	"timeout":0		,"flag":""},
		{"delay":1000,	"timeout":3000	,"flag":""},
		//サキナのお約束
		{"delay":1000,	"timeout":2000	,"flag":"start"},
		{"delay":1000,	"timeout":2000	,"flag":""},
		{"delay":1000,	"timeout":2000	,"flag":""},
		{"delay":1000,	"timeout":0		,"flag":""}
	];

	/**
	 * タブ カレント
	 *
	 * @param objImg タブ画像オブジェクト
	 */
	function func_onTab(objImg){
//		var onSrc = objImg.attr("src").replace("_off.","_on.");
//		objImg.attr("src", onSrc);
		objImg.css({display:"block"});
	}

	/**
	 * タブ オフ
	 *
	 * @param objImg タブ画像オブジェクト
	 */
	function func_offTab(objImg){
//		var offSrc = objImg.attr("src").replace("_on.","_off.");
//		objImg.attr("src", offSrc);
		objImg.css({display:"none"});
	}

	/**
	 * タブ 初期化
	 */
	function func_initTab(){
		objTab.each(function(){
			func_offTab($(this).find("img"));
		});
	}

	/**
	 *
	 */
	function func_fadeIn(cnt, cntEnd, timeDelay){
		cnt++;

		if(cnt <= cntEnd){
			var obj = objVisualList.eq(cnt-1);

			//タブ切り替え
			if(!flgTabClick && arrSetting[cnt-1]["flag"] == "start"){
				var targetId = obj.parent().parent().attr("class");
				objTab.find("img").delay(timeDelay).each(function(){
					$(this).fadeOut();

				});
				$("#"+targetId+" img").fadeIn(1000);
			}

			//フェード処理
			obj.delay(timeDelay).fadeIn(
				arrSetting[cnt-1]["delay"],
				function(){
					func_fadeIn(cnt, cntEnd, arrSetting[cnt-1]["timeout"]);
					objVisualList.filter(":lt("+(cnt-1)+")").css({display:"none"});
					objVisualList.filter(":gt("+(cnt+1)+")").css({display:"none"});
					return false;
				}
			);


		}
	}


	//初期処理
	objVisualList.css({display:"none"});
	objCategoryList.css({display:"block"});

	//初期フェードイン
	func_fadeIn(0, objVisualList.length, 0);

	//タブ イベント設定
	objTab.css({cursor:"pointer"});
	objTab.each(function(){
		//カレント処理
		if($(this).hasClass("cur")){
			func_onTab($(this).find("img"));
		}

		//タブ hoverイベント
		$(this).hover(function(){
			objTab.removeClass("cur");
			$(this).addClass("cur");

			//タブ切り替え
			func_initTab();
			func_onTab($(this).find("img"));
		},
		function(){}
		);

		//タブ クリックイベント
		$(this).click(function(){
			flgTabClick = true;
			var tabId = $(this).attr("id");
			var objTarget = objVisualBase.find("."+tabId);
			var objTargetList = objTarget.find("h1");
			var cntStart = 0;
			var cntEnd = 0;

			objCategoryList.parent().css({zIndex:"1"});
			objTarget.css({zIndex:"2"});

			switch (tabId) {
			//サキナの美容法
			case "content1":
				cntStart = 0;
				cntEnd = cntStart + objTargetList.length;
				break;

			//サキナが選ばれる理由
			case "content2":
				cntStart = 6;
				cntEnd = cntStart + objTargetList.length;
				break;

			//サキナのお約束
			case "content3":
				cntStart = 10;
				cntEnd = cntStart + objTargetList.length;
				break;
			}
			clearTimeout();
			objVisualList.clearQueue();
			objVisualList.filter(":animated").stop();
			objVisualList.filter(":gt("+(cntStart+1)+")").fadeOut();
			func_fadeIn(cntStart, cntEnd, 0);
		});
	});


	objCategoryList.parent().css({cursor:"pointer"});
	objCategoryList.click(function(){
		var id = $(this).parent().attr("class");
		var domain = "http://"+location.hostname;

		switch (id) {
		//サキナの美容法
		case "content1":
			location.href = domain+"/beauty/";
			break;

		//サキナが選ばれる理由
		case "content2":
			location.href = domain+"/saqina/chosen.html";
			break;

		//サキナのお約束
		case "content3":
			location.href = domain+"/beginner/promise.html";
			break;

		//デフォルト
		default:
			break;
		}
	});

});