// JavaScript Document

/*var leftArr = jQuery('a.LArrow');
var rightArr = jQuery('a.RArrow');
var logoItem = jQuery('.FrameImg');
var wLogoGrp = jQuery('#logoGroup').width();
var hLogoGrp = jQuery('#logoGroup').height();
var topPos, leftPos, rightPos, botPos;
var cntHL;
var wLogoGrpEx = wLogoGrp - 157;
*/

jQuery(function(){
	var logoItem = jQuery('.FrameImg');
	var wLogoGrp = jQuery('#logoGroup').width();
	var hLogoGrp = jQuery('#logoGroup').height();
	var topPos, leftPos, rightPos, botPos;
	var cntHL;
	var wLogoGrpEx = wLogoGrp - 157;

	LinkCircle();
	
	logoItem.bind('click', function(e){
		e.preventDefault();
		logoItem.removeClass('Active');
		jQuery(this).addClass('Active');
		
		topPos = jQuery(this).position().top;
		leftPos = jQuery(this).position().left;
		
		
		rightPos = wLogoGrp - leftPos - 149;
		botPos = hLogoGrp - topPos - 149;
		
		cntHL = jQuery(this).siblings().html();
		
		if(jQuery('#track').is(':hidden')) {
			//HLContent()
			if(leftPos < wLogoGrpEx) {
				if(topPos < 475) {
					jQuery('#track').css({display: 'block',
													top: String(topPos) + 'px', 
													left: String(leftPos) + 'px'
											}).animate({
													width: '305px', 
													height: '304px'
												},
												500,
												'easeInOutQuint',
												function(){
													jQuery(this).html(cntHL);
											});
				} else {
					jQuery('#track').css({display: 'block',
													bottom: String(botPos) + 'px', 
													left: String(leftPos) + 'px'
											}).animate({
													width: '305px', 
													height: '304px'
												},
												500,
												'easeInOutQuint',
												function(){
													jQuery(this).html(cntHL);
											});
				}
			} else {				
				if(topPos < 475) {
					
					jQuery('#track').css({display: 'block',
													top: String(topPos) + 'px', 
													right: String(rightPos) + 'px'
											}).animate({
													width: '305px', 
													height: '304px'
												},
												500,
												'easeInOutQuint',
												function(){
													jQuery(this).html(cntHL);
											});
				} else {
					jQuery('#track').css({display: 'block',
													bottom: String(botPos) + 'px', 
													right: String(rightPos) + 'px'
											}).animate({
													width: '305px', 
													height: '304px'
												},
												500,
												'easeInOutQuint',
												function(){
													jQuery(this).html(cntHL);
											});
				} 
			}		
		} else {
			
			jQuery('#track').animate(500, 'easeInOutExpo',
				function(){
					jQuery(this).removeAttr('style');
					jQuery(this).empty();
					//HLContent();				
					if(leftPos < wLogoGrpEx) {
						if(topPos < 475) {
							jQuery('#track').css({display: 'block',
															top: String(topPos) + 'px', 
															left: String(leftPos) + 'px'
													}).animate({
															width: '305px', 
															height: '304px'
														},
														500,
														'easeInOutQuint',
														function(){
															jQuery(this).html(cntHL);
													});
						} else {
							jQuery('#track').css({display: 'block',
															bottom: String(botPos) + 'px', 
															left: String(leftPos) + 'px'
													}).animate({
															width: '305px', 
															height: '304px'
														},
														500,
														'easeInOutQuint',
														function(){
															jQuery(this).html(cntHL);
													});
						}
					} else {				
						if(topPos < 475) {
							
							jQuery('#track').css({display: 'block',
															top: String(topPos) + 'px', 
															right: String(rightPos) + 'px'
													}).animate({
															width: '305px', 
															height: '304px'
														},
														500,
														'easeInOutQuint',
														function(){
															jQuery(this).html(cntHL);
													});
						} else {
							jQuery('#track').css({display: 'block',
															bottom: String(botPos) + 'px', 
															right: String(rightPos) + 'px'
													}).animate({
															width: '305px', 
															height: '304px'
														},
														500,
														'easeInOutQuint',
														function(){
															jQuery(this).html(cntHL);
													});
						} 
					}		
				});
		}

		return false;
	});
	
	jQuery('#track').bind('click', function(e){
		e.preventDefault();		
		jQuery(this).animate({opacity: 0},500,'easeInOutExpo',function(){
							jQuery(this).removeAttr('style');
							jQuery(this).empty();
						});
		return false;
	});
	
});

/*function HLContent(){
	if(leftPos < wLogoGrpEx) {
		if(topPos < 475) {
			jQuery('#track').css({display: 'block',
											top: String(topPos) + 'px', 
											left: String(leftPos) + 'px'
									}).animate({
											width: '305px', 
											height: '304px'
										},
										500,
										'easeInOutQuint',
										function(){
											jQuery(this).html(cntHL);
									});
		} else {
			jQuery('#track').css({display: 'block',
											bottom: String(botPos) + 'px', 
											left: String(leftPos) + 'px'
									}).animate({
											width: '305px', 
											height: '304px'
										},
										500,
										'easeInOutQuint',
										function(){
											jQuery(this).html(cntHL);
									});
		}
	} else {				
		if(topPos < 475) {
			
			jQuery('#track').css({display: 'block',
											top: String(topPos) + 'px', 
											right: String(rightPos) + 'px'
									}).animate({
											width: '305px', 
											height: '304px'
										},
										500,
										'easeInOutQuint',
										function(){
											jQuery(this).html(cntHL);
									});
		} else {
			jQuery('#track').css({display: 'block',
											bottom: String(botPos) + 'px', 
											right: String(rightPos) + 'px'
									}).animate({
											width: '305px', 
											height: '304px'
										},
										500,
										'easeInOutQuint',
										function(){
											jQuery(this).html(cntHL);
									});
		} 
	}				
}*/

function LinkCircle(){
	var fCirCnt = jQuery('#circleCnt').html();
	jQuery('.Slice').bind('click', function(e){
		e.preventDefault();
		var idx = jQuery(this).attr('alt');
		var cnt = jQuery('#Cnt'+ idx + '').html();
		jQuery('#imgCircle').removeAttr('class');
		jQuery('#circleCnt').removeAttr('class');
		jQuery('#imgCircle').addClass('BgCircle' + idx + '');
		jQuery('#circleCnt').addClass('BgCircleCnt' + idx + '');
		jQuery('#circleCnt').html(cnt);
		return false;
	});
	jQuery(document).ready(function(){
		jQuery("#areaCircle").bind('click', function(e){
			e.preventDefault();
			jQuery('#circleCnt').html(fCirCnt);
			jQuery('#circleCnt').removeAttr('class');
			jQuery('#imgCircle').removeAttr('class');
			return false;
		});
	});
	
	jQuery('.Slice').bind('mouseover', function(e){
		e.preventDefault();
		var idx = jQuery(this).attr('alt');
		jQuery('#imgCircle').addClass('BgHCircle' + idx + '');
		return false;
	});
	
	jQuery('.Slice').bind('mouseout', function(e){
		e.preventDefault();
		var idx = jQuery(this).attr('alt');
		jQuery('#imgCircle').removeClass('BgHCircle' + idx + '');
		return false;
	});
}


