var xmlData;
var eventsCounter;
var counter;
var eventItemSize;
var itemSize;
var firstLoadItem = 'yes';
var delayTabTimer;
var delayTimer;
var pauseWidget = 'no';
var pauseButtonClicked = 'no';

var tabSelectionClicked = 'no';

var stillPause;

var pageSet;
var xmlDoc;

var timeBetweenFades = 3000;
var timeBetweenTabFades = 5000;
var fadeInSpeed = 1000;
var fadeOutSpeed = 1000;

$(function()
{	
	imagePreLoader();
	
	initWidget();
	
	$('#selectorIconPausePlay').livequery('click', function()
	{
		clearTimeout(delayTabTimer);
		clearTimeout(delayTimer);
		
		if($('#selectorIconPausePlay').hasClass('selectorIconPause'))
		{
			initPauseWidget();
		}
		
		else
		{
			initPlayWidget();
		}
	});
	
	$('#buttonNavOverContainer .selectorIcon').livequery('click', function()
	{
		if(!$(this).is('#selectorIconPausePlay'))
		{
			clearTimeout(delayTabTimer);
			clearTimeout(delayTimer);
			var itemIndex = $('#buttonNavOverContainer .selectorIcon').index(this);
			counter = itemIndex;
			populateContentContainer(itemIndex);
			initPauseWidget();
		}
	});
	
	$('.eventPageTabs').click(function()
	{
		clearTimeout(delayTabTimer);
		clearTimeout(delayTimer);
		tabSelectionClicked = 'yes';
		pauseWidget = 'no';
		var currentSelectedTab = $('#contentAreaEventsTabs img').index(this);
		eventsCounter = currentSelectedTab;
		populateTabsContent();
	});
	
});

///////////////////////////////////////////////////////////////////////////
//		initPauseWidget() - performs all the actions to Pause the widget
///////////////////////////////////////////////////////////////////////////

function initPauseWidget()
{
	pauseButtonClicked = 'yes';
	pauseAndStartWidget('pause');
	$('#selectorIconPausePlay').removeClass('selectorIconPause');
	$('#selectorIconPausePlay').addClass('selectorIconPlay');
	$('#selectorIconPausePlay').css('backgroundPosition', '0px -35px');
	
	return false;
}

///////////////////////////////////////////////////////////////////////////
//		initPlayWidget() - performs all the actions to Play the widget
///////////////////////////////////////////////////////////////////////////

function initPlayWidget()
{
	pauseButtonClicked = 'no';
	pauseAndStartWidget('start');
	$('#selectorIconPausePlay').removeClass('selectorIconPlay');
	$('#selectorIconPausePlay').addClass('selectorIconPause');
	$('#selectorIconPausePlay').css('backgroundPosition', '0px 0px');
}

///////////////////////////////////////////////////////////////////////////
//		initWidget() - creates the css for the widget and pulls in the
//			dynamic content using ajax.
///////////////////////////////////////////////////////////////////////////

function initWidget()
{
	$('#buttonNav').css(
	{
		height: 50,
		width: 824,
		bottom: 0,
		position: 'absolute',
		backgroundColor: '#000000',
		opacity: 0.4
	});
	
	$('#buttonNavOverContainer').css(
	{
		position: 'absolute',
		bottom: 10,
		right: 10
	});
	
	$('.overLayer').css(
	{
		opacity: 0
	});
	
	xmlDoc = "eventsPageWidgetFeed.xml";
	
	$.get('xml/'+xmlDoc, function(data)
	{
		xmlData = data;
		$('#SEOWidgetContent').html(xmlData);
		itemSize = $(xmlData).find('item').size();
		eventItemSize = $(xmlData).find('item').eq(0).find('event').size();
	
		eventsCounter = 0;
		populateTabsContent();
	});	
}

///////////////////////////////////////////////////////////////////////////
//		populateTabsContent()
///////////////////////////////////////////////////////////////////////////

function populateTabsContent()
{
	clearTimeout(delayTabTimer);
	
	if(eventsCounter >= itemSize)
	{
		eventsCounter = 0;	
	}
	
	eventItemSize = $(xmlData).find('item').eq(eventsCounter).find('event').size();
	counter = 0;
	
	if(firstLoadItem == 'yes')
	{
		highlightTab(eventsCounter);
		populateNav();
		initLoop();
	}
	
	else
	{
		if(tabSelectionClicked == 'no')
		{
			delayTabTimer = setTimeout('highlightTab("'+eventsCounter+'"); populateNav();', timeBetweenFades);
			initLoop();
		}
		
		else
		{
			highlightTab(eventsCounter);
			populateNav();
			initLoop();
		}
		
	}
}

