//MessageBox
function MessageBox(ConfirmControlID, PopupControlID, OkControlID, CancelControlID,ReturnMessageControlID, ValidationGroup) {
    //Init
    this.ConfirmControlID = ConfirmControlID;
    this.PopupControlID = PopupControlID;
    this.OkControlID = OkControlID;
    this.CancelControlID = CancelControlID;
    this.ShadowWidth = 10;
    this.ShadowOpacity = 50;
    this.ReturnConfirmValue = "";
    this.ShowOnTop = false;
    this.IsRecaptcha = false;
    this.RecaptchaID;
    this.ValidationFunction;
    this.ReturnMessageControlID = ReturnMessageControlID;
    this.ValidationGroup = ValidationGroup;
    var CurrentMessageBox = this;
    //Set Action on Button and Panel
    this.ButtonConfirm = GetElement(this.ConfirmControlID);
    if (this.ButtonConfirm)
        this.ButtonConfirm.onclick = function() {
    if (Page_ClientValidate(CurrentMessageBox.ValidationGroup)) {
                //this.disabled = "disabled";
                return CurrentMessageBox.Show();
            } 
        }
    this.ButtonOk = GetElement(this.OkControlID);
    this.ButtonOk.onclick = function() { return CurrentMessageBox.SetReturnConfirmValue('Ok'); }
    this.ButtonCancel = GetElement(this.CancelControlID);
    this.ButtonCancel.onclick = function() { return CurrentMessageBox.SetReturnConfirmValue("No"); }
    //Setting Popup Panel 
    this.PanelPopup = GetElement(this.PopupControlID);
    this.PanelPopup.style.zIndex = 1000;
    var browser = getBrowserHeight();
    var pWidth = getStyle(this.PanelPopup, "width");
    var pHeight = getStyle(this.PanelPopup, "height");
    this.Left = (browser.width - pWidth) / 2;
    this.Top = (browser.height - pHeight) / 2;
    //Setting Shadow Panel
    this.PanelShadow = GetElement(this.PopupControlID + "Shadow")
    if (this.PanelShadow == null) {
        this.PanelShadow = document.createElement("div");
        this.PanelShadow.setAttribute("id", this.PopupControlID + "Shadow");
        this.PanelShadow.setAttribute("style", "display:none;background:black;position:absolute;z-index:0;width:" + pWidth + "px;height:" + pHeight + "px");
        document.body.appendChild(this.PanelShadow);
    }
   // var ReturnMessage = GetElement(this.ReturnMessageControlID);
    //ReturnMessage.setAttribute("style", "display: none; position: absolute;  background-color: #fbfbfb; border: solid 5px #7F9DB9; width: 300px;padding: 5px; z-index: 10000;left" + this.Left + "px;top:" + this.Top + "px");
 //   ReturnMessage.style.left = this.Left + "px";
   // ReturnMessage.style.top = this.Top + "px";
}
MessageBox.prototype.PopupPanel = function(ShadowWidth, ShadowOpacity) {
    this.ShadowWidth = ShadowWidth;
    this.ShadowOpacity = ShadowOpacity;
}
MessageBox.prototype.PopupPanel = function(ShowOnTop, ShadowWidth, ShadowOpacity, Left, Top) {
    if (ShowOnTop != null) this.ShowOnTop = ShowOnTop;
    if (ShadowWidth != null) this.ShadowWidth = ShadowWidth;
    if (ShadowOpacity != null) this.ShadowOpacity = ShadowOpacity;
    if (Left != null) this.Left = Left;
    if (Top != null) this.Top = Top;
}
MessageBox.prototype.RecaptchaSetting = function(RecaptchaID, ValidationFunction, ErrorMessage) {
    this.IsRecaptcha = true;
    this.RecaptchaID = RecaptchaID;
    this.ValidationFunction = ValidationFunction;
    this.ErrorMessage = ErrorMessage;
}
MessageBox.prototype.Show = function() {
   
    Recaptcha.Reload(this.RecaptchaID);
    this.PanelPopup.style.display = 'block';
    this.PanelPopup.style.position = 'absolute';
    this.PanelPopup.style.left = this.Left + "px";
    this.PanelPopup.style.top = this.Top + "px";
    this.PanelShadow.style.display = 'block';
    this.PanelShadow.style.left = this.Left + this.ShadowWidth + "px"; ;
    this.PanelShadow.style.top = this.Top + this.ShadowWidth + "px"; ;
    this.PanelShadow.style.filter = "alpha(opacity=" + this.ShadowOpacity + ")";
    this.PanelShadow.style.opacity = this.ShadowOpacity / 100;
    this.PanelShadow.style.MozOpacity = this.ShadowOpacity / 100;
    if (this.ReturnConfirmValue == "Ok") {

        this.ReturnConfirmValue = "";
        if (!this.ShowOnTop) this.Hide();
        return true;
    }
    else return false;
}

