$(function() {
	var xml = 'common/xml/banner.xml';
	var indexBaseDir = 'common/index_banner/';

	// サムネイル領域のマウスオーバー処理
	$("#thumbImage>div").live("mouseover",function() {
		$(this).find("img").fadeTo(300, 0.4);

		// キャッチコピー
		var index = $("#thumbImage>div").index($(this));
		var w = $("#copyArea>div").eq(index).find("img").width();
		var h = $("#copyArea>div").eq(index).find("img").height();
		$("#copyArea>div").eq(index).css("top",$("#mainVisual").height() - $("#thumbArea").height() - 10 - ($("#copyArea>div").eq(index).height()));
		if (w > 0) {
			$("#copyArea>div").eq(index).css("width",w);
		}
		if (h > 0) {
			$("#copyArea>div").eq(index).css("height",h);
		}
		var margin = $("#thumbFrame").position().left + 8;
		var l = $(this).position().left + margin;
		var w = $("#copyArea>div").eq(index).width();
		if ($("#thumbArea").width() < l + w) {
			l = l + $(this).width() - w;
		}
		$("#copyArea>div").eq(index).css("left", l);
		$("#copyArea>div").eq(index).find("img").fixPng();
		if(!$.support.opacity && !$.support.style){
			$("#copyArea>div").eq(index).show();
		} else {
			$("#copyArea>div").eq(index).fadeIn(200);
		}
	});
	$("#thumbImage>div").live("mouseout",function() {
		$(this).find("img").fadeTo(300, 1.0);
		if(!$.support.opacity && !$.support.style){
			$("#copyArea>div").hide();
		} else {
			$("#copyArea>div").fadeOut(200);
		}
	});

	// キャッチコピーの縦位置調整
	$("#copyArea>div").each(function() {
		$(this).data("w", $(this).width()).hide();
	});

	// 横位置調整
	var setPos = function() {
		// サムネイル
//		var w = $("#thumbImage>div").length * $("#thumbImage>div:first").width() - $(".slidenavi:first").width() * 2;
//		$("#thumbImage").width(w);
/*
		// キャッチコピーの縦位置調整
		$("#copyArea>div").each(function() {
			$(this).css("top", $("#mainVisual").height() - $("#thumbArea").height() - 20 - ($(this).height()));
			$(this).data("w", $(this).find("img").width()).hide();
		});
		// キャッチコピー
		$("#thumbImage>div").each(function(index) {
			var margin = $("#thumbFrame").position().left + 8;
			var l = $(this).position().left + margin;
			var w = $("#copyArea>div").eq(index).data("w");
			if ($("#thumbArea").width() < l + w) {
				l = l + $(this).width() - w;
			}
			$("#copyArea>div").eq(index).css("left", l);
		})*/
	}

	var parseXml = function (xmldata) {
		$("#thumbImage,#copyArea").empty();

		$(xmldata).find("banner").each(function() {
			var thumbVisual = indexBaseDir + $(this).attr("dir") + $(this).attr("img");
			var copyVisual = indexBaseDir + $(this).attr("dir") + $(this).attr("copy");
			var thumbLink = $(this).attr("url");
			var linkTarget = $(this).attr("target");
			if (linkTarget == undefined) {
				linkTarget = '_self';
			}
			$('<div><a href="'+thumbLink+'" target="'+linkTarget+'"><img src="'+thumbVisual+'" alt="" /></a></div>').appendTo("#thumbImage");
			$('<div style="display:none;"><img src="'+copyVisual+'" alt="" class="iepngfix" /></div>').appendTo("#copyArea");
		});
		setPos();
	}

	// xml読み込み
	$.ajax({
		type: 'GET',
		url: xml,
		dataType: 'xml',
		success:function(xmldata) {
			parseXml(xmldata);
		}
	});

	setTimeout(function() {
		$("#mainOverlay .msg").fadeIn(1000, function() {
			setTimeout(function() {
				$("#mainOverlay").hide();
				setTimeout(function() {
					$("#mainImage div").fadeIn(3000);
				}, 200);
			}, 1500);
		});
		$("#thumbArea").fadeIn(1000);
	},200);

	$(".msg").fixPng();
});