JQuery-Dialog开发

;
(function ($, win, undefined) {
    var jqueryDialog = function (config) {
        var setting = jqueryDialog.setting;
        config = $.extend({}, setting, config || {});
        return jqueryDialog.fn._init(config);
    }

    function getOpen(doc) {
        ///<summary>
        /// 获取Open
        ///</summary>
        ///<param name="doc">
        /// doc对象
        ///</param>
        var index = doc(".ui-widget-overlay").length;
        doc(".ui-dialog-titlebar").find("button[title='close']").attr("title", "关闭");
        doc(".ui-widget-overlay").css("opacity", "0");
        doc(".ui-widget-overlay").last().css({
            "z-index": index + 99998,
            "opacity": "0.8"
        });
        doc(".ui-dialog").last().css({ "z-index": index + 99999 });
    }

    function getClose(doc) {
        ///<summary>
        /// 获取Close
        ///</summary>
        ///<param name="doc">
        /// doc对象
        ///</param>
        doc(".ui-widget-overlay").last().css({ "opacity": "0.8" });
    }

    function getContent(text) {
        ///<summary>
        /// 获取Content
        ///</summary>
        ///<param name="text">
        /// 显示文字
        ///</param>
        var html = "<div class=\"dialog\" id=\"dialog-message\"><p style=\"text-align:left;\">" +
            "<span class=\"ui-icon ui-icon-circle-check\" style=\"float: left;margin: 0 7px 0 0;\"></span>" + text + "</p></div>";
        return html;
    }

    function delDialog(doc, dlgId) {
        var length = doc(".ui-widget-overlay").length;
        if (length === 1) {
            doc("html").css("overflow", "auto");
        }
        var dialog = doc("#" + dlgId);
        var frame = doc("#" + dlgId.replace("window", "frame"));
        frame.contents().empty();
        frame.remove();
        dialog.dialog("destroy");
        dialog.parent().remove();
        dialog.remove();
        doc(".ui-widget-overlay").last().css({ "opacity": "0.8" });
    }

    jqueryDialog.fn = jqueryDialog.prototype = {
        constructor: jqueryDialog,

        _init: function (config) {
            ///<summary>
            /// 初始化
            ///</summary>
            ///<param name="config">
            /// 配置项目
            ///</param>
            var that = this;
            that.config = config;
            return that;
        },

        alert: function (fn) {
            ///<summary>
            /// alert对话框
            ///</summary>
            ///<param name="fn">
            /// 回调函数
            ///</param>
            var that = this;
            var config = that.config;
            var $doc = this.getWin();

            var alertConfig = {
                resizable: false,
                modal: true,
                show: config.show,
                hide: config.hide,
                width: config.width,
                height: config.height,
                position: [($(window.top.document).width() - config.width) / 2, ($(window.top.document).scrollTop() === 0 ? 80 : $(window.top.document).scrollTop() - 100)],
                title: config.title,
                buttons: {
                    "确定": function () {
                        var dlg = $doc(this);
                        dlg.dialog("close");
                        dlg.dialog("destroy");
                        fn && fn.call();
                    }
                },
                open: function () {
                    getOpen($doc);
                },
                close: function () {
                    getClose($doc);
                }
            };
            var html = getContent(config.text);
            return $doc(html).dialog(alertConfig);
        },

        timer: function (fn) {
            ///<summary>
            /// 定时alert对话框
            ///</summary>
            ///<param name="fn">
            /// 回调函数
            ///</param>
            var that = this;
            var config = that.config;
            var $doc = this.getWin();
            var timerConfig = {
                resizable: false,
                modal: true,
                show: config.show,
                hide: config.hide,
                width: config.width,
                height: config.height,
                position: [($(window.top.document).width() - config.width) / 2, ($(window.top.document).scrollTop() === 0 ? 80 : $(window.top.document).scrollTop() - 100)],
                title: config.title,
                buttons: {
                    "确定": function () {
                        var dlg = $doc(this);
                        dlg.dialog("close");
                        dlg.dialog("destroy");
                        fn && fn.call(dlg);
                        clearInterval(that.intimer);
                    }
                },
                open: function () {
                    getOpen($doc);
                    var dlg = $doc(this);
                    var btn = dlg.parent().find(".ui-button-text").text("确定(" + config.timer + ")");
                    that.intimer = setInterval(function () {
                        btn.text("确定(" + config.timer + ")");
                        if ((--config.timer) <= 0) {
                            dlg.dialog("close");
                            dlg.dialog("destroy");
                            fn && fn.call(dlg);
                            clearInterval(that.intimer);
                        }
                    }, 1000);
                },
                close: function () {
                    getClose($doc);
                    clearInterval(that.intimer);
                }
            };
            var html = getContent(config.text);
            return $doc(html).dialog(timerConfig);
        },

        confirm: function (fnOk, fnCancel) {
            ///<summary>
            /// 定时confirm对话框
            ///</summary>
            ///<param name="fnOk">
            /// OK回调函数
            ///</param>
            ///<param name="fnCancel">
            /// Cancel回调函数
            ///</param>
            var that = this;
            var config = that.config;
            var $doc = this.getWin();

            var comfirmConfig = {
                resizable: false,
                modal: true,
                show: config.show,
                hide: config.hide,
                width: config.width,
                height: config.height,
                position: [($(window.top.document).width() - config.width) / 2, ($(window.top.document).scrollTop() === 0 ? 80 : $(window.top.document).scrollTop() - 100)],
                title: config.title,
                buttons: {
                    "确定": function () {
                        var dlg = $doc(this);
                        dlg.dialog("close");
                        dlg.dialog("destroy");
                        fnOk && fnOk.call(dlg);
                    },
                    "取消": function () {
                        var dlg = $doc(this);
                        dlg.dialog("close");
                        dlg.dialog("destroy");
                        fnCancel && fnCancel.call(dlg);
                    }
                },
                open: function () {
                    getOpen($doc);
                },
                close: function () {
                    getClose($doc);
                }
            };
            var html = getContent(config.text);
            return $doc(html).dialog(comfirmConfig);
        },

        openDiv: function (id, fnOk, fnCancel) {
            ///<summary>
            /// div以对话框打开
            ///</summary>
            ///<param name="fnOk">
            /// OK回调函数
            ///</param>
            ///<param name="fnCancel">
            /// Cancel回调函数
            ///</param>
            var that = this;
            var config = that.config;
            var $doc = this.getWin();

            var divConfig = {
                resizable: config.resizable,
                modal: config.modal,
                show: config.show,
                hide: config.hide,
                width: config.width,
                height: config.height,
                position: [($(window.top.document).width() - config.width) / 2, ($(window.top.document).scrollTop() === 0 ? 80 : $(window.top.document).scrollTop() - 100)],
                title: config.title,
                buttons: {
                    "确定": function () {
                        var dlg = $doc(this);
                        dlg.dialog("close");
                        dlg.dialog("destroy");
                        fnOk && fnOk.call(dlg);
                    },
                    "取消": function () {
                        var dlg = $doc(this);
                        dlg.dialog("close");
                        dlg.dialog("destroy");
                        fnCancel && fnCancel.call(dlg);
                    }
                },
                open: function () {
                    getOpen($doc);
                },
                close: function () {
                    getClose($doc);
                }
            };
            return $doc(id).dialog(divConfig);
        },

        openWin: function () {
            ///<summary>
            /// 打开窗口对话框
            ///</summary>
            var that = this;
            var config = that.config;
            var $doc = this.getWin();
            var temp = (new Date()).getTime();
            var dlgId = "dialog-window-" + temp;
            var winDialog = window.top.document.getElementById(dlgId);
            if (winDialog != null) {
                winDialog = $doc(winDialog);
            } else {
                winDialog = $doc("<div id='" + dlgId + "'></div>");
            }
            if (config.external) {
                var iframe = "<iframe id=\"dialog-frame-" + temp + "\" src=" + config.url + " frameBorder=\"0\" style=\"border: 0; \" scrolling=\"auto\" width=\"100%\" height=\"100%\"></iframe>";
                var layer = "<div id=\"dialog-layer-" + temp + "\" style=\"width:100%;height:100%;position: absolute;top: 0;left: 0;\">" +
                    "<table border=\"0\" cellpadding=\"0\" cellspacing=\"10\" width=\"100%\" height=\"100%\"><tr><td align=\"center\" style=\"width: 100%; color: black; font-size: 12px;\">" +
                    "<img alt=\"\" src=\"/Images/loading.gif\" width=\"24\" height=\"24\" hspace=\"10\" style=\"vertical-align:middle;\" />&nbsp;页面加载中，请稍候...</td></tr></table></div>";
                winDialog.html(iframe + layer);
            } else {
                throw ("不支持external: false的模式");
            }
            config.open = function () {
                $doc("#dialog-frame-" + temp).load(function () {
                    $doc("#dialog-layer-" + temp).css("display", "none");
                    $doc("#dialog-frame-" + temp).contents().find("body").data("h", dlgId);
                    $doc("#dialog-frame-" + temp).contents().find("body").attr("dialog-frame", dlgId);
                });
                $doc(".ui-widget-overlay").css("opacity", "0");
                $doc(".ui-widget-overlay").last().css({ "z-index": $doc(".ui-widget-overlay").length + 99998, "opacity": "0.8" });
                $doc(".ui-dialog").last().css({ "z-index": $doc(".ui-widget-overlay").length + 99999 });
                $doc("#" + dlgId).siblings(".ui-dialog-titlebar").find("button[title='close']").attr("title", "关闭");
                $doc("#" + dlgId).siblings(".ui-dialog-titlebar").find(".ui-dialog-titlebar-close").unbind().bind("click", function () {
                    var length = $doc(".ui-widget-overlay").length;
                    if (length === 1) {
                        $doc("html").css("overflow", "auto");
                    }
                    var dialog = $doc("#" + dlgId);
                    var frame = $doc("#" + dlgId.replace("window", "frame"));
                    frame.contents().empty();
                    frame.remove();
                    dialog.dialog("destroy");
                    dialog.parent().remove();
                    dialog.remove();
                    $doc(".ui-widget-overlay").last().css({ "opacity": "0.8" });
                });
                var scroll = $doc("html").attr("overflow");
                if (scroll !== "hidden") {
                    $doc("html").css("overflow", "hidden");
                }
            };
            winDialog.dialog(config);
            if (config.param) winDialog.data("param", config.param);
            winDialog.data(dlgId + "callback", config.callback);
            $doc("body").data(dlgId, dlgId);
        },

        closeWin: function (isLoad) {
            ///<summary>
            /// 关闭对话框
            ///</summary>
            ///<param name="isLoad">
            /// 是否初次加载
            ///</param>
            var parentFrame, dlgId, fmId;
            var $doc = this.getWin();

            if (window !== window.top) {
                parentFrame = window.frameElement;
                fmId = parentFrame.id;
                dlgId = parentFrame.id.replace("frame", "window");
            }
            if (isLoad) {
                $doc("#" + fmId).attr("src", "about:blank");
                delDialog($doc, dlgId);
            } else {
                delDialog($doc, dlgId);
            }
            $doc.removeData(this, dlgId);
        },

        closeBackWin: function (obj, isLoad, close) {
            ///<summary>
            /// 后台关闭对话框
            ///</summary>
            ///<param name="obj">
            /// 回传对象
            ///</param>
            ///<param name="isLoad">
            /// 是否初次加载
            ///</param>
            ///<param name="close">
            /// 是否立即关闭
            ///</param>
            var parentFrame, dlgId;
            if (close === undefined) close = true;
            var $doc = this.getWin();

            if (window !== window.top) {
                parentFrame = window.frameElement;
                dlgId = parentFrame.id.replace("frame", "window");
            }
            dlgId = $(window.document.body).attr("dialog-frame") || dlgId;
            var dialog = $doc("#" + dlgId);
            var callBack;
            if (dialog.data(dlgId + "callback") != null) {
                callBack = dialog.data(dlgId + "callback");
            }
            if (close) {
                this.closeWin((isLoad != undefined ? isLoad : false));
            } else {
                $.jqueryDialog.alert({ text: '修改成功！' });
            }
            if (callBack != null) {
                callBack.apply(this, [obj]);
            }
        },

        getWin: function () {
            var $doc = window.top.$;
            return $doc;
        }
    };

    jqueryDialog.fn._init.prototype = jqueryDialog.fn;

    jqueryDialog.setting = {
        title: "提示信息",
        text: "",
        width: "100%",
        height: "100%",
        url: "about:blank",
        modal: true,
        resizable: false,
        external: true,
        draggable: true,
        timer: 3,
        show: {
            effect: "fade",
            duration: 300
        },
        hide: {
            effect: "fade",
            duration: 300
        }
    };

    window.jqueryDialog = $.jqueryDialog = jqueryDialog;
})(jQuery, window, undefined);


