Merge pull request #73 from illuminati1618/main

PERIOD2 - RealityRoom Friday Pull Request
nighthawkcoders · Nov 1, 2024 · 8675ba7 · 8675ba7
2 parents c500af5 + 912ec4e
commit 8675ba7
Show file tree

Hide file tree

Showing 4 changed files with 133 additions and 34 deletions.
diff --git a/_includes/nav/create_and_compete.html b/_includes/nav/create_and_compete.html
@@ -2,10 +2,11 @@
     <tr>
         <td id="createandcompete">
             <a href="{{site.baseurl}}/create_and_compete/home">
-                <img src="{{site.baseurl}}/images/favicon.ico" alt="Icon">
+                <img src="{{site.baseurl}}/images/createandcompete/logo.png" alt="Icon">
             </a>
         </td>
-        <td id="realityroom"><a href="{{site.baseurl}}/create_and_compete/realityroom">Reality Room</a></td>
+
+        <td id="realityroom"><a href="{{site.baseurl}}/create_and_compete/realityroom-home">Reality Room</a></td>
         <td id="elevatorpitch"><a href="{{site.baseurl}}/create_and_compete/elevatorpitch">Elevator Pitch</a></td>
         <td id="zoominguess"><a href="{{site.baseurl}}/create_and_compete/zoominguess">Zooming Guess</a></td>
         <td id="doodle"><a href="{{site.baseurl}}/create_and_compete/doodle">Doodle</a></td>

diff --git a/images/createandcompete/logo.png b/images/createandcompete/logo.png
diff --git a/navigation/create_and_compete/reality-game.md b/navigation/create_and_compete/reality-game.md
@@ -258,17 +258,35 @@ author: Yash, Nikhil, Rohan, Neil
 </script>
 
 <script>
+    async function fetchPosts() {
+        const urlParams = new URLSearchParams(window.location.search);
+        const postId = urlParams.get('postId');
+        console.log(postId)
+        console.log("test")
+
+        try {
+            const response = await fetch(`${pythonURI}/api/post`, fetchOptions);
+            if (!response.ok) {
+                throw new Error('Failed to fetch groups: ' + response.statusText);
+            }
+            const posts = await response.json();
+            console.log(posts)
+
+        } catch (error) {
+            console.error('Error fetching groups:', error);
+        }
+    }
+    fetchPosts();
+
     // file upload functionality
     function triggerFileUpload() {
         document.getElementById('file-input').click();
     }
-</script>
 
-<script>
     function toggleRedirect() {
         const checkbox = document.getElementById('toggle-switch');
         if (checkbox.checked) {
             window.location.href = '{{site.baseurl}}/create_and_compete/realityroom';
         }
     }
-</script>
+</script>
diff --git a/navigation/create_and_compete/reality-room-home.md b/navigation/create_and_compete/reality-room-home.md
@@ -10,18 +10,20 @@ author: Yash, Nikhil, Rohan, Neil
 <div class="form-container">
     <h2>Add New Post</h2>
     <form id="postForm">
-        <label for="title">Title:</label>
-        <input type="text" id="title" name="title" required>
-        <label for="content">Content:</label>
+        <label for="title" class="label">Title:</label> <br>
+        <input type="text" id="title" name="title" required> <br>
+        <label for="content" class="label">Content:</label>
         <textarea id="content" name="content" required></textarea>
         <button type="submit">Add Post</button>
     </form>
 </div>
 
-
 <div id="posts"></div>
 
 <style>
+    #posts {
+        display: inline-grid;
+    }
     .card {
         width: 300px;
         padding: 20px;
@@ -48,6 +50,7 @@ author: Yash, Nikhil, Rohan, Neil
         color: white;
         border: none;
         padding: 8px 16px;
+        margin: 5px;
         border-radius: 4px;
         cursor: pointer;
         font-size: 0.9em;
@@ -60,36 +63,71 @@ author: Yash, Nikhil, Rohan, Neil
     }
 </style>
 
