AutoViewImage = {
	BtnAreaId : '',
	ImageAreaId : '',
	/* Info Sample
	* Array('배경이미지','버튼Off 이미지','버튼On 이미지','맵이름','맵 위치 coords','링크');
	* 사용법 샘플
	*
		<script type="text/javascript">
		var aInfo = new Array;
		aInfo[0] = new Array('/images/main/dom_main_visual_1.jpg','/images/main/visual_tab_01.gif','/images/main/visual_tab_01_on.gif','AutoImageMap0','16,182,148,209','#');
		aInfo[1] = new Array('/images/main/dom_main_visual_2.jpg','/images/main/visual_tab_02.gif','/images/main/visual_tab_02_on.gif','AutoImageMap1','378,100,508,127','#');
		aInfo[2] = new Array('/images/main/dom_main_visual_3.jpg','/images/main/visual_tab_03.gif','/images/main/visual_tab_03_on.gif','AutoImageMap2','31,194,183,224','#');
		var option = {
			Info : aInfo,
			BtnAreaId : 'button_area', //버튼 영역
			ImageAreaId : 'image_area', //배경이미지 영역
			IntervalTime : 5000
		};
		AutoViewImage.Init(option);
		</script>
	*/
	Info : new Array,
	IntervalTime : 7000, // 기본 7초
	CurrentTargetId : 0,
	_InIt : 0,
	AutoChangeFunc : '', // 재귀함수
	Init : function (option){
		AutoViewImage.BtnAreaId = option.BtnAreaId; // 버튼영역
		AutoViewImage.ImageAreaId = option.ImageAreaId; // 배경이미지 영역
		AutoViewImage.Info = option.Info; // 정보
		AutoViewImage.IntervalTime = option.IntervalTime;
				
		// 버튼갯수만큼 버튼 영역에 생성
		var $button = '<dl>';
		//onmouseout="javascript:AutoViewImage.Btn_Mouse_Out(\''+i+'\');"
		for(var i = 0; i < option.Info.length; i++){
			$button += '<dt><a href="#" onmouseover="javascript:AutoViewImage.Btn_Mouse_over(\''+i+'\');" onfocus="this.blur();"><img src="'+option.Info[i][1]+'" alt="목록이미지_'+i+'"  id="Button_'+i+'"></a></dt>';

			if(option.Info[i][3]){
				var MapUrlCnt = option.Info[i][4].length;
				
				
				

				
				//alert(option.Info[i][4].length);
				if(option.Info[i][6]){ // html 옵션 ex) target="_blank"
					var $map = '<map name="'+option.Info[i][3]+'" id="'+option.Info[i][3]+'">';
					for(var j = 0; j < MapUrlCnt; j++){
						$map += '<area shape="rect" coords="'+option.Info[i][4][j]+'" href="'+option.Info[i][5][j]+'" '+option.Info[i][6]+'>';
					}
					$map += '</map>';
									
					
				}else{
					var $map = '<map name="'+option.Info[i][3]+'" id="'+option.Info[i][3]+'">';
					for(var j = 0; j < MapUrlCnt; j++){
						$map += '<area shape="rect" coords="'+option.Info[i][4][j]+'" href="'+option.Info[i][5][j]+'" >';
					}
					$map += '</map>';

				}
				//alert($map);
				

				
				$('#'+AutoViewImage.ImageAreaId).append($map);
			}
		}
		$button += '</dl>';
		$('#'+AutoViewImage.BtnAreaId).append($button);
		AutoViewImage.Btn_Mouse_over(0); // 처음 Image 선택
	},
	Btn_Mouse_over : function(id){
		// 최초실행이거나 마우스오버요청값과 현재값이 틀릴때만 저장
		if(AutoViewImage._InIt == 0 || AutoViewImage.CurrentTargetId != id){
			// Stop Animation
			$('div#'+AutoViewImage.ImageAreaId).find('img').eq(0).stop();

			// Start Animation

			// Prev Image FadeOut
			$('div#'+AutoViewImage.ImageAreaId).find('img').eq(0).fadeTo("0.5",0.2,function(){
				// New Image FadeIn
				$(this).attr('src',AutoViewImage.Info[id][0]).attr('usemap','#'+AutoViewImage.Info[id][3]).fadeTo("0.5",1);
			});
			
			// Change mouseover Icon
			$("img[id^=Button_]").each(function(i){
				$(this).attr('src',AutoViewImage.Info[i][1]);
			});
			$("#Button_"+id).attr('src',AutoViewImage.Info[id][2]);
			
			// Save Current Id
			AutoViewImage.CurrentTargetId = id;
			// Reset Recursive Function
			clearTimeout(AutoViewImage.AutoChangeFunc);
			// Set Recursive Function
			AutoViewImage.AutoChangeFunc = setTimeout("AutoViewImage.AutoChange()", AutoViewImage.IntervalTime); 
		}
		if(AutoViewImage._InIt == 0) AutoViewImage._InIt = 1;
	
	},
	AutoChange : function(){
		// Get Next Id
		var CurViewId = parseInt(AutoViewImage.CurrentTargetId);
		var TotalCnt = parseInt(AutoViewImage.Info.length) - 1;
		if(CurViewId == TotalCnt){
			var NextViewId = 0;
		}else{
			var NextViewId = CurViewId + 1;
		}
		AutoViewImage.Btn_Mouse_over(NextViewId); 		
	}
}