function Dialog()
{
	this.shade;				// shade div (object reference)
	this.dialog_box;			// dialog box (object reference)
	this.dialog_width = 0;	// initialize dialog width
	this.dialog_height = 0;	// initialize dialog height
	this.op_high = 60;		// highest opacity level
	this.op_low = 0;			// lowest opacity level (should be the same as initial opacity in the CSS)
	this.fade_speed = 18;	// set default speed - 18ms 
	this.function_call;		// name of function to call after clicking on button 
	
	this.init();
}

Dialog.prototype.init = function()
{
	// create dialog box
	this.dialog_box = document.createElement('div');
	this.dialog_box.setAttribute('id', 'dialog');
	// create shade div
	this.shade = document.createElement('div');
	this.shade.setAttribute('id', 'shade');
	// append dialog box and shade to the page body
	var body = document.getElementsByTagName('body')[0];
	body.appendChild(this.shade);
	body.appendChild(this.dialog_box);
	// define onscroll & onresize event handler for FF, Chrome		
	if (window.addEventListener) {
		window.addEventListener('scroll', this.position, false);
		window.addEventListener('resize', this.position, false);
	}
	// IE
	else if (window.attachEvent) {
		window.attachEvent('onscroll', this.position);
		window.attachEvent('onresize', this.position);
	}
	// other (hopefully this will not be needed)
	else {
		window.onscroll = this.position;
		window.onresize = this.position;
	}
}

Dialog.prototype.show = function(width, height, text)
{
	this.dialog_width  = width;
	this.dialog_height = height;
	this.position();

	this.dialog_box.innerHTML = '<table width="' + width + '" border="0" cellspacing="0" cellpadding="0">' +
							 '<tr>' +
							 '  <td height="' + (height-30) + '">' +
							 '    <div style="height:100%; width:100%; overflow: auto;">' + text + '</div>' +
							 '  </td>' +
							 '</tr>' +
							 '<tr>' +
							 '  <td height="30">' +
							 '    <INPUT type="button" onclick="dialog.hide();" value="Close">' +
							 '  </td>' +
							 '</tr>' +
							 '</table>';
	
	// show shade and dialog box
	this.shade.style.display = this.dialog_box.style.display = 'block';
	// hide dropdown menus, iframes & flash
	this.visibility('hidden');
	// show shaded div slowly
	this.fade(this.op_low, 10);
}

Dialog.prototype.hide = function(fnc)
{
	// set function call
	this.function_call = (fnc || 'undefined');
	// start fade out
	this.fade(this.op_high, -20);
	// hide dialog box
	this.dialog_box.style.display = 'none';
	// show dropdown menu, iframe & flash
	this.visibility('visible');
}

Dialog.prototype.position = function()
{
	// define local variables
	var window_width, window_height, scrollX, scrollY;
	// Non-IE (Netscape compliant)
	if (typeof(window.innerWidth) === 'number') {
		window_width  = window.innerWidth;
		window_height = window.innerHeight;
		scrollX = window.pageXOffset;
		scrollY = window.pageYOffset;
	}
	// IE 6 standards compliant mode
	else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
		window_width  = document.documentElement.clientWidth;
		window_height = document.documentElement.clientHeight;
		scrollX = document.documentElement.scrollLeft;
		scrollY = document.documentElement.scrollTop;
		// IE hack because #shade{width:100%;height:100%;} will not work for IE if body{height:100%} isn't set also ?!
		dialog.shade.style.width   = window_width  + 'px';
		dialog.shade.style.height  = window_height + 'px';
	}
	// DOM compliant
	else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
		window_width  = document.body.clientWidth;
		window_height = document.body.clientHeight;
		scrollX = document.body.scrollLeft;
		scrollY = document.body.scrollTop;
	}
	// place dialog box to the center
	dialog.dialog_box.style.left = (scrollX + ((window_width  - dialog.dialog_width)  / 2)) + 'px';
	dialog.dialog_box.style.top  = (scrollY + ((window_height - dialog.dialog_height) / 2)) + 'px';
	// set shade offset
	dialog.shade.style.top  = scrollY + 'px';
	dialog.shade.style.left = scrollX + 'px';
}

Dialog.prototype.visibility = function(p)
{
	var obj = [],	// define tag array
		x, y;		// variables used in local loops
	obj[0] = document.getElementsByTagName('select');
	obj[1] = document.getElementsByTagName('iframe');
	obj[2] = document.getElementsByTagName('object');
	// loop through fetched elements
	for (x = 0; x < obj.length; x++) {
		for (y = 0; y < obj[x].length; y++) {
			obj[x][y].style.visibility = p;
		}
	}
}

Dialog.prototype.fade = function(opacity, step)
{
	// set opacity for FF and IE
	this.shade.style.opacity = opacity / 100;
	this.shade.style.filter  = 'alpha(opacity=' + opacity + ')';
	// update opacity level
	opacity += step;
	// recursive call if opacity is between 'low' and 'high' values
	if (this.op_low <= opacity && opacity <= this.op_high) {
		var d = this;
		setTimeout(
			function () {
				d.fade(opacity, step);
			}, this.fade_speed); // fade speed is public parameter
	}
	// hide shade div when fade out ends and make function call 
	else if (this.op_low > opacity) {
		this.shade.style.display = 'none';
		if (this.function_call !== 'undefined') {
			// call function after button is clicked because functions are defined in global scope
			window[this.function_call]();
		}
	}
}