View GitHub Repository arm-ui

Schedule Inspection
Subscribe
Passed
Push — master ( 974900...d82885 )
by D
02:16
created

Popup.initCloseIcon   A

↳ Parent: Popup

Complexity

Conditions 2

Size

Total Lines 6
Code Lines 4

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
eloc 4
dl 0
loc 6
c 0
b 0
f 0
rs 10
cc 2
1 
"use strict";
2 
Object.defineProperty(exports, "__esModule", { value: true });
3 
const globals_1 = require("../globals/globals");
4 
(function (root, factory) {
5 
    if (typeof globals_1.define === 'function' && globals_1.define.amd) {
6 
        globals_1.define([], factory);
7 
    }
8 
    else if (typeof module === 'object' && module.exports) {
9 
        module.exports = factory();
10 
    }
11 
    else {
12 
        root.Popup = factory();
13 
    }
14 
}(typeof self !== 'undefined' ? self : this, function () {
0 ignored issues
– show
Bug introduced by
The variable self seems to be never declared. If this is a global, consider adding a /** global: self */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
15 
    class Popup {
16 
        constructor(options) {
17 
            if (!options.el) {
18 
                throw new Error('No popup root selector');
19 
            }
20 
            if (!options.openers) {
21 
                throw new Error('No popup openers');
22 
            }
23 
            this.options = options;
24 
            this.options.el = typeof options.el === 'string' ? document.querySelector(options.el) : options.el;
25 
            this.options.openers = typeof options.openers === 'string' ? document.querySelectorAll(options.openers) : options.openers;
26 
            this.options.closable = options.closable || false;
27 
            this.onInit();
28 
            this.onLoad();
29 
        }
30 
        onInit() {
31 
            this.initHTML();
32 
            this.initEvents();
33 
            this.initCloseIcon();
34 
        }
35 
        onLoad() {
36 
            if (this.options && this.options.onLoad) {
37 
                this.options.onLoad();
38 
            }
39 
        }
40 
        initHTML() {
41 
            this.options.el.classList.add('popup');
42 
            this.options.el.firstElementChild.classList.add('popup__container');
43 
            if (this.options.closable) {
44 
                let popupClose = document.createElement('a');
45 
                popupClose.href = '#';
46 
                popupClose.classList.add('popup__close-btn');
47 
                this.options.el.firstElementChild.appendChild(popupClose);
48 
            }
49 
            document.body.appendChild(this.options.el);
50 
            return this.options.el;
51 
        }
52 
        initEvents() {
53 
            this.open();
54 
            this.close();
55 
        }
56 
        initCloseIcon() {
57 
            if (this.options.closable && this.options.closeIcon) {
58 
                let closeBtn = this.options.el.querySelector('.popup__close-btn');
59 
                closeBtn.innerHTML = this.options.closeIcon;
60 
            }
61 
        }
62 
        open() {
63 
            let that = this;
64 
            that.options.openers.forEach(function (popupOpen) {
65 
                popupOpen.addEventListener('click', function (e) {
66 
                    e.preventDefault();
67 
                    that.options.el.classList.add('active');
68 
                    if (that.options.onOpen) {
69 
                        that.options.onOpen.call(that);
70 
                    }
71 
                });
72 
            });
73 
        }
74 
        close() {
75 
            let that = this;
76 
            document.addEventListener('keydown', function (e) {
77 
                if (e.key === "Escape") {
78 
                    that.options.el.classList.remove('active');
79 
                    if (that.options.onClose) {
80 
                        that.options.onClose.call(that);
81 
                    }
82 
                }
83 
            });
84 
            that.options.el.addEventListener('click', function (e) {
85 
                if (!e.target.closest('.popup__container')) {
86 
                    that.options.el.classList.remove('active');
87 
                    if (that.options.onClose) {
88 
                        that.options.onClose.call(that);
89 
                    }
90 
                }
91 
            });
92 
            let popupClose = that.options.el.querySelector('.popup__close-btn');
93 
            if (popupClose) {
94 
                popupClose.addEventListener('click', function (e) {
95 
                    e.preventDefault();
96 
                    that.options.el.classList.remove('active');
97 
                    if (that.options.onClose) {
98 
                        that.options.onClose.call(that);
99 
                    }
100 
                });
101 
            }
102 
        }
103 
        manualOpen() {
104 
            this.options.el.classList.add('active');
105 
        }
106 
        manualClose() {
107 
            this.options.el.classList.remove('active');
108 
        }
109 
    }
110 
    return Popup;
111 
}));
112