$(document).ready(function() {

	// --------------------------------------------------------------
	// Provides methods for showing the 3 different types of reskins
	// --------------------------------------------------------------

	// initialize flag that will be set to true if reskin is running
	
	reskinSetBackgroundImgAndColor = function(bgImageUrl,bgColor) {
		$("body").css("background-image","url("+bgImageUrl+")");
		$("body").css("background-color",bgColor);
	}

	reskinSetBackgroundLinks = function(bgClickthroughUrl, bgClickableHeight) {

		// gets width of content, will likely not change
		var contentWidth = $("#wrapper").width();

		// inserts links in the gutters
		$("body").prepend('<a href="'+bgClickthroughUrl+'" class="gutLinks clearLink" id="gutLinkLft">&nbsp;<\/a><a href="'+bgClickthroughUrl+'" class="gutLinks clearLink" id="gutLinkRit">&nbsp;<\/a>');

		// checks browser width and calculates width of gutter links
		resizeGutterLinks =  function(contentWidth) {
			var browserWidth =  $(window).width();
			var gutterWidth = (browserWidth - contentWidth) / 2;
			$(".gutLinks").width(gutterWidth);
			$(".gutLinks").css("padding-top",bgClickableHeight);
		}

		// if user resizes window call the function again
		$(window).resize(function(){
			resizeGutterLinks(contentWidth);
		});
		
		// start checking content width
		resizeGutterLinks(contentWidth);
	}

	reskinBackground_ready = function( bgImageUrl, bgColor  ) {
		reskinSetBackgroundImgAndColor( bgImageUrl, bgColor );
		var reskinIsActive = true;
	}

	reskinBackgroundClickable_ready = function( bgImageUrl, bgColor, bgClickthroughUrl, bgClickableHeight ) {
		reskinSetBackgroundImgAndColor(bgImageUrl, bgColor);
		reskinSetBackgroundLinks(bgClickthroughUrl, bgClickableHeight);
		var reskinIsActive = true;
	}

	reskinBackgroundSelectable_ready = function(bgImageUrls, bgColors, selectableImageMapUrl, clickthroughUrl) {
		// get the number of skins
		var numOfSkins = bgImageUrls.length;
		//sets the wrapping reskin div that contains a class to style the template, based on the numOfSkins
		$("#inBodyAd .adWrap").append("<div id='reskinContent' class='reskinContent-"+numOfSkins+"'>")
		$("#reskinContent").append("<a href='"+clickthroughUrl+"' id='reskinSponsorLink' target='_blank' class='clearLink'>&nbsp;</a>");
		$("#reskinContent").append("<ul>");
		for(i=0; i<numOfSkins; i++) { 
			// have to draw the onclick here, can't attach dynamically because -- suprise -- IE sucks
			$("#reskinContent ul").append("<li><a onclick='reskinBackground_ready( \""+bgImageUrls[i]+"\",\""+bgColors[i]+"\" ); return false;' href='#' id='selectableSkinLink-"+i+"' class='clearLink'>select skin "+i+"</a></li>");
   		}
		$("#reskinContent ul li a").css("background-image","url("+selectableImageMapUrl+")");
		$("#reskinContent").append("</ul>");
		$("#inBodyAd #adWrap").append("</div>")

		//call the default (first) skin
		reskinBackground_ready(bgImageUrls[0],bgColors[0]);
		var reskinIsActive = true;
	}
	

	// ------------------------------------
	// Show an upgrade message to IE 6 users
	// ------------------------------------

	// if the user has not previously closed the upgrade message and a reskin is not active and reskinIsActive is not true and the browser is IE6 or less, show it
	if ( ( $.cookie("swHideIE6Upgrade") != "true") && ( typeof reskinIsActive == "undefined" ) && (typeof document.body.style.maxHeight === "undefined") && $(".brand-mamabar").length ) {
		$("body").css({backgroundPosition: "center 80px"});
		$(".brand-mamabar").after("<div id='ie6Upgrade'><div><h3>You are using an outdated browser<\/h3><p>For a better experience using this site please upgrade to a modern web browser. It's quick, it's easy, and it's safe!<\/div><\/div>")
		$("#ie6Upgrade div").append("<ul><li><a href='http://firefox.com/' target='_new' onclick='sendLinkEvent( \"ie6-upgrade-to-firefox\" );' class='clearLink b-ff'><\/a><\/li><li><a href='http://www.microsoft.com/windows/internet-explorer/default.aspx' target='_new' onclick='sendLinkEvent( \"ie6-upgrade-to-ie8\" );' class='clearLink b-ie'><\/a><\/li><li><a href='http://www.apple.com/safari/' target='_new' onclick='sendLinkEvent( \"ie6-upgrade-to-safari\" );' class='clearLink b-sf'><\/a><\/li><\/ul>")
		$("#ie6Upgrade div").append("<a href='#' onclick='sendLinkEvent( \"ie6-upgrade-dismissed\" );' class='icon16Lft icon16Close clearLink'><\/a>")
	}

	//close the ie6upgrade bar
	$("#ie6Upgrade .icon16Close").live("click", function(){
		$("#ie6Upgrade").hide();
		$("body").css({backgroundPosition: "center 18px"});
		//user has clicked the close button, don't show again for 30 days
		var cookieOptions = { path: '/', domain: '.shockwave.com', expires: 30 };
		$.cookie("swHideIE6Upgrade", "true", cookieOptions);
		return false;
	})		

});

// because we have to wait for the document to be fully rendered
// these helper functions delay the firing until functions above are available

reskinBackground = function( bgImageUrl, bgColor ) {
	function initRB() {
		reskinBackground_ready( bgImageUrl, bgColor ); 
	}
	window.onload = initRB; 	
}
reskinBackgroundClickable = function( bgImageUrl, bgColor, bgClickthroughUrl, bgClickableHeight ) {
	function initRBC() {
		reskinBackgroundClickable_ready( bgImageUrl, bgColor, bgClickthroughUrl, bgClickableHeight ); 
	}
	window.onload = initRBC; 	
}
reskinBackgroundSelectable = function( bgImageUrls, bgColors, selectableImageMapUrl, clickthroughUrl ) {
	function initRBS() {
		reskinBackgroundSelectable_ready( bgImageUrls, bgColors, selectableImageMapUrl, clickthroughUrl ); 
	}
	window.onload = initRBS; 	
}