Completed
Push — master ( 962293...57f738 )
by D
02:43
created

Lightbox.bodyClose   B

Complexity

Conditions 6

Size

Total Lines 18
Code Lines 13

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 6
eloc 13
dl 0
loc 18
rs 8.6666
c 0
b 0
f 0
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.Lightbox = 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 Lightbox {
16
        constructor(options) {
17
            if (!options.targets) {
18
                throw new Error('No targets');
19
            }
20
            this.options = options;
21
            this.options.targets = typeof options.targets === 'string' ? document.querySelectorAll(options.targets) : options.targets;
22
            this.initClasses();
23
            this.initClone();
24
            this.bodyClose();
25
        }
26
        initClasses() {
27
            this.options.targets.forEach(function (target) {
28
                target.classList.add('lightbox');
29
            });
30
        }
31
        initHTML(target, position) {
32
            let wrapper = document.createElement('div');
33
            wrapper.classList.add('lightbox-clone-wrapper');
34
            setTimeout(() => {
35
                wrapper.classList.add('active');
36
            }, 100);
37
            let clone = document.createElement('div');
38
            clone.classList.add('lightbox-clone');
39
            clone.style.top = position.top + 'px';
40
            clone.style.left = position.left + 'px';
41
            clone.style.width = target.naturalWidth + 'px';
42
            setTimeout(() => {
43
                clone.classList.add('centered');
44
            }, 100);
45
            let cloneImg = document.createElement('img');
46
            cloneImg.src = target.src;
47
            clone.appendChild(cloneImg);
48
            wrapper.appendChild(clone);
49
            document.body.appendChild(wrapper);
50
        }
51
        initClone() {
52
            let that = this;
53
            this.options.targets.forEach(function (target) {
54
                target.addEventListener('click', function (e) {
55
                    that.initHTML(e.target, Lightbox.getTargetPosition(target));
56
                    that.scrollClose(target);
57
                });
58
            });
59
        }
60
        static getTargetPosition(target) {
61
            let targetPosition = target.getBoundingClientRect();
62
            return {
63
                top: targetPosition.top,
64
                left: targetPosition.left
65
            };
66
        }
67
        bodyClose() {
68
            let that = this;
0 ignored issues
show
Unused Code introduced by
The variable that seems to be never used. Consider removing it.
Loading history...
69
            document.addEventListener('click', function (e) {
70
                e.preventDefault();
71
                if (e.target.closest('.lightbox-clone-wrapper')) {
72
                    let wrapper = document.querySelector('.lightbox-clone-wrapper');
73
                    if (wrapper) {
74
                        let clone = wrapper.firstElementChild;
75
                        new Promise(function (resolve) {
76
                            clone.classList.remove('centered');
77
                            setTimeout(resolve, 500);
78
                        }).then(function () {
79
                            wrapper.remove();
80
                        });
81
                    }
82
                }
83
            });
84
        }
85
        scrollClose(target) {
86
            document.addEventListener('scroll', function () {
87
                let targetPosition = target.getBoundingClientRect();
88
                let wrapper = document.querySelector('.lightbox-clone-wrapper');
89
                if (wrapper) {
90
                    let clone = wrapper.firstElementChild;
91
                    new Promise(function (resolve) {
92
                        clone.classList.remove('centered');
93
                        clone.style.top = targetPosition.top + 'px';
94
                        clone.style.left = targetPosition.left + 'px';
95
                        setTimeout(resolve, 750);
96
                    }).then(function () {
97
                        wrapper.remove();
98
                    });
99
                }
100
            });
101
        }
102
    }
103
    return Lightbox;
104
}));
105