$(function(){
	var imgSpanX = 100;
	var imgSpanY = 100;
	var imgBoxWidth = 600;
	var imgParts = new Array;
	var imgBox = new Array;
	//set to the category from the url
	var category = location.href.split('/');
		category = category[category.length-2];
	var XMLname ='';
	var thePage = '';
	setXmlname();
	
	
	
$.ajax({
	url:XMLname,
	type: "GET",
	dataType: "xml",
	timeout: 1000,
	cache:false,
	success:function(xml){
		makeDataSet(xml);
		layoytImg();
		setMouseover();
		checkPageNum();
		checkThePage();
	},
	error:function(){
	}
});
	
	
	
function setXmlname(){
	var theId = $('body').attr('id');
	
	if((theId == 'master')||(theId == 'master_perma')){
		XMLname = '../xml/over-view.xml';
		
	}else if((theId == 'electronics')||(theId == 'electronics_perma')){
		XMLname = '../xml/consumer-electronics.xml';
		
	}else if((theId == 'products') || (theId == 'products_perma')){
		XMLname = '../xml/consumer-products.xml';
	
	}else if((theId == 'professional') || (theId == 'professional_perma')){
		XMLname = '../xml/professional-products.xml';
	
	}else if((theId == 'transpotation') || (theId == 'transpotation_perma')){
		XMLname = '../xml/public-transportation.xml';
	
	}
	
}




//perse the xml which got, make HASH
function makeDataSet(theData){
	imgParts = $('image',theData);
	for(i=0; i<imgParts.size(); i++){
		var title = imgParts.eq(i).find('title').text();
		var src = imgParts.eq(i).find('src').text();
		var permalink = imgParts.eq(i).find('permalink').text();
		var page = imgParts.eq(i).find('page').text();
		var posX = imgParts.eq(i).find('posX').text();
		var posY = imgParts.eq(i).find('posY').text();
		
		var tmp = {
			title:title,
			src:src,
			permalink:permalink,
			page:page,
			posX:posX,
			posY:posY
		}
		
		if(tmp['title'] && tmp['src'] && tmp['permalink'] && tmp['page'] && tmp['posX'] && tmp['posY']){
			imgBox[i] = tmp;
		}else{
/* 			alert(title+'に入力エラーがありますよ'); */
			return false;
		}
			
	}

}




//put image to DOM, attach styles
function layoytImg(){
	var imgTag = '';
	var x = '';
	var y = '';
	var link = '';

	
	for(i=0; i<imgBox.length; i++){
		x = imgBoxWidth*(imgBox[i]["page"]-1)+imgSpanX*(imgBox[i]["posX"]-1);
		y = imgSpanY*(imgBox[i]["posY"]-1);
		link = imgBox[i]["permalink"];
		tmp = '<a href='+link+'?'+category+'><img src='+imgBox[i]["src"]+' alt='+imgBox[i]["title"]+'></a>';
		$(tmp).appendTo('#im').css({'top':y,'left':x});
	}
	
	
/* 	tooltip.init (); */
}





//check page number
function checkPageNum(){
	var maxPageNum = 1;
	var pageTmp = '';
	
	for(i=0; i<imgBox.length; i++){
		pageTmp += imgBox[i]['page'];
		
		if(maxPageNum < imgBox[i]['page']){
			maxPageNum = imgBox[i]['page'];
		}
	}
	$('ul.'+category).css('display','block');
	for(i=1; i<maxPageNum; i++){
		makeBtnEvent(i)
		/* only in case of btn 2 */
		if(i==1){
			$('ul.'+category).find('a').eq(0).css('color','#bb0000');
		}
	}
}


/* check thePage when it back from detail page */
function checkThePage(){
	if(location.search != "" && location.search != "?page=1"){
		thePage = location.search.substring(1);
		thePage = thePage.split('=');
		thePage = parseInt(thePage[1]);
		$('#im').css('left',-(thePage-1)*imgBoxWidth);
		$('ul.'+category).find('a').css('color','#666666');
		$('ul.'+category).find('a').eq(thePage-1).css('color','#bb0000');
	}
}


/* make Numbtn event attached */
function makeBtnEvent(i){

	/* 	when there over 2 btns, became to show 1 btn. */
	if(i==1){
		var btn_1 = '<li><a href="#">1</a></li>';
		$(btn_1).appendTo('ul.'+category).click(function(){
			$('#im').animate(
				{'left':'0'},
				{}
			);
			$('ul.'+category).find('a').css('color','#666666');
			$(this).children('a').css('color','#bb0000');
			return false;
		});
	}
	//end
	
	var moveW = imgBoxWidth*i;
	var tmp = '<li><a href="#">'+(i+1)+'</a></li>';
	$(tmp).appendTo('ul.'+category).click(function(){
		$('#im').animate(
			{'left':'-'+moveW},
			{}
		);
		$('ul.'+category).find('a').css('color','#666666');
		$(this).children('a').css('color','#bb0000');
		return false;
	});
}



//set mouseover event
function setMouseover(){
	$('img','#im').hover(
			function(){
				$(this).colorBlend([{param:'border-color',cycles:1,isFade:false,fps:20,fromColor:'#d8d8d8',toColor:'#cc0000',duration:'500'}]);
			},
			function(){
				$(this).colorBlend([{param:'border-color',cycles:1,isFade:false,fps:60,fromColor:'#cc0000',toColor:'#d8d8d8',duration:'250'}]);
			}
		);

}


})