var xmlFile = "/xml/top.xml";
var ajaxTimeout = 10000;
var sets = new Array();
var visMax;
var visNow = 0;
var visNext;
var visImgs = new Array();
var bnrImgs = new Array();

var numFlag;
var duration = 750;
var animateFlag = false;
var clickPos;
var nextIds = new Array(5);
var outLs = [-340, -170, 840, 1010];
var anStartLs = new Array();
anStartLs[-2] = 0, anStartLs[-1] = 0, anStartLs[1] = -170, anStartLs[2] = -340;

var w_b = 362
var w_c = 335
var w_d = 223


// 要素の番号 //

function getElementIndex(a) {
    var i = 0, tmp = a;
    while (tmp = tmp.previousSibling) {
        if (tmp.nodeType == 1) i++;
    }
    return i;
}

// 要素数外の番号 //

function getOutNum(a) {
	var i = a;
	if (i < 0) {
		i = i + (visMax + 1);
	} else if (visMax < i) {
		i = i - (visMax + 1);
	}
	return i;
}

function time_ch(a){
	if(a == 1){
		timer = setTimeout("switch2(1)",7000); 
	}else{
		
		if(visNow < visMax){
			cln = visNow+1
		}else{
			cln = 0
		}
		/*alert(cln +"  "+ visNow +"  "+visMax)*/
		timer = setTimeout("switch1(cln)",7000); 
	}
}





// 初期設定用関数 --------------------------------- //

