var moveContent = true; // avoid issues with IDs

function showOverlay(content_id, content_width, content_height) {
	if ($('.overlay_container').length == 0) {
		createOverlay();
		createContent(content_id, content_width, content_height);

		$('.overlay_container').fadeIn(400, function() {
      if (typeof(sIFR) != "undefined") {
        sIFR.rollback();
       }
    });
		setOverlayDimensions();
	}
}

function closeOverlay(content_id) {
	$('.overlay_container').fadeOut(400, function () {
    if (typeof(sIFR) != "undefined") {
      sifr_activate();    
    }
    if (moveContent) {
      var container = document.getElementById('content_container');
      var code = innerXHTML(container);
      $('#'+content_id).append(code);
    }
		$(this).remove();	
	});
}

function createOverlay () {
	$('body').append('<div class="overlay_container"></div>');
	$('.overlay_container').append('<div class="overlay"></div>');
	  $(window).resize(function () {
		setOverlayDimensions();
	});
}

function createContent (content_id, content_width, content_height) {
	$('.overlay_container').append('<div class="content"></div>');
	
	$('.overlay_container .content').append('<a href="javascript:closeOverlay(\''+content_id+'\')" class="btn_overlay_close"><img src="/shared/gfx/overlay/btn_close.png" /></a>');

  // hack voor IE (wat anders?)
  var container = document.getElementById(content_id);
  var code = innerXHTML(container);
  if (moveContent) {
    $('#'+content_id).empty();
  }

  $('.overlay_container .content').append('<div id="content_container">' + code + '</div>');

//	$('.overlay_container .content').append('<div id="content_container">' + $('#'+content_id).html() + '</div>');

  $(".overlay_container .content #content_container").css("height",content_height+"px");
  $(".overlay_container .content #content_container").css("width",content_width+"px");
  $(".overlay_container .content #content_container").attr("height",content_height);
  $(".overlay_container .content #content_container").attr("width",content_width);

}  

function setOverlayDimensions() {
	var viewportHeight = $(".overlay_container .overlay").height();
	var viewportWidth = $(".overlay_container .overlay").width();
	var contentPlayerHeight = $(".overlay_container .content #content_container").attr("height");
	var contentPlayerWidth = $(".overlay_container .content #content_container").attr("width");

	if(contentPlayerWidth == undefined) contentPlayerWidth = $(".overlay_container .content #content_container object").attr("width");
	
	$(".overlay_container .content a.btn_overlay_close").css("top",((viewportHeight)/2-((contentPlayerHeight)/2)-10)+"px");
	$(".overlay_container .content a.btn_overlay_close").css("left",((viewportWidth/2)+(contentPlayerWidth/2)-10)+"px");
	
	if ($(".overlay_container .content #content_container").length > 0) {
		$(".overlay_container .content #content_container").css("margin-top",((viewportHeight)/2-(contentPlayerHeight)/2)+"px");
	}
}