forked from M3-Academy/m3-academy-template-checkout
development #12
@ -7,7 +7,7 @@ export default class Footer {
|
||||
|
||||
async init() {
|
||||
await this.selectors();
|
||||
// this.onUpdate();
|
||||
this.onUpdate();
|
||||
this.createfooterShelf();
|
||||
this.insertImagesPayments();
|
||||
this.insertImagesDevelopedBy();
|
||||
@ -25,18 +25,47 @@ export default class Footer {
|
||||
}
|
||||
|
||||
onUpdate() {
|
||||
//Função qeu fará a verificação se o carrinho está vazio para remover a prateleira de produtos:
|
||||
//Função qu fará a verificação se o carrinho está vazio para remover a prateleira de produtos:
|
||||
// vocês devem olhar a doc fornecida no Desafio para aprender a usar a MutationObserver
|
||||
// sempre que o carrinho estiver vazio o elemento chcekoutVazio fica display: none e isso pode ser usado como atributo para a MutationObserver
|
||||
|
||||
let target = this.checkoutVazio;
|
||||
let shelf = this.footerCheckoutShelf;
|
||||
let config = { childList: true, attributes: true };
|
||||
|
||||
if (window.location.href === "https://m3academy.myvtex.com/checkout/#/cart" && this.checkoutVazio.style.display == "none") {
|
||||
shelf.classList.remove("none");
|
||||
this.createfooterShelf();
|
||||
} else {
|
||||
shelf.classList.add("none");
|
||||
}
|
||||
window.addEventListener("hashchange", () => {
|
||||
if (window.location.hash == "#/cart" && this.checkoutVazio.style.display == "none") {
|
||||
shelf.classList.remove("none")
|
||||
this.createfooterShelf();
|
||||
} else if (window.location.hash != "#/cart") {
|
||||
shelf.classList.add("none");
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
let observer = new MutationObserver((mutations) => {
|
||||
mutations.forEach(function (mutation) {
|
||||
console.log(mutation.type);
|
||||
mutations.forEach((mutation) => {
|
||||
if (target.style.display == "none" && window.location.hash == "#/cart") {
|
||||
shelf.classList.remove("none");
|
||||
this.footerShelf();
|
||||
} else {
|
||||
shelf.classList.add("none");
|
||||
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
observer.observe(target, config);
|
||||
|
||||
|
||||
}
|
||||
insertImagesPayments() {
|
||||
this.footerCheckoutPayments.innerHTML = `
|
||||
|
Loading…
Reference in New Issue
Block a user