function setVis() {

	// 初期設定 ***************

	if (numFlag == "a") {
		document.getElementById("mainvisual").style.height='350px';
		$j("#mainvisual").addClass("mv_a").html('<div id="mainvisual_inner"><div id="wrapVisual"></div><a id="guard" href="' + sets[visNow].url + '" target="' + sets[visNow].target + '" title="' + sets[visNow].alt + '"></a></div>');
	} else if (numFlag != "e") {
		document.getElementById("mainvisual").style.height='411px';
		$j("#mainvisual").addClass("mv_"+numFlag).html('<div id="mainvisual_inner"><div id="wrapVisual"></div><a id="guard" href="' + sets[visNow].url + '" target="' + sets[visNow].target + '" title="' + sets[visNow].alt + '"></a><div id="wrapThumb"></div><p id="thumbCr"></p><div id="wrapThumbTrap"></div></div>');
	} else {
		document.getElementById("mainvisual").style.height='411px';
		$j("#mainvisual").addClass("mv_e").html('<div id="mainvisual_inner"><div id="wrapVisual"></div><a id="guard" href="' + sets[visNow].url + '" target="' + sets[visNow].target + '" title="' + sets[visNow].alt + '"></a><div id="wrapThumb"></div><p id="thumbCr" class="png_bg"></p><p id="arrowL"></p><p id="arrowR"></p><div id="wrapThumbTrap"></div></div>');
	}
	
	

	if(numFlag == "a"){
		$j("#wrapVisual").append('<p id="visual_1"><img src="' + sets[0].visualSrc + '" alt="' + sets[0].alt + '" width="900" height="330"></p>');
	}else if(numFlag != "a"){
		for (i=0; i<=visMax; i++) {
			$j("#wrapVisual").append('<p id="visual_' + (i+1) + '"><img src="' + sets[i].visualSrc + '" alt="' + sets[i].alt + '" width="900" height="330"></p>');
			
		}
	}
	
	if (numFlag == "e") {
		$j("#wrapThumb").append(
			'<p><img src="' + sets[visMax-1].bannerSrc + '" alt="" width="158" height="55"></p>' +
			'<p><img src="' + sets[visMax].bannerSrc + '" alt="" width="158" height="55"></p>' +
			'<p><img src="' + sets[0].bannerSrc + '" alt="" width="158" height="55"></p>' +
			'<p><img src="' + sets[1].bannerSrc + '" alt="" width="158" height="55"></p>' +
			'<p><img src="' + sets[2].bannerSrc + '" alt="" width="158" height="55"></p>'
		);
		$j("#wrapThumbTrap").append(
			'<p title="' + sets[visMax-1].alt + '"></p>' +
			'<p title="' + sets[visMax].alt + '"></p>' +
			'<p title="' + sets[0].alt + '"></p>' +
			'<p title="' + sets[1].alt + '"></p>' +
			'<p title="' + sets[2].alt + '"></p>'
		);
		for (i=0; i<=visMax; i++) {
			$j("#wrapThumb p").eq(i).css("left", 170*i);
			$j("#wrapThumbTrap p").eq(i).css("left", 170*i);
		}
		$j("#wrapThumbTrap p").eq(2).css("cursor", "pointer");
		time_ch(1);
	}else if(numFlag != "e" && numFlag != "a"){
		bannerimg_set = "";
		title_set = "";
		for (i=0; i<=visMax; i++) {
			bannerimg_set += '<p><img src="' + sets[i].bannerSrc + '" alt="" width="158" height="55"></p>';
			title_set += '<p title="' + sets[i].alt + '"></p>'
		}
		
		$j("#wrapThumb").append(
			bannerimg_set
		);
		$j("#wrapThumbTrap").append(
			title_set
		);
		for (i=0; i<=visMax; i++) {
			$j("#wrapThumb p").eq(i).css("left", (eval('w_'+numFlag))*i);
			$j("#wrapThumbTrap p").eq(i).css("left",  (eval('w_'+numFlag))*i);
		}
		$j("#wrapThumbTrap p").eq(0).css("cursor", "pointer");
		time_ch(2);
	}
	
	
	
	$j("#wrapVisual p").eq(0).css("z-index", 1).show();

	$j("#mainvisual_inner").fadeIn(duration);




	$j("#wrapThumbTrap p").mouseover(function() {
		num = getElementIndex(this);
		if (numFlag != "a" && animateFlag && 0 < clickPos) {
			$j("#wrapThumb p").eq(num+clickPos).css("border-color", "#0F9FFF");
		} else {
			$j("#wrapThumb p").eq(num).css("border-color", "#0F9FFF");
		}
	});




	$j("#wrapThumbTrap p").mouseout(function() {
		$j("#wrapThumb p").css("border-color", "#000000");
	});




	$j("#wrapThumbTrap p").click(function() {
		if (!animateFlag) {
						
			clickNum = getElementIndex(this);
			
			$j("#wrapThumb p").eq(clickNum).css("border-color", "#000000");
			if (numFlag != "a" && numFlag != "e") {
				if (clickNum != visNow) {
					switch1(clickNum);
				}
			} else if (numFlag == "e") {
				if (clickNum != 2) {
					switch2(clickNum);
					$j(this).trigger("mouseover");
				}
			}
		}
	});


	// 矢印をクリック時 ***************
	$j("#arrowL").click(function() {
		if (!animateFlag) {
			switch2(1);
		}
	});
	$j("#arrowR").click(function() {
		if (!animateFlag) {
			switch2(3);
		}
	});

}





// 切り替えを制御する関数（ビジュアルの数が2〜5の場合） --------------------------------- //

function switch1(clickNum) {
	clearTimeout(timer);
	animateFlag = true;
	visNext = clickNum;
	
	$j("#thumbTrap_" + (visNow+1)).css("cursor", "pointer");
	$j("#thumbTrap_" + (visNext+1)).css("cursor", "pointer");
	if(numFlag == "b"){
		left_num = Math.floor(900 - (158 * (visMax + 1) + 204 * visMax)) / 2 + 362 * visNext;
	}else if(numFlag == "c"){
		left_num = Math.floor(900 - (158 * (visMax + 1) + 177 * visMax)) / 2 + 335 * visNext;
	}else if(numFlag == "d"){
		left_num = Math.floor(900 - (158 * (visMax + 1) + 65 * visMax)) / 2 + 223 * visNext;
	}
	$j("#thumbCr").animate({
		"left": left_num
	}, {
		queue: false,
		duration: duration,
		easing: "easeOutQuart"
	});

	$j("#guard").attr({
		"href": sets[visNext].url,
		"target": sets[visNext].target,
		"title": sets[visNext].alt
	});

	$j("#visual_" + (visNext+1)).show();
	$j("#visual_" + (visNow+1)).fadeOut(duration, function() {
		$j(this).css("z-index", 0);
		$j("#visual_" + (visNext+1)).css("z-index", 1);
		visNow = visNext;
		time_ch(2)
		animateFlag = false;
	});
	
}


