From e31f29b14e59fc2b89679cc12a5295c1500bf616 Mon Sep 17 00:00:00 2001
From: Gabriel Diniz <gabrieldrvianna@gmail.com>
Date: Thu, 20 Jun 2024 16:13:46 -0300
Subject: [PATCH] Update script.js

---
 .../diniz/sprint3-diniz/assets/js/script.js   | 161 ++++++++++--------
 1 file changed, 87 insertions(+), 74 deletions(-)

diff --git a/codigo/diniz/sprint3-diniz/assets/js/script.js b/codigo/diniz/sprint3-diniz/assets/js/script.js
index 031eb51..c241592 100644
--- a/codigo/diniz/sprint3-diniz/assets/js/script.js
+++ b/codigo/diniz/sprint3-diniz/assets/js/script.js
@@ -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);
     });
   }
@@ -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() {
@@ -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//