$(function()
{

	var imgdatas = [];
	var imgcount = 0;


	$("#main .border-block-01a > ul").each(function()
	{
		var t = 0;
		var th=$(this);

		th.find("li > span > a").each(function()
		{
			t++;
		});
		imgdatas[imgcount++] = t;
	});

	var imgdataslen = imgdatas.length;
	imgcount = 0;

	var imgDir = "img/";

	// 画像本体、サムネイル、説明文、題名
	var imgm = [];
	var imgt = [];
	var imgex = [];
	var imgttl = [];

	var imgobj = [];
	var imgobjlen = 0;
	var imgobjm = [];

	var imgdatasfirst = [];
	var isOverlayHidden = true;
	var isAnimated = false;
	var isAnimatedM = false;
	var nowDisplayLayer = 0;
	var selectedImgNumber = 0;
	var selectedImgNumberT = 0;
	var animSpeed = 1;

	var oldImgNumber = 0;

	var layopacity = "";
	var imgmainheight = 300;
	var imgmainwidth = 400;

	$("ul[id^='sample-'] > li > span.img").each(function(i)
	{
		var t = $(this)
		var ta = t.children("a");

		imgm[imgcount] = new Image();
		imgm[imgcount].src = ta.attr("href");
		imgt[imgcount] = new Image();
		imgt[imgcount].src = ta.attr("href");
		imgcount++;

		// 説明文、名前
		imgex[i] = t.closest("li").children("span.txt").text();
		imgttl[i] = t.next("span.ttl").text();

		ta.click(function()
		{
			if (getAnimated()== false)
			{
				setAnimated(true);
				if (getOverlayHidden() == true)
				{
					(function(i)
					{
						// 今月のおすすめネイル
						if (i < imgdatasfirst[1])
						{
							// 一番近い親要素<div class="sample-block">の子孫h2の内容
							showLayerData(i, t.closest("div.sample-block").find("h2").html().replace(/<span>/i,"　").replace(/<\/span>/i,""));
						}
						else	// それ以外のネイル
						{
							showLayerData(i, t.closest("div.sample-block").find("h2").html().replace(/<span>(.+)<\/span>/i,""));
						}
					})(i);

				}
				else
				{
					hideOverlay();
				}
			}

			return false;
		});
	});

	imgno = new Image();
	imgno.src = imgDir + "dummy.gif";


	// 項目の最初の画像
	for (var i = 0; i < imgdataslen; i++)
	{
		if (i == 0)
		{
			imgdatasfirst[i] = 0;
		}
		else
		{
			for (var j = 0 ; j < i ; j++)
			{
				imgdatasfirst[i] = imgdatasfirst[i - 1] + imgdatas[j];
			}
		}
	}

	function getNumber(num)
	{
		return (((num < 10) ? "0" : "") + num);
	}

	function showLayerData(imgid, laytitle)	// imgid [0-imgcount]
	{
		$("#popup_layer_title").text(laytitle);
		changeSelectedImgNumber(imgid, 1);
	}

	function changeThumbnailImages(imgid)
	{
		var layid = getNowDisplayLayer();
		var div_m ;

		for (var i = 0 ; i < imgobjlen ; i++)
		{
			var t = 0;

			for (var j = 0 ; j < layid ; j++)
			{
				t += imgdatas[j];
			}

			if (i < imgdatas[layid])
			{
				imgobj[i].removeClass("cursor_off");
				imgobj[i].addClass("cursor_on");
				imgobj[i].attr("src", imgt[t  + i].src);
				$("#popup_img_main_" + (i + 1)).attr("src", imgm[t + i].src);
			}
			else
			{
				imgobj[i].removeClass("cursor_on");
				imgobj[i].addClass("cursor_off");
				imgobj[i].attr("src", imgno.src);
				$("#popup_img_main_" + (i + 1)).attr("src", imgno.src);
			}
		}

		resetStyleThumbnail();
	}

	function changeImageText(imgid)
	{
		$("#popup_layer_explanation").html(imgex[imgid]);
		$("#popup_layer_ttl").text(imgttl[imgid]);
	}

	// メインの画像を変更する
	function changeMainImage(imgid, tim)
	{
		var ns = getNowShortImgNumber(imgid);
		imgobjm.fadeOut(1000, function()
		{
			setAnimatedM(false);
			imgobjm.attr("src", imgm[imgid].src);
			imgobjm.fadeIn(500, function()
			{
//				setAnimatedM(false);
			});
		});

	}

	function getNowTotalImgNumber(imgid)	// imgid [0-9]
	{
		var layid = getNowDisplayLayer();
		var t = 0;
		for (var i = 0 ; i < layid ; i++)
		{
			t += imgdatas[i];
		}
		return t + imgid;
	}
	function getNowShortImgNumber(imgnum)	// imgnum [0-imgcount]
	{
		for (var i=0 ; i < imgdataslen ; i++)
		{
			if (imgnum < imgdatas[i]) break;
			imgnum -= imgdatas[i];
		}
		return imgnum;
	}
	function getSelectedImgNumber()
	{
		return selectedImgNumber;
	}
	function setSelectedImgNumber(imgid)
	{
		selectedImgNumber = imgid;
		return this;
	}
	function changeSelectedImgNumber(imgid, tim)
	{
		if (getAnimatedM() == false)
		{
			setAnimatedM(true);
			setOldImgNumber(getSelectedImgNumber());
			setSelectedImgNumber(imgid);
			changeNowDisplayLayer(imgid);
			changeMainImage(imgid, tim);
			changeThumbnailImages()
			changeImageText(imgid);
			showOverlay();
		}
		return this;
	}
	function getOldImgNumber()
	{
		return oldImgNumber;
	}
	function setOldImgNumber(imgid)
	{
		oldImgNumber = imgid;
		return this;
	}

	function changeSelectedData(imgid)
	{
		changeSelectedImg(imgid);
	}

	function getNowDisplayLayer()
	{
		return nowDisplayLayer;
	}
	function setNowDisplayLayer(layid)
	{
		nowDisplayLayer = layid;
		return this;
	}
	function changeNowDisplayLayer(imgid)
	{
		var imgnum = imgid;
		for (var i=0 ; i < imgdataslen ; i++)
		{
			imgnum -= imgdatas[i];
			if (imgnum < 0) break;
		}
		setNowDisplayLayer(i);
		return this;
	}

	function getAnimated()
	{
		return isAnimated;
	}
	function setAnimated(bln)
	{
		isAnimated = bln;
		return this;
	}
	function getAnimatedM()
	{
		return isAnimatedM;
	}
	function setAnimatedM(bln)
	{
		isAnimatedM = bln;
		return this;
	}

	function getOverlayHidden()
	{
		return isOverlayHidden;
	}
	function setOverlayHidden(bln)
	{
		isOverlayHidden = bln;
		return this;
	}

	jQuery.fn.changeStyleThumbnailOver = function()
	{
		return this.removeClass("mouse_out").addClass("mouse_over");
	}
	jQuery.fn.changeStyleThumbnailOut = function()
	{
		return this.removeClass("mouse_over").addClass("mouse_out");
	}
	function resetStyleThumbnail()
	{
		for (var i = 0 ; i < imgobjlen ; i++)
		{
			var t = 0;
			if (i == getNowShortImgNumber(getSelectedImgNumber()))
			{
				imgobj[i].changeStyleThumbnailOver();
			}
			else
			{
				imgobj[i].changeStyleThumbnailOut();
			}
		}
	}

	// レイヤーを表示する
	function showOverlay()
	{
		if (getOverlayHidden() == true)
		{
			// レイヤーを画面中央に配置
			$("#popup_layer_body").css(
			{
				marginTop: "-" + $("#popup_layer_body").height() / 2 + "px",
				marginLeft: "-" + $("#popup_layer_body").width() / 2 + "px"
			});
			$("#popup_layer_background").css("opacity", layopacity).show();

			$("#popup_layer_body").fadeIn(500, function()
			{
				setOverlayHidden(false);
				setAnimated(false);
				$(document).bind("keydown",hideOverlay);
			});
		}
	}

	// レイヤーを非表示にする
	function hideOverlay()
	{
		$(document).unbind("keydown", hideOverlay);
		$("#popup_layer_background").animate(
		{"opacity": "0"}, 500, function()
			{
				$("#popup_layer_background").hide();
				setOverlayHidden(true);
				setAnimated(false);
			});
		$("#popup_layer_body").fadeOut(500);
	}

	// レイヤーをHTML上に追加
	$("body").append("<div id='popup_layer_body'><\/div><div id='popup_layer_background'><\/div>")
	$("#popup_layer_body").prepend($("#popup_layer_table"));
	$("#popup_layer_table").show();

	layopacity = $("#popup_layer_background").css("opacity");
	layheight = $("#popup_layer_body").height();
	laywidth = $("#popup_layer_body").width();

	// レイヤーの外をクリック
	$("#popup_layer_background").click(function()
	{
		if (getAnimated() == false)
		{
			setAnimated(true);
			// レイヤーを隠す
			hideOverlay();
		}
	});

	// [position:fixed] for IE6 / IE8 quirks モード
	if(($.browser.msie && $.browser.version < 7) || (!!document.documentMode && document.documentMode < 7))
	{
		$(window).scroll(function()
		{
			$("#popup_layer_background").get(0).style.setExpression("top", "$(document).scrollTop() + 'px'")
			$("#popup_layer_body").get(0).style.setExpression("top", "($(document).scrollTop() + $(window).height() / 2) + 'px'")
		});
	}

	// 前の画像
	$("#popup_back").click(function()
	{
		selectImgNumberBack();
	});

	function selectImgNumberBack()
	{
		var num = getSelectedImgNumber();
		if (getNowShortImgNumber(num) > 0)
		{
			changeSelectedImgNumber(num - 1, animSpeed);
		}
		else
		{
			changeSelectedImgNumber(num + (imgdatas[getNowDisplayLayer()] - 1), animSpeed);
		}
	}

	// 次の画像
	$("#popup_next").click(function()
	{
		selectImgNumberNext();
	});

	function selectImgNumberNext()
	{
		var num = getSelectedImgNumber();
		if (getNowShortImgNumber(num) < imgdatas[getNowDisplayLayer()] - 1)
		{
			changeSelectedImgNumber(num + 1, animSpeed);
		}
		else
		{
			changeSelectedImgNumber(num - (imgdatas[getNowDisplayLayer()] - 1), animSpeed);
		}
	}

	imgobjm = $("#popup_img_main");

	$("img:[id^='popup_img_t']").each(function(i)
	{
		imgobj[i] = $(this);
		imgobjlen++;

		if (i <= imgdatas[getNowDisplayLayer()])
		{
			imgobj[i].addClass("cursor_on");
		}
		else
		{
			imgobj[i].addClass("cursor_off");
		}

		imgobj[i].click(function()
		{
			var nowImgNumber = getNowTotalImgNumber(i);
			if (i < imgdatas[getNowDisplayLayer()])
			{
				changeSelectedImgNumber(nowImgNumber, animSpeed);
				changeImageText(nowImgNumber);
			}
		});

		imgobj[i].mouseover(function()
		{
			if (i < imgdatas[getNowDisplayLayer()])
			{
				imgobj[i].changeStyleThumbnailOver();
			}
		});

		imgobj[i].mouseout(function()
		{
			if (getNowShortImgNumber(getSelectedImgNumber()) != i)
			{
				imgobj[i].changeStyleThumbnailOut();
			}
		});
	});

	// 閉じる
	$("#button_hide").click(function()
	{
		if (getAnimated() == false)
		{
			setAnimated(true);
			hideOverlay();
		}
	}) ;
})