// A Modal popup in javascript

function ModalPopup(eleId, Loffset, Toffset)
{
    this.Height = 0;
    this.Width = 0;
    this.Mask = document.createElement('div');
    this.MsgBox = document.getElementById(eleId);
    this.eleId = eleId;
    this.Loffset = (typeof(Loffset) == 'number') ? Loffset : 0;
    this.Toffset = (typeof(Toffset) == 'number') ? Toffset : 0;
    this.YOffset = 0;

    this.GetSize = function getSize() {
        if (typeof (window.innerHeight) == 'number') {
            this.Height = window.innerHeight + (-this.Toffset);
            this.Width = window.innerWidth + (-this.Loffset);
        }
        else if (document.documentElement && document.documentElement.clientWidth) {
            this.Height = document.documentElement.clientHeight + (-this.Toffset);
            this.Width = document.documentElement.clientWidth + (-this.Loffset);
        }
        else if (document.body && document.body.clientWidth) {
            this.Height = document.body.clientHeight + (-this.Toffset);
            this.Width = document.body.clientWidth + (-this.Loffset);
        }
    };

    this.SetMask = function setMask() {
        this.GetSize();
        //setting all attributes using w3c standards.
        this.Mask.style.position = 'absolute';
        this.Mask.style.top = this.Toffset.toString() + 'px';
        this.Mask.style.left = this.Loffset.toString() + 'px';
        this.Mask.style.height = this.Height + 'px';
        this.Mask.style.width = this.Width + 'px';
        this.Mask.style.opacity = '.7';
        this.Mask.style.filter = 'alpha(opacity=70)';
        this.Mask.style.display = 'none';
        this.Mask.style.backgroundColor = '#000000';
        this.Mask.style.zIndex = '99';
        this.Mask.id = 'daMask';
        if (this.MsgBox) {
            this.MsgBox.style.top = (parseInt((parseInt(this.Mask.style.height) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.height) / 2).toString()) + this.Toffset).toString() + 'px';
            this.MsgBox.style.left = (parseInt((parseInt(this.Mask.style.width) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.width) / 2).toString()) + this.Loffset).toString() + 'px';
        }
    };   this.SetMask();

    this.Resize = function resize() {
        this.GetSize();
        this.MsgBox = document.getElementById(this.eleId);
        this.Mask.style.width = this.Width + 'px';
        this.Mask.style.height = this.Height + 'px';
        if (this.MsgBox) {
            this.MsgBox.style.top = (parseInt((parseInt(this.Mask.style.height) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.height) / 2).toString()) + this.Toffset).toString() + 'px';
            this.MsgBox.style.left = (parseInt((parseInt(this.Mask.style.width) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.width) / 2).toString()) + this.Loffset).toString() + 'px';
        }

    };
    
    document.body.appendChild(this.Mask);

    this.Show = function show() {
        this.Mask.style.display = 'block';
        this.HideElements();
        this.MsgBox = document.getElementById(this.eleId);
        if (this.MsgBox) {
            this.MsgBox.style.top = (parseInt((parseInt(this.Mask.style.height) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.height) / 2).toString()) + this.Toffset).toString() + 'px';
            this.MsgBox.style.left = (parseInt((parseInt(this.Mask.style.width) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.width) / 2).toString()) + this.Loffset).toString() + 'px';
            this.MsgBox.style.display = 'block';
        }
        //for IE to display the animated gif, reload it here.
        setTimeout("document.getElementById('ctl00_Image1').src='images/loading.gif';", 100);
        this.KeepPosition();
    };

    this.Hide = function hide() {
        this.Mask.style.display = 'none';
        this.ShowElements();
        this.MsgBox = document.getElementById(this.eleId);
        if (this.MsgBox)
            this.MsgBox.style.display = 'none';
    };

    this.KeepPosition = function keepPosition() {
        if (document.body.scrollLeft) {
            this.Mask.style.top = document.body.scrollTop + this.Toffset + 'px';
            this.Mask.style.left = document.body.scrollLeft + this.Loffset + 'px';
            this.MsgBox.style.top = (parseInt((parseInt(this.Mask.style.height) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.height) / 2).toString()) + this.Toffset + document.body.scrollTop).toString() + 'px';
            this.MsgBox.style.left = (parseInt((parseInt(this.Mask.style.width) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.width) / 2).toString()) + this.Loffset + document.body.scrollLeft).toString() + 'px';
        }
        else if (document.documentElement && document.documentElement.scrollTop) {
            this.Mask.style.top = document.documentElement.scrollTop + this.Toffset + 'px';
            this.Mask.style.left = document.documentElement.scrollLeft + this.Loffset + 'px';
            this.MsgBox.style.top = (parseInt((parseInt(this.Mask.style.height) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.height) / 2).toString()) + this.Toffset + document.documentElement.scrollTop).toString() + 'px';
            this.MsgBox.style.left = (parseInt((parseInt(this.Mask.style.width) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.width) / 2).toString()) + this.Loffset + document.documentElement.scrollLeft).toString() + 'px';
        }
        else if (window.pageYOffset) {
            this.Mask.style.top = window.pageYOffset + this.Toffset + 'px';
            this.Mask.style.left = window.pageXOffset + this.Loffset + 'px';
            this.MsgBox.style.top = (parseInt((parseInt(this.Mask.style.height) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.height) / 2).toString()) + this.Toffset + window.pageYOffset).toString() + 'px';
            this.MsgBox.style.left = (parseInt((parseInt(this.Mask.style.width) / 2).toString()) - parseInt((parseInt(this.MsgBox.style.width) / 2).toString()) + this.Loffset + window.pageXOffset).toString() + 'px';
        }
    };

    this.HideElements = function hideElements() {
        var badElements = document.getElementsByTagName('select');
        for (var q = 0; q < badElements.length; ++q) {
            badElements[q].style.display = 'none';
        }
    };

    this.ShowElements = function showElements() {
        var badElements = document.getElementsByTagName('select');
        for (var q = 0; q < badElements.length; ++q) {
            badElements[q].style.display = 'inline';
        }
    };
    window.onscroll = this.KeepPosition;
    window.onresize = this.Resize;
    return this;
}