https://loja.correios.com.br/public-resources/core/js/modal.js

1/**
2 *
3 * @param {string} id
4 */
5
6let numAbertos = 0
7let inPopstate = false
8const desktop = window.matchMedia('(min-width: 1024px)').matches
9
10const abre = id => {
11  const m = document.getElementById(id)
12  escModal(m)
13  const aFechar = m.querySelector('a.fechar')
14  if (aFechar) {
15    aFechar.addEventListener('click', fecha)
16  }
17  m.classList.add('aberto')
18  const s = document.querySelector(`#${id} > section`)
19  if (s) {
20    s.addEventListener('click', sectionClick)
21  }
22  document.body.classList.add('modal-aberto')
23  numAbertos++
24  if (inPopstate || desktop) return
25  const pars = new URLSearchParams(window.location.hash.substr(1))
26  pars.set('mc', numAbertos.toString())
27  if (desktop) return
28  window.history.pushState(null, null, '#' + pars)
29}
30
31const sectionClick = ev => {
32  ev.stopPropagation()
33}
34
35const fecha = () => {
36  if (numAbertos == 0) {
37    escModal(null)
38    return
39  }
40  const abertos = [...document.querySelectorAll('.modal.aberto')]
41  const ultimo = abertos.pop()
42  ultimo.classList.remove('aberto')
43  numAbertos--
44  if (numAbertos == 0) {
45    escModal(null)
46    document.body.classList.remove('modal-aberto')
47  }
48  escModal(abertos.pop())
49  if (inPopstate || desktop) return
50  window.history.back()
51}
52
53const teclaEsc = ev => {
54  if (ev.key == 'Escape') {
55    fecha()
56  }
57}
58
59const escModal = m => {
60  if (!m || !m.dataset.hasOwnProperty('esc')) {
61    document.body.removeEventListener('keydown', teclaEsc)
62  } else {
63    document.body.addEventListener('keydown', teclaEsc)
64  }
65}
66
67window.addEventListener('popstate', ev => {
68  if (desktop) return
69  inPopstate = true
70  const pars = new URLSearchParams(window.location.hash.substr(1))
71  const mc = parseFloat(pars.get('mc'))
72  if (isNaN(mc) || mc < numAbertos) fecha()
73  inPopstate = false
74})
75
76export { abre, fecha }