// ---------------------------------------------
// SINGLETON:	Guide
window.Guide	= new function()
{
	// ------------------------------------------------------------------------
	// PROPERTIES
	
	this.eventId		= 31208241;
	this.itemCount		= 5;
	
	this.containerHeight	= (18 + (Math.ceil(this.itemCount / 3) * 147));
	this.waitId		= null;
	this.imageUrl		= '/eda/' + this.eventId + '/resources/images/';
	this.buttonOverImage	= new Image();
	this.buttonOutImage	= new Image();
	
	this.buttonOutImage.src	= this.imageUrl + 'btn_siteGuide.gif';
	this.buttonOverImage.src= this.imageUrl + 'btn_siteGuide_hover.gif';
	
	// ------------------------------------------------------------------------
	// METHODS
	
	// Get the container element
	this.getContainerElm		= function()
	{
		return document.getElementById('guide_floater');
	};
	
	// Set the header's text
	this.setHeaderText		= function()
	{
		
		// Set the header's text
		document.getElementById('guide_nav_text').innerHTML = 'Welcome to Wrigleys Extra Venue - Use this guide to get around';
	}
	
	// Build the module elements
	this.buildContent		= function()
	{
		var oContainerElm	= Guide.getContainerElm();
		var oDiv, oContentDiv, oHeaderDiv, oLinkDiv, oMainImgDiv, oCopyDiv, oDivBorder;
		
			oDiv			= document.createElement('div');
			oDiv.id			= 'guide_mod_1';
			oDiv.innerHTML		= '<div class="guide_right_border"></div><div class="guide_bottom_border"></div><div class="guide_left_border"></div>';
			
			// Content
			oContentDiv		= document.createElement('div');
			oContentDiv.className	= 'guide_mod_content';
			
			
			
			// HeaderDiv
			oHeaderDiv = document.createElement('div');
			oHeaderDiv.className = 'guide_header_img';
			oDiv.appendChild(oHeaderDiv);
			
			oHeaderDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'166\',\'20070522\');"><img class="guide_header_img_class" src="http://eur.i1.yimg.com/eur.yimg.com/i/uk/mu/w/allb.gif" width="158" height="9" alt="" /></a>';
				
						
			// LinkDiv
			oLinkDiv = document.createElement('div');
			
			oLinkDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'166\',\'20070522\');" class="guide_link_text_class">Sophie Ellis Bextor</a>';
						
			oLinkDiv.className = 'guide_link_text';
				
			oContentDiv.appendChild(oLinkDiv);
						
			// MainImgDiv
			oMainImgDiv	= document.createElement('div');
			oMainImgDiv.className = 'guide_main_img';
			
			oMainImgDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'166\',\'20070522\');"><img class="guide_main_img_class" src="http://l.yimg.com/eur.yimg.com/i/uk/mu/s/65sop.jpg" width="65" height="65" alt="" /></a>';
				
			oContentDiv.appendChild(oMainImgDiv);
			
			
			oCopyDiv = document.createElement('div');
			oCopyDiv.className = 'guide_copy';
			oCopyDiv.innerHTML = 'Sophie Ellis Bextor takes us on a tour of her fav London spots.';
			oContentDiv.appendChild(oCopyDiv);
			
			oDiv.appendChild(oContentDiv);
			oContainerElm.appendChild(oDiv);
		
			oDiv			= document.createElement('div');
			oDiv.id			= 'guide_mod_2';
			oDiv.innerHTML		= '<div class="guide_right_border"></div><div class="guide_bottom_border"></div><div class="guide_left_border"></div>';
			
			// Content
			oContentDiv		= document.createElement('div');
			oContentDiv.className	= 'guide_mod_content';
			
			
			
			// HeaderDiv
			oHeaderDiv = document.createElement('div');
			oHeaderDiv.className = 'guide_header_img';
			oDiv.appendChild(oHeaderDiv);
			
			oHeaderDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'163\',\'20070420\');"><img class="guide_header_img_class" src="http://eur.i1.yimg.com/eur.yimg.com/i/uk/msg/w/rere.gif" width="200" height="9" alt="" /></a>';
				
						
			// LinkDiv
			oLinkDiv = document.createElement('div');
			
			oLinkDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'163\',\'20070420\');" class="guide_link_text_class">Mutya</a>';
						
			oLinkDiv.className = 'guide_link_text';
				
			oContentDiv.appendChild(oLinkDiv);
						
			// MainImgDiv
			oMainImgDiv	= document.createElement('div');
			oMainImgDiv.className = 'guide_main_img';
			
			oMainImgDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'163\',\'20070420\');"><img class="guide_main_img_class" src="http://l.yimg.com/eur.yimg.com/i/uk/mu/m/65mut.jpg" width="65" height="65" alt="" /></a>';
				
			oContentDiv.appendChild(oMainImgDiv);
			
			
			oCopyDiv = document.createElement('div');
			oCopyDiv.className = 'guide_copy';
			oCopyDiv.innerHTML = 'Ex-Sugababe Mutya covers The Kooks\' "Naive".';
			oContentDiv.appendChild(oCopyDiv);
			
			oDiv.appendChild(oContentDiv);
			oContainerElm.appendChild(oDiv);
		
			oDiv			= document.createElement('div');
			oDiv.id			= 'guide_mod_3';
			oDiv.innerHTML		= '<div class="guide_right_border"></div><div class="guide_bottom_border"></div><div class="guide_left_border"></div>';
			
			// Content
			oContentDiv		= document.createElement('div');
			oContentDiv.className	= 'guide_mod_content';
			
			
			
			// HeaderDiv
			oHeaderDiv = document.createElement('div');
			oHeaderDiv.className = 'guide_header_img';
			oDiv.appendChild(oHeaderDiv);
			
			oHeaderDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'167\',\'20061011\');"><img class="guide_header_img_class" src="http://eur.i1.yimg.com/eur.yimg.com/i/uk/mu/w/livea2.gif" width="200" height="9" alt="" /></a>';
				
						
			// LinkDiv
			oLinkDiv = document.createElement('div');
			
			oLinkDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'167\',\'20061011\');" class="guide_link_text_class">Sugababes</a>';
						
			oLinkDiv.className = 'guide_link_text';
				
			oContentDiv.appendChild(oLinkDiv);
						
			// MainImgDiv
			oMainImgDiv	= document.createElement('div');
			oMainImgDiv.className = 'guide_main_img';
			
			oMainImgDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'167\',\'20061011\');"><img class="guide_main_img_class" src="http://us.ent1.yimg.com/images.launch.yahoo.com/000/033/837/33837073.jpg" width="65" height="65" alt="" /></a>';
				
			oContentDiv.appendChild(oMainImgDiv);
			
			
			oCopyDiv = document.createElement('div');
			oCopyDiv.className = 'guide_copy';
			oCopyDiv.innerHTML = 'Get live and up close with the Sugababes in this exclusive performance.';
			oContentDiv.appendChild(oCopyDiv);
			
			oDiv.appendChild(oContentDiv);
			oContainerElm.appendChild(oDiv);
		
			oDiv			= document.createElement('div');
			oDiv.id			= 'guide_mod_4';
			oDiv.innerHTML		= '<div class="guide_right_border"></div><div class="guide_bottom_border"></div><div class="guide_left_border"></div>';
			
			// Content
			oContentDiv		= document.createElement('div');
			oContentDiv.className	= 'guide_mod_content';
			
			
			
			// HeaderDiv
			oHeaderDiv = document.createElement('div');
			oHeaderDiv.className = 'guide_header_img';
			oDiv.appendChild(oHeaderDiv);
			
			oHeaderDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'165\',\'20070108\');"><img class="guide_header_img_class" src="http://eur.i1.yimg.com/eur.yimg.com/i/uk/mu/w/queue2.gif" width="158" height="9" alt="" /></a>';
				
						
			// LinkDiv
			oLinkDiv = document.createElement('div');
			
			oLinkDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'165\',\'20070108\');" class="guide_link_text_class">Fall Out Boy</a>';
						
			oLinkDiv.className = 'guide_link_text';
				
			oContentDiv.appendChild(oLinkDiv);
						
			// MainImgDiv
			oMainImgDiv	= document.createElement('div');
			oMainImgDiv.className = 'guide_main_img';
			
			oMainImgDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'165\',\'20070108\');"><img class="guide_main_img_class" src="http://us.ent1.yimg.com/images.launch.yahoo.com/000/015/470/15470865.jpg" width="65" height="65" alt="" /></a>';
				
			oContentDiv.appendChild(oMainImgDiv);
			
			
			oCopyDiv = document.createElement('div');
			oCopyDiv.className = 'guide_copy';
			oCopyDiv.innerHTML = 'Feisty fans battle it out to meet the band!';
			oContentDiv.appendChild(oCopyDiv);
			
			oDiv.appendChild(oContentDiv);
			oContainerElm.appendChild(oDiv);
		
			oDiv			= document.createElement('div');
			oDiv.id			= 'guide_mod_5';
			oDiv.innerHTML		= '<div class="guide_right_border"></div><div class="guide_bottom_border"></div><div class="guide_left_border"></div>';
			
			// Content
			oContentDiv		= document.createElement('div');
			oContentDiv.className	= 'guide_mod_content';
			
			
			
			// HeaderDiv
			oHeaderDiv = document.createElement('div');
			oHeaderDiv.className = 'guide_header_img';
			oDiv.appendChild(oHeaderDiv);
			
			oHeaderDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'163\',\'20061009\');"><img class="guide_header_img_class" src="http://eur.i1.yimg.com/eur.yimg.com/i/uk/msg/w/rere.gif" width="200" height="9" alt="" /></a>';
				
						
			// LinkDiv
			oLinkDiv = document.createElement('div');
			
			oLinkDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'163\',\'20061009\');" class="guide_link_text_class">MIKA</a>';
						
			oLinkDiv.className = 'guide_link_text';
				
			oContentDiv.appendChild(oLinkDiv);
						
			// MainImgDiv
			oMainImgDiv	= document.createElement('div');
			oMainImgDiv.className = 'guide_main_img';
			
			oMainImgDiv.innerHTML = '<a href="#" onclick="return event_navigate(\'31208241\',\'163\',\'20061009\');"><img class="guide_main_img_class" src="http://us.ent1.yimg.com/images.launch.yahoo.com/000/041/946/41946204.jpg" width="65" height="65" alt="" /></a>';
				
			oContentDiv.appendChild(oMainImgDiv);
			
			
			oCopyDiv = document.createElement('div');
			oCopyDiv.className = 'guide_copy';
			oCopyDiv.innerHTML = 'Check out this exclusive performance from the man of the moment.';
			oContentDiv.appendChild(oCopyDiv);
			
			oDiv.appendChild(oContentDiv);
			oContainerElm.appendChild(oDiv);
		
		
		
		var oButtonElm		= document.getElementById('display_button');
		var aBarElmIds		= ['home_bar', 'segment_bar', 'artist_bar'], oBarElm, nBarEmlIdIdx = 0;
		while (!oBarElm)
		{
			oBarElm			= document.getElementById(aBarElmIds[nBarEmlIdIdx++]);
		}
		
		oContainerElm.style.top		= (oBarElm.offsetTop + oBarElm.offsetHeight) + 'px';
		oContainerElm.style.height	= Guide.containerHeight + 'px';
		oContainerElm.onmouseover	= Guide.mouseoverHandler;
		oContainerElm.onmouseout	= Guide.mouseoutHandler;
		
		// Clean up
		oContainerElm = oDiv = oHeaderDiv = oLinkDiv = oMainImgDiv = oCopyDiv = oDivBorder = oButtonElm = null;
	};
	
	// Opens the guide
	this.open	= function()
	{
		var oButtonElm				= document.getElementById('display_button');
		oButtonElm.firstChild.style.backgroundImage	= 'url("' + Guide.buttonOverImage.src + '")';
		
		var oContainerElm			= Guide.getContainerElm();
		oContainerElm.style.display	= 'block';
		//oContainerElm.style.zIndex	= '999999';
	};
	
	// Closes the guide
	this.close	= function()
	{
		var oContainerElm			= Guide.getContainerElm();
		oContainerElm.style.display	= 'none';
		
		var oButtonElm				= document.getElementById('display_button');
		oButtonElm.firstChild.style.backgroundImage	= 'url("' + Guide.buttonOutImage.src + '")';
	};
	
	// ------------------------------------------------------------------------
	// EVENT HANDLERS
	
	// Handles the mouseover event of the guide button
	this.mouseoverHandler	= function()
	{	
		// Clear the mouseout timeout if it exists
		if (Guide.waitId)
		{
			window.clearTimeout(Guide.waitId);
			Guide.waitId	= null;
		}
		
		var oContainerElm	= Guide.getContainerElm();
		if (!Guide.isOpen)
		{
			Guide.open();
			Guide.isOpen	= true;
		}
	};
	
	// Handles the mouseout event of the guide button
	this.mouseoutHandler	= function()
	{
		if (Guide.isOpen)
		{
			Guide.waitId	= window.setTimeout('Guide.close();Guide.isOpen=false;', 500);
		}
	};
	
	// Handles the window's load event to initialize elements
	this.loadHandler		= function()
	{
		Guide.setHeaderText();
		Guide.buildContent();
	};
	
	// ---------------------------------------------------
	// Initialize
	//window.attachEvent('onload', this.loadHandler);
	var fLoadHanlder	= (window.onload)? window.onload : function(){};
	window.onload		= function()
	{
		fLoadHanlder();
		Guide.loadHandler();
	};
};