/* -------------------------------------------------------------------------- */
/* ---- Modal Window Effect ------------------------------------------------- */
/* -------------------------------------------------------------------------- */

function Window( contents, width, height, padding ) {
	this.contents = contents;
	this.padding = padding == undefined ? 40 : padding;
	this.width = width + this.padding * 2;
	this.height = height + this.padding * 2;
	this.rootElement = null;
	this.blackoutElement = null;
	this.windowElement = null;
	
	
	this.Show = function() {
		this.rootElement = document.body;
		
		this.blackoutElement = document.createElement( "div" );
		this.blackoutElement.style.position = "fixed";
		this.blackoutElement.style.left = "0px";
		this.blackoutElement.style.top = "0px";
		this.blackoutElement.style.width = "100%";
		this.blackoutElement.style.height = "100%";
		this.blackoutElement.style.backgroundColor = "#000";
		SetTransparency( this.blackoutElement, 0 );
		
		this.windowElement = document.createElement( "div" );
		this.windowElement.style.position = "fixed";
		this.windowElement.style.width = this.width + "px";
		this.windowElement.style.height = this.height + "px";
		this.windowElement.style.padding = this.padding + "px";
		this.windowElement.style.left = "50%";
		this.windowElement.style.top = "50%";
		this.windowElement.style.marginLeft = "-" + ( this.width / 2 ) + "px";
		this.windowElement.style.marginTop = "-" + ( this.height / 2 ) + "px";
		
		this.windowElement.style.backgroundColor = "#fff";
		
		var closeElement = document.createElement( "img" );
		closeElement.src = "/waf/image/cross.png";
		closeElement.style.cssFloat = "right";
		closeElement.style.cursor = "pointer";
		closeElement.style.marginTop = "-" + ( this.padding - 4 ) + "px";
		closeElement.style.marginRight = "-" + ( this.padding - 4 ) + "px";
		closeElement.onclick = GetMethodReference( this, "Hide" );
		
		var contentElement = document.createElement( "div" );
		contentElement.style.width = "100%";
		contentElement.style.height = "100%";
		contentElement.style.overflow = 'auto';
		contentElement.innerHTML = this.contents;
		
		this.windowElement.appendChild( closeElement );
		this.windowElement.appendChild( contentElement );
		
		this.rootElement.appendChild( this.blackoutElement );
		this.rootElement.appendChild( this.windowElement );
		
		var backgroundFader = new FadeElement( this.blackoutElement );
		backgroundFader.FadeTo( 0.15, 0.65 );
		
		var windowFader = new FadeElement( this.windowElement );
		windowFader.FadeTo( 0.25, 1 );
	}
	
	this.Hide = function() {
		this.rootElement.removeChild( this.windowElement );
		this.rootElement.removeChild( this.blackoutElement );
	}
}