Merge pull request #46 from ICEI-PUC-Minas-PPLCC-TI/forum

Adicionando lógica de curtir e descurtir
ICEI-PUC-Minas-PPLCC-TI · Dec 2, 2023 · 70ac6ec · 70ac6ec
2 parents fce0170 + 77e22a3
commit 70ac6ec
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 19 deletions.
diff --git a/src/assets/js/index.js b/src/assets/js/index.js
@@ -1,4 +1,5 @@
 const apiURL = 'https://arduinohub--andreeluis.repl.co';
+const user = JSON.parse(sessionStorage.getItem('user'));
 
 const loginButton = document.querySelector('header nav .login');
 const myAccountButton = document.querySelector('header nav .my-account');

diff --git a/src/forum/assets/js/index.js b/src/forum/assets/js/index.js
@@ -3,9 +3,9 @@ let postsList;
 const form = document.querySelector('#modal form');
 
 window.addEventListener('load', showPosts, false);
+window.onbeforeunload = () => showPosts();
 document.querySelector('#add-post').addEventListener('click', addPost, false);
 
-
 // READ
 async function loadPosts() {
 	try { postsList = await (await fetch(`${apiURL}/posts`)).json() }
@@ -32,7 +32,7 @@ function generateHTML(post) {
 
       <div class="reactions">
         <span><i class="far fa-comment-alt"></i> ${comentarios.length}</span>
-        <span><i class="far fa-thumbs-up"></i> ${curtidas}</span>
+        <span><i class="${post.usuariosCurtidas.includes(user.id) ? 'fas' : 'far'} fa-thumbs-up"></i> ${curtidas}</span>
       </div>
 
       <p class="categoria">${categoria}</p>

diff --git a/src/forum/assets/js/posts.js b/src/forum/assets/js/posts.js
@@ -3,7 +3,7 @@ let post;
 
 window.addEventListener('load', showPost, false);
 document.querySelector('#comentar').addEventListener('submit', addComentario, false);
-document.querySelector('#curtir').addEventListener('click', addCurtida, false);
+document.querySelector('#curtir').addEventListener('click', curtir, false);
 
 async function loadPost() {
   try { post = await (await fetch(`${apiURL}/posts/${id}`)).json() }
@@ -13,13 +13,20 @@ async function loadPost() {
 async function showPost() {
   try {
     await loadPost();
-    
+
     const comentariosHTML = post.comentarios.map(({ id, usuario, autor, comentario }) => `
       <li id="${id}-${usuario.slice(0, 8)}">${autor} - ${comentario}</li>
     `).join('');
 
 		document.querySelector('.titulo').innerHTML = post.titulo;
 		document.querySelector('.categoria').innerHTML = post.categoria;
+
+    if (post.usuariosCurtidas.includes(user.id)) {
+      document.querySelector('#curtir i').classList.replace('far', 'fas');
+    } else {
+      document.querySelector('#curtir i').classList.replace('fas', 'far');
+    }
+
 		document.querySelector('.qtde-curtidas').innerHTML = post.curtidas;
 		document.querySelector('.autor').innerHTML = post.autor;
 
@@ -39,8 +46,8 @@ async function addComentario(event) {
 
   const novoComentario = {
     id: generateUUID(8),
-    autor: JSON.parse(sessionStorage.getItem('user')).name,
-    usuario: JSON.parse(sessionStorage.getItem('user')).id,
+    autor: user.name,
+    usuario: user.id,
     comentario: document.querySelector('#comentario').value,
   };
 
@@ -49,27 +56,50 @@ async function addComentario(event) {
     headers: {
       'Content-Type': 'application/json',
     },
-    //body: JSON.stringify({ novoComentario }),
     body: JSON.stringify({ comentarios: [...post.comentarios, novoComentario] }),
   })
+    .then(() => document.querySelector('#comentario').value = '')
     .then(() => showPost())
     .catch(error => {
       console.error('Erro ao inserir comentario via API JSONServer:', error);
     });
 }
 
-async function addCurtida() {
+async function curtir() {
   await loadPost();
 
-  fetch(`${apiURL}/posts/${id}`, {
-    method: 'PATCH',
-    headers: {
-      'Content-Type': 'application/json',
-    },
-    body: JSON.stringify({ curtidas: post.curtidas + 1 }),
-  })
-    .then(() => showPost())
-    .catch(error => {
-      console.error('Erro ao inserir curtida via API JSONServer:', error);
-    });
+  const usuariosCurtidas = post.usuariosCurtidas;
+
+  if (!usuariosCurtidas.includes(user.id)) {
+    fetch(`${apiURL}/posts/${id}`, {
+      method: 'PATCH',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        curtidas: post.curtidas + 1,
+        usuariosCurtidas: [...usuariosCurtidas, user.id],
+      }),
+    })
+      .then(() => showPost())
+      .catch(error => {
+        console.error('Erro ao inserir curtida:', error);
+      });
+  }
+  else {
+    fetch(`${apiURL}/posts/${id}`, {
+      method: 'PATCH',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        curtidas: post.curtidas - 1,
+        usuariosCurtidas: usuariosCurtidas.filter(usuario => usuario !== user.id),
+      }),
+    })
+      .then(() => showPost())
+      .catch(error => {
+        console.error('Erro ao remover curtida:', error);
+      });
+  }
 }