dialog.js 8.12 KB
var $=require('jquery');

var toast = function (options, ok, cancel) {
    options = options || {};
    if (typeof options=="string") {
        options = { content: options };
    }
    options = $.extend({}, toast.defaults, options);
    if (!$.isArray(options.button)) {
        options.button = [];
    }
    if (ok !== undefined) {
        options.ok = ok;
    }
    if (options.ok) {
        options.button.push({
            id: 'ok',
            value: options.okValue,
            callback: options.ok,
            css:"btn-primary"
        });
    }
    if (cancel !== undefined) {
        options.cancel = cancel;
    }
    if (options.cancel) {
        options.button.push({
            id: 'cancel',
            value: options.cancelValue,
            callback: options.cancel
        });
    }
    // toast.superclass.constructor.call(this, options);

    return new toast.prototype.init(options);
}
toast.list = {};
toast.prototype.constructor=toast,
toast.prototype.closed = true;
toast.prototype.destroyed = true;
toast.prototype.current = true;
toast.prototype.init = function (options) {
    var __self = this, _o = options;
    __self.options=options;
    __self.closed = false;
    __self.destroyed = false;

    var wrap = $('<div />')
       .css({
           display: 'none'
       })
       .addClass('modal')
       .html(_o.template)
       .appendTo('body');
    __self.dom = __self.dom || __self.__dom(wrap, _o.className);
    //<div class="modal-backdrop fade in"></div>
    __self.dom.backdrop = $('<div />').addClass(_o.className+"backdrop");
    __self.dom.backdrop.insertAfter(__self.dom.wrap);
    __self
        .button(_o.button)
        .title(_o.title)
        .content(_o.content)
    .addclass(_o.addClass)
    .show();
    __self.dom.close[_o.show === false ? 'hide' : 'show']().attr('title', _o.cancelValue)
        .on('click', function (event) {
            __self._trigger('cancel');
            event.preventDefault();
        });
    __self.dom.wrap.on('click', '[data-id]', function (event) {
        var $this = $(this);
        if (!$this.attr('disabled')) {
            __self._trigger($this.data('id'));
        }
        event.preventDefault();
    });
    return __self;
},
toast.prototype.addclass = function (css) {
    var __self = this, _o = __self.options;
    __self.dom.wrap.addClass(css);
    return __self;
},
toast.prototype.content = function (html) {
    var __self = this, _o = __self.options;
    if (!__self.dom.body) {
        return __self;
    }
    __self.dom.body.empty('')[typeof html === 'object' ? 'append' : 'html'](typeof html === 'object' ? html.innerHTML : html);

    return __self;
},
toast.prototype.title = function (text) {
    var __self = this, _o = __self.options;
    if (!__self.dom.title) {
        return __self;
    }
    __self.dom.title.html(text);
    __self.dom.title[text ? 'show' : 'hide']();
    return __self;
},
toast.prototype.button = function () {
    var __self = this, _o = __self.options;
    var html = '', args = _o.button;
    __self.callbacks = {};
    if (!__self.dom.button) {
        return this;
    }
    if (typeof args === 'string') {
        html = args;
    } else {
        $.each(args, function (i, val) {
            val.id = val.id || val.value;
            __self.callbacks[val.id] = val.callback;
            html +=
              '<button'
            + ' type="button"'
            + ' data-id="' + val.id + '"'
            + ' class="' + (_o.className + val.id) + ' btn '+(val.css ? val.css : 'btn-default')+'"'
            + '>'
            + val.value
            + '</button>';
        });
    }
    if ($.trim(html) == "")
        __self.dom.button.hide();
    else
        __self.dom.button.html(html).show();
    return __self;
},
toast.prototype.time = function (second) {
    var __self = this, _o = __self.options;
    var cancel = _o.cancelValue, timer = __self._timer;
    timer && clearTimeout(timer);
    if (second) {
        __self._timer = setTimeout(function () {
            __self._click(cancel);
        }, 1000 * second);
    };
    return __self;
},
toast.prototype.show = function () {
    var __self = this, _o = __self.options;
    if (__self.destroyed) {
        return this;
    }
    __self.dom.wrap.show().addClass("fade in");
    __self.dom.backdrop.show().addClass("fade in");
    __self.open = true;
    return __self;
},
toast.prototype.close = function () {
    var __self = this, _o = __self.options;
    if (!__self.destroyed && __self.open) {
        __self.dom.wrap.removeClass('in');
        setTimeout(function () {
            __self.dom.wrap.hide();
            __self.dom.backdrop.hide();
            __self.remove();
            __self.open = false;
        }, 200);
    }
    return this;
},
toast.prototype.remove = function () {
    var __self = this, _o = __self.options;
    if (__self.destroyed) {
        return g;
    }
    if (__self.current === this)
        __self.current = null;
    __self.dom.wrap.remove();
    __self.dom.backdrop.remove();
    for (var i in __self) {
        delete this[i];
    }
    return this;
},
toast.prototype._trigger = function (id) {
    var __self = this, _o = __self.options;
    var fn = __self.callbacks[id];
    return typeof fn !== 'function' || fn.call(__self) !== false ?
        __self.close() : __self;
},
toast.prototype._click = function (name) {
    var __self = this, _o = __self.options;
    var fn = __self.callbacks[name];
    return typeof fn !== 'function' || fn.call(__self, window) !== false ?
        __self.close() : __self;
},
toast.prototype.__dom= function ($select, classCss) {
    var wrap = $select;
    var name, DOM = {
        wrap: $(wrap)
    },
        els = wrap[0].getElementsByTagName("*"),
        elsLen = els.length;
    for (var i = 0; i < elsLen; i++) {
        name = els[i].className;
        if (name.indexOf(classCss) > -1) {
            name = name.split(classCss)[1];
        }
        if (name) {
            DOM[name] = $(els[i], wrap)
        }
    }
    return DOM
},

