/* ================================================== */
/* var */
/* ================================================== */

var theDate = new Date();
var getTimeData = theDate.getTime();
var timeParam = '#' + getTimeData;
var browserName;      
var browserVersion;
var fileXml       = './images/portal/slide/img.xml';
var fileIntroIe/*   = './images/portal/slide/intro_ie.gif' + timeParam*/;
var fileIntroFf /*  = './images/portal/slide/intro_ff.gif' + timeParam*/;
var fileLoadGif   = './images/portal/slide/loading.gif';
var fileSpacerGif = './images/portal/slide/spacer.gif';
var ajaxTimeout   = 10000;
var introAlt = 'HIRO';
var introFile;
var introFadeIn;
var introFadeOut;
var introFadeStop;
var timeStart;
var timeStop;
var imgNum;
var imgMax;
var imgBack;
var imgNext;
var imgFade = 800;
var imgArray = new Array();
var urlParam = '?fromid=topmain';
var linkURL;
var flagBtnOver  = false;
var flagBtnClick = false;
var flagImgStart = false;
var idArray      = new Array();
var imgPassArray = new Array();
var btnPassArray = new Array();
var timer;
var tipTimer;
var btnTimer;

/* ================================================== */
/* browser check */
/* ================================================== */

function browserCheck() {
	jQuery.each(jQuery.browser, function(key,value) {
		if (key == "version") { 
			browserVersion = value;
		} else if (value) {
			browserName = key;
		}
	});
}

/* ================================================== */
/* document load */
/* ================================================== */

$(window).bind("load",function(){

	nowLoading();
	browserCheck();

	$.ajax({
		url: fileXml,
		type: 'GET',
		dataType: 'xml',
		cache: false,
		timeout: ajaxTimeout,

		error: function(){
			ajaxError();
		},

		success: function(xml){
			ajaxSuccess(xml);
		}

	});

});

/* ================================================== */
/* loading */
/* ================================================== */

function nowLoading() {

	$('#main').html('<div id="loading"><img src="'+ fileLoadGif + '" width="32" height="32" alt="HIRO"></a></div>');

	if (browserName == "msie") {
		$('#loading').show();
	} else {
		$('#loading').fadeIn(100);
	}

}

/* ================================================== */
/* xml error */
/* ================================================== */

function ajaxError() {
	$('#loading').fadeOut(400,function(){
		$('#noxml').fadeIn(400);
	});
}

/* ================================================== */
/* xml success */
/*イントロを復活させる場合は、setImgShow()をsetIntro()に変更*/
/* ================================================== */

function ajaxSuccess(xml) {
	getImgInfo(xml); 
	setImgShow();
}

/* ================================================== */
/* image info */
/* ================================================== */

function getImgInfo(xml) {
	$(xml).find('img').each(function(i) {
		imgArray[i]        = new Object();
		imgArray[i].id     = jQuery(this).find('id').text();
		imgArray[i].src    = jQuery(this).find('src').text();
		imgArray[i].alt    = jQuery(this).find('alt').text();
		imgArray[i].href   = jQuery(this).find('href').text();
		imgArray[i].target = jQuery(this).find('target').text();
		imgArray[i].time   = jQuery(this).find('time').text();
	});
}

/* ================================================== */
/* intro */
/* ================================================== */

function setIntro() {

	if (browserName == "msie") {
		fileIntro    = fileIntroIe ;
		timeStart    = 0;
		introFadeIn  = 200;
		timeStop     = 1300;
		introFadeOut = 500;

	} else {
		fileIntro    = fileIntroFf ;
		timeStart    = 0;
		introFadeIn  = 600;
		timeStop     = 800;
		introFadeOut = 300;
	}

	$('#main').html('<div id="intro"><img src=' + fileIntro + ' width="180" height="60" alt="' + introAlt + '"></a></div>');

	$('#intro')
	.hide()
	.animate({'left':'+=0'},timeStart)
	.fadeIn(introFadeIn)
	.animate({'left':'+=0'},timeStop)
	.fadeOut(introFadeOut, function() {

		$(this).remove;

		setImgShow();

	});
}

/* ================================================== */
/* set main image */
/* ================================================== */

