var help_overlay = help_overlay ? help_overlay : {};
(function() { // my private "namespace"
var background = null;
// var instructions = "n"; // n = new user, r = returning user



function open() {
  var a = this;
  var href = a.href; // + "?instructions=" + instructions;
    
    // show background (opaque)
  if (background === null) {
	background = document.createElement("div");
	background.className = "help_overlayBackground";
	document.body.appendChild(background);
  } else {
	background.style.display = "block";
  }
    
  // show overlay div    
  var div = document.createElement("div");
  div.className = "help_overlayBox";
	
  div.closehelp_overlay = function() {
	background.style.display = "none";
	div.parentNode.removeChild(div);
	div = null;
	return false;
  };
	
  div.innerHTML =
	"<div class='help_overlayHeader'><a href='#close' onclick='return this.parentNode.parentNode.closehelp_overlay();'  class='closeButton'><img alt='Close' src='/system/gocloseBtn.png' /></a></div>" +
	"<iframe frameBorder='0' src='" + href + "'></iframe><div class='help_overlayFooter'></div>";
	
  div.style.left = "-10000px";
  document.body.appendChild(div);

  var x = (background.clientWidth - div.clientWidth) / 2;
  var y = (background.clientHeight - div.clientHeight) / 2;

  div.style.left = (x > 10 ? Math.round(x) : 10) + "px";
  div.style.top = (y > 10 ? Math.round(y) : 10) + "px";

  background.onclick = div.closehelp_overlay;

  return false; // don't follow link
};

help_overlay.open = open;


})(); // my "namespace" ends and is executed