$(document).ready(function(){
	var $notice = $('#notice-area'),
			$tabs = $notice.find('li.tab');

	// accessibility
	$tabs.find('>img').wrap('<a href="#" class="stub"></a>');

	var tabClickFocusFunction = function($tab) {
		$tab.siblings().removeClass('current').find('>a>img').each(function(){
			var $image = $(this);
			$image.attr('src', $image.attr('src').replace('-on', '-off'));
		});
		$tab.addClass('current');
		var $image = $tab.find('>a>img');
		$image.attr('src', $image.attr('src').replace('-off', '-on'));
	};

	$tabs.find('>a')
		.click(function() {
			var $tab = $(this).parent();
			tabClickFocusFunction($tab);
			return false;
		})
		.focus(function() {
			var $tab = $(this).parent();
			tabClickFocusFunction($tab);
		});

	//==========================================================================

	var $popupZone = $('#popup-zone>ul');
	var $popupZoneItems = $popupZone.find('li');
	var popupZoneRun = false;
	var popupHasFocus = false;
	var popupMouseOver = false;
	var popupCount = $popupZoneItems.length;

	/* add play/stop button */
	$popupZone
		.after('<a href="#stop" class="control01 stop"><img src="/images/main/popup/stop.png" alt="멈춤" title="팝업존 멈춤"/></a>')
		.siblings('a.stop')
		.click(function() {
			popupZoneRun = false;
			return false;
		})
		.after('<a href="#play" class="control02 play"><img src="/images/main/popup/play.png" alt="재생" title="팝업존 재생" /></a>')
		.siblings('a.play')
		.click(function() {
			popupZoneRun = true;
			return false;
		});

	var popupSetIndex = function(index) {
		$popupZoneItems.removeClass('current');
		$($popupZoneItems[index]).addClass('current');

		var oldButton = $popupZoneItems.find('img.runner[src$=on.png]')[0];
		oldButton.src = oldButton.src.replace('on', 'off');
		var newButton = $popupZoneItems.find('img.runner')[index];
		newButton.src = newButton.src.replace('off', 'on');
	};

	// accessibility
	$popupZoneItems.find('img.runner').wrap('<a href="#" class="runner"></a>');

	$popupZoneItems.find('a.runner')
		.focus(function() {
			var index = $popupZoneItems.index($(this).parent());
			popupSetIndex(index);
		})
		.mouseenter(function() {
			var index = $popupZoneItems.index($(this).parent());
			popupSetIndex(index);
		})
		.click(function() {
			return false;
		});

	$popupZoneItems
		.mouseenter(function() {
			popupMouseOver = true;
		})
		.mouseleave(function() {
			popupMouseOver = false;
		});

	$popupZoneItems.find('a')
		.focus(function() {
			popupHasFocus = true;
		})
		.blur(function() {
			popupHasFocus = false;
		});

	if (popupCount > 1)
	{
		setInterval(function() {
			if (popupZoneRun && !popupHasFocus && !popupMouseOver)
			{
				var index = $popupZoneItems.index($popupZoneItems.filter('.current'));
				index = (index + 1) % popupCount;
				popupSetIndex(index);
			}
		}, 4000);
	}

	//==========================================================================

	var $bannerZone = $('#banner-zone');
	var $bannerZoneContentList = $bannerZone.find('div.content ul');
	var offset = 0;
	var bannerZoneScroll = true;
	var bannerHasFocus = false;
	var bannerCount = $bannerZoneContentList.find('li').length;

	$bannerZoneContentList.find('a')
		.focus(function() {
			bannerHasFocus = true;
		})
		.blur(function() {
			bannerHasFocus = false;
		});

	if (bannerCount > 4)
		setInterval(function() {
			if (bannerZoneScroll && !bannerHasFocus) {
				if (offset < 120)
					$bannerZoneContentList.attr('style', 'margin-left: ' + (-offset / 10) + 'em');
				if (offset >= 120) {
					$bannerZoneContentList.removeAttr('style');
					$bannerZoneContentList.find('li:first').appendTo($bannerZoneContentList);
					offset = 0;
				}
				else
					offset++;
			}
		}, 100);
	$bannerZone.find('img.arrow-stop').wrap('<a href="#" class="control"></a>').parent().click(function(){
		bannerZoneScroll = !bannerZoneScroll;
		return false;
	});
	$bannerZone.find('img.arrow-left').wrap('<a href="#" class="control"></a>').parent().click(function(){		
		if (bannerCount > 4)
			$bannerZoneContentList.find('li:lt(4)').appendTo($bannerZoneContentList);
		return false;
	});
	$bannerZone.find('img.arrow-right').wrap('<a href="#" class="control"></a>').parent().click(function(){
		if (bannerCount > 4) {
			for (var i=0; i<4; i++)
				$bannerZoneContentList.find('li:last').prependTo($bannerZoneContentList);
		}
		return false;
	});
});