tsp-component/lib/toast/index.js

提供多端和react版本的UI组件

var prefix = 'tsp-component-Toast';
var componentFlag = 'tsp-component-Toast-flag';
function render(templelte, key, duration, onClose) {
    var noTouch = function (event) {
        event.preventDefault();
    };
    document.body.insertAdjacentHTML('beforeend', templelte);
    document.getElementById(key.toString()).addEventListener('touchmove', noTouch, false);
    setTimeout(function () {
        var el = document.getElementById(key.toString());
        el.removeEventListener('touchmove', noTouch, false);
        el.parentNode.removeChild(el);
    }, duration);
}
var Toast = (function () {
    function Toast() {
    }
    Toast.text = function (content, duration) {
        if (duration === void 0) { duration = 3000; }
        var key = new Date().getTime();
        var templelte = "<div class=\"" + prefix + " " + componentFlag + " " + prefix + "-text\" id=\"" + key + "\">\n      <div class=\"" + prefix + "-text-content\">" + content + "</div>\n    </div>";
        render(templelte, key, duration);
    };
    Toast.success = function (content, duration) {
        if (duration === void 0) { duration = 3000; }
        var key = new Date().getTime();
        var templelte = "<div class=\"" + prefix + " " + componentFlag + "\" id=\"" + key + "\">\n      <img class=\"" + prefix + "-icon\" src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAACDUlEQVR4Xu2Z4VHDMAxGP23ACB2BEboCE0AngA3oBtAJKBt0A44JgE3YQJzu0rse18Sy40RKLP9t2vg9f1ZjhdD4oMb5EQIiAY0biC3QeACiCMYWiC3QuIHYAo0HIP4FVrMFmPkGwDOAWwC/AN6J6JRK+CoEMLNAfwAQCZfjSES7IQmLFzAAf+a+G0rCogUo4EXCgYie+lKwWAFK+HUKyIAXATsiOq4mAZnwn0S0XU0RzIT/AbAlIvlL7B2LqQFTwIuVRQiYCn4RAqaEdy9ganjXAuaAdytgLniXAuaEzxLQHTc3RPSdOmKWfj43vEoAM28AvMlDRQcmDxZ7IjqUgl77ngV8UkC36l8ARML/kTxrawVZwWsEyDHyZQBktARLeI0AOUXdJ1ayWII1vEbAvuuzpdKcLcEDvEaA9NqkBmiGWoIX+KQAuYCZU3XgUk5Sgid4lYBOgqYWnEX0SvAGrxZQQ4JH+CwBYyR4hc8WUCJB2tI9Ly2uFVZVG0tTkbXXFHWEmDmnJmjnMjt8UQLONJUlmMCPElCwHfqSYAY/WkAFCabwVQSMkGAOX01AgQQX8FUFZEhwA19dQCfhFcBjT8VzBT+JgE6CtM8eLjpJ0kY7Db2l1T4s1L6u6EGo9iQsfy8EWNr3cO9IgIdVsJxDJMDSvod7RwI8rILlHCIBlvY93DsS4GEVLOfQfAL+ALOwC1C10enRAAAAAElFTkSuQmCC\" />\n      " + content + "\n    </div>";
        render(templelte, key, duration);
    };
    Toast.fail = function (content, duration) {
        if (duration === void 0) { duration = 3000; }
        var key = new Date().getTime();
        var templelte = "<div class=\"" + prefix + " " + componentFlag + "\" id=\"" + key + "\">\n      <img class=\"" + prefix + "-icon\" src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAACW0lEQVR4Xu3a7U3EMAwGYHsDRmAEGAAEAzDDcRuwAhMgJuBuEhATMAoI/htFaqQKpamd+iPi0p/QNnmfOqEJRTjxA088PwyAUQEnLjCGwIkXwJgExxCQDAEiOgOAc0T8kFzncS4R7RDxKG2LXQFT+NcEAAC3PSEQ0QsA3APAARH3EgQWwCz8xXTzz14QZuFzbhHCKkAhfG4oHKEQPvftGREfOJWwCpBuQkQHANgVbhiGUAn/BQA33CHKAugNQSt8ysUG6AWBiFJpPxWqUfTk8/UigGgEIkozfZrx/x5N4cUVkFuNmBMswjcDeFeCVfhNAF4IluE3A1gjWIdXAbBC8AivBqCN4BVeFUALwTO8OsBWBO/wJgCtCBHhzQCkCFHhTQG4CJHhzQEYCGlR86j5bl+4V/VH4sWQtIEVhNLtmhc2LX1zARAguIZ3GQLzp1JZRabTfgDgiruT0/K0S9e4VcBUBUvr+fTrbwC4/rcAldl+/mDc9xhdKoAZPkO4IpgDrPydfweAu8LYdEMwBeC85ERsr83BzQA44XNHIhFMAFbG/GVppo9CUAdYCb9HxPRfpuIRgaAKsCV81HBQA9AIH4GgAqAZ3hthM4BFeE+ETQCW4b0QmgE8wnsgNAF4hrdGEANEhLdEEAFEhrdCYAP0EN4CgQXQU3htBC7A0ldi1Xd7rX27hrWD7mdyC7u6oeErlXBExLT3yDpYFVBorIvwhX6JwqfrRQBTJaSPEN9YvI4npXmqttRe6ooYwDGTS1MDwIW540ZGBXT8cFy6NirAhbnjRkYFdPxwXLr2C95Q3VDSo5ZBAAAAAElFTkSuQmCC\" />\n      " + content + "\n    </div>";
        render(templelte, key, duration);
    };
    Toast.warning = function (content, duration) {
        if (duration === void 0) { duration = 3000; }
        var key = new Date().getTime();
        var templelte = "<div class=\"" + prefix + " " + componentFlag + "\" id=\"" + key + "\">\n      <img class=\"" + prefix + "-icon\" src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAACGElEQVR4Xu1bwVEDMQzcrQA6ACoAKgAqACqAEqACSAWkBKgAqICkAqCDlAAViNFwl7m5Afteq0wsffOwtV6tpT2HaDzYeP5IAJIBjSOQJRBFADPbBXDYr09yGbEXOQPM7ALAA4D9UcJfAOYkZ0ogpACY2SmAt0qCM5L3KhDUACwAnFSSW5E82FYAbEpiJGUHI1vIEzez5gFwodupsOCbpN8QklAzYIoGLEm6WEoiAZDA3C1iZs0z4AXAeQX0V5LeLElCXQLe4Ny13AglAK0z4KYbhEpVcEtyLhEAQGuJTRyGzkj6bSEJtQhOmQYTgG1mwBGA9wq3j0l+SPiv1oApE6FyFPb9SDUgAZjgCbTAgJInIPUCokqgNBFKvYAEIEgEm2dAyROQegFRJVAaiaUfRRKAIA1ongElT0DqBUSVQGkklo7CCUCQBjTPgJInIPUCQkqgNBKrJ8EEIEIDkgG/pshf84B8DogsAf/4+TwyPi9JOjDSkHuCfXbdc7n+IcQiIvkwBkiPuLJYGAM2BYQQALpnslcAvCny8A8hTyTdMJWGHAAz8yey/nVo/BLMk/dOcKVEIAKA5i0xP+G9f05Z+kw25BaovRZVzwMRJeCCt/6fwIgJnyR7YZRIQQQAbXuC3TD0CMCvwWH4NXgtOfbBInIGDFphvwbXfUBEDxAiguoTrq0XxoDaxlS/JwAqpDd1nWTApp6Mal8/QsLzQWduTWsAAAAASUVORK5CYII=\" />\n      " + content + "\n    </div>";
        render(templelte, key, duration);
    };
    Toast.loading = function (content, duration, onClose) {
        var key = new Date().getTime();
        var templelte = "<div class=\"" + prefix + "-loading " + componentFlag + "\" id=\"" + key + "\">\n      <div class=\"" + prefix + "\">\n        <img class=\"" + prefix + "-icon\" src=\"" + Toast.loadingSrc + "\" />\n        " + (content ? content : '请稍等') + "\n      </div>\n    </div>\n    ";
        render(templelte, key, duration ? duration : 15000);
    };
    Toast.hide = function (selector) {
        var el = document.querySelectorAll("." + (selector ? selector : componentFlag));
        var length = el.length;
        var i;
        for (i = 0; i < length; i++) {
            el[i]['style'].display = 'none';
        }
    };
    return Toast;
}());
export default Toast;