MessageBox.prototype.Hide = function() {
   
    this.PanelPopup.style.display = 'none';
    this.PanelShadow.style.display = 'none';
  
    //this.ButtonConfirm.removeAttribute("disabled");
}

MessageBox.prototype.SetReturnConfirmValue = function(action) {

    this.ReturnConfirmValue = action;
    if (action == "Ok" && this.IsRecaptcha) {
        try { this.CheckRecaptchValidate(); } catch (e) { this.ButtonConfirm.click(); }
    }
    else
        if (action == "Ok")
        this.ButtonConfirm.click();
    else
        this.Hide();
    return false;
}
//For Recaptcha -------------------------------------------------------------------
MessageBox.prototype.CheckRecaptchValidate = function() {
    var obj = this;
    var a = Recaptcha.GetHashValue(this.RecaptchaID);
    eval("" + this.ValidationFunction + "(obj.RecaptchaID,a," + function(result) { obj.OnSucceeded(result, obj); } + "," + this.OnFailed + ")");
    //  PageMethods.ValidateReCaptcha(a, this.OnSucceeded, this.OnFailed);
}
MessageBox.prototype.OnSucceeded = function(result, obj) {
    if (result) { obj.ButtonConfirm.click(); }
    else { obj.ReturnConfirmValue = ""; alert(obj.ErrorMessage); Recaptcha.Reload(obj.RecaptchaID); }

}
MessageBox.prototype.OnFailed = function(error) {
    alert(error);
}
//----------------------------------------------------------------------------------------------------------
//Get  Element by Server ID
function GetElement(Id) {
    var count = document.forms[0].length;
    var i = 0;
    var eleName, element;
    for (i = 0; i < count; i++) {
        element = document.forms[0].elements[i];
        eleName = document.forms[0].elements[i].id;
        if (eleName.indexOf(Id) != -1) {
            pos = eleName.lastIndexOf(Id) + Id.length;
            if (pos == eleName.length) return element;
        }
    }
    return document.getElementById(Id);
}
//----------------------------------------------------------------------------------------------------------
//Get Browser Width and Height
function getBrowserHeight() {
    var intH = 0;
    var intW = 0;

    if (typeof window.innerWidth == 'number') {
        intH = window.innerHeight;
        intW = window.innerWidth;
    }
    else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
        intH = document.documentElement.clientHeight;
        intW = document.documentElement.clientWidth;
    }
    else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
        intH = document.body.clientHeight;
        intW = document.body.clientWidth;
    }
    return { width: parseInt(intW), height: parseInt(intH) };
}

//----------------------------------------------------------------------------------------------------------
//Get Style of Element
function getStyle(oElm, strCssRule) {
    var strValue = "";
    if (document.defaultView && document.defaultView.getComputedStyle) {
        strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
    }
    else if (oElm.currentStyle) {
        strCssRule = strCssRule.replace(/\-(\w)/g, function(strMatch, p1) {
            return p1.toUpperCase();
        });
        strValue = oElm.currentStyle[strCssRule];
    }
    return strValue.split("px")[0]; ;
}