toast._through = function () {
    var __self = this, _o = __self.options;
    var api = new toast(arguments[0]);
    return api;
}
toast.alert = function (content, callback) {
    var __self = this, _o = __self.options;
    return __self._through({
        title: '提示',
        addClass: 'alert',
        icon: 'alert',
        width: 440,
        lock: true,
        content: content,
        ok: callback || true
    });
}
toast.confirm = function (title,content, yes, no) {
    var __self = this, _o = __self.options;
    return __self._through({
        title: title||'确认',
        icon: 'confirm',
        addClass: 'confirm',
        lock: true,
        show: false,
        content: content,
        ok: function (here) {
            return yes.call(this, here);
        },
        cancel: function (here) {
            return no && no.call(this, here);
        }
    });
};
toast.tip = function (content, time) {
    var __self = this, _o = __self.options;
    return __self._through({
        icon: 'tip',
        addClass: 'tip',
        content: content,
        show: false,
        time: time || 2
    });
}

toast.close = function () {
    // var __self = this, _o = __self.options;
    // var _api = __self.top().me.get(window.frameElement.name);
    // _api.close();
}
toast.defaults = {
    init: null,
    zIndex: 1024,
    lock: true,
    content: 'Loading...',
    title: '',
    show: true,
    button: null,
    ok: null,
    cancel: null,
    okValue: '确定',
    cancelValue: '取消',
    addClass:'fade in',
    className: 'modal-',
    template:'<div class="modal-dialog">' 
                +'<div class="modal-content">'
                    +'<div class="modal-header">'
                        +'<button type="button" class="close" ><span aria-hidden="true">&times;</span></button>'
                        +'<h4 class="modal-title"></h4>'
                    +'</div>'
                    +'<div class="modal-body">'
                    +'</div>'
                    +'<div class="modal-footer">'
                        +'<div class="modal-button">'
                        +'</div>'
                    +'</div>'
                +'</div>'
            +'</div>'
}
toast.prototype.init.prototype=toast.prototype;
module.exports=toast;