/*
  version  : 2008-12-16_001
  requires : jquery(ver1.3.1)
*/

/* 地域のお店検索マップのjs */


$(function (){
		
/* 共通の変数 */
var mapImage = $('img#map-image');
var shopList = $('div.area-box');
var rolloverArea = $('area.choice');
var preMapSrc = mapImage.attr('src');
var point = preMapSrc.split('/images/');
	point = point[1];
	commonPath = preMapSrc.split(point);
	commonPath = commonPath[0];	//地図画像のパスの共通部分

/* 
areaのhashに、-mapをつける
------------------------------------------------------------------------- */
$(rolloverArea).each(function(){
	$(this).attr('href' , function(){

	return this.hash + '-map';
	});
});


/* 
画像・リストの初期表示（指定）
------------------------------------------------------------------------- */
$(shopList).css('display','none');

var hash = location.hash
var url = location.href;
	if (hash.match('anchor') || (hash == 0)) {
/* 
画像・リストのプリロード、ランダム表示
------------------------------------------------------------------------- */
		$(shopList).css('display','none');
		
		var i = 0;
		var areaNum = shopList.length;
		var rand = Math.floor( Math.random() * areaNum);
		
		$(shopList).each(function(){
			var areaName = $(this).attr('id');
			
			/* 画像のプリロード 
			-------------------------------------- */
			var preImg = new Image();
			preImg.src = commonPath + areaName + '.gif';
					
			/* 画像・リストのランダム表示
			-------------------------------------- */
			
				if(i==rand){
					$('div#shop-list').css('display','block');
					$('div#'+areaName).css('display','block');
					$(mapImage).attr('src',preImg.src);
				};
			i++	;
		});
	}else {
			var areaName = url.split('#');
			areaName = areaName[1];
			if (areaName.match('-')){
				areaName = areaName.split('-');
				areaName = areaName[0];
			}
			preImg = commonPath + areaName + '.gif';
			
			$('div#shop-list').css('display','block');
			$('div#'+areaName).css('display','block');
			$(mapImage).attr('src',preImg);
			
			$(shopList).each(function(){
				var areaName = $(this).attr('id');
				
				/* 画像のプリロード 
				-------------------------------------- */
				var preImg = new Image();
				preImg.src = commonPath + areaName + '.gif';
			});
		};

	
/* 
画像・リストの置き換え
------------------------------------------------------------------------- */
	$(function areaChange(){
	
		
		/* マウスオーバーでの画像切り替え
		-------------------------------------- */
		var mapSrc = mapImage.attr('src');	//ランダム表示画像のパス
		var t;
		
		$(rolloverArea).mouseover(function (){
			var overAreaName = $(this).attr('href');	//マウスオーバーされているマップリンクのhrefの値（地域名）
			var areaName = (overAreaName.split('#').join(''));	//マウスオーバーされているマップリンクのhrefの値から#を取った値
			areaName = (areaName.split('-'));
			areaName = areaName[0];
			var imgPath = (commonPath + areaName + '.gif');	//マウスオーバーされている画像のパス
			$(mapImage).attr('src',imgPath);
			t = 1;
		});
		$(rolloverArea).mouseout(function(){
			
			t = 0;
										  
			timerID = setTimeout(function(){
					change();
					
			}, 500);
			function change() {
				if (t == 0){
					$(mapImage).attr('src',mapSrc);
				}
				else {
					clearTimeout();
				}
			};
		});
	
		/* クリックでの画像・店舗リスト切り替え 
		-------------------------------------- */
		$(rolloverArea).click(function(){
		$(this).blur();
		var overAreaName = $(this).attr('href');	//クリックされたマップリンクのhrefの値（地域名）
		var areaName = (overAreaName.split('#').join(''));
		areaName = (areaName.split('-'));
		areaName = areaName[0]
		var imgPath = (commonPath + areaName + '.gif');		//クリックされた画像のパス
		
		$(mapImage).attr('src',imgPath);
		
		$(shopList).css('display','none');
		$('div#'+areaName).css('display','block');
		$('div.area-box dl').css('display','none').css('display','block');	//レンダリングのやり直し
		$('div.area-box ul').css('display','none').css('display','block');
		
		mapSrc = mapImage.attr('src');	//クリックされた画像をベースの画像に指定
		
		
		});
	});
});

/* 
ページ読み込み時の店舗リストを消す処理
------------------------------------------------------------------------- */
var listHidden = '<style type="text/css" media="screen,print">'
listHidden += 'div#shop-list {display: none;}'
listHidden += '</style>'

document.write(listHidden);

/* 
URLのhashに、-mapをつける
------------------------------------------------------------------------- */
if (location.href.match('#')){
	if (location.hash.match('-')||location.hash.match('anchor')){
	}else {
		location.hash = location.hash + '-map';
	};
};