function switch2(clickNum) {
	clearTimeout(timer);
	animateFlag = true;
	clickPos = clickNum - 2;
	for (i=0; i<nextIds.length; i++) {
		nextIds[i] = visNow + clickPos + (i-2);
		nextIds[i] = getOutNum(nextIds[i]);
	}
	visNext = nextIds[2];
	var outIds = [visNow-4, visNow-3, visNow+3, visNow+4];
	var outTags = new Array(4);
	for (i=0; i<outIds.length; i++) {
		outIds[i] = getOutNum(outIds[i]);
		outTags[i] = '<p style="left: ' + outLs[i] + 'px"><img src="' + sets[outIds[i]].bannerSrc + '" alt="" width="158" height="55"></p>';
	}

	if (clickPos == -2) {
		$j("#wrapThumb").prepend(outTags[0] + outTags[1]);
		$j("#wrapThumb p:eq(5), #wrapThumb p:eq(6)").addClass("remove");
	} else if (clickPos == -1) {
		$j("#wrapThumb").prepend(outTags[1]);
		$j("#wrapThumb p:eq(5)").addClass("remove");
	} else if (clickPos == 1) {
		$j("#wrapThumb").append(outTags[2]);
		$j("#wrapThumb p:eq(0)").addClass("remove");
	} else if (clickPos == 2) {
		$j("#wrapThumb").append(outTags[2] + outTags[3]);
		$j("#wrapThumb p:eq(0), #wrapThumb p:eq(1)").addClass("remove");
	}

	for (i=0; i<5+Math.abs(clickPos); i++) {
		$j("#wrapThumb p").eq(i).animate({
			"left": anStartLs[clickPos] + 170 * i
		}, {
			queue: false,
			duration: duration,
			easing: "easeOutQuart"
		});
	}

	$j("#guard").attr({
		"href": sets[visNext].url,
		"target": sets[visNext].target,
		"title": sets[visNext].alt
	});

	$j("#visual_" + (visNext+1)).show();
	$j("#visual_" + (visNow+1)).fadeOut(duration, function() {
		$j("#wrapThumb .remove").remove();
		for (i=0; i<5; i++) {
			$j("#wrapThumbTrap p").eq(i).attr("title", sets[nextIds[i]].alt);
		}
		$j(this).css("z-index", 0);
		$j("#visual_" + (visNext+1)).css("z-index", 1);
		visNow = visNext;
		time_ch(1)
		animateFlag = false;
	});
	

	
}



$j(function() {	
	$j.ajax({
		url: xmlFile,
		type: "GET",
		dataType: "xml",
		cache: false,
		timeout: ajaxTimeout,
		success: function(xml){
			visMax = $j(xml).find("set").length - 1;
			
			$j(xml).find("creation").each(function(i) {
				first_num = $j(this).find("first").text()	
			});

			if(first_num > visMax+1 || first_num == 0){
				visNow2 = 0
			}else{
				visNow2 = Number(first_num)-1
			}

			if(visMax == 0){
				numFlag = "a";
			}else if(visMax == 1){
				numFlag = "b";
			}else if(visMax == 2){
				numFlag = "c";
			}else if(visMax == 3){
				numFlag = "d";
			}else if(visMax >= 4){
				numFlag = "e";
			}
			

			
			$j(xml).find("set").each(function(i) {
											  
				v = (visMax+1) - visNow2 + i
				
				if(v > visMax){
					v = v-(visMax+1);
				}
				
				sets[v] = new Array();
				sets[v].url = $j(this).find("url").text();
				sets[v].target = $j(this).find("target").text();
				sets[v].alt = $j(this).find("alt").text();
				sets[v].visualSrc = $j(this).find("main_image").text();
				sets[v].bannerSrc = $j(this).find("bt_image").text();
				visImgs[v] = new Image();
				bnrImgs[v] = new Image();
				visImgs[v].src = sets[v].visualSrc;
				bnrImgs[v].src = sets[v].bannerSrc;
				if (i==visMax) setVis();
			});
			
		}
	});
	
});