refactor: separando funções em responsabilidades unicas

This commit is contained in:
Savio Carvalho Moraes 2022-12-13 19:46:34 -03:00
parent 8890726729
commit 27d740563c

View File

@ -46,188 +46,63 @@ export default class Header {
const progressBarLista = document.querySelectorAll("#progressBar ul li"); const progressBarLista = document.querySelectorAll("#progressBar ul li");
progressBarLista.forEach((li) => { progressBarLista.forEach((li) => {
if (window.location.href === "https://m3academy.myvtex.com/checkout/#/cart") { if (window.location.href === "https://m3academy.myvtex.com/checkout/#/cart") {
if (li.children[0].children[0].children["progress-bar-circle-1"]) { this.trataPonto(li, 1);
li.children[0].children[0].children["progress-bar-circle-1"].classList.add(
"active"
);
}
if (li.children[0].children[0].children["progress-bar-circle-2"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-3"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.remove("active");
}
}
} else if ( } else if (
window.location.href === "https://m3academy.myvtex.com/checkout/#/email" || window.location.href === "https://m3academy.myvtex.com/checkout/#/email" ||
window.location.href == "https://m3academy.myvtex.com/checkout/#/profile" || window.location.href == "https://m3academy.myvtex.com/checkout/#/profile" ||
window.location.href == "https://m3academy.myvtex.com/checkout/#/shipping" window.location.href == "https://m3academy.myvtex.com/checkout/#/shipping"
) { ) {
if (li.children[0].children[0].children["progress-bar-circle-1"]) { this.trataPonto(li, 2);
if (
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-2"]) {
li.children[0].children[0].children["progress-bar-circle-2"].classList.add(
"active"
);
}
if (li.children[0].children[0].children["progress-bar-circle-3"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.remove("active");
}
}
} else if ( } else if (
window.location.href === "https://m3academy.myvtex.com/checkout/#/payment" window.location.href === "https://m3academy.myvtex.com/checkout/#/payment"
) { ) {
if (li.children[0].children[0].children["progress-bar-circle-1"]) { this.trataPonto(li, 3);
if (
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-2"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-3"]) {
li.children[0].children[0].children["progress-bar-circle-3"].classList.add(
"active"
);
}
} }
window.addEventListener("hashchange", () => { window.addEventListener("hashchange", () => {
if (window.location.hash == "#/cart") { if (window.location.hash == "#/cart") {
if (li.children[0].children[0].children["progress-bar-circle-1"]) { this.trataPonto(li, 1);
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.add("active");
}
if (li.children[0].children[0].children["progress-bar-circle-2"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-3"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.remove("active");
}
}
} else if ( } else if (
window.location.hash == "#/email" || window.location.hash == "#/email" ||
window.location.hash == "#/profile" || window.location.hash == "#/profile" ||
window.location.hash == "#/shipping" window.location.hash == "#/shipping"
) { ) {
if (li.children[0].children[0].children["progress-bar-circle-1"]) { this.trataPonto(li, 2);
if (
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-2"]) {
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.add("active");
}
if (li.children[0].children[0].children["progress-bar-circle-3"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.remove("active");
}
}
} else if (window.location.hash == "#/payment") { } else if (window.location.hash == "#/payment") {
if (li.children[0].children[0].children["progress-bar-circle-1"]) { this.trataPonto(li, 3);
if (
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-1"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-2"]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-2"
].classList.remove("active");
}
}
if (li.children[0].children[0].children["progress-bar-circle-3"]) {
li.children[0].children[0].children[
"progress-bar-circle-3"
].classList.add("active");
}
} }
}); });
}); });
} }
} }
marcarPonto(li, local) {
if (li.children[0].children[0].children["progress-bar-circle-" + local]) {
li.children[0].children[0].children["progress-bar-circle-" + local].classList.add(
"active"
);
}
}
removerPonto(li, local) {
if (li.children[0].children[0].children["progress-bar-circle-" + local]) {
if (
li.children[0].children[0].children[
"progress-bar-circle-" + local
].classList.contains("active")
) {
li.children[0].children[0].children[
"progress-bar-circle-" + local
].classList.remove("active");
}
}
}
trataPonto(li, local) {
const indice = [1, 2, 3];
let indicesPontoBranco = indice.splice(local - 1, 1);
this.marcarPonto(li, local);
for (const i of indice) {
this.removerPonto(li, i);
}
}
} }