//Translate from checkbox id to value in form
var homeOverlayCheckboxes = {
	option_1_checkbox:"debt_relief",
	option_2_checkbox:"credit_card",
	option_3_checkbox:"refi_rt",
	option_4_checkbox:"purch",
	option_5_checkbox:"tax_relief",
	option_6_checkbox:"other_credit"
};

function setOverlayCheckbox(checkbox) {
	
	//Grab form from page
	var form = $('homeOverlayForm');
	var elements = form.elements;
	
	//Loop through form elements looking for the one that was clicked
	for(var i = 0, len = elements.length; i < len; ++i) {
		
		//If form element is the one that was clicked
		if(homeOverlayCheckboxes[checkbox.id] == elements[i].value) {
			
			//Set element checked state and shift background position of checkbox to show/hide check mark
			if(!elements[i].checked) {
				checkbox.style.backgroundPosition = '0px 0px';
				elements[i].checked = true;
			} else {
				checkbox.style.backgroundPosition = '38px 0px';
				elements[i].checked = false;
			}
		}
	}
}

function submitOverlay() {
	var form = $('homeOverlayForm');
	var elements = form.elements;

	var str = '';
	for (var index = 0, len = elements.length; index < len; ++index) {
		if(elements[index].checked)
			str = str + elements[index].value;
	}
	//alert(str);
	form.submit();
	hideHomeOverlay();
}

function showHomeOverlay() {
	var pageDimensions = getPageDimensions();
	var scrollOffsets = document.viewport.getScrollOffsets();
	var overlay = $('homeOverlay');
	if(overlay) {
		//Center overlay
		overlay.style.left = Math.round(pageDimensions.width / 2 - 720 / 2)+'px';
		overlay.style.top = Math.round(scrollOffsets.top + 100)+'px';
		grayOut(true);
		overlay.style.display = 'block';
		$('headerForm').style.display = 'none';
	}
}
function hideHomeOverlay() {
	
	var overlay = $('homeOverlay');
	if(overlay) {
		grayOut(false);
		overlay.style.display = 'none';
		$('headerForm').style.display = 'block';
	}
}

function grayOut(vis, options) {
  // Pass true to gray out screen, false to ungray
  // options are optional.  This is a JSON object with the following (optional) properties
  // opacity:0-100         // Lower number = less grayout higher = more of a blackout 
  // zindex: #             // HTML elements with a higher zindex appear on top of the gray out
  // bgcolor: (#xxxxxx)    // Standard RGB Hex color code
  // grayOut(true, {'zindex':'50', 'bgcolor':'#0000FF', 'opacity':'70'});
  // Because options is JSON opacity/zindex/bgcolor are all optional and can appear
  // in any order.  Pass only the properties you need to set.
  var options = options || {}; 
  var zindex = options.zindex || 50;
  var opacity = options.opacity || 70;
  var opaque = (opacity / 100);
  var bgcolor = options.bgcolor || '#000000';
  var dark=document.getElementById('darkenScreenObject');
  if (!dark) {
    // The dark layer doesn't exist, it's never been created.  So we'll
    // create it here and apply some basic styles.
    // If you are getting errors in IE see: http://support.microsoft.com/default.aspx/kb/927917
    var tbody = document.getElementsByTagName("body")[0];
    var tnode = document.createElement('div');           // Create the layer.
        tnode.style.position='absolute';                 // Position absolutely
        tnode.style.top='0px';                           // In the top
        tnode.style.left='0px';                          // Left corner of the page
        tnode.style.overflow='hidden';                   // Try to avoid making scroll bars            
        tnode.style.display='none';                      // Start out Hidden
        tnode.id='darkenScreenObject';                   // Name it so we can find it later
    tbody.appendChild(tnode);                            // Add it to the web page
    dark=document.getElementById('darkenScreenObject');  // Get the object.
  }
  if (vis) {
		
		//Why are page dimensions so god damn hard to calculate?
		var pageDimensions = getPageDimensions();
		
		//set the shader to cover the entire page and make it visible.
    dark.style.opacity=opaque;
    dark.style.MozOpacity=opaque;
    dark.style.filter='alpha(opacity='+opacity+')';
    dark.style.zIndex=zindex;
    dark.style.backgroundColor=bgcolor;
    dark.style.width= pageDimensions.width+'px';
    dark.style.height= pageDimensions.height+'px';
    dark.style.display='block';
  } else {
     dark.style.display='none';
  }
}

function getPageDimensions() {
	if( window.innerHeight && window.scrollMaxY ) { // Firefox
		pageWidth = window.innerWidth + window.scrollMaxX;
		pageHeight = window.innerHeight + window.scrollMaxY;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    pageWidth = document.documentElement.clientWidth;
    pageHeight = document.documentElement.clientHeight;
		pageHeight = 1595;//HACK
	} else if( document.body.scrollHeight > document.body.offsetHeight ) { // all but Explorer Mac
		pageWidth = document.body.scrollWidth;
		pageHeight = document.body.scrollHeight;
	} else { // works in Explorer 6 Strict, Mozilla (not FF) and Safari
		pageWidth = document.body.offsetWidth + document.body.offsetLeft;
		pageHeight = document.body.offsetHeight + document.body.offsetTop;
	}
	return { width:pageWidth, height:pageHeight };
}