function ModalWindow(backgroundId, modalId, errorId, scrollable)
{
    this.backroundId = backgroundId;
    this.modalId = modalId;
    this.errorId = errorId;
    this.onshowmodal = null;
    this.onhidemodal = null;
    this.scrollable = scrollable;    
    
    var dropdownsVisibility;
    var isIE6 = IsIE6();

    var isOpera = navigator.userAgent.indexOf("Opera") > -1;
    var isIE = navigator.userAgent.indexOf("MSIE") > -1 && !isOpera;
    var isGecko = navigator.userAgent.indexOf("Gecko") > -1;
    
    var onresizeHandler;
    var onscrollHandler;
    
    function getScrollTop()
    {
        if(window.scrollY)
        {
            return window.scrollY;
        }
        else
        {
            return document.documentElement.scrollTop + document.body.scrollTop;
        }
    }

    function getScrollLeft()
    {
        if(window.scrollX)
        {
            return window.scrollX;
        }
        else
        {
            return document.documentElement.scrollLeft + document.body.scrollLeft;
        }
    }

    function getPageWidth()
    {
	    return window.innerWidth != null ? window.innerWidth : document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth:document.body != null? document.body.clientWidth:null;
    }

    function getPageHeight()
    {
	    return window.innerHeight != null? window.innerHeight: document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight:document.body != null? document.body.clientHeight:null;
    }
    
    function fixModalWindowSize(background, modal)
    {            
        background.style.height = parseInt(getPageHeight()) - 2 + "px";
        background.style.width = parseInt(getPageWidth()) - 2 + "px";
   
	if(this.scrollable)
	{
	        modal.style.top = parseInt((parseInt(getPageHeight()) - parseInt(modal.offsetHeight)) / 2) +'px';
	        modal.style.left = parseInt((parseInt(getPageWidth()) - parseInt(modal.offsetWidth)) / 2) +'px';
	}
	else
	{
	        modal.style.top = 0 +'px';
	        modal.style.left = parseInt((parseInt(getPageWidth()) - parseInt(modal.offsetWidth)) / 2) +'px';
	}
    }

    function fixModalWindowScroll(background, modal)
    {
        
        background.style.height = parseInt(getPageHeight()) - 2 + "px";
        background.style.width = parseInt(getPageWidth()) - 2 + "px";
	background.style.top = parseInt(getScrollTop()) + "px";    
        background.style.left = parseInt(getScrollLeft()) + "px";
	if(this.scrollable)
	{	
		modal.style.top = parseInt((parseInt(getPageHeight()) - parseInt(modal.offsetHeight)) / 2) + parseInt(getScrollTop()) + "px";
	        modal.style.left = parseInt((parseInt(getPageWidth()) - parseInt(modal.offsetWidth)) / 2) +'px';
	}
	else
	{
		modal.style.top = 0 + "px";
	        modal.style.left = parseInt((parseInt(getPageWidth()) - parseInt(modal.offsetWidth)) / 2) +'px';
	}	
    }
    
    function ClearInputs(modal)
    {
        var inputs = modal.getElementsByTagName("input");
        var i;
        for(i = 0; i < inputs.length; i++)
        {
            if(inputs[i].type == "text" || inputs[i].type == "password" || inputs[i].type == "textarea")
            {
                inputs[i].value = "";
            }
        }
        var textareas = modal.getElementsByTagName("textarea");
        var j;
        for(j = 0; j < textareas.length; j++)
        {
            textareas[j].value = "";
        }
    }
    
    function SetFirstInputFocus(modalId)
    {    
        var modal = document.getElementById(modalId);
        var inputs = modal.getElementsByTagName("input");
        if(inputs.length > 0)
        {
            inputs[0].focus();
        }
    }       
    
    function ShowModalDropDowns(modal)
    {
        var tags = modal.getElementsByTagName('select');
	    var i;
	    for(i = 0; i < tags.length; i++)
	    {
		    tags[i].style.visibility = "visible";
        }
    }
    
    function ShowDropDowns()
    {
        var tags = document.getElementsByTagName('select');
	    var i;
	    for(i = 0; i < tags.length; i++)
	    {	        
		    tags[i].style.visibility = dropdownsVisibility[i];
        }
    }
    
    function HideDropDowns()
    {
        var tags = document.getElementsByTagName('select');
	    var i;
	    dropdownsVisibility = new Array(tags.length);
	    for(i = 0; i < tags.length; i++)
	    {
		    if(tags[i].style.visibility == "hidden")
		    {		    
		        dropdownsVisibility.push("hidden");
		    }
		    else
		    {
		        dropdownsVisibility.push("visible");
		    }
		    tags[i].style.visibility = "hidden";
        }
    }
    
    function IsIE6()
    {
        var re = /(MSIE|Opera|Firefox)(?:\s|\/)(\d+\.\d+)/i;
        var m = re.exec(navigator.userAgent);
        var result = false;
            
        if(m[1] == "MSIE" && parseFloat(m[2]) < 7)
        {
            result = true;
        }
        return result;
    }
    
    this.SetError = function (message)
    {
        var errorMessage = document.getElementById(this.errorId);
        if(errorMessage)
        {
            errorMessage.innerHTML = message;
        }
    }
    
    this.ShowModal = function(clearInputs)
    {
	var background = document.getElementById(this.backroundId);
        var modal = document.getElementById(this.modalId);       
        
        if(!background)
        {
            throw "Background element is not found";
        }
        if(!modal)
        {
            throw "Modal element is not found";
        }
        background.style.display = "block";
        modal.style.display = "block";
                
        fixModalWindowSize(background, modal);
        
        	onscrollHandler = function()
	        {            
	            fixModalWindowScroll(background, modal);
        	};
        onresizeHandler = function()
        {
            fixModalWindowSize(background, modal);
            
        };
        
        if(isIE)
        {
            background.style.position = "absolute";
            modal.style.position = "absolute";                       
            fixModalWindowScroll(background, modal);
	    window.attachEvent("onscroll", onscrollHandler);
            window.attachEvent("onresize", onresizeHandler);
        }        
        else
        {
            background.style.position = "fixed";
            modal.style.position = "fixed";
            
            window.addEventListener("resize", onresizeHandler, true);
        }
        
        this.SetError('');
        
        if(clearInputs)
        {
            ClearInputs(modal);
        }
        
        if(isIE6)
        {
            HideDropDowns();
            ShowModalDropDowns(modal);
        }                              
        
//        setTimeout(function(){SetFirstInputFocus(modalId)}, 50);
        
        if(this.onshowmodal)
        {
            this.onshowmodal();
        }
    }

    this.HideModal = function()
    {
        var background = document.getElementById(this.backroundId);
        var modal = document.getElementById(this.modalId);
        
        background.style.display = "none";
        modal.style.display = "none";

        if(IsIE6)
        {
            ShowDropDowns();
        }
        
        if(isIE)
        {
            if(onscrollHandler)
            {
                window.detachEvent("onscroll", onscrollHandler);
            }
            if(onresizeHandler)
            {
                window.detachEvent("onresize", onresizeHandler);
            }
        }
        else
        {
            if(onresizeHandler)
            {
                window.removeEventListener("resize", onresizeHandler, true);
            }
        }
        
        if(this.onhidemodal)
        {
            this.onhidemodal();
        }
    }
    
    this.HideModalOnEscape = function(oEvent)
    {
        var esc;
        if(isIE || isOpera)
        {
            esc = 27;
        }
        else if(isGecko)
        {
            esc = oEvent.DOM_VK_ESCAPE;
        }
        if(oEvent.keyCode == esc)
        {
            this.HideModal();
        }
    }
}