﻿

jQuery(function($)
{
	// ボタン切り替えの演出の時間、待ち時間
	var changeButtonDuration = 1000;
	var changeButtonWait = 5000;

	// 画像切り替えの演出の時間
	var changeImageDuration = 1000;

	// 現在表示中のボタン、表示中の画像
	var nowSelectedImg = 0;
	var nowSelectedBtn = 0;

	// 一番上に表示されているボタン（スクロール用）
	var NowTopBtn = 0;
	var visibleBtn = 3;

	// ボタンの個数
	var btnLen = 0;

	// タイマーの状態　0：受付中、1：ボタンスクロール中(未使用)、2：メイン画像変更＆ボタンスクロール中
	var nowTimerState = 0;

	var timImageID = setTimeout("", 1);
	var timButtonID = setTimeout("", 1);


	// ボタン画像キャッシュ用の配列
	var imgBtns = [];
	var imgObjBtns = [];
	var imgObjImgs = [];

	// ボタン画像のスクロール用の配列
	var imgPos = [];

	//ボタン画像の高さ（ボタンスクロールの移動距離）
	var btnHeight = 0;
	var btnHeightMax = 0;

	var imgZindex = 3;

	// キャッシュ用のオブジェクト変数
	var obji = $("#top_img_bg");
	var objb = $("#top_btn_banner");



	function getNowImg()
	{
		return nowSelectedImg;
	}
	function setNowImg(nowImg)
	{
		nowSelectedImg = nowImg;
	}
	function getNowBtn()
	{
		return nowSelectedBtn;
	}
	function setNowBtn(nowBtn)
	{
		nowSelectedBtn = nowBtn;
	}
	function getNowTop()
	{
		return NowTopBtn;
	}
	function setNowTop(NowTop)
	{
		NowTopBtn = NowTop;
	}
	function getNowTim()
	{
		return nowTimerState;
	}
	function setNowTim(nowTim)
	{
		nowTimerState = nowTim;
	}
	function getNowTimerState()
	{
		return nowTimerState;
	}
	function setNowTimerState(nowTimS)
	{
		nowTimerState = nowTimS;
	}


	function clearTimImg()
	{
		clearInterval(timImageID);
	}
	function clearTimBtn()
	{
		clearInterval(timButtonID);
	}


	// ボタンのリンク先を無効化
	$("#top_btn_banner li a").each(function(i)
	{
		// ボタンの個数を加算
		btnLen++;
		$(this).replaceWith($(this).html());
	});

	// 画像にイベントを設定
	$("#top_btn_banner li img").each(function(i)
	{
		var t = $(this);
		imgObjBtns[i] = t;

		imgBtns[i] = [];
		imgBtns[i][0] = new Image();
		imgBtns[i][0].src = t.attr("src");

		imgBtns[i][1] = new Image();
		imgBtns[i][1].src = t.attr("src").split("_out").join("_over");


		if (i == 0)
		{
			btnHeight = t.closest("li").height();
			btnHeightMax = t.closest("ul").height();
			t.attr("src", imgBtns[i][1].src);
		}

		imgPos[i] = -btnHeight * i + "px";

/*
		// 下が空になる場合は、スクロール位置をずらさない
		if (i > (btnLen - visibleBtn))
		{
			imgPos[i] = imgPos[i - 1];
		}
*/

		// マウスオーバー、アウト
		t.hover(
			function()
			{
				if (getNowImg() != i)
				{
					t.attr("src", imgBtns[i][1].src);
				}
			},
			function()
			{
				resetBtnImage();
				imgObjBtns[getNowImg()].attr("src", imgBtns[getNowImg()][1].src);
		});

		// クリックでメイン画像切り替え
		t.click(function()
		{
			if ((getNowTimerState() == 0) && (getNowImg() != i))
			{
				clickBtnImage(i);
			}
		});

	});

	// メイン画像を切り替える
	function clickBtnImage(btnID)
	{
		var bnum = btnID;

		if ((getNowTimerState() == 0) && (getNowImg() != bnum))
		{
			var nbtn = getNowBtn();

			stopScrollButton();
			setNowTimerState(2);

			// 現在のボタンをOFF
			resetBtnImage();

			setNowBtn(bnum);
			imgObjBtns[bnum].attr("src", imgBtns[bnum][1].src);

			changeMainImage(bnum);
		}

	}

	// メイン画像の処理
	$("#top_img_bg li").each(function(i)
	{
		var t = $(this);
		// z-indexを設定
		t.css("z-index", (imgZindex + i));
		// オブジェクト変数を設定
		imgObjImgs[i] = t;
	});

	function resetBtnImage()
	{
		for (var i = 0; i < btnLen; i++)
		{
			imgObjBtns[i].attr("src", imgBtns[i][0].src);
		}
	}

	// メイン画像を切り替える関数
	function changeMainImage(imgID)
	{
		var inum = imgID;
		var nnum = getNowImg();
		setNowImg(inum);

		imgObjImgs[inum].css("z-index", (btnLen + imgZindex))
						.fadeIn(changeImageDuration, function()
							{
								imgObjImgs[nnum].css("z-index", (nnum + imgZindex)).hide();
								imgObjImgs[inum].css("z-index", (inum + imgZindex));
//								setNowImg(inum);
								setNowTimerState(0);
								// ボタンスクロールを再開
								startScrollButton();
							}
						)

	}


	// ボタンを切り替える関数
	function scrollButton()
	{
		// 切り替えアニメーション中でない場合
		if (getNowTimerState() == 0)
		{
			var nowBtn = getNowBtn();
			var nowTop = getNowTop();
			var nextTop = (nowTop + 1) % btnLen;

			// スクロール後のY座標
			var pos = imgPos[nextTop];

			// 現在選択中の画像を1つ下にずらす
			clickBtnImage((nowBtn + 1) % btnLen);

			// 一番下の要素だった場合、スクロール先を先頭に変更
			if (nowBtn + 1 >= btnLen)
			{
				pos = imgPos[0];
				nextTop = 0;
			}

			// 状態を「ボタン移動中」に変更
//			setNowTimerState(1);

			// まだ、非表示のボタンが下にある or 選択中のボタンが一番下
			if ((nowTop < (btnLen - visibleBtn)) || (nowBtn + 1 >= btnLen))
			{
				objb.animate(
					{
						top: pos
					},
					changeButtonDuration,
					"easeOutQuart",
					function()
					{
						setNowTop(nextTop);
					}
				);
			}
		}
	}

	// ボタンの自動移動を停止
	function stopScrollButton()
	{
		clearInterval(timButtonID);
		setNowTimerState(0);
	}

	// ボタンの自動移動を開始
	function startScrollButton()
	{
		timButtonID = setInterval(scrollButton, changeButtonWait);
	}

	startScrollButton();

});


