document.write('<div id="darkenScreenObject" style="position: absolute; top: 0px; left: 0px; overflow: hidden; display: none;">&nbsp;</div>');
document.write('<div id="dch" style="z-index: 25; display: none; position: absolute; top: 0; left: 0; border: 1px solid #000; padding-top: 10px; padding-bottom: 7px; padding-left: 40px; padding-right: 45px; background: #fff;">&nbsp;</div>');

function grayOut(vis, options) {
  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 (vis) {
	  if (window.innerWidth || window.innerHeight) {
		  var screenWidth = window.innerWidth;
		  var screenHeight = window.innerHeight;
    } else if (document.body.clientWidth || document.body.clientHeight) {
		  var screenWidth = document.body.clientWidth;
		  var screenHeight = document.body.clientHeight;
		}
		
		if( document.body && ( document.body.scrollWidth || document.body.scrollHeight ) ) {
      var pageWidth = document.body.scrollWidth;
      var pageHeight = document.body.scrollHeight;
			var mtype = "px";
    } else if( document.body.offsetWidth ) {
      var pageWidth = document.body.offsetWidth;
      var pageHeight = document.body.offsetHeight;
			var mtype = "px";
    } else {
       var pageWidth='100';
       var pageHeight='100';
			 var mtype = "%";
    }
		
		if (!screenWidth) {
		  var screenWidth = pageWidth;
			var screenHeight = pageHeight;
	  }
		var lpt = (screenWidth - holder.offsetWidth)/2;
		var tpt = (screenHeight - holder.offsetHeight)/2;
		
		if (document.body.scrollTop) {
		  tpt += document.body.scrollTop;
		}
		
		holder.style.left = lpt;
		holder.style.top = tpt;
		
    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= pageWidth+mtype;
    dark.style.height= pageHeight+mtype;
    dark.style.display='block';                          
  } else {
     dark.style.display='none';
  }
}

var holder = document.getElementById("dch");

function showDialog(html) {
  holder.innerHTML = html;
	holder.style.display = "block";
	grayOut(true, {"opacity":"50", "zindex":"10"});
}

function hideDialog() {
	holder.style.display = "none";
  grayOut(false, {});
}