pages...

README.md

@@ -76,7 +76,7 @@ And, you can learn about API in `util/APIDOCS.md`.
 | auto-scroll  | 🟢 | LOW |
 | Multi-theme support | 🔴 | LOW |
 | Search | 🔴 | MEDIUM |
-| Better view, page support | 🔴 | MEDIUM |
+| Better view, page support, support message limit correct | 🔴 | MEDIUM |
 | Sending message etc. will use fetch API | 🟢 | HIGH |
 
 ## Screenshot

public/js/thread.js

@@ -1,7 +1,7 @@
 import request from "./request.js";
 
 const messages = document.getElementById("messages");
-
+let messages_raw = [];
 function renderMessage(message) {
     const messageElement = document.createElement("div");
     messageElement.classList.add("message");
@@ -40,16 +40,15 @@ function renderMessage(message) {
  */
 (async () => {
 
-    const result = await fetch(`/api/threads/${messages.getAttribute("value")}/messages/`).then(res => res.json());
- 
-    if (result?.error) {
+    messages_raw = await fetch(`/api/threads/${messages.getAttribute("value")}/messages/`).then(res => res.json());
+    if (messages_raw?.error) {
 
         document.getElementById("messages").innerHTML
             += '<div class="message"><h1>THIS THREAD HAS NOT GOT ANY MESSAGE</h1></div>';
 
 
     } else
-        for (const message of result) 
+        for (const message of messages_raw)
             renderMessage(message);
 
     window.scrollTo(0, document.body.scrollHeight);
@@ -80,6 +79,7 @@ document.getElementById("send").addEventListener("submit", async e => {
  * Button Listener
  */
 document.addEventListener("click", async e => {
+    let page = 1;
     //   e.preventDefault();
     if (e.target.id === "delete_thread") {
         const response = await request("/api/threads/" + e.target.value + "/delete");
@@ -95,6 +95,16 @@ document.addEventListener("click", async e => {
             alert("Message deleted");
             document.getElementById("message-delete-" + e.target.value).innerHTML = "<h3 style=\"display:inline;\">This message has been deleted</h3>";
         }
+    } else if (e.target.id === "left_page") {
+        e.preventDefault();
+        
+    }else if (e.target.id === "right_page") {
+        e.preventDefault();
+        const response = await request(`/api/messages/${e.target.value}/delete`);
+        if (response.deleted) {
+            alert("Message deleted");
+            document.getElementById("message-delete-" + e.target.value).innerHTML = "<h3 style=\"display:inline;\">This message has been deleted</h3>";
+        }
     }/*else if (e.target.id === "edit_thread") {
       window.location.href = "/threads/<%= thread.id }/edit";
     } */

views/thread.ejs

@@ -55,9 +55,14 @@
                 <script>
                   document.getElementById("message-<%= scroll %>").scrollIntoView();
                 </script>
-           <!--    <button id="left_page"  style=" float: right;"  type="submit">PREV</button>
 
-                <button id="right_page" style="display:inline;float: right;" type="submit">NEXT</button>--> 
+                 <!--     <div style="float: right;">
+                          <h3 id="page_count" style="display:inline;">1</h3>
+                          <button id="left_page" style=" display:inline;float: right;" type="submit">PREV</button>
+                          
+                          <button id="right_page" style="display:inline;float: right;" type="submit">NEXT</button>
+                      </div>--> 
+              
                 <%- include("extra/footer") %>
   </body>