5 files changed, 48 insertions, 35 deletions

diff --git a/public/css/home.css b/public/css/home.css
index f05466a..33d72c0 100644
--- a/public/css/home.css
+++ b/public/css/home.css
@@ -179,15 +179,4 @@ 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/css/main.css b/public/css/main.css
index a75a941..c1b4fa2 100644
--- a/public/css/main.css
+++ b/public/css/main.css
@@ -293,4 +293,15 @@ form {
     border-radius: 10px;
     margin-left: 10px;
     width: 100%;
+}
+
+#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/js/api.js b/public/js/api.js
index 9b5a4dd..f0879c9 100644
--- a/public/js/api.js
+++ b/public/js/api.js
@@ -20,8 +20,8 @@ const login = async (email, password) => {
     return await request('/auth/login', {email, password})
 }
 
-const register = async (first, last, email, password, gender, month, day, year) => {
-    return await request('/auth/register', {first, last, email, password, gender, month, day, year})
+const register = async (firstname, lastname, email, password, gender, month, day, year) => {
+    return await request('/auth/register', {firstname, lastname, email, password, gender, month, day, year})
 }
 
 const loadposts = async (page) => {
@@ -36,12 +36,12 @@ const loadusers = async (ids) => {
     return await request('/users/load', {ids})
 }
 
-const loadallusers = async () => {
-    return await request('/users/all', {})
+const loaduserspage = async (page) => {
+    return await request('/users/page', {page})
 }
 
 const loadself = async () => {
-    return await request("/auth/self", {})
+    return await request("/users/self", {})
 }
 
 const postcomment = async (id, content) => {
diff --git a/public/js/home.js b/public/js/home.js
index f3711ad..9ccd610 100644
--- a/public/js/home.js
+++ b/public/js/home.js
@@ -44,13 +44,13 @@ function parsePost(post) {
             ${post.content.replace(/\n/g,'<br>')}
         </p>
         <span class="gtext mtext">
-                ${post.likes.length} Likes
+                ${Object.keys(post.likes).length} Likes
         </span>
         <div class="fullline nb"></div>
         <div class="postbuttons">
             <span onclick="like(this)">
-                <i class="icons like ${post.likes.includes(data.user.id) ? 'blue' : ''}"></i>
-                <span class="bold ${post.likes.includes(data.user.id) ? 'blue' : ''}">Like</span>
+                <i class="icons like ${post.likes[data.user.id] ? 'blue' : ''}"></i>
+                <span class="bold ${post.likes[data.user.id] ? 'blue' : ''}">Like</span>
             </span>
             <span onclick="this.parentElement.parentElement.getElementsByClassName('newcomment')[0].focus()">
                 <i class="icons comm"></i>
@@ -87,15 +87,10 @@ function getPost(id) {
 async function like(span) {
     const id = parseInt(span.parentElement.parentElement.getAttribute('postid'))
     const post = data.posts[getPost(id)]
-    const index = post.likes.indexOf(data.user.id)
-    const state = index === -1;
-    const response = await postlike(id, state)
+    const current = post.likes[data.user.id]
+    const response = await postlike(id, !current)
     if (response.status != 200) return;
-    if (index == -1) {
-        post.likes.push(data.user.id)
-    } else {
-        post.likes.splice(index, 1)
-    }
+    post.likes[data.user.id] = !current
     render()
 }
 
@@ -127,7 +122,7 @@ async function post() {
     }
     error.innerHTML = '';
     data.posts.unshift({
-        id: data.posts[0].id + 1,
+        id: response.msg,
         user: data.user.id,
         date: Date.now(),
         content: text,
@@ -182,7 +177,7 @@ function render() {
 
     const load = `
     <div id="load">
-        <a class="bold gtext" onclick="load()">Load More posts</a>
+        <a class="bold gtext" onclick="load()">Load more posts</a>
     </div>
     `
 
@@ -203,9 +198,9 @@ const data = {
 async function load() {
     const posts = (await loadposts(page)).json
     if (posts.length === 0) {
-        page = -1;
+        page = -1
     } else {
-        page++;
+        page++
     }
     data.posts.push(... posts)
     const batch = []
diff --git a/public/js/people.js b/public/js/people.js
index 415dd16..4351315 100644
--- a/public/js/people.js
+++ b/public/js/people.js
@@ -16,6 +16,7 @@ function parseUser(user) {
                 <span class="gtext">Joined ${parseDate(new Date(user.date))}</span>
                 <span class="gtext">Gender: ${user.gender}</span>
                 <span class="gtext">Birthday: ${user.month + ' ' + user.day + ', ' + user.year}</span>
+                <span class="gtext" style="margin-bottom: -100px;">User ID: ${user.id}</span>
             </div>
         </a>
     `
@@ -29,17 +30,34 @@ function render() {
     </div>
     `
 
-    add(html, 'usres')
+    add(html, 'users')
+
+    const load = `
+    <div id="load">
+        <a class="bold gtext" onclick="load()">Load more users</a>
+    </div>
+    `
+
+    if (page !== -1) {
+        add(load, 'load')
+    } else {
+        remove('load')
+    }
 }
 
+var page = 0
 var data = {
     users: []
 }
 
 async function load() {
-    const users = (await loadallusers()).json
-    console.log(users)
-    data.users = users
+    const users = (await loaduserspage(page)).json
+    if (users.length === 0) {
+        page = -1
+    } else {
+        page++
+    }
+    data.users.push(... users)
     render()
 }