Browse Source

좋아요버튼 기능

Gayeon Park 3 years ago
parent
commit
5ccfffec58
1 changed files with 17 additions and 3 deletions
  1. 17 3
      realworld/src/main/webapp/WEB-INF/jsp/main.jsp

+ 17 - 3
realworld/src/main/webapp/WEB-INF/jsp/main.jsp

@@ -89,6 +89,19 @@
         }, 2000);
     }
 
+    function favoriteBtn(indexNumber) {
+        const favBtn = document.querySelectorAll('.favorite-btn');
+        if("${ssIsLogin}" === "true"){
+            favBtn.forEach(value => {
+                if(value.classList.contains(indexNumber)){
+                    value.classList.toggle('active');
+                }
+            })
+        } else {
+            location.href = "/user/signin"
+        }
+    }
+
     window.onload = (event) => {
             
             ssIsLogin = "${ssIsLogin}";
@@ -101,7 +114,7 @@
             articleList = window.document.querySelector('#article-list');
             noTag = window.document.querySelector('#no-tag');
             tagList = window.document.querySelector('#tag-list');
-    
+
             // fetch api call
             const options = { method: 'GET' };
             const tagSet = new Set();
@@ -128,7 +141,7 @@
                                     </div>
                                 </div>
                                 <div>
-                                    <button class="favorite-btn">
+                                    <button class="favorite-btn \${article.id}" onclick="favoriteBtn(\${article.id})">
                                         <i class="fas fa-heart"></i>
                                         <span class="count">564</span>
                                     </button>
@@ -142,7 +155,7 @@
     
                         const domStrPreviewLink = 
                         `
-                            <a href="#" class="preview-link">
+                            <a href="/article/\${article.id}" class="preview-link">
                                 <h1 class="preview-title"></h1>
                                 <p></p>
                                 <div class="tag-data">
@@ -182,6 +195,7 @@
                         }
                         
                         articleList.appendChild(articlePreview);
+                        console.log(articlePreview);
                     });
                     
                     const tags = Array.from(tagSet);