fix rerendering logout button, console page

8 files changed, 70 insertions, 30 deletions

diff --git a/public/css/console.css b/public/css/console.css
index bc07969..e3fde6a 100644
--- a/public/css/console.css
+++ b/public/css/console.css
@@ -2,8 +2,6 @@ body {
     margin: 0;
     padding: 0;
     background-color: #181818;
-    display: flex;
-    flex-direction: column-reverse;
 }
 
 @font-face {
@@ -30,20 +28,20 @@ span {
     margin-right: 10px;
 }
 
+.body span {
+    margin-right: 0;
+}
+
 .json span {
     display: inline;
     margin: 0;
 }
 
-.key {
-    color: white;
-}
-
 .value {
     color: white;
 }
 
-.boolean {
+.bool {
     color:  aqua;
 }
 
@@ -57,4 +55,8 @@ span {
 
 .string {
     color: #4ae04a
+}
+
+.key .string {
+    color: white;
 }
\ No newline at end of file
diff --git a/public/css/profile.css b/public/css/profile.css
index 4c5ae10..467c756 100644
--- a/public/css/profile.css
+++ b/public/css/profile.css
@@ -62,6 +62,7 @@ body {
     height: 3em;
     display: flex;
     align-items: center;
+    justify-content: space-between;
 }
 
 .profilebuttons button {
@@ -74,6 +75,7 @@ body {
     justify-content: center;
     color: #606770;
     cursor: pointer;
+    flex: 0;
 }
 
 .profilebuttons button:hover {
@@ -118,4 +120,9 @@ body {
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
+}
+
+.logout {
+    flex: 1;
+    /* align-self: flex-end !important; */
 }
\ No newline at end of file
diff --git a/public/js/api.js b/public/js/api.js
index 07769f6..77adff7 100644
--- a/public/js/api.js
+++ b/public/js/api.js
@@ -30,6 +30,10 @@ const register = async (firstname, lastname, email, password, gender, day, month
     return await request('/auth/register', {firstname, lastname, email, password, gender, day, month, year})
 }
 
+const logout = async () => {
+    return await request('/auth/logout', {})
+}
+
 const loadpostspage = async (page) => {
     return await request('/posts/page', {page})
 }
diff --git a/public/js/home.js b/public/js/home.js
index 23f0d01..688cbf5 100644
--- a/public/js/home.js
+++ b/public/js/home.js
@@ -1,12 +1,5 @@
-const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
-                  'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
-
-function parseDate(date) {
-    return months[date.getUTCMonth()] + ' ' + date.getUTCDate() + ', ' + date.getUTCFullYear() + ' ' + date.toLocaleTimeString();
-}
-
 function parseComment(comment) {
-    const author = data.users[comment[0]]
+    let author = data.users[comment[0]]
     if (author === undefined) {
         author = {}
     }
@@ -25,14 +18,14 @@ function parseComment(comment) {
 }
 
 function parsePost(post) {
-    const author = data.users[post.user_id]
+    let author = data.users[post.user_id]
     if (author === undefined) {
         author = {}
     }
     const html = `
     <div class="post" postid=${post.post_id}>
         <div class="postheader">
-            <a class="pfp">
+            <a class="pfp" href=/profile?id=${author.user_id}>
                 
             </a>
             <div class="postname">
@@ -217,8 +210,8 @@ async function load() {
         batch.push(post.user_id)
     }
     const users = (await loadusers(batch)).json
-    for (const id in users) {
-        data.users[id] = users[id]
+    for (const user of users) {
+        data.users[user.user_id] = user
     }
     render()
 }
diff --git a/public/js/login.js b/public/js/login.js
index f65808b..0d9feb8 100644
--- a/public/js/login.js
+++ b/public/js/login.js
@@ -20,7 +20,7 @@ async function onregister() {
     const year = document.getElementById('year').value
     const gender = document.querySelector('input[name="gender"]:checked').value  
     const response = await register(first, last, email, pass, gender, parseInt(day), parseInt(month), parseInt(year))
-    if (response.status !== 200) {
+    if (response.status !== 201) {
         const error = document.getElementsByClassName('error')[1]
         error.innerHTML = response.msg
     } else {
diff --git a/public/js/main.js b/public/js/main.js
index 0003c0d..06736ee 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -19,4 +19,25 @@ function remove(id) {
     if (old !== null) {
         old.remove()
     }
+}
+
+const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
+'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+
+const letters = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 
+    'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
+
+function parseMonth(month) {
+    if (month > -1 && month < 26) {
+        return months[month]
+    } else {
+        let first = letters[month%26].toUpperCase()
+        let middle = letters[month*13%26]
+        let last = letters[month*50%26]
+        return first + middle + last
+    }
+}
+
+function parseDate(date) {
+    return parseMonth(date.getUTCMonth()) + ' ' + date.getUTCDate() + ', ' + date.getUTCFullYear() + ' ' + date.toLocaleTimeString();
 }
\ No newline at end of file
diff --git a/public/js/people.js b/public/js/people.js
index ddd1875..e9f5db6 100644
--- a/public/js/people.js
+++ b/public/js/people.js
@@ -1,10 +1,3 @@
-const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
-                  'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
-
-function parseDate(date) {
-    return months[date.getUTCMonth()] + ' ' + date.getUTCDate() + ', ' + date.getUTCFullYear() + ' ' + date.toLocaleTimeString();
-}
-
 function parseUser(user) {
     const html = `
         <a class="person" href="/profile?id=${user.id}">
@@ -15,7 +8,7 @@ function parseUser(user) {
                 <span class="bold ltext">${user.firstname + ' ' + user.lastname}</span>
                 <span class="gtext">Joined ${parseDate(new Date(user.date))}</span>
                 <span class="gtext">Gender: ${user.gender}</span>
-                <span class="gtext">Birthday: ${months[user.month] + ' ' + user.day + ', ' + user.year}</span>
+                <span class="gtext">Birthday: ${parseMonth(user.month) + ' ' + user.day + ', ' + user.year}</span>
                 <span class="gtext" style="margin-bottom: -100px;">User ID: ${user.user_id}</span>
             </div>
         </a>
diff --git a/public/js/profile.js b/public/js/profile.js
index 79dbe2f..1f72b17 100644
--- a/public/js/profile.js
+++ b/public/js/profile.js
@@ -23,6 +23,8 @@ function render() {
             <button class="${posts ? '' : 'selected'}" onclick="posts = false; render()">
                 About
             </button>
+            <div style="flex: 20"></div>
+            ${ isself ? `<button class="logout" onclick="logout_button()">Logout</button>` : ''}
         </div>
     </div>
     `
@@ -44,7 +46,7 @@ function render() {
             <span class="gtext bold">Name: ${data.user.firstname + ' ' + data.user.lastname}</span>
             <span class="gtext bold">Email: ${data.user.email}</span>
             <span class="gtext bold">Gender: ${data.user.gender}</span>
-            <span class="gtext bold">Birthday: ${months[data.user.month] + ' ' + data.user.day + ', ' + data.user.year}</span>
+            <span class="gtext bold">Birthday: ${parseMonth(data.user.month) + ' ' + data.user.day + ', ' + data.user.year}</span>
             <span class="gtext bold">User ID: ${data.user.user_id}</span>
         </div>
     </div>
@@ -53,7 +55,14 @@ function render() {
     add(about, 'about')
 }
 
+async function logout_button() {
+    const response = await logout()
+    if (response.status != 200) return;
+    location.href = '/login'
+}
+
 var posts = true
+var isself = false
 
 async function load() {
     header(false, false)
@@ -63,7 +72,18 @@ async function load() {
         params[key] = value
     }
 
-    const id = params.id !== undefined && !isNaN(params.id) ? parseInt(params.id) : (await loadself()).json.user_id
+    let self = (await loadself()).json;
+    let id;
+    
+    if (params.id !== undefined && !isNaN(params.id)) {
+
+        id = parseInt(params.id);
+    } else {
+        id = self.user_id
+    }
+
+    isself = id === self.user_id
+
     const posts = (await loadusersposts(id)).json
     data.posts.push(... posts)
     const batch = [id]