/**
	created by : Angelo Bryan A Perito
	description : turn a div into a modalWindow.
	Note : Div height and width should be explicitly specified.
**/
function ModalDialog(modalWindowId,zIndex){
	var body = document.getElementsByTagName("body")[0];
	var html = document.getElementsByTagName('html')[0];
	var modalBackground = document.createElement("div");
	//var modalBackgroundFrame = document.createElement("iframe");
	var modalWindow = document.getElementById(modalWindowId);
	var owner;
	modalWindow.parentNode.removeChild(modalWindow);
	modalWindow.className="modalWindow";
	modalBackground.className="modalBackground";
	//modalBackgroundFrame.className ="modalBackgroundFrame";
	//modalBackgroundFrame.zIndex=zIndex;
	modalBackground.zIndex=zIndex+1;
	modalWindow.zIndex=zIndex+2;
	body.appendChild(modalWindow);
	body.appendChild(modalBackground);
	//body.appendChild(modalBackgroundFrame);
	this.show =  function(ownerWin){
	html.style.overflow="hidden";
		if(ownerWin!=null){
			owner = ownerWin;
		}
		else{
			owner = body;
		}
        modalBackground.style.display='block';
		//modalBackgroundFrame.style.display='block';
		modalWindow.style.display='block';
		if (window.XMLHttpRequest == null)
		{
			showSelects('hidden');
		}
		OnWindowResize();
		if(window.attachEvent){
			window.attachEvent('onresize', OnWindowResize);
		}
		else if(window.addEventListener){
			window.addEventListener('resize', OnWindowResize, false);
		}
	};
	this.hide = function(){
		html.style.overflow="auto";	
		modalWindow.style.display="none";
		//modalBackgroundFrame.style.display="none";
		modalBackground.style.display="none";
		if (window.XMLHttpRequest == null)
		{
				showSelects('visible');
		}
		if(window.detachEvent){
			window.detachEvent('onresize', OnWindowResize);
		}
		else if(window.removeEventListener){
			window.removeEventListener('resize', OnWindowResize, false);
		}
	};
	this.refresh = function(){
		OnWindowResize();
	}
	function OnWindowResize(){
			var left = window.XMLHttpRequest == null ? document.documentElement.scrollLeft : 0;
			var top = window.XMLHttpRequest == null ? document.documentElement.scrollTop : 0;
			
			var docWidth =
				document.documentElement && document.documentElement.clientWidth ||
				document.body && document.body.clientWidth ||
				document.body && document.body.parentNode && document.body.parentNode.clientWidth ||
				0;
			var docHeight =
				document.documentElement && document.documentElement.clientHeight ||
				document.body && document.body.clientHeight ||
				document.body && document.body.parentNode && document.body.parentNode.clientHeight ||
				0;	
				
			modalWindow.style.left = Math.max((left + (docWidth - modalWindow.offsetWidth) / 2), 0) + 'px';
			modalWindow.style.top = Math.max((top + (docHeight - modalWindow.offsetHeight) / 2), 0) + 'px';
	}

	function showSelects(visibility){
		var selects = document.getElementsByTagName("select");
		var modalSelects = modalWindow.getElementsByTagName("select");
		//hide document modal's object
        for(i=0;i<selects.length;i++){
        	selects[i].style.visibility = visibility;
        }
        //modal's select object
        for(i=0;i<modalSelects.length;i++){
        	modalSelects[i].style.visibility = visibility =="visible" ? "hidden" : "visible";
        }
	
	}
	return this;
}