Current Version

AbdulDevHub · Mar 7, 2024 · 3de76a9 · 3de76a9
1 parent 48ae92c
commit 3de76a9
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 43 deletions.
diff --git a/main.js b/main.js
@@ -18,33 +18,6 @@ function toggleDarkMode() {
     document.body.classList.toggle('dark-mode');
 }
 
-// Delete The Fake Place Holder Posts
-document.querySelectorAll('.fake-post').forEach(function(button) {
-    button.addEventListener('click', function(e) {
-        e.target.closest('.post').remove();
-    });
-});
-
-// Load fake posts from localStorage on page load
-window.addEventListener('DOMContentLoaded', (event) => {
-    let posts = JSON.parse(localStorage.getItem('posts'));
-    if (posts) {
-        document.getElementById('posts-container').innerHTML = posts;
-    }
-});
-
-// Add event listener to all fake posts to add delete buttons
-document.getElementById('posts-container').addEventListener('click', function(e) {
-    if (e.target.classList.contains('fake-post')) {
-        // Remove post from DOM
-        e.target.closest('.post').remove();
-
-        // Save current state of posts to localStorage
-        localStorage.setItem('posts', JSON.stringify(document.getElementById('posts-container').innerHTML));
-    }
-});
-
-
 function filterPostsByTag() {
     const searchValue = document.getElementById('search-tags').value.toLowerCase().trim();
     const posts = document.querySelectorAll('.post');
@@ -129,6 +102,19 @@ window.onload = function() {
         postElement.setAttribute('data-tags', post.tags); // Ensure tags are added as a data attribute for searching
         postElement.innerHTML = `<h1>${post.title}</h1><p>${post.message}</p><p style="font-size: 80%">Tags: ${post.tags}</p>`; // Format the post with title, message, and tags
 
+        // Create delete button
+        const deleteButton = document.createElement('button');
+        deleteButton.innerText = 'Delete';
+        deleteButton.classList.add('delete-button'); // Add class to the delete button
+        deleteButton.onclick = function() {
+            postsContainer.removeChild(postElement);
+            // Update local storage
+            let posts = JSON.parse(localStorage.getItem('posts')) || [];
+            posts = posts.filter(p => p.title !== post.title && p.message !== post.message && p.tags !== post.tags);
+            localStorage.setItem('posts', JSON.stringify(posts));
+        };
+
+        postElement.appendChild(deleteButton); // Append delete button to the post
         postsContainer.appendChild(postElement);
     });
-}
+}
diff --git a/notes.html b/notes.html
@@ -78,26 +78,12 @@ <h2>Create a New Post</h2>
     <!-- Posts will be dynamically inserted here -->
     <div id="posts-container">
         <!-- Existing posts will be fetched and displayed here -->
-        <div class="post" data-tags="(CSC209) (Lecture)">
+        <div class="post fake-post" data-tags="(CSC209) (Lecture)">
             <h1>Recent CSC209 Notes</h1>
             <p>Does anyone have notes on the prof's writing from the most recent lecture? I missed the last few slides.</p>
             <p style="font-size: 80%">Tags: (CSC209) (Lecture)</p>
             <button class="delete-button fake-post">Delete</button>
         </div>
-
-        <div class="post" data-tags="(CCT386) (Definitions)">
-            <h1>CCT386 Notes</h1>
-            <p>Here's a link to some of the definitions from class. Feel free to comment if I missed any.</p>
-            <p style="font-size: 80%">Tags: (CCT386) (Definitions)</p>
-            <button class="delete-button fake-post">Delete</button>
-        </div>
-
-        <div class="post" data-tags="(CCT109) (Lecture)">
-            <h1>CCT109 Lecture Summary</h1>
-            <p>Had to miss yesterday's lecture. I went through the slide deck but could anyone summarize what the lecture covered?</p>
-            <p style="font-size: 80%">Tags: (CCT109) (Lecture)</p>
-            <button class="delete-button fake-post">Delete</button>
-        </div>
     </div>
 
     <!-- Footer -->