-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.ts
37 lines (30 loc) · 917 Bytes
/
main.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
interface Refs {
overlay: HTMLElement | null;
modalWindow: HTMLElement | null;
closeBtn: HTMLElement | null;
openBtn: HTMLElement | null;
}
const refs: Refs = {
overlay: document.getElementById("overlay"),
modalWindow: document.getElementById("modalWindow"),
closeBtn: document.getElementById("closeBtn"),
openBtn: document.getElementById("openBtn"),
};
interface Classes {
openModal: string;
}
const classes: Classes = {
openModal: "open-modal",
};
refs.openBtn?.addEventListener("click", handleModal);
refs.closeBtn?.addEventListener("click", handleModal);
refs.overlay?.addEventListener("click", handleModal);
document.addEventListener("keydown", handleModalClose);
function handleModal() {
document.body.classList.toggle(classes.openModal);
}
function handleModalClose({ code }: KeyboardEvent) {
if (code === "Escape") {
document.body.classList.remove(classes.openModal);
}
}