https://netcattest.com/assets/js/main.js

1const cabecalho = document.querySelector("#cabecalho");
2const menu = document.querySelector("#menu-principal");
3const botaoMenu = document.querySelector(".menu-botao");
4const elementosAnimados = document.querySelectorAll(".animar");
5const secaoHero = document.querySelector("#inicio");
6const secaoSuite = document.querySelector("#suite");
7const secaoCateyes = document.querySelector("#cateyes");
8const rodape = document.querySelector("#contato");
9const linksMenu = document.querySelectorAll(".menu a[href^='#']");
10const secoesNavegacao = Array.from(linksMenu)
11    .map((link) => document.querySelector(link.getAttribute("href")))
12    .filter(Boolean);
13const menuContexto = document.createElement("div");
14let alvoContexto = null;
15const catEyesLojas = Object.freeze({
16    chrome: "https://chromewebstore.google.com/detail/cat-eyes/abhlihknahkcmopioedcnimnfnifgcon?authuser=2&hl=pt-BR",
17    firefox: "https://addons.mozilla.org/pt-BR/firefox/addon/cateyes-netcattest/",
18});
19
20document.body.classList.add("animacoes-ativas");
21
22function dadosNavegadorCateyes() {
23    const agente = navigator.userAgent.toLowerCase();
24    const firefox = agente.includes("firefox") || agente.includes("fxios");
25    const edge = agente.includes("edg/") || agente.includes("edgios") || agente.includes("edga");
26    const opera = agente.includes("opr/") || agente.includes("opera");
27    const brave = agente.includes("brave") || Boolean(navigator.brave);
28    const vivaldi = agente.includes("vivaldi");
29    const yandex = agente.includes("yabrowser");
30    const chromium = agente.includes("chromium");
31
32    if (firefox) {
33        return {
34            navegador: "firefox",
35            loja: "firefox",
36            rotulo: "Adicionar ao Firefox",
37            url: catEyesLojas.firefox,
38        };
39    }
40
41    return {
42        navegador: edge ? "edge" : opera ? "opera" : brave ? "brave" : vivaldi ? "vivaldi" : yandex ? "yandex" : chromium ? "chromium" : "chrome",
43        loja: "chrome",
44        rotulo: edge ? "Adicionar ao Edge" : opera ? "Adicionar ao Opera" : brave ? "Adicionar ao Brave" : vivaldi ? "Adicionar ao Vivaldi" : yandex ? "Adicionar ao Yandex" : chromium ? "Adicionar ao Chromium" : "Adicionar ao Chrome",
45        url: catEyesLojas.chrome,
46    };
47}
48
49const cateyesBrowser = dadosNavegadorCateyes();
50const linksTemaTopo = Array.from(document.querySelectorAll('.menu a[href="#suite"], .menu a[href="#cateyes"]'));
51
52document.querySelectorAll("[data-cateyes-add-browser]").forEach((botao) => {
53    botao.textContent = cateyesBrowser.rotulo;
54    botao.setAttribute("aria-label", cateyesBrowser.rotulo);
55    botao.setAttribute("href", cateyesBrowser.url);
56    botao.setAttribute("target", "_blank");
57    botao.setAttribute("rel", "noopener noreferrer");
58});
59
60console.log(
61    "%cNETCAT TEST%c Cat Suite gratuito",
62    "color:#38e8ff;background:#03050b;font-size:34px;font-weight:900;letter-spacing:3px;padding:10px 14px;border:1px solid #38e8ff;border-radius:6px 0 0 6px;text-shadow:0 0 12px rgba(56,232,255,.8);",
63    "color:#050505;background:#fff200;font-size:14px;font-weight:900;padding:17px 14px;border:1px solid #38e8ff;border-left:0;border-radius:0 6px 6px 0;",
64);
65console.log("Cat Suite: sem cobrança, feito para estudo e testes autorizados em laboratório.");
66
67function atualizarCabecalho() {
68    if (!cabecalho) {
69        return;
70    }
71
72    cabecalho.classList.toggle("ativo", window.scrollY > 40);
73
74    const alturaJanela = window.innerHeight;
75    const heroAltura = secaoHero ? secaoHero.offsetHeight : 0;
76    const ocultarNoHero = window.scrollY < heroAltura * 0.55;
77    const ocultarNoRodape = rodape ? rodape.getBoundingClientRect().top < alturaJanela * 0.72 : false;
78    const suiteRect = secaoSuite ? secaoSuite.getBoundingClientRect() : null;
79    const cateyesRect = secaoCateyes ? secaoCateyes.getBoundingClientRect() : null;
80    const suiteAtiva = suiteRect
81        ? suiteRect.top < alturaJanela * 0.58 && suiteRect.bottom > alturaJanela * 0.36
82        : false;
83    const cateyesAtiva = cateyesRect
84        ? cateyesRect.top < alturaJanela * 0.58 && cateyesRect.bottom > alturaJanela * 0.36
85        : false;

86
87    document.body.classList.toggle("nav-oculta", ocultarNoHero || ocultarNoRodape);
88    document.body.classList.toggle("suite-ativa", suiteAtiva);
89    document.body.classList.toggle("cateyes-ativa", cateyesAtiva);
90    document.documentElement.classList.toggle("suite-ativa", suiteAtiva);
91    document.documentElement.classList.toggle("cateyes-ativa", cateyesAtiva);
92}
93
94function fecharMenu() {
95    document.body.classList.remove("menu-aberto");
96
97    if (menu) {
98        menu.classList.remove("aberto");
99    }
100
101    if (botaoMenu) {
102        botaoMenu.setAttribute("aria-expanded", "false");
103    }
104}
105
106window.addEventListener("scroll", atualizarCabecalho);
107window.addEventListener("resize", atualizarCabecalho);
108atualizarCabecalho();
109requestAnimationFrame(() => {
110    document.body.classList.remove("nav-sem-transicao");
111});
112
113linksTemaTopo.forEach((link) => {
114    const tema = link.getAttribute("href") === "#suite" ? "suite" : "cateyes";
115    const classe = `nav-preview-${tema}`;
116    const ativarTema = () => {
117        document.body.classList.add(classe);
118        document.documentElement.classList.add(classe);
119    };
120    const removerTema = () => {
121        document.body.classList.remove(classe);
122        document.documentElement.classList.remove(classe);
123    };
124
125    link.addEventListener("mouseenter", ativarTema);
126    link.addEventListener("focus", ativarTema);
127    link.addEventListener("mouseleave", removerTema);
128    link.addEventListener("blur", removerTema);
129});
130
131if (botaoMenu) {
132    botaoMenu.addEventListener("click", () => {
133        const aberto = menu.classList.toggle("aberto");
134        document.body.classList.toggle("menu-aberto", aberto);
135        botaoMenu.setAttribute("aria-expanded", String(aberto));
136    });
137}
138
139document.querySelectorAll('a[href^="#"]').forEach((link) => {
140    link.addEventListener("click", (evento) => {
141        const destino = document.querySelector(link.getAttribute("href"));
142
143        if (!destino) {
144            return;
145        }
146
147        evento.preventDefault();
148        fecharMenu();
149        destino.scrollIntoView({ behavior: "smooth", block: "start" });
150    });
151});
152
153function revelarElementosNoViewport(observador = null) {
154    const topoVisivel = window.innerHeight * 0.08;
155    const limiteEntrada = window.innerHeight * 0.86;
156
157    elementosAnimados.forEach((elemento) => {
158        if (elemento.classList.contains("visivel")) {
159            return;
160        }
161
162        const retangulo = elemento.getBoundingClientRect();
163        const estaNaAreaDeRevelacao = retangulo.top < limiteEntrada && retangulo.bottom > topoVisivel;
164
165        if (!estaNaAreaDeRevelacao) {
166            return;
167        }
168
169        elemento.classList.add("visivel");
170
171        if (observador) {
172            observador.unobserve(elemento);
173        }
174    });
175}
176
177if ("IntersectionObserver" in window) {
178    const observador = new IntersectionObserver((entradas) => {
179        entradas.forEach((entrada) => {
180            if (entrada.isIntersecting) {
181                entrada.target.classList.add("visivel");
182                observador.unobserve(entrada.target);
183            }
184        });
185    }, { threshold: 0.18 });
186
187    elementosAnimados.forEach((elemento) => observador.observe(elemento));
188
189    window.addEventListener("scroll", () => revelarElementosNoViewport(observador), { passive: true });
190    window.addEventListener("resize", () => revelarElementosNoViewport(observador));
191    window.setTimeout(() => revelarElementosNoViewport(observador), 300);
192
193    if (secoesNavegacao.length) {
194        const observadorNavegacao = new IntersectionObserver((entradas) => {
195            entradas.forEach((entrada) => {
196                if (!entrada.isIntersecting) {
197                    return;
198                }
199
200                linksMenu.forEach((link) => {
201                    link.classList.toggle("link-ativo", link.getAttribute("href") === `#${entrada.target.id}`);
202                });
203            });
204        }, { rootMargin: "-40% 0px -48% 0px", threshold: 0 });
205
206        secoesNavegacao.forEach((secao) => observadorNavegacao.observe(secao));
207    }
208} else {
209    elementosAnimados.forEach((elemento) => elemento.classList.add("visivel"));
210}
211
212menuContexto.className = "menu-contexto";
213menuContexto.setAttribute("role", "menu");
214menuContexto.setAttribute("aria-hidden", "true");
215document.body.appendChild(menuContexto);
216
217function ocultarMenuContexto() {
218    menuContexto.classList.remove("ativo");
219    menuContexto.classList.remove("menu-contexto--suite");
220    menuContexto.classList.remove("menu-contexto--cateyes");
221    menuContexto.setAttribute("aria-hidden", "true");
222    alvoContexto = null;
223}
224
225function criarItemContexto(rotulo, acao) {
226    const botao = document.createElement("button");
227    botao.type = "button";
228    botao.textContent = rotulo;
229    botao.dataset.contextoAcao = acao;
230    botao.setAttribute("role", "menuitem");
231
232    return botao;
233}
234
235function criarSeparadorContexto() {
236    const separador = document.createElement("span");
237    separador.className = "menu-contexto__separador";
238    separador.setAttribute("aria-hidden", "true");
239
240    return separador;
241}
242
243function posicionarMenuContexto(evento) {
244    const margem = 10;
245    const retangulo = menuContexto.getBoundingClientRect();
246    const esquerda = Math.min(evento.clientX, window.innerWidth - retangulo.width - margem);
247    const topo = Math.min(evento.clientY, window.innerHeight - retangulo.height - margem);
248
249    menuContexto.style.left = `${Math.max(margem, esquerda)}px`;
250    menuContexto.style.top = `${Math.max(margem, topo)}px`;
251}
252
253function mostrarMenuContexto(evento) {
254    const link = evento.target.closest("a[href]");
255    const imagem = evento.target.closest("img");
256    const suite = evento.target.closest("#suite, .secao--suite");
257    const cateyes = evento.target.closest("#cateyes, .secao--cateyes");
258    const secoes = [
259        ["Início", "#inicio"],
260        ["Manual", "#manual"],
261        ["Aulas", "#videoaulas"],
262        ["Cat Suite", "#suite"],
263        ["Redes", "#redes"],
264        ["Blog", "#blog"],
265        ["Cat Eyes", "#cateyes"],
266    ];
267
268    evento.preventDefault();
269    alvoContexto = { link, imagem, suite, cateyes };
270    menuContexto.replaceChildren();
271    menuContexto.classList.toggle("menu-contexto--suite", Boolean(suite));
272    menuContexto.classList.toggle("menu-contexto--cateyes", Boolean(cateyes));
273
274    if (link) {
275        menuContexto.append(
276            criarItemContexto("Abrir link", "abrir-link"),
277            criarItemContexto("Copiar link", "copiar-link"),
278            criarSeparadorContexto(),
279        );
280    }
281
282    if (imagem) {
283        menuContexto.append(
284            criarItemContexto("Abrir imagem", "abrir-imagem"),
285            criarItemContexto("Copiar URL da imagem", "copiar-imagem"),
286            criarSeparadorContexto(),
287        );
288    }
289
290    if (cateyes) {
291        menuContexto.append(
292            criarItemContexto("Cat Eyes", "cateyes-topo"),
293            criarItemContexto(cateyesBrowser.rotulo, "cateyes-download"),
294            criarItemContexto("Copiar seção Cat Eyes", "copiar-cateyes"),
295            criarSeparadorContexto(),
296            criarItemContexto("Privacidade Cat Eyes", "abrir-cateyes-privacidade"),
297            criarItemContexto("Suporte Cat Eyes", "abrir-cateyes-suporte"),
298        );
299    } else if (suite) {
300        menuContexto.append(
301            criarItemContexto("Cat Suite", "suite-topo"),
302            criarItemContexto("Download Play Store", "suite-download"),
303            criarItemContexto("Copiar seção Cat Suite", "copiar-suite"),
304            criarSeparadorContexto(),
305            criarItemContexto("Ver manual gratuito", "abrir-manual"),
306            criarItemContexto("Ver videoaulas", "abrir-aulas"),
307        );
308    } else {

309        secoes.forEach(([rotulo, destino]) => {
310            const item = criarItemContexto(rotulo, "ir-secao");
311            item.dataset.destino = destino;
312            menuContexto.appendChild(item);
313        });
314    }
315
316    menuContexto.append(
317        criarSeparadorContexto(),
318        criarItemContexto("Recarregar", "recarregar"),
319        criarItemContexto("Copiar endereço da página", "copiar-pagina"),
320    );
321
322    menuContexto.classList.add("ativo");
323    menuContexto.setAttribute("aria-hidden", "false");
324    posicionarMenuContexto(evento);
325}
326
327async function copiarTexto(texto) {
328    if (!texto) {
329        return;
330    }
331
332    try {
333        await navigator.clipboard.writeText(texto);
334    } catch (erro) {
335        const campo = document.createElement("textarea");
336        campo.value = texto;
337        campo.style.position = "fixed";
338        campo.style.opacity = "0";
339        document.body.appendChild(campo);
340        campo.select();
341        document.execCommand("copy");
342        campo.remove();
343    }
344}
345
346menuContexto.addEventListener("click", (evento) => {
347    const item = evento.target.closest("[data-contexto-acao]");
348
349    if (!item) {
350        return;
351    }
352
353    const acao = item.dataset.contextoAcao;
354    const linkHref = alvoContexto?.link?.href;
355    const imagemSrc = alvoContexto?.imagem?.currentSrc || alvoContexto?.imagem?.src;
356
357    if (acao === "abrir-link" && linkHref) {
358        window.location.href = linkHref;
359    }
360
361    if (acao === "copiar-link" && linkHref) {
362        copiarTexto(linkHref);
363    }
364
365    if (acao === "abrir-imagem" && imagemSrc) {
366        window.open(imagemSrc, "_blank", "noopener");
367    }
368
369    if (acao === "copiar-imagem" && imagemSrc) {
370        copiarTexto(imagemSrc);
371    }
372
373    if (acao === "ir-secao") {
374        const destino = document.querySelector(item.dataset.destino);
375
376        if (destino) {
377            fecharMenu();
378            destino.scrollIntoView({ behavior: "smooth", block: "start" });
379        }
380    }
381
382    if (acao === "recarregar") {
383        window.location.reload();
384    }
385
386    if (acao === "copiar-pagina") {
387        copiarTexto(window.location.href);
388    }
389
390    if (acao === "suite-topo") {
391        document.querySelector("#suite")?.scrollIntoView({ behavior: "smooth", block: "start" });
392    }
393
394    if (acao === "suite-download") {
395        document.querySelector(".suite__download")?.click();
396    }
397
398    if (acao === "copiar-suite") {
399        copiarTexto(`${window.location.origin}${window.location.pathname}#suite`);
400    }
401
402    if (acao === "abrir-manual") {
403        window.location.href = "/livro/manual-de-operacoes-anonimas";
404    }
405
406    if (acao === "abrir-aulas") {
407        window.location.href = "/aulas";
408    }
409
410    if (acao === "cateyes-topo") {
411        document.querySelector("#cateyes")?.scrollIntoView({ behavior: "smooth", block: "start" });
412    }
413
414    if (acao === "cateyes-download") {
415        window.location.href = cateyesBrowser.url;
416    }
417
418    if (acao === "copiar-cateyes") {
419        copiarTexto(`${window.location.origin}${window.location.pathname}#cateyes`);
420    }
421
422    if (acao === "abrir-cateyes-privacidade") {
423        window.location.href = "/cateyes/privacidade";
424    }
425
426    if (acao === "abrir-cateyes-suporte") {
427        window.location.href = "/cateyes/suporte";
428    }
429
430    ocultarMenuContexto();
431});
432
433document.addEventListener("contextmenu", mostrarMenuContexto);
434document.addEventListener("click", ocultarMenuContexto);
435window.addEventListener("blur", ocultarMenuContexto);
436window.addEventListener("resize", ocultarMenuContexto);
437window.addEventListener("scroll", ocultarMenuContexto, { passive: true });
438window.addEventListener("keydown", (evento) => {
439    if (evento.key === "Escape") {
440        ocultarMenuContexto();
441    }
442});