$(function()
{
	
	// Malaysia
	$('.map_apac').each(function ()
	{
    	var distance = 10;
        var time = 250;
        var hideDelay = 50;

        var hideDelayTimer = null;

        var beingShown = false;
        var shown = false;
		
		// KL
        var trigger_kl = $('.loc_kl', this);
        var info_kl = $('.pop_kl', this).css('opacity', 0);
		
		$([trigger_kl.get(0), info_kl.get(0)]).mouseover(function()
		{
        	if (hideDelayTimer) clearTimeout(hideDelayTimer);
            if (beingShown || shown)
			{
            	// don't trigger the animation again
                return;
            }
			else
			{
               // reset position of info box
               beingShown = true;

               info_kl.css({position: 'absolute', top: -205, left: 132, display: 'block'}).
			   animate({top: '-=' + distance + 'px',opacity: 1}, time, 'swing', function()
			   {
               	beingShown = false;
                shown = true;
				
				info_tambun.animate
				(
					{
                    	top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info_tambun.css('display', 'none');
                    }
				);
				
               });
            }

            return false;
        }).mouseout(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                hideDelayTimer = setTimeout(function () {
                    hideDelayTimer = null;
                    info_kl.animate({
                        top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info_kl.css('display', 'none');
                    });

            }, hideDelay);

        	return false;
    	});
		
		// Tambun
		var trigger_tambun = $('.loc_tambun', this);
        var info_tambun = $('.pop_tambun', this).css('opacity', 0);
		
		$([trigger_tambun.get(0), info_tambun.get(0)]).mouseover(function()
		{
        	if (hideDelayTimer) clearTimeout(hideDelayTimer);
            if (beingShown || shown)
			{
            	// don't trigger the animation again
                return;
            }
			else
			{
               // reset position of info box
               beingShown = true;

               info_tambun.css({position: 'absolute', top: -220, left: 122, display: 'block'}).
			   animate({top: '-=' + distance + 'px',opacity: 1}, time, 'swing', function()
			   {
               	beingShown = false;
                shown = true;
				
				info_kl.animate
				(
					{
                    	top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info_kl.css('display', 'none');
                    }
				);
				
               });
            }

            return false;
        }).mouseout(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                hideDelayTimer = setTimeout(function () {
                    hideDelayTimer = null;
                    info_tambun.animate({
                        top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info_tambun.css('display', 'none');
                    });

            }, hideDelay);

        	return false;
    	});
        
	});
	
	// China
	$('.map_cn').each(function ()
	{
    	var distance = 10;
        var time = 250;
        var hideDelay = 50;

        var hideDelayTimer = null;

        var beingShown = false;
        var shown = false;
		
		// CN
        var trigger_kl = $('.loc_cn', this);
        var info_kl = $('.pop_cn', this).css('opacity', 0);
		
		$([trigger_kl.get(0), info_kl.get(0)]).mouseover(function()
		{
        	if (hideDelayTimer) clearTimeout(hideDelayTimer);
            if (beingShown || shown)
			{
            	// don't trigger the animation again
                return;
            }
			else
			{
               // reset position of info box
               beingShown = true;

               info_kl.css({position: 'absolute', top: 90, left: 350, display: 'block'}).
			   animate({top: '-=' + distance + 'px',opacity: 1}, time, 'swing', function()
			   {
               	beingShown = false;
                shown = true;
				
               });
            }

            return false;
        }).mouseout(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                hideDelayTimer = setTimeout(function () {
                    hideDelayTimer = null;
                    info_kl.animate({
                        top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info_kl.css('display', 'none');
                    });

            }, hideDelay);

        	return false;
    	});
	});
	
	
});