Skip to content

Commit

Permalink
Update script.js
Browse files Browse the repository at this point in the history
  • Loading branch information
@ygabsxw
ygabsxw committed Jun 20, 2024
1 parent 141714a commit e31f29b
Showing 1 changed file with 87 additions and 74 deletions.
161 changes: 87 additions & 74 deletions codigo/diniz/sprint3-diniz/assets/js/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,11 +28,7 @@ document.addEventListener("DOMContentLoaded", function () {
const receitasDiv = document.createElement("div");
receitasDiv.className = "receita";
receitasDiv.dataset.id = favorito.receita.id;
receitasDiv.innerHTML = `
<a href="./html/pagreceita.html?id=${favorito.receita.id}"><img src="${favorito.receita.imagem}" />
<h3>${favorito.receita.nome}</h3></a>
<button data-id="${favorito.id}" class="fav-btn"><i class="ph ph-trash fav-btn"></i></button>
`;
receitasDiv.innerHTML = `<a href="./html/pagreceita.html?id=${favorito.receita.id}"><img src="${favorito.receita.imagem}" /> <h3>${favorito.receita.nome}</h3></a> <button data-id="${favorito.id}" class="fav-btn"><i class="ph ph-trash fav-btn"></i></button>`;
listaReceitas.appendChild(receitasDiv);
});
}
Expand Down Expand Up @@ -91,27 +87,30 @@ document.addEventListener("DOMContentLoaded", function () {
function mostraReceita(receita) {
console.log(receita);
receitaContainer.innerHTML = `
<h2 class="receita-nome">${receita.nome}</h2>
<button class="favorito-btn" data-id="${receita.id}">
<i id="favoritoId-btn" class="ph ph-bookmark-simple"></i>
</button>
<img src="${receita.imagem}" class="receita-imagem"/>
<p class="receita-descricao">${receita.tempo} - ${receita.rendimento} - ${receita.dificuldade}</p>
<h3 class="titulo-ingredientes">Ingredientes:</h3>
<ul class="receita-ingredientes">
${receita.ingredientes
.map(
(ingrediente) =>
`<li >${ingrediente.quantidade} ${ingrediente.ingrediente}</li>` )
.join("")}
</ul>
<h3 class="titulo-modo_preparo">Modo de Preparo:</h3>
<ul class="receita-modo_preparo">
${receita.modo_preparo
.map((passo) => `<li>${passo}</li>`)
.join("")}
</ul>
`;
<h2 class="receita-nome">${receita.nome}</h2>
<button class="favorito-btn" data-id="${receita.id}">
<i id="favoritoId-btn" class="ph ph-bookmark-simple"></i>
</button>
<img src="${receita.imagem}" class="receita-imagem"/>
<p class="receita-descricao">${receita.tempo} - ${
receita.rendimento
} - ${receita.dificuldade}</p>
<h3 class="titulo-ingredientes">Ingredientes:</h3>
<ul class="receita-ingredientes">
${receita.ingredientes
.map(
(ingrediente) =>
`<li>${ingrediente.quantidade} ${ingrediente.ingrediente}</li>`
)
.join("")}
</ul>
<h3 class="titulo-modo_preparo">Modo de Preparo:</h3>
<ul class="receita-modo_preparo">
${receita.modo_preparo
.map((passo) => `<li>${passo}</li>`)
.join("")}
</ul>
`;
}

function getReceitaIdFromURL() {
Expand All @@ -120,56 +119,70 @@ document.addEventListener("DOMContentLoaded", function () {
}

function setFavoritoButtonListener(receitaId) {
document.querySelector(".favorito-btn").addEventListener("click", function (event) {
const button = event.target.closest(".favorito-btn");
const receitasId = button.getAttribute("data-id");

const jaFavoritado = button.classList.contains("favorito");
const mensagemConfirmacao = jaFavoritado
? "Tem certeza que deseja desfavoritar esta receita?"
: "Tem certeza que deseja favoritar esta receita?";

if (confirm(mensagemConfirmacao)) {
if (jaFavoritado) {
fetch(`https://d2c501fa-4177-4d7b-a69b-81eb77e71b05-00-1wjvhqjrblfl5.kirk.replit.dev/favoritos?receitasId=${receitasId}&usuariosId=1`)
.then((res) => res.json())
.then((data) => {
const favoritoId = data[0].id;
return fetch(`https://d2c501fa-4177-4d7b-a69b-81eb77e71b05-00-1wjvhqjrblfl5.kirk.replit.dev/favoritos/${favoritoId}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
});
})
.then((response) => response.json())
.then(() => {
button.classList.remove("favorito");
})
.catch((error) => {
console.error("Erro na requisição", error);
});
} else {
fetch("https://d2c501fa-4177-4d7b-a69b-81eb77e71b05-00-1wjvhqjrblfl5.kirk.replit.dev/favoritos", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ receitasId, usuariosId: "1" }),
document
.querySelector(".favorito-btn")
.addEventListener("click", function (event) {
const button = event.target.closest(".favorito-btn");
const receitasId = button.getAttribute("data-id");

let jaFavoritado;

fetch(
`https://d2c501fa-4177-4d7b-a69b-81eb77e71b05-00-1wjvhqjrblfl5.kirk.replit.dev/favoritos?receitasId=${receitasId}&usuariosId=1`
)
.then((res) => res.json())
.then((data) => {
console.log(data);
return data[0];
})
.then((response) => response.json())
.then(() => {
button.classList.add("favorito");
})
.catch((error) => {
console.error("Erro na requisição", error);
});
}
}
});
.then((data) => {
jaFavoritado = data;
const mensagemConfirmacao = jaFavoritado
? "Tem certeza que deseja desfavoritar esta receita?"
: "Tem certeza que deseja favoritar esta receita?";

if (confirm(mensagemConfirmacao)) {
if (jaFavoritado) {
console.log("ja favoritado");
fetch(
`https://d2c501fa-4177-4d7b-a69b-81eb77e71b05-00-1wjvhqjrblfl5.kirk.replit.dev/favoritos/${jaFavoritado.id}`,
{
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
}
)
.then((res) => res.json())
.then(() => {
button.classList.remove("favorito");
})
.catch((error) => {
console.error("Erro na requisição", error);
});
} else {
fetch(
"https://d2c501fa-4177-4d7b-a69b-81eb77e71b05-00-1wjvhqjrblfl5.kirk.replit.dev/favoritos",
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ receitasId, usuariosId: "1" }),
}
)
.then((response) => response.json())
.then(() => {
button.classList.add("favorito");
})
.catch((error) => {
console.error("Erro na requisição", error);
});
}
}
});
});
}

carregarReceita();
});

//fim pagReceita.html//

0 comments on commit e31f29b

Please sign in to comment.