// Popup.js

var bPlaying = true;
var currentPane = -1;

$(document).ready (function () {	
	/* Set up the blackout */
	 var viewportwidth;
	 var viewportheight;
	 
	 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
	 
	 if (typeof window.innerWidth != 'undefined')
	 {
		  viewportwidth = window.innerWidth,
		  viewportheight = window.innerHeight
	 }
	 
	// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
	
	 else if (typeof document.documentElement != 'undefined'
		 && typeof document.documentElement.clientWidth !=
		 'undefined' && document.documentElement.clientWidth != 0)
	 {
		   viewportwidth = document.documentElement.clientWidth,
		   viewportheight = document.documentElement.clientHeight
	 }
	 
	 // older versions of IE
	 
	 else
	 {
		   viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
		   viewportheight = document.getElementsByTagName('body')[0].clientHeight
	 }

	 $('.blackout').css ('width', viewportwidth + 'px')
	 	.css ('height', viewportheight + 'px');
		
	
	
	var popupwidth = 512;
	var popupheight = 260;
	$('.popup').css ('left', (viewportwidth / 2) - (popupwidth / 2) + "px")
		.css ('top', (viewportheight / 2) - (popupheight / 2) + "px");
		
	// Set up the popup contents
	var nItems = $('.popup-items li').length;
	
	for (var i = 1; i <= nItems; i++) {
		$('.popup-controls').html (
			$('.popup-controls').html () + '<li><a href="#">' + i + '</a></li>');
	}
	
	// Show the popup on the promotions clicks
	var promos = $('.promotions li');
	var i = 0;
	promos.each (function () {
		// Bubble the variable through the loop
		var ii = i;

		// Add the cursor css
		$(this).css ('cursor', 'pointer');
		
		$(this).click (function () {
			// Record the change in pane showing
			currentPane = ii;
			
			// First make sure all the other items are hidden
			$('.popup-items li').each (function () { $(this).css ('display', 'none'); });
			// Then show the correct item
			$('.popup-items li').eq (ii).css ('display', 'block');
			// Make the right number show hilighted
			$('.popup-controls li').each (function () { $(this).removeClass ('current'); });
			$('.popup-controls li').eq (ii).addClass ('current');
			
			$('.popup').css ('display', 'block'); 
			$('.popup .blackout').animate ({ opacity: '1' }, 1000);
			
			return false;
		});

		i++;
	});
	
	// Similar stuff for internal popup page controls
	i = 0;
	$('.popup-controls a').each (function () {
		// Bubble the variable through the loop
		var ii = i;
		
		$(this).click (function () {
			// Record the change in pane showing
			currentPane = ii;
			
			// Test if the controls need to be updated
			testControls ();
			
			// Pause the promotions ticker
			bPlaying = false;
			
			// First make sure all the other items are hidden
			$('.popup-items li').each (function () { $(this).css ('display', 'none'); });
			// Then show the correct item
			$('.popup-items li').eq (ii).css ('display', 'block');
			// Make the right number show hilighted
			$('.popup-controls li').each (function () { $(this).removeClass ('current'); });
			$('.popup-controls li').eq (ii).addClass ('current');
		});
		
		i++;
	});
	
	// Next\Previous paging controls
	$('.next').click (function () {
		$('.popup-controls a').eq (currentPane + 1).click ();
	});
	$('.previous').click (function () {
		$('.popup-controls a').eq (currentPane - 1).click ();
		
		if (currentPane != ($('.popup-controls a').length - 1))
			$('.next').css ('display', 'block');
		if (currentPane == 0)
			$('.previous').css ('display', 'none');
	});
	
	// Hide the popup when you click the blackout
	$('.blackout').add ($('.popup-close')).click (function () {
		$('.popup').css ('display', 'none');
		$('.blackout').css ('opacity', '0');
	});
});

function testControls ()
{
	if (currentPane == ($('.popup-controls a').length - 1))
		$('.next').css ('display', 'none');
	else
		$('.next').css ('display', 'block');
		
	if (currentPane != 0)
		$('.previous').css ('display', 'block');	
	else
		$('.previous').css ('display', 'none');
}