fix endpoint, html parse, load more posts

5 files changed, 44 insertions, 5 deletions

diff --git a/public/css/home.css b/public/css/home.css
index 33d72c0..f05466a 100644
--- a/public/css/home.css
+++ b/public/css/home.css
@@ -179,4 +179,15 @@ body {
     width: calc(100% - 20px);
     background-color: #f0f2f5;
     font-family: sfpro;
+}
+
+#load {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    padding-bottom: 20px;
+}
+
+#load a:hover {
+    border-bottom: #606770 1px solid;
 }
\ No newline at end of file
diff --git a/public/home.html b/public/home.html
index 79c807b..865e53a 100644
--- a/public/home.html
+++ b/public/home.html
@@ -12,6 +12,6 @@
     <script src="/js/header.js"></script>
     <script src="/js/api.js"></script>
     <script src="/js/home.js"></script>
-    <script>load()</script>
+    <script>init()</script>
 </body>
 </html>
\ No newline at end of file
diff --git a/public/js/api.js b/public/js/api.js
index 371ecf3..9b5a4dd 100644
--- a/public/js/api.js
+++ b/public/js/api.js
@@ -1,4 +1,4 @@
-const endpoint = 'https://xssbook.com/api'
+const endpoint = '/api'
 
 const request = async (url, body, method) => {
     if (method === undefined) method = 'POST'
diff --git a/public/js/home.js b/public/js/home.js
index 7697c29..f3711ad 100644
--- a/public/js/home.js
+++ b/public/js/home.js
@@ -179,6 +179,18 @@ function render() {
     `
 
     add(popup, 'popup')
+
+    const load = `
+    <div id="load">
+        <a class="bold gtext" onclick="load()">Load More posts</a>
+    </div>
+    `
+
+    if (page !== -1) {
+        add(load, 'load')
+    } else {
+        remove('load')
+    }
 }
 
 var page = 0
@@ -189,9 +201,12 @@ const data = {
 }
 
 async function load() {
-    header(true, false)
     const posts = (await loadposts(page)).json
-    page++;
+    if (posts.length === 0) {
+        page = -1;
+    } else {
+        page++;
+    }
     data.posts.push(... posts)
     const batch = []
     for (const post of posts) {
@@ -208,7 +223,13 @@ async function load() {
     for (const id in users) {
         data.users[id] = users[id]
     }
+    render()
+}
+
+
+async function init() {
+    header(true, false)
     data.user = (await loadself()).json
     data.users[data.user.id] = data.user
-    render()
+    load()
 }
\ No newline at end of file
diff --git a/public/js/main.js b/public/js/main.js
index 42cc6fe..0003c0d 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -12,4 +12,11 @@ function add(html, id) {
     document.body.appendChild(
         range.createContextualFragment(html)
     )
+}
+
+function remove(id) {
+    const old = document.getElementById(id)
+    if (old !== null) {
+        old.remove()
+    }
 }
\ No newline at end of file