Bootstrap Modal 框 alert confirm loading

/**
 * Created by Administrator on 2016/5/4.
 */
/**
 * 模态窗口
 */
window.Modal = {
    tpls:{
        alert:'<div class="modal fade" tabindex="-1" role="dialog"><div class="modal-dialog modal-sm"  role="document" style="margin-top: 20%;"><div class="modal-content"><div class="modal-header" style="padding: 8px 15px;"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button><h4 class="modal-title">系统提示</h4></div><div class="modal-body"><p class="message-box text-center"></p></div></div></div></div>',
        confirm:'<div class="modal fade"><div class="modal-dialog modal-sm" role="document"  style="margin-top: 20%;"><div class="modal-content"><div class="modal-header"  style="padding: 8px 15px;"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button><h4 class="modal-title">系统提示</h4></div><div class="modal-body"><p class="message-box  text-center"></p></div><div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">取消</button><button type="button" class="btn btn-primary">确定</button></div></div></div></div>',
        loading:'<div class="modal fade"><div class="modal-dialog modal-sm" role="document"  style="margin-top: 20%;"><div class="modal-content" style="box-shadow: none;border: none;background: rgba(0,0,0,0.5); color: #FFFFFF;"><div class="modal-body"><div class="text-center"><i class="fa fa-spinner fa-spin fa-2x"></i></div> <div class="message-box text-center form-control-static">正在载入...</div></div></div></div></div>'
    },
    register:function(events){
        events = events || [];
        if(events.length == 0){
            events = ['alert', 'confirm', 'loading'];
        }
        var body = $(document.body);
        this.modal = {};
        for(var i=0; i<events.length; i++){
            var event = events[i];
            var tpl = this.tpls[event];
            if(tpl){
                this.modal[event] = $(tpl);
                body.append(this.modal[event]);
            }
        }
    },
    alert:function(message, config){
        config = config || {};
        var confirmText = config.confirmText || "确定";
        this.modal.alert.find(".btn-primary").text(confirmText);
        this.modal.alert.find(".message-box").html(message);
        this.modal.alert.modal("show");
    },
    confirm:function(message, config){
        config = config || {};
        var confirmText = config.confirmText || "确定";
        var cancelText = config.cancelText || "取消";
        this.modal.confirm.find(".btn-primary").text(confirmText);
        this.modal.confirm.find(".btn-default").text(cancelText);
        this.modal.confirm.find(".message-box").html(message);
        this.modal.confirm.modal("show");
        var _this = this;
        this.modal.confirm.find(".btn-primary").on("click", function(){
           if(typeof config.confirm == "function"){
               config.confirm();
           }
            _this.modal.confirm.modal("hide");
        });
    },
    loading:function(message){
        this.modal.loading.find(".message-box").html(message);
        this.modal.loading.modal({backdrop:'static'});
    },
    dismissLoading:function(){
        this.modal.loading.find(".message-box").html("");
        this.modal.loading.modal("hide");
    }
};
Modal.register();