/*!
*------------------------------------------------
* 对话框其它功能扩展模块（可选外置模块）
*------------------------------------------------
*/
;
(function ($, jqueryDialog, undefined) {
    var width = 220;
    var height = 150;
    jqueryDialog.alert = function (options, fn) {
        options.width = width;
        options.height = height;
        return new jqueryDialog(options).alert(fn);
    };

    jqueryDialog.timer = function (options, fn) {
        options.width = width;
        options.height = height;
        return new jqueryDialog(options).timer(fn);
    };

    jqueryDialog.confirm = function (options, fnOk, fnCancel) {
        options.width = width;
        options.height = height;
        return new jqueryDialog(options).confirm(fnOk, fnCancel);
    };

    jqueryDialog.openDiv = function (options, fnOk, fnCancel) {
        return new jqueryDialog(options.id, options).openDiv(fnOk, fnCancel);
    };

    jqueryDialog.openWin = function (options) {
        return new jqueryDialog(options).openWin();
    };

    jqueryDialog.closeWin = function (isLoad) {
        return new jqueryDialog().closeWin(isLoad);
    };

    jqueryDialog.closeBackWin = function (obj, isLoad, close) {
        return new jqueryDialog().closeBackWin(obj, isLoad, close);
    };
})(jQuery, jqueryDialog, undefined);