function setImgShow() {

	imgMax = imgArray.length-1;

	$('#main').prepend('<div id="spacer"><a href="javascript:void(0);" target="_self" id="hrefMain"><img src="' + fileSpacerGif + '" width="700" height="275" alt="" id="nocopy"></a></div>');
	$("#spacer").fadeIn(200);

	$("#main").append("<div id='mainBaloon'><p></p></div>");

	/* $("#main").append("<div id='toolTip'><p></p></div>"); */

	$("#mainVisualnav").append("<div id='mainBaloonBottom'><img src='./images/portal/slide/baloonbottom.png' width='16' height='10' border='0' alt='' id='iepngfix'></div>");

	/* imgNum = Math.floor(Math.random() * imgArray.length); */
	imgNum = 0;

	$(imgArray).each(function(i) {

		idArray[i] = new Object();

		idArray[i].img = "wait" + i;
		idArray[i].btn = "btn" + i;
		idArray[i].btnImgOn  = "btnImgOn" + i;
		idArray[i].btnImgOff = "btnImgOff" + i;

		idArray[i].imgPass       = "#" + idArray[i].img;
		idArray[i].btnPass       = "#" + idArray[i].btn;
		idArray[i].btnImgOnPass  = "#" + idArray[i].btnImgOn;
		idArray[i].btnImgOffPass = "#" + idArray[i].btnImgOff;

		linkURL = imgArray[i].href + urlParam;

		$('#main').append('<div class="wait" id="' + idArray[i].img + '"><a href="'+ linkURL + '" target="' + imgArray[i].target + '"><img src="' + imgArray[i].src + '" width="700" height="275" alt="' + imgArray[i].alt + '"></a></div>');

		$('#mainVisualnav').append('<span class="btn" id="' + idArray[i].btn + '"><a href="javascript:void(0);"><img src="./images/portal/slide/btn_off.gif" width="12" height="8" alt="' + imgArray[i].alt + '" id="' + idArray[i].btnImgOff + '" class="btnImgOff"><img src="./images/portal/slide/btn_on.gif" width="12" height="8" alt="' + imgArray[i].alt + '" id="' + idArray[i].btnImgOn + '" class="btnImgOn"></a></span>');

	});

	// 1st tip
	/*$('#toolTip p').text(imgArray[imgNum].alt);*/

	linkURL = imgArray[imgNum].href + urlParam;

	// 1st href
	$('#hrefMain').attr("href", linkURL);
	$('#hrefMain').attr("target",imgArray[imgNum].target);
	$('#nocopy').attr("alt",imgArray[imgNum].alt);

	// 1st image
	$(idArray[imgNum].imgPass).fadeIn(imgFade);
	$(idArray[imgNum].btnImgOffPass).hide();

	timerImgShow();

	/* setToolTip(); */

}

/* ================================================== */
/* init main image */
/* ================================================== */

function timerImgShow(btnNum) {

	clearTimeout(timer);

	$(imgArray).each(function(i) {
		$(idArray[i].btnPass).unbind("click");
	});

	if(!flagBtnClick) {

		flagBtnClick = true;

		if(btnNum != imgNum) {

			if(flagImgStart) {

				imgBack = imgNum-1;

				if (!isNaN(btnNum)) {
					imgNext = btnNum;
				} else {
			  	imgNext = imgNum+1;
					if (imgNext > imgMax) {
						imgNext = 0;
					}
				}

				if (imgBack < 0) {
					imgBack = imgMax;
				}

				$('#toolTip p').text(imgArray[imgNext].alt);

				// href

				linkURL = imgArray[imgNext].href + urlParam;

				$('#hrefMain').attr("href", linkURL);
				$('#hrefMain').attr("target",imgArray[imgNext].target);
				$('#nocopy').attr("alt",imgArray[imgNext].alt);

				// image
				$(idArray[imgNext].imgPass).css({'z-index':'700'}).css({'top':'0'}).show();
				$(idArray[imgNum].imgPass).css({'z-index':'800'}).css({'top':'0'}).animate({'top':'-=0'},{queue:false,duration:600}).fadeOut(410);

				// btn
				$(idArray[imgNum].btnImgOffPass).show();
				$(idArray[imgNext].btnImgOffPass).hide();

				// next imgNum
				if (isNaN(btnNum)) {
					if(imgNum == imgMax) {
						imgNum = 0;
					} else {
						imgNum++;
					}
				} else {
					imgNum = btnNum;
				}
			}
		}

		setBtnTimeout();
		flagImgStart = true;
		timer = setTimeout("timerImgShow()", imgArray[imgNum].time)

	}

	flagBtnClick = false;

}

/* ================================================== */
/* set btn */
/* ================================================== */

function setBtn() {
	$(imgArray).each(function(i) {
		$(idArray[i].btnPass).bind("click",i,function(event){timerImgShow(event.data)});
	});
}

function setBtnTimeout() {
	btnTimer = setTimeout("setBtn()", 500)
}

/* ================================================== */
/* end */
/* ================================================== */
