https://cas.correios.com.br/ect/js/menu.js

1const desktop = window.matchMedia('(min-width: 1024px)').matches;
2const hambuguer = document.querySelector('#menu .hamburger');
3const ctnM = document.querySelector('#menu > .menu');
4const menuUsuario = document.querySelector('#menu a.nome');
5const ddUsu = document.querySelector('#menu > .dd');
6const menuUsuarioMob = document.querySelector('#menu > .menu section a.nome-usuario-logado');
7const ddUsuMob = document.querySelector('#menu .menu div.dd-mobile');
8let pilha = [];
9
10const enterClick = el => {
11    el.addEventListener('keydown', ev => {
12        if (ev.key == 'Enter') {
13            ev.preventDefault();
14            el.dispatchEvent(new Event('click'));
15        }
16    });
17};
18
19function abreMenu () {
20    hambuguer.classList.add('aberto');
21    ctnM.classList.remove('oculto');
22    document.body.classList.add('menu-aberto');
23    addHash();
24    conf.aberto = true;
25    saveConf();
26}
27
28function fechaMenu () {
29    hambuguer.classList.remove('aberto');
30    ctnM.classList.add('oculto');
31    document.body.classList.remove('menu-aberto');
32    const abertos = ctnM.querySelectorAll('.aberto');
33    for (let a of abertos) {
34        a.classList.remove('aberto');
35    }
36    pilha = [];
37    removeHash();
38    conf.aberto = false;
39    conf.abertos = [];
40    saveConf();
41}
42
43function abreSubmenu (ev, anchor) {
44    let a;
45    if (ev) {
46        a = ev.currentTarget;
47    } else {
48        a = anchor;
49    }
50    if (a.classList.contains('nome-usuario-logado')) return;
51    let sub = a.nextSibling.nextSibling;
52    if (sub.tagName != 'DIV') return;
53    sub.classList.add('aberto');
54    pilha.push(sub.querySelector('.voltar'));
55    sub.querySelectorAll(':scope > a').forEach(a => a.tabIndex = 1);
56    setTimeout(() => {
57        sub.querySelector('.voltar').focus();
58    }, 0);
59    if (ev) {
60        addHash();
61        conf.abertos.push([...a.parentNode.childNodes].indexOf(a));
62        saveConf();
63    }
64    ctnM.scrollTop = 0;
65}
66
67function fechaSubmenu (ev) {
68    let a;
69    if (ev) {
70        a = ev.currentTarget;
71    } else {
72        a = pilha.pop();
73    }
74    let sub = a.parentNode;
75    sub.classList.remove('aberto');
76    sub.querySelectorAll('a').forEach(a => a.tabIndex = -1);
77    if (ev) {
78        subHash();
79    }
80    conf.abertos.pop();
81    saveConf();
82}
83
84function getHash () {
85    const pars = new URLSearchParams(location.hash.substr(1));
86    return pars.get('menu');
87}
88
89function removeHash () {
90    if (desktop) return;
91    if (location.hash) {
92        const pars = new URLSearchParams(location.hash.substr(1));
93        if (pars.has('menu')) {
94            const newPars = new URLSearchParams();
95            for (let [k, v] of pars.entries()) {
96                if (k == 'menu') continue;
97                newPars.set(k, v);
98            }
99            history.pushState(null, null, '#' + newPars.toString());
100        }
101    }
102}
103
104function addHash () {
105    if (desktop) return;
106    const pars = new URLSearchParams(location.hash.substr(1));
107    let nivel = 1;
108    if (!pars.has('menu')) {
109        pars.set('menu', nivel.toString());
110    } else {
111        const nivel = parseInt(pars.get('menu')) + 1;
112        pars.set('menu', nivel.toString());
113    }
114    history.pushState(nivel.toString(), null, '#' + pars.toString());
115}
116
117function subHash () {
118    if (desktop) return;
119    const pars = new URLSearchParams(location.hash.substr(1));
120    if (!pars.has('menu')) return;
121    history.back();
122}
123
124function abreFechMenUsu (ev) {
125    ev.stopPropagation();
126    if (menuUsuario.classList.contains('aberto')) {
127        menuUsuario.classList.remove('aberto');
128        ddUsu.classList.remove('aberto');
129    } else {
130        menuUsuario.classList.add('aberto');
131        ddUsu.classList.add('aberto');
132    }
133}
134
135function abreFechMenUsuMob (ev) {
136    ev.stopPropagation();
137    if (menuUsuarioMob.classList.contains('aberto')) {
138        menuUsuarioMob.classList.remove('aberto');
139        ddUsuMob.classList.remove('aberto');
140    } else {
141        menuUsuarioMob.classList.add('aberto');
142        ddUsuMob.classList.add('aberto');
143    }
144}
145
146let conf = {
147    aberto: false,
148    abertos: [],
149};
150
151function readConf () {
152    const cnf = localStorage.getItem('menu');
153    if (!cnf) return;
154    conf = JSON.parse(cnf);
155}
156
157function saveConf () {
158    localStorage.setItem('menu', JSON.stringify(conf));
159}
160
161function ini () {
162    if (!ctnM) return;
163    readConf();
164
165    if (hambuguer) {
166        hambuguer.addEventListener('click', ev => {
167            const ham = ev.currentTarget;
168            if (ham.classList.contains('aberto')) {
169                fechaMenu();
170            } else {
171                abreMenu();
172            }
173        });
174    }
175    ctnM.classList.add('oculto');
176    setInterval(() => {
177        const altura = window.innerHeight - hambuguer.getBoundingClientRect().bottom;
178        ctnM.style.height = (altura - 9) + 'px';
179    }, 500);
180    document.body.addEventListener('click', () => {
181        if (!desktop) {
182            fechaMenu();
183        }
184    });
185    hambuguer.addEventListener('click', ev => ev.stopPropagation());
186    ctnM.addEventListener('click', ev => ev.stopPropagation());
187    const subs = ctnM.querySelectorAll('div');
188    for (let s of subs) {
189        if (s.classList.contains('dd-mobile')) {
190            continue;
191        }
192        let voltar = document.createElement('a');
193        voltar.textContent = 'Voltar';
194        voltar.className = 'voltar';
195        s.insertAdjacentElement('afterbegin', voltar);
196    }
197    ctnM.querySelectorAll('a').forEach(a => {
198        a.tabIndex = 1;
199    });
200    ctnM.querySelectorAll(':scope > div a').forEach(a => {
201        a.tabIndex = -1;
202    });
203    const abriveis = ctnM.querySelectorAll('a:not([href])');
204    for (let a of abriveis) {
205        if (a.classList.contains('voltar')) {
206            a.addEventListener('click', fechaSubmenu);
207        } else {
208            a.addEventListener('click', abreSubmenu);
209        }
210        enterClick(a);
211    }
212
213    window.addEventListener('popstate', ev => {
214        if (desktop) return;
215        const nivel = parseInt(getHash());
216        const n = pilha.length;
217        if (n == nivel) {
218            fechaSubmenu();
219        } else {
220            fechaMenu();
221        }
222    });
223
224    removeHash();
225
226    if (desktop && conf.aberto) abreMenu();
227    try {
228        let sub = ctnM;
229        for (let i = 0; i < conf.abertos.length; i++) {
230            let a = sub.childNodes[conf.abertos[i]];
231            abreSubmenu(null, a);
232            if (!desktop) {
233                addHash();
234            }
235            sub = a.nextSibling.nextSibling;
236        }
237    } catch (e) {
238        conf.abertos = [];
239        saveConf();
240    }
241    enterClick(hambuguer);
242    if (menuUsuario) {
243        menuUsuario.addEventListener('click', abreFechMenUsu);
244        menuUsuarioMob.addEventListener('click', abreFechMenUsuMob);
245        ddUsu.addEventListener('click', ev => ev.stopPropagation());
246        ddUsuMob.addEventListener('click', ev => ev.stopPropagation());
247        document.body.addEventListener('click', () => {
248            menuUsuario.classList.remove('aberto');
249            menuUsuarioMob.classList.remove('aberto');
250            ddUsu.classList.remove('aberto');
251            ddUsuMob.classList.remove('aberto');
252        });
253        enterClick(menuUsuario);
254    }
255}
256
257try {
258    ini();
259} catch (e) {
260    console.log("Erro ao tentar construir o menu");
261    console.log(e)
262}