//@charset "utf-8";
//////////////////////////////////////////////////////////////////////////
//
// 地図
//
//////////////////////////////////////////////////////////////////////////
$(document).ready(function() {
	$('div#map').each(function(){
	
	
	/* 地図マウスオーバー */
		var distance = 10;
		var time = 300;
		var hideDelay = 100;
		var hideDelayTimer = null;
		
		var beingShown = false;
		var shown = null;
		
		var trigger = $('map#m_map area');
		var popup = $('div.areaPanel').css('opacity', 0);
		
		var topArray = new Array();
		topArray = ['149','174','152','220','163','179'];
		
		otherMouseOut($('div.areaPanel'));
		
		//北海道・東北
		var popup1 = $('div#area01');
		$([trigger.get(0),trigger.get(1), popup.get(0)]).mouseover(
			function () {
				otherMouseOut($('div.areaPanel:not(div#area01)'));
				onMouseOverFunc(popup1);
			}
		).mouseout(
			function () {
				onMouseOutFunc(popup1);
			}
		);
		
		//関東
		var popup2 = $('div#area02');
		$([trigger.get(2),popup.get(1)]).mouseover(
			function () {
				otherMouseOut($('div.areaPanel:not(div#area02)'));
				onMouseOverFunc(popup2);
			}
		).mouseout(
			function () {
				onMouseOutFunc(popup2);
			}
		);
		
		//中部
		var popup3 = $('div#area03').css('opacity', 0);
		$([trigger.get(3),popup.get(2)]).mouseover(
			function () {
				otherMouseOut($('div.areaPanel:not(div#area03)'));
				onMouseOverFunc(popup3);
			}
		).mouseout(
			function () {
				onMouseOutFunc(popup3);
			}
		);
		
		//関西
		var popup4 = $('div#area04').css('opacity', 0);
		$([trigger.get(4),popup.get(3)]).mouseover(
			function () {
				otherMouseOut($('div.areaPanel:not(div#area04)'));
				onMouseOverFunc(popup4);
			}
		).mouseout(
			function () {
				onMouseOutFunc(popup4);
			}
		);
		
		//中国・四国
		var popup5 = $('div#area05').css('opacity', 0);
		$([trigger.get(5),trigger.get(6),popup.get(4)]).mouseover(
			function () {
				otherMouseOut($('div.areaPanel:not(div#area05)'));
				onMouseOverFunc(popup5);
			}
		).mouseout(
			function () {
				onMouseOutFunc(popup5);
			}
		);
		
		//九州・沖縄
		var popup6 = $('div#area06').css('opacity', 0);
		$([trigger.get(7),trigger.get(8),popup.get(5)]).mouseover(
			function () {
				otherMouseOut($('div.areaPanel:not(div#area06)'));
				onMouseOverFunc(popup6);
			}
		).mouseout(
			function () {
				onMouseOutFunc(popup6);
			}
		);
		
		function onMouseOverFunc(popup){
			if (hideDelayTimer) clearTimeout(hideDelayTimer);
			if (beingShown || shown == popup) {
				return;
			} else {
				beingShown = true;
				popup.css({
					display: 'block'
				})
				.animate({
					top: '-=' + distance + 'px',
					opacity: 1
					}, time, 'swing', 
					function() {
						beingShown = false;
						shown = popup;
					}
				);
			}
		}
		
		function onMouseOutFunc(popup){
			if (hideDelayTimer) clearTimeout(hideDelayTimer);
			hideDelayTimer = setTimeout(function () {
				hideDelayTimer = null;
				beingShown = false;
				popup.animate({
					top: '+=' + distance + 'px',
					opacity: 0
					}, time, 'swing',
					function () {
						shown = null;
						popup.css('display', 'none');
					}
				);
			}, hideDelay);
		}
		
		function otherMouseOut(other){
			if (hideDelayTimer) clearTimeout(hideDelayTimer);
			hideDelayTimer = null;
			beingShown = false;
			if(shown == other){
				shown = null;
			}
			for(i=0;i<other.length;i++){
				var index = $('div.areaPanel').index(other[i]);
				$('div.areaPanel:eq('+ index +'):visible').animate({
					top: topArray[index]+ 'px',
					opacity: 0
					}, 'swing').css('display', 'none');
				
			}
		}
	});
	
	
});