+<style>
+.form-container {
+    width: 500px;
+    margin: 20px auto;
+    padding: 16px;
+    border: 1px solid #e1e8ed;
+    border-radius: 16px;
+    background-color: #ffffff;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+    font-family: Arial, sans-serif;
+}
+
+#content {
+    width: 100%;
+    border: none;
+    outline: none;
+    resize: none;
+    font-size: 16px;
+    padding: 12px;
+    color: #14171a;
+    border-bottom: 1px solid #e1e8ed;
+    box-sizing: border-box;
+    height: 100px;
+}
+
+.form-footer {
+    display: flex;
+    justify-content: flex-end;
+    padding-top: 12px;
+}
+
+button[type="submit"] {
+    background-color: #1da1f2;
+    color: #ffffff;
+    border: none;
+    border-radius: 20px;
+    padding: 8px 16px;
+    font-size: 14px;
+    font-weight: bold;
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+}
+
+button[type="submit"]:hover {
+    background-color: #1a91da;
+}
+
+h2 {
+    color: #ff4d4d !important;
+}
+
+.label {
+    color: #ff4d4d !important;
+}
+</style>
+
 <script type="module">
     import { pythonURI, fetchOptions } from '../assets/js/api/config.js';
     const container = document.getElementById("posts");
 
-    // function deletePost(formID) {
-    //     event.preventDefault();
-
-    //     // Create API payload
-    //     const deleteData = {
-    //         id: formID,
-    //     };
-
-    //     try {
-    //         const response = await fetch(`${pythonURI}/api/post`, {
-    //             ...fetchOptions,
-    //             method: 'DELETE',
-    //             headers: {
-    //                 'Content-Type': 'application/json'
-    //             },
-    //             body: JSON.stringify(postData)
-    //         });
+    function openChatRoom(button) {
+        const postId = button.getAttribute("id");
+        window.location.href = `{{site.baseurl}}/create_and_compete/realityroom?postId=${postId}`;
+    }
 
-    //         if (!response.ok) {
-    //             throw new Error('Failed to delete post: ' + response.statusText);
-    //         }
-    //     } catch (error) {
-    //         console.error('Error deleting post:', error);
-    //         alert('Error deleting post: ' + error.message);
-    //     }
-    // }
 
     async function fetchPosts() {
         try {
@@ -122,9 +160,19 @@ author: Yash, Nikhil, Rohan, Neil
                 deleteButton.classList.add("delete-button");
                 deleteButton.textContent = "Delete";
 
+                const commentButton = document.createElement("button");
+                commentButton.classList.add("delete-button");
+                commentButton.textContent = "Comment";
+                commentButton.setAttribute("id", post.id);
+
+                commentButton.onclick = function () {
+                    openChatRoom(commentButton);
+                };
+
                 card.appendChild(title);
                 card.appendChild(description);
                 card.appendChild(deleteButton);
+                card.appendChild(commentButton);
 
                 container.appendChild(card);
             });
@@ -173,5 +221,37 @@ author: Yash, Nikhil, Rohan, Neil
         }
     });
 
+    function redirect() {
+
+    }
+
+
+    // function deletePost(formID) {
+    //     event.preventDefault();
+
+    //     // Create API payload
+    //     const deleteData = {
+    //         id: formID,
+    //     };
+
+    //     try {
+    //         const response = await fetch(`${pythonURI}/api/post`, {
+    //             ...fetchOptions,
+    //             method: 'DELETE',
+    //             headers: {
+    //                 'Content-Type': 'application/json'
+    //             },
+    //             body: JSON.stringify(postData)
+    //         });
+
+    //         if (!response.ok) {
+    //             throw new Error('Failed to delete post: ' + response.statusText);
+    //         }
+    //     } catch (error) {
+    //         console.error('Error deleting post:', error);
+    //         alert('Error deleting post: ' + error.message);
+    //     }
+    // }
+
     fetchPosts();
 </script>