$.fn.extend({
	homeTopVisual : function(arrList){
		var $target = $(this);

		var imgArray = new Array();
		imgArray = arrList;
		var imgArrayLen = imgArray.length;

		var $targetBox = $('<div />');
		$(this).find('img:eq(0)').after($targetBox);
		var $targetImg;

		var selectImageArr = new Array();

		var imageGalleryTimer;
		var galleryTime = 6000;

		var loadImageCnt = 1;
		$.each(
			imgArray,
			function(num,url){
				var $img = $('<img />').attr('src',url).css('opacity',0).appendTo($targetBox);
				selectImageArr[num]=num;
				if(num){
					$img.load(function(){
						loadImageCnt++;
						if(loadImageCnt>=imgArrayLen){
							$targetImg = $targetBox.find('img');
							imageGalleryTimer = setTimeout(function(){ changeImage();},galleryTime);
						}
					});
				}
			}
		);

		function changeImage(){
			clearTimeout(imageGalleryTimer);
			$targetImg.eq(selectImageArr[0]).css('opacity',0).css('zIndex',500).stop().animate({ opacity : 1 },{
				duration : 800,
				easing : 'easeInCubic',
				complete : function(){
					$targetImg.eq(selectImageArr[0]).css('zIndex',400).siblings().css('zIndex',300);

					selectImageArr.push(selectImageArr.shift());

					imageGalleryTimer = setTimeout(function(){ changeImage();},galleryTime);
				}
			});
		}

		$(function(){

			var $homeMapArea = $('#homeMapArea');
			var $homeMapShow = $('#homeMapClick').fixPng().css('opacity',0).css('top',316);
//			var $homeMapHide = $('#homeMapClose').fixPng().css('opacity',0);
			var $homeMapImage = $('#homeMapImage');

			$homeMapArea.hover(
				function(){
					$homeMapShow.stop().animate({ opacity : 1 },{
						duration : 400,
						easing : 'easeInCubic'
					});
				},
				function(){
					$homeMapShow.animate({ opacity : 0 },{
						duration : 400,
						easing : 'easeOutCubic'
					});
				}
			);


			function homeMapOpen(){
				$homeMapImage.stop().animate({ top : 0 },{
					duration : 500,
					easing : 'easeInCubic',
					complete : function(){

//						$homeMapHide.animate({ opacity : 1 },{
//							duration : 400,
//							easing : 'easeInCubic'
//						});

					}
				});
			}

			function homeMapClose(){
				$homeMapImage.stop().animate({ top : 340 },{
					duration : 600,
					easing : 'easeOutCubic',
					complete : function(){
						$homeMapImage.unbind( areaOutHandle );
					}
				});

//				$homeMapHide.animate({ opacity : 0 },{
//					duration : 400,
//					easing : 'easeOutCubic'
//				});
			}

			var areaOutHandle = {
				mouseleave:function(){
					homeMapClose();
				}
			};

			$homeMapShow.click(function(){
				homeMapOpen();
				$homeMapImage.bind( areaOutHandle );
			});

//			$homeMapHide.click(function(){
//				homeMapClose();
//			});

		});
	}
});