///////////////////////////////////////////////////////////////////////////
//		populateNav() - populates the widget navigation at the bottom
///////////////////////////////////////////////////////////////////////////

function populateNav()
{
	$('#buttonNavOverContainer').html('');
	
	if(eventItemSize != 1)
	{
		for(var b = 1; b < eventItemSize+1; b++)
		{
			var selectorIcon = "<div class='selectorIcon png'><span>"+b+"</span><div class='overLayer png'></div></div>";
			$('#buttonNavOverContainer').append(selectorIcon);
		}
		
		var selectorIconPause = "<div id='selectorIconPausePlay' class='selectorIcon selectorIconPause png'></div>";
		$('#buttonNavOverContainer').append(selectorIconPause);
	}
}

///////////////////////////////////////////////////////////////////////////
//		initLoop() - performs the timeouts and looping through the items
///////////////////////////////////////////////////////////////////////////

function initLoop()
{
	if(eventItemSize == 1)
	{
		//populateContentContainer(counter);
		delayTimer = setTimeout('populateContentContainer("'+counter+'");', timeBetweenFades);
	}
	
	else
	{
		clearTimeout(delayTimer);
		
		if(pauseWidget != 'yes')
		{
			if(firstLoadItem == 'yes')
			{
				if(counter < eventItemSize)
				{
					populateContentContainer(counter);
				}
				
				else
				{
					eventsCounter++;
					populateTabsContent();
				}
			}
			
			else
			{
				if(counter < eventItemSize)
				{
					if(tabSelectionClicked == 'no')
					{
						delayTimer = setTimeout('populateContentContainer("'+counter+'");', timeBetweenFades);
					}
					
					else
					{
						tabSelectionClicked = 'no';
						populateContentContainer(counter);
					}
					
				}
				
				else
				{
					eventsCounter++;
					populateTabsContent();
				}	
			}
		}
		
		else
		{
			clearTimeout(delayTimer);
		}
	}
}

///////////////////////////////////////////////////////////////////////////
//		populateContentContainer(index) - 
//			performs the populating of the container with the appropriate
//			content.
///////////////////////////////////////////////////////////////////////////

function populateContentContainer(index)
{
	var widgetItemImage = $(xmlData).find('item').eq(eventsCounter).find('event').eq(index).find('imageSrc').text();
	var widgetItemImageLink = $(xmlData).find('item').eq(eventsCounter).find('event').eq(index).find('imageUrl').text();
	
	var widgetItemTarget = $(xmlData).find('item').eq(eventsCounter).find('event').eq(index).find('imageTarget').text();
	var widgetItemImageAltText = $(xmlData).find('item').eq(eventsCounter).find('event').eq(index).find('imageAltText').text();
	
	var widgetImage = '<a href="'+widgetItemImageLink+'" target="'+widgetItemTarget+'"><img class="widgetImage" src="'+widgetItemImage+'" alt="'+widgetItemImageAltText+'" title="'+widgetItemImageAltText+'" /></a>';
			
	if(widgetItemImage != '' || widgetItemImage != null)
	{
		if(firstLoadItem == 'yes')
		{
			// Main Panel Population
			$('#contentContainer #content').hide();
			$('#contentContainer #content').html(widgetImage);
			highLightNav(index);
			
			$('#contentContainer #content').fadeIn(fadeInSpeed, function()
			{
				if(eventItemSize == 1)
				{
					eventsCounter++;
					delayTimer = setTimeout('populateTabsContent();', timeBetweenTabFades);
				}
				
				else
				{
					counter++;
					
					if(pauseWidget == 'no')
					{
						initLoop();
						return true;
					}
					
					else
					{
						return false;
					}
				}
			});
			
			firstLoadItem = 'no';
		}
		
		else
		{
			$('#contentContainer #content').fadeOut(fadeOutSpeed, function()
			{
				// Main Panel Population
				$('#contentContainer #content').hide();
				$('#contentContainer #content').html(widgetImage);
				highLightNav(index);
				
				$('#contentContainer #content').fadeIn(fadeInSpeed, function()
				{
					if(eventItemSize == 1)
					{
						eventsCounter++;
						delayTimer = setTimeout('populateTabsContent();', timeBetweenTabFades);
					}
					
					else
					{
						counter++;
						
						if(pauseWidget == 'no')
						{
							initLoop();
							return true;
						}
						
						else
						{
							return false;
						}
					}
				});
			});
		}
	}
	
	else
	{
		$('#contentContainer #content').html("Content could not be pulled in!");
	}
}

