Object.defineProperty(Object.prototype, "Error", { value: null, enumerable: false, }); const NotifyBuild = (function () { // локальная область видимости (приватные поля и методы) /** * Задержка в миллисекундах перед удалением элемента (сообщения) при клике (должен совпадать с классом removing, в котором происходит анимация исчезновения (transition opacity)) */ const HARDREMOVE_TIME = 100; /** * Задержка в миллисекундах перед удалением элемента (сообщения) при автоматическом исчезновении (должен совпадать с классом removing-long, в котором происходит анимация исчезновения (transition opacity)) */ const AUTOREMOVE_TIME = 2000; const REMOVING_SHORT = "short"; const REMOVING_LONG = "long"; /** * Счётчик ID для создаваемых сообщений */ let MESSAGE_COUNTER = -1; /** * Удаляет сообщение (или другой элемент, к которому было привязано данное событие) * @param {Number} time время, через которое сообщение будет удалено из DOM (в миллисекундах) */ const removeMessage = function (time = HARDREMOVE_TIME, transition = REMOVING_SHORT) { this.classList.add("removing", transition); setTimeout( function ($elem) { $elem.remove(); }, time, this ); }; /** * Для автоматического удаления сообщений, вызывается в setTimeout во время создания текущего сообщения */ const autoRemoveMessage = function () { if (this instanceof HTMLElement) { removeMessage.call(this, AUTOREMOVE_TIME, REMOVING_LONG); } }; /** * Класс создания всплывающих сообщений. Конструктор создаёт элемент-контейнер для помещения элементов-сообщений и добавляет его в конец BODY. Класс имеет один метод - Show - показать сообщение (создать элемент-сообщение и поместить в элемент-контейнер на указанное время жизни (аргумент time)) */ return class Messenger { /** * Конструктор сообщений */ constructor() { this.$message = document.createElement("div"); this.$message.classList.add("messenger"); this.$message.id = "idMessenger"; document.body.appendChild(this.$message); } /** * Вывести сообщение одного из трёх типов. Выводит в прямоугольной области в нижнем правом углу экрана. А также дублируется в лог консоли. * @param {String} msg текст сообщения, допускается HTML формат * @param {MESSAGE_TYPE} type тип отображения сообщения (ошибка, предупреждение, информация) * @param {Number} time время отображения сообщения в миллисекундах */ Show(msg, type = "info", time = 10000) { let message = document.createElement("div"); message.id = `idMsg${++MESSAGE_COUNTER}`; message.innerHTML = msg; message.classList.add(type); let close = document.createElement("div"); close.classList.add("close"); close.onclick = removeMessage.bind(message); message.append(close); this.$message.appendChild(message); setTimeout(autoRemoveMessage.bind(message), time); } } })(); var Notify = new NotifyBuild();