var counter, imgLength=0, DIV_CD, slideHtml="", btnHtml="";
var thisImgSrc=[],thisCurrentSrc=[],clickFlg=false,triggerID,thisBtnImg,actFlg=false,activeID,zNum=10;

$(function(){

	$(".mainView").each(function(){

		var loadXmlObj = $(this);
		if($.cookie('ck_ads') != ""){ loadXmlObj.areaId = $.cookie('ck_ads'); }else{ loadXmlObj.areaId = 0; }
		loadXmlObj.settingXml = "xml/area.xml";

		//初期設定XMLファイルの読み込み
		$.ajax({
			type: "GET",
			url: loadXmlObj.settingXml,
			dataType : "xml",
			success: function(xml){
				$(".mainView .mainImgs").prepend("<div id=\"loading\"><p><img src=\"images/loading.gif\" alt=\"\" /></p></div>");
				loadXmlObj.parseXml(xml);
			},
			error:function(){
				$(".imageReel p").show();
			}
		});

		//外部XMLファイルの読み込み
		loadXmlObj.loadXml = function(target){
			$.ajax({
				type: "GET",
				url: target,
				dataType : "xml",
				success: function(xml){
					$(xml).find("data").find("bnr").each(function(e){
						loadXmlObj[e] = {};
						loadXmlObj[e].src = $(this).attr("src") ? $(this).attr("src") : 0;
						loadXmlObj[e].alt = $(this).attr("txt") ? $(this).attr("txt") : 0;
						loadXmlObj[e].thumbnail = $(this).attr("thumbnail") ? $(this).attr("thumbnail") : 0;
						loadXmlObj[e].url = $(this).attr("url") ? $(this).attr("url") : 0;
						imgLength++;
					});
					
					for(counter=0; counter<imgLength; counter++){ //スライドさせる項目の数だけ処理

						if(loadXmlObj[counter].alt != 0){ //altがあれば
							var thisImg = "<img src=\"" + loadXmlObj[counter].src + "\" alt=\"" + loadXmlObj[counter].alt + "\" width=\"950\" height=\"305\" />";
							var thisAlt = loadXmlObj[counter].alt;
						}else{ //altがなければ
							var thisImg = "<img src=\"" + loadXmlObj[counter].src + "\" alt=\"\" width=\"950\" height=\"305\" />";
							var thisAlt = "";
						}
					
						if(loadXmlObj[counter].url != 0){
							slideHtml += "<div><a href=\"" + loadXmlObj[counter].url + "\">" + thisImg + "</a></div>";
						}else{
							slideHtml += "<div>" + thisImg + "</div>";
						}

						//ボタン部分の処理
						btnHtml += "<li><a href=\"#\" rel=\"" + eval(counter+1) + "\"><img src=\"" + loadXmlObj[counter].thumbnail + "\" width=\"144\" height=\"134\" alt=\"" + thisAlt + "\" /></a></li>";
						
					}
					
					if(counter == 0){
						$(".mainView #loading").fadeOut("slow", function(){ $(".imageReel p").fadeIn(); });
					}else if(counter == 1){
						//1つしかない場合は実処理しない
						$(".mainImgs .imageReel").html(slideHtml);
						$(".mainView #loading").fadeOut("fast");
					}else{
						//実処理
						$(".mainView #loading").fadeOut("slow", function(){
							$(".mainImgs .imageReel").html(slideHtml);
							$(".mainView .paging").html("<ul>" + btnHtml + "</ul>");
							imgAction(counter);
						});
					}
				
				},
				error:function(){
					$(".mainView #loading").fadeOut("slow", function(){ $(".imageReel p").fadeIn(); });
				}
			});
		}
		
		//XMLファイルのパース処理
		loadXmlObj.parseXml = function(xml){
			if($(xml).find("area_"+loadXmlObj.areaId).length){
				loadXmlObj.loadXml($(xml).find("area_"+loadXmlObj.areaId).find("loadxml").attr("path"));
			}else{
				loadXmlObj.areaId = 0;
				loadXmlObj.loadXml($(xml).find("area_0").find("loadxml").attr("path"));
			}
		}		
	
	});

});


function imgAction(num){
	
	$(".paging").show();
	$(".paging li:first").addClass("active");
		
	$(".imageReel > div").eq(0).addClass("active").css("zIndex", 5).show();

	$(".paging li").each(function(i){
		thisImgSrc[i] = $(this).find("img").attr("src");
		thisCurrentSrc[i] = thisImgSrc[i].replace(/(\.gif|\.jpg|\.png)/, "_o" + "$1");
	});
	$(".paging li:first").find("img").attr("src",thisCurrentSrc[0]);
	thisBtnImg = $(".paging li:first").find("img");
	
	rotate = function(){
		actFlg = true;
		
		triggerID = $active.find("a").attr("rel") - 1;
		thisBtnImg = $active.find("img");

		if(!clickFlg){
			if(triggerID != 0){
				activeID = triggerID - 1;
				$(".paging li.active").find("img").attr("src",thisImgSrc[triggerID-1]);
			}else{
				activeID = num-1;
				$(".paging li.active").find("img").attr("src",thisImgSrc[num-1]);
			}

			$(".paging li").removeClass("active");
			$active.addClass("active");
			
			$(".imageReel > div").eq(triggerID).css({ zIndex:zNum++, top:"0px" }).addClass("active").show();
			$(".imageReel > div").eq(activeID).css({ zIndex:zNum++, top:"0px"}).removeAttr("class").animate({top:"-10px"},{queue:false,duration:800}).fadeOut(500);

		}else{
			
			clickFlg = false;
			
			$(".paging li").removeClass("active");
			$active.addClass("active");
			
			if(!$(".imageReel > div").eq(triggerID).hasClass("active")){
				$(".imageReel > div").eq(triggerID).css({ zIndex:zNum++, top:"0px" }).show();
				$(".imageReel > div.active").css({ zIndex:zNum++, top:"0px"}).removeAttr("class").animate({top:"-10px"},{queue:false,duration:800}).fadeOut(500);
				$(".imageReel > div").eq(triggerID).addClass("active");
			}
			
		}
		
		thisBtnImg.attr("src",thisCurrentSrc[triggerID]);
		
	}; 
	
	rotateSwitch = function(){
		play = setInterval(function(){
			$active = $('.paging li.active').next();
			if ( $active.length === 0) { $active = $('.paging li:first'); }
			rotate();
		}, 5000);
	};
	
	rotateSwitch();
	
	$(".imageReel div").hover(function() {
		clearInterval(play);
	}, function() {
		rotateSwitch();
	});	
	
	$(".paging li").click(function() {	
		clearInterval(play);

		clickFlg = true;
		if(!actFlg){ thisBtnImg.attr("src",thisImgSrc[0]); }else{ thisBtnImg.attr("src",thisImgSrc[triggerID]); }
		
		$active = $(this);
		rotate();
		rotateSwitch();
		return false;
	});	

	
}