///////////////////////////////////////////////////////////////////////////
//		highLightNav(index) - performs the highlighting of the navigation
///////////////////////////////////////////////////////////////////////////

function highLightNav(index)
{
	clearTimeout(delayTabTimer);
	clearTimeout(delayTimer);
	
	var selectorIconSize = $('#buttonNavOverContainer .selectorIcon').size();
	
	for(var u = 0; u < selectorIconSize; u++)
	{
		$('.selectorIcon').not('#selectorIconPausePlay').eq(u).css('backgroundPosition', '0px 0px');
		$('.selectorIcon').not('#selectorIconPausePlay').eq(u).css('color', '#000000');
	}
	
	$('.selectorIcon').eq(index).css('backgroundPosition', '0px -35px');
	$('.selectorIcon').eq(index).css('color', '#FFFFFF');
}

///////////////////////////////////////////////////////////////////////////
//		pauseAndStartWidget(action) - 
//			changes the pauseWidget variable that is used in the initLoop()
///////////////////////////////////////////////////////////////////////////

function pauseAndStartWidget(action)
{
	if(action == 'pause')
	{
		clearTimeout(delayTabTimer);
		clearTimeout(delayTimer);
	
		$('#contentContainer #content').stop(true, true).show();
		pauseWidget = 'yes';
	}
	
	else
	{
		pauseWidget = 'no';
	}
	
	initLoop();
}

///////////////////////////////////////////////////////////////////////////
//		imagePreLoader() - 
//			image preloader for TAG
///////////////////////////////////////////////////////////////////////////

function imagePreLoader()
{
	var imageToPreLoad = new Array(
		"/images/common/navigation/navTagLogo.png",
		"/images/common/navigation/navSocialize.png",
		"/images/common/navigation/subNavTagBlogOff.png",
		"/images/common/navigation/subNavTagBlogOn.png",
		"/images/common/navigation/subNavTwitterOff.png",
		"/images/common/navigation/subNavTwitterOn.png",
		"/images/common/navigation/subNavYouTubeOff.png",
		"/images/common/navigation/subNavYouTubeOn.png",
		"/images/common/navigation/subNavMySpaceOff.png",
		"/images/common/navigation/subNavMySpaceOn.png",
		"/images/common/navigation/navProducts.png",
		"/images/common/navigation/subNavStayUpOff.png",
		"/images/common/navigation/subNavStayUpOn.png",
		"/images/common/navigation/subNavGetYoursOff.png",
		"/images/common/navigation/subNavGetYoursOn.png",
		"/images/common/navigation/subNavMakeMovesOff.png",
		"/images/common/navigation/subNavMakeMovesOn.png",
		"/images/common/navigation/navTagRecords.png",
		"/images/common/navigation/navLogin.png",
		"/images/common/navigation/navRegister.png",
		"/images/common/navigation/navRightCapper.png",
		"/images/common/products/productCarmeloWidgetFeature1.png",
		"/images/common/homepageWidgetFeature1.png",
		"/images/common/homepageWidgetFeature2.png",
		"/images/common/homepageWidgetFeature3.png",
		"/images/common/products/productLudacrisWidgetFeature1.jpg",
		"/images/common/products/productRobWidgetFeature1.png",
		"/images/common/products/productRobWidgetFeature2.png");
	
	for(var i = 0; i < imageToPreLoad.length; i++)
	{
		$('<img>').attr('src', imageToPreLoad[i]);	
	}
}

///////////////////////////////////////////////////////////////////////////
//		highlightTab()
///////////////////////////////////////////////////////////////////////////

function highlightTab(index)
{	
	for(var c = 0; c < itemSize; c++)
	{
		var eventTabSrc = $('#contentAreaEventsTabs img').eq(c).attr('src');
		eventTabSrc = eventTabSrc.replace('On', 'Off');
		$('#contentAreaEventsTabs img').eq(c).attr('src', eventTabSrc);
	}
	
	var currentActivatedTabSrc = $('#contentAreaEventsTabs img').eq(index).attr('src');
	currentActivatedTabSrc = currentActivatedTabSrc.replace('Off', 'On');
	$('#contentAreaEventsTabs img').eq(index).attr('src', currentActivatedTabSrc);
}