https://tetus.ru/resource/js/core6/rsplugins/modal.js

1/**
2 * Открывает модальное окно с заданным содержимым.
3 * Зависит от bootstrap.Modal
4 */
5new class Modal extends RsJsCore.classes.plugin {
6    /**
7     * Открывает модальное окно
8     * @param html Содержимое окна
9     * @param onOpen callback, вызываемый после открытия окна
10     * @param options объект, любые дополнительные свойства
11     */
12    open(html, onOpen, options) {
13        let isReopen = this.isOpen();
14        if (this.modal) {
15            //При повторном открытии без анимации закрываем текущее окно
16            this.modal._element.classList.remove('fade');
17            this.close();
18        }
19
20        let element = document.createElement('div');
21        element.className = 'modal rs-dialog' + (isReopen ? '' : ' fade');
22        element.addEventListener('shown.bs.modal', (event) => {
23            if (isReopen) {
24                let modal = bootstrap.Modal.getInstance(event.target);
25                element.classList.add('fade');
26                (modal._backdrop._element || modal._backdrop).classList.add('fade');
27            }
28            element.dispatchEvent(new CustomEvent('new-content', {bubbles: true}));
29        });
30
31        element.addEventListener('shown.bs.modal', onOpen);
32        element.addEventListener('hide.bs.modal', () => {
33            this.modal = null
34        });
35        element.addEventListener('hidden.bs.modal', (event) => {
36            let modal = bootstrap.Modal.getInstance(event.target);
37            modal.dispose();
38            event.target.remove();
39        });
40
41        element.innerHTML = html;
42
43        this.modal = new bootstrap.Modal(element, options);
44        this.modal.show();
45    }
46
47    /**
48     * Закрывает модальное окно
49     */
50    close() {
51        if (this.modal) {
52            this.modal.hide();
53        }
54    }
55
56    /**
57     * Возвращает true, если модальное окно сейчас открыто
58     *
59     * @returns boolean
60     */
61    isOpen() {
62        return !!this.modal;
63    }
64
65    /**
66     * Отображает лоадер внутри диалогового окна
67     */
68    showLoader() {
69        if (this.modal) {
70            this.loader = document.createElement('div');
71            this.loader.classList.add('rs-loader');
72            this.modal._element.querySelector('.modal-content').append(this.loader);
73        }
74    }
75
76    /**
77     * Скрывает лоадер внутри диалогового окна
78     */
79    hideLoader() {
80        if (this.loader) {
81            this.loader.remove();
82        }
83    }
84};