DialogBox = {

    // global variables //
    Timer: 5,
    Speed: 40,
    okFunction: null,
    cancelFunction: null,
    closeFunction: null,
    defaultHeight: 200,
    defaultWidth: 307,

    /// <summary>
    /// Calculate the current window width
    /// </summary> 
    pageWidth: function () {
        try {
            return window.innerWidth != null ? window.innerWidth : document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body != null ? document.body.clientWidth : null;
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.pageWidth]\n\n' + ex.message);
        }
    },

    /// <summary>
    /// Calculate the current window height 
    /// </summary> 
    pageHeight: function () {
        try {
            return window.innerHeight != null ? window.innerHeight : document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body != null ? document.body.clientHeight : null;
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.pageHeight]\n\n' + ex.message);
        }
    },

    // calculate the current window vertical offset //
    topPosition: function () {
        try {
            return typeof window.pageYOffset != 'undefined' ? window.pageYOffset : document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ? document.body.scrollTop : 0;
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.topPosition]\n\n' + ex.message);
        }
    },

    // calculate the position starting at the left of the window //
    leftPosition: function () {
        try {
            return typeof window.pageXOffset != 'undefined' ? window.pageXOffset : document.documentElement && document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ? document.body.scrollLeft : 0;
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.leftPosition]\n\n' + ex.message);
        }
    },

    /// <summary>
    /// Show the dialog box with the parameters associated with the indicated id.
    /// </summary> 
    /// <param name="id">
    /// The id of the dialog box parameters to use when displaying the dialog box.
    /// </param>   
    show: function (id) {
        try {
            DialogBox.showDialog(DialogBox[id].type, DialogBox[id].title, DialogBox[id].message, DialogBox[id].button1Text, DialogBox[id].button2Text, DialogBox[id].button1OnClick, DialogBox[id].button2OnClick, DialogBox[id].buttonCloseOnClick, DialogBox[id].autoHide, DialogBox[id].height, DialogBox[id].width);
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.show]\n\n' + ex.message);
        }
    },

    /// <summary>
    /// Show the dialog box with the parameters associated with the indicated id 
    /// while providing the ability to pass a message.
    /// </summary> 
    /// <param name="id">
    /// The id of the dialog box parameters to use when displaying the dialog box.
    /// </param> 
    /// </summary> 
    /// <param name="message">
    /// The message to display in the DialogBox.
    /// </param>   
    showWithMessage: function (id, message) {
        try {
            DialogBox.showDialog(DialogBox[id].type, DialogBox[id].title, message, DialogBox[id].button1Text, DialogBox[id].button2Text, DialogBox[id].button1OnClick, DialogBox[id].button2OnClick, DialogBox[id].buttonCloseOnClick, DialogBox[id].autoHide, DialogBox[id].height, DialogBox[id].width);
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.show]\n\n' + ex.message);
        }
    },

    // build/show the dialog box, populate the data and call the fadeDialog function //
    showDialog: function (type, title, message, button1Text, button2Text, button1Function, button2Function, closeButtonFunction, autoHide, dialogHeight, dialogWidth) {
        try {
            //Replace crlf and lf with <br/>
            message = message.replace(/\r\n/g, '<br/>');
            message = message.replace(/\r|\n/g, '<br/>');

            var isButton1TextSet = false;
            var isButton1FunctionSet = false;
            var isButton2TextSet = false;
            var isButton2FunctionSet = false;
            var isCloseButtonFunctionSet = false;

            if (button1Function != null && button1Function != undefined && button1Function != "")
                isButton1FunctionSet = true;

            if (button1Text != null && button1Text != undefined && button1Text != "")
                isButton1TextSet = true;

            if (button2Function != null && button2Function != undefined && button2Function != "")
                isButton2FunctionSet = true;

            if (button2Text != null && button2Text != undefined && button2Text != "")
                isButton2TextSet = true;

            if (closeButtonFunction != null && closeButtonFunction != undefined && closeButtonFunction != "")
                isCloseButtonFunctionSet = true;

            if (!type)
                type = 'error';

            //These are global variables that are not used in this function.
            //These will be used by the hideDialogOk, hideDialogCancel and hideDialogClose functions.
            DialogBox.okFunction = button1Function;
            DialogBox.cancelFunction = button2Function;
            DialogBox.closeFunction = closeButtonFunction;

            var dialog;
            var content;
            var dialogtext;
            var okbutton;
            var cancelbutton;
            var icon;

            if (!$('dialog')) {
                dialog = document.createElement('div');
                dialog.id = 'dialog';
                var topLeft = document.createElement('div');
                topLeft.className = 'DialogTopLeft';
                var topCenter = document.createElement('div');
                topCenter.className = 'DialogTopCenter';
                var topRight = document.createElement('div');
                topRight.className = 'DialogTopRight';
                var bottomHalf = document.createElement('div');
                content = document.createElement('div');
                content.id = 'dialog-content';
                content.className = 'DialogContent';
                var bottomLeft = document.createElement('div');
                bottomLeft.className = 'DialogBottomLeft';
                var bottomCenter = document.createElement('div');
                bottomCenter.className = 'DialogBottomCenter';
                var bottomRight = document.createElement('div');
                bottomRight.className = 'DialogBottomRight';

                document.body.appendChild(dialog);
                dialog.appendChild(topLeft);
                topLeft.appendChild(topRight);
                topRight.appendChild(topCenter);
                dialog.appendChild(bottomHalf);
                bottomHalf.appendChild(content);
                bottomHalf.appendChild(bottomLeft);
                bottomLeft.appendChild(bottomRight);
                bottomRight.appendChild(bottomCenter);

                var icon = document.createElement('div');
                icon.id = 'dialog-icon';
                content.appendChild(icon);

                dialogtext = document.createElement('div');
                dialogtext.id = 'dialog-text';
                dialogtext.innerHTML = message;
                content.appendChild(dialogtext);

                var dialogbuttons = document.createElement('div');
                dialogbuttons.id = 'dialog-buttons';

                okbutton = document.createElement('input');
                okbutton.id = 'ok-button';
                okbutton.type = 'button';
                okbutton.value = button1Text;
                dialogbuttons.appendChild(okbutton);

                if (isButton1TextSet) {
                    if (isButton1FunctionSet)
                        okbutton.onclick = DialogBox.hideDialogOk;
                    else {
                        if (isCloseButtonFunctionSet)
                            okbutton.onclick = DialogBox.hideDialogClose;
                        else
                            okbutton.onclick = DialogBox.hideDialog;
                    }
                }
                else
                    okbutton.style.display = 'none';
                //okbutton.style.visibility = 'hidden';

                //We must place an extra div here with clear:both to force the dialog buttons to start below the floating icon and text.
                var clearBoth = document.createElement('div');
                clearBoth.style.clear = 'both';
                content.appendChild(clearBoth);

                content.appendChild(dialogbuttons);

                cancelbutton = document.createElement('input');
                cancelbutton.id = 'cancel-button';
                cancelbutton.type = 'button';
                cancelbutton.value = button2Text;
                spaceMaker = document.createElement('input');
                spaceMaker.id = 'space-maker';
                spaceMaker.type = 'text';

                spaceMaker.style.visibility = 'hidden';

                spaceMaker.style.width = '2px';
                dialogbuttons.appendChild(spaceMaker); //Put some space between the buttons.
                dialogbuttons.appendChild(cancelbutton);

                if (isButton2TextSet) {
                    if (isButton2FunctionSet)
                        cancelbutton.onclick = DialogBox.hideDialogCancel;
                    else {
                        if (isCloseButtonFunctionSet)
                            cancelbutton.onclick = DialogBox.hideDialogClose;
                        else
                            cancelbutton.onclick = DialogBox.hideDialog;
                    }
                }
                else {
                    cancelbutton.style.display = 'none';
                    spaceMaker.style.display = 'none';
                    //cancelbutton.style.visibility = 'hidden';
                }

                //Create modal dialog background.
                DialogBox.createModalBackground();
            }
            else {
                dialog = $('dialog');
                content = $('dialog-content');
                dialogBackground = $('dialogModalBackground');
                dialogBackground.style.display = "";

                var icon = $('dialog-icon');

                ///For IE, we sometimes have to manually resize the background initially.
                if (document.all)
                    DialogBox.resizeModalBackground();

                dialog.style.display = "";
                dialogtext = $('dialog-text');
                okbutton = $('ok-button');
                cancelbutton = $('cancel-button');
                dialogtext.innerHTML = message;

                if (isButton1TextSet) {
                    okbutton.value = button1Text;

                    if (isButton1FunctionSet)
                        okbutton.onclick = DialogBox.hideDialogOk;
                    else {
                        if (isCloseButtonFunctionSet)
                            okbutton.onclick = DialogBox.hideDialogClose;
                        else
                            okbutton.onclick = DialogBox.hideDialog;
                    }
                    okbutton.style.display = '';
                    //okbutton.style.visibility = 'visible';
                }
                else
                    okbutton.style.display = 'none';
                //okbutton.style.visibility = 'hidden';

                if (isButton2TextSet) {
                    cancelbutton.value = button2Text;

                    if (isButton2FunctionSet)
                        cancelbutton.onclick = DialogBox.hideDialogCancel;
                    else {
                        if (isCloseButtonFunctionSet)
                            cancelbutton.onclick = DialogBox.hideDialogClose;
                        else
                            cancelbutton.onclick = DialogBox.hideDialog;
                    }
                    cancelbutton.style.display = '';
                    //cancelbutton.style.visibility = 'visible';
                }
                else
                    cancelbutton.style.display = 'none';
                //cancelbutton.style.visibility = 'hidden';
            }

            //Set the icon based on the type of the message.
            if (type == 'error' || type == 'warning')
                icon.className = 'DialogErrorIcon';
            else if (type == 'prompt')
                icon.className = 'DialogPromptIcon';

            // Start:  This code is responsible for setting the height and width of the DialogBox /////////////////
            if (dialogWidth > DialogBox.defaultWidth)
                dialog.style.width = dialogWidth + 'px';
            else
                dialog.style.width = DialogBox.defaultWidth + 'px';

            //We're no longer allowing the height to be specified. The height will size to fit the content. Only the width may be set.

            //            if (dialogHeight > DialogBox.defaultHeight)
            //            {
            //                dialog.style.height = dialogHeight + 'px';

            //                if (dialogHeight > 39)
            //                    content.style.height = (dialogHeight - 39) + 'px';
            //            }
            //            else
            //            {
            //                dialog.style.height = DialogBox.defaultHeight + 'px';

            //                if (DialogBox.defaultHeight > 38)
            //                    content.style.height = (DialogBox.defaultHeight - 38) + 'px';
            //            }
            // End:  This code is responsible for setting the height and width of the DialogBox ///////////////////

            dialog.style.opacity = .00;
            dialog.style.filter = 'alpha(opacity=0)';
            dialog.alpha = 0;
            dialog.className = 'Float'; //This is needed to properly size page parts in Firefox.
            var width = DialogBox.pageWidth();
            var height = DialogBox.pageHeight();
            var left = DialogBox.leftPosition();
            var top = DialogBox.topPosition();
            var dialogwidth = dialog.offsetWidth;
            var dialogheight = dialog.offsetHeight;
            var topposition = top + (height / 3) - (dialogheight / 3);
            var leftposition = left + (width / 2) - (dialogwidth / 2);

            if (topposition < 35) topposition = 35;
            if (leftposition < 0) leftposition = 0;

            dialog.style.top = topposition + "px";
            dialog.style.left = leftposition + "px";
            dialog.timer = setInterval("DialogBox.fadeDialog(1)", DialogBox.Timer);

            if (autoHide)
                window.setTimeout("DialogBox.hideDialog()", (autoHide * 1000));

            //$('dialog-text').setStyle({ height: (parseInt($('dialog-content').getStyle('height')) - 40) + 'px' });
            $('dialog-text').setStyle({ width: (parseInt($('dialog-content').getStyle('width')) - 100) + 'px' });

            //Make the dialog box draggable.
            //new Draggable(dialog, { handle: dialogheader.className, scroll: window, starteffect: '', endeffect: '' });
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.showDialog]\n\n' + ex.message);
        }
    },

    createModalBackground: function () {
        try {
            var background = new Element('div', { 'id': 'dialogModalBackground' });

            if (Tools.browserIsIe8())
                background.addClassName('DialogModalBackgroundIE8'); //IE8
            else if (document.all)
                background.addClassName('DialogModalBackgroundIE'); //IE
            else
                background.addClassName('DialogModalBackground');

            document.body.appendChild(background);

            ///For IE, we sometimes have to manually resize the background initially, and always 
            //need to resize it when the window resizes.  Stupid IE...
            if (document.all) {
                DialogBox.resizeModalBackground();
                window.onresize = function () { DialogBox.resizeModalBackground(); };
            }

            //Add a post request call to take down the background if the dialog it is associated with is not visible in case an async postback took the 
            //modal dialog down.
            try {
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(DialogBox.closeModalBackground);
            }
            catch (ex) {
                //Ignore any error generated in case there wasn't a request manager on the page, etc.
            }
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.createModalBackground]\n\n' + ex.message);
        }
    },

    // hide the dialog box and execute 'Ok' button functionality //
    hideDialogOk: function () {
        try {
            DialogBox.okFunction();
            DialogBox.hideDialog();
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.hideDialogOk]\n\n' + ex.message);
        }
    },

    // hide the dialog box and execute 'Cancel' button functionality //
    hideDialogCancel: function () {
        try {
            DialogBox.cancelFunction();
            DialogBox.hideDialog();
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.hideDialogCancel]\n\n' + ex.message);
        }
    },

    // hide the dialog box and execute 'Close' ('X') button functionality //
    hideDialogClose: function () {
        try {
            DialogBox.closeFunction();
            DialogBox.hideDialog();
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.hideDialogClose]\n\n' + ex.message);
        }
    },

    // hide the dialog box //
    hideDialog: function () {
        try {
            var dialog = $('dialog');
            if (dialog != null) {
                clearInterval(dialog.timer);
                dialog.timer = setInterval("DialogBox.fadeDialog(0)", DialogBox.Timer);
            }
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.hideDialog]\n\n' + ex.message);
        }
    },

    // fade-in the dialog box //
    fadeDialog: function (flag) {
        try {
            if (flag == null)
                flag = 1;

            var dialog = $('dialog');
            var value;

            if (flag == 1)
                value = dialog.alpha + DialogBox.Speed;
            else
                value = dialog.alpha - DialogBox.Speed;

            dialog.alpha = value;
            dialog.style.opacity = (value / 100);
            dialog.style.filter = 'alpha(opacity=' + value + ')';

            if (value >= 99) {
                clearInterval(dialog.timer);
                dialog.timer = null;
            }
            else if (value <= 1) {
                dialog.style.display = "none";
                $('dialogModalBackground').style.display = "none";
                clearInterval(dialog.timer);
            }
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.fadeDialog]\n\n' + ex.message);
        }
    },

    /// <summary>
    /// Resize the modal background. This occurs when the window resizes.
    /// <summary>
    resizeModalBackground: function () {
        var background = $('dialogModalBackground');
        if (background != null) {
            if (Tools.browserIsIe8) {
                background.style.width = document.body.scrollWidth + 'px';
                background.style.height = document.body.scrollHeight + 'px';
            }
            else {
                background.style.width = document.documentElement.scrollLeft + 'px';
                background.style.height = document.documentElement.scrollTop + 'px';
            }
        }
    },

    /// <summary>
    /// Hide the modal background if the dialog is not visible.
    /// </summary>
    closeModalBackground: function () {
        try {
            var background = $('dialogModalBackground');
            if (background != null && background.visible()) {
                var dialog = $('dialog');
                if (dialog != null && !dialog.visible())
                    background.hide();
            }
        }
        catch (ex) {
            alert("Error occurred: [Panel.closeModalBackground]\n\n" + ex.message);
        }
    },

    /// <summary>
    /// This will associate the indicated id with the indicated dialog box parameters so that the id can then be used to display a dialog box with these parameters.
    /// </summary> 
    /// <param name="id">
    /// The id to assign to these parameters.
    /// </param>   
    /// <param name="type">
    /// The type of the dialog box. Valid values are error, warning, success, or prompt.
    /// </param>   
    /// <param name="title">
    /// The title to appear in the header of the dialog box.
    /// </param>   
    /// <param name="message">
    /// The message to display in the dialog box.
    /// </param>   
    /// <param name="button1Text">
    /// The text to appear on the left button of the dialog box.
    /// </param>   
    /// <param name="button2Text">
    /// The text to appear on the right button of the dialog box.
    /// </param>   
    /// <param name="button1OnClick">
    /// The javascript to execute when the left button of the dialog box is clicked. Additionally, the dialog box will close.
    /// </param>   
    /// <param name="button2OnClick">
    /// The javascript to execute when the right button of the dialog box is clicked. Additionally, the dialog box will close.
    /// </param> 
    /// <param name="buttonCloseOnClick">
    /// The javascript to execute when the 'X' button in the dialog box is clicked. Additionally, the dialog box will close.
    /// </param>  
    /// <param name="autoHide">
    /// This will be true if the dialog box should automatically hide after a few seconds.
    /// </param> 
    register: function (id, type, title, message, button1Text, button2Text, button1OnClick, button2OnClick, buttonCloseOnClick, autoHide, height, width) {
        try {
            //This will allow us to access these parameters like so: DialogBox[id].type, DialogBox[id].title, etc.
            var parameters = new Object;
            parameters.type = type.toLowerCase();
            parameters.title = title;
            parameters.message = message;
            parameters.button1Text = button1Text;
            parameters.button2Text = button2Text;
            parameters.button1OnClick = button1OnClick;
            parameters.button2OnClick = button2OnClick;
            parameters.buttonCloseOnClick = buttonCloseOnClick;
            parameters.autoHide = autoHide;
            parameters.height = height;
            parameters.width = width;

            DialogBox[id] = parameters;
        }
        catch (ex) {
            alert('Error occurred: [DialogBox.register]\n\n' + ex.message);
        }
    }
}