function createOverlay() {
	if ($('dialog_overlay')) {
		overlay = $('dialog_overlay');
	} else {
		xoverlay = document.createElement('div');
		xoverlay.id = 'dialog_overlay';
		Object.extend(this.xoverlay.style, {
			position: 'fixed',
			top: 0,
			left: 0,
			zIndex: 90,
			width: '100%',
			backgroundColor: '#000',
			display: 'none'
		});
	}
	document.body.insertBefore(xoverlay, document.body.childNodes[0]);
}

function toggleDialog(id) {
	if (!$('dialog_overlay')) createOverlay();
	var viewport_height = document.viewport.getHeight();
	if (viewport_height == 0) veiwport_height = document.body.clientHeight;
	$('dialog_overlay').style.height = viewport_height+'px';
			
	if ($(id).visible()) {
		Effect.Fade('dialog_overlay', { duration: 0.5, from: 0.5, to: 0.0 });
		Effect.Fade(id, { duration: 0.5});
	} else {
		var left = (document.viewport.getWidth()/2)-($(id).getWidth()/2);
		if(left > 0) {
			$(id).setStyle({
				left: left+'px'
			});
		}
		var top = viewport_height/2-$(id).getHeight()/2;
		$(id).setStyle({
			top: top+'px'
		});
		
		Effect.Appear(id, { duration: 0.5});
		Effect.Appear('dialog_overlay', { duration: 0.5, from: 0.0, to: 0.5 });
	}
}