colored pfps

5 files changed, 18 insertions, 12 deletions

diff --git a/public/js/header.js b/public/js/header.js
index 5a12408..0e251ed 100644
--- a/public/js/header.js
+++ b/public/js/header.js
@@ -1,4 +1,4 @@
-function header(home, people) {
+function header(home, people, user_id) {
     const html = `
     <div id="header">
         <span class="logo"><a href="/">xssbook</a></span>
@@ -15,7 +15,7 @@ function header(home, people) {
             </a>
         </div>
         <a class="pfp" id="profile" hreF="profile">
-            
+            ${pfp(user_id)}
         </a>
     </div>
     <div class="spacer"></div>
diff --git a/public/js/home.js b/public/js/home.js
index cf56eca..0083297 100644
--- a/public/js/home.js
+++ b/public/js/home.js
@@ -6,7 +6,7 @@ function parseComment(comment) {
     const html = `
     <div class="comment">
         <a class="pfp">
-        
+            ${pfp(author.user_id)}
         </a>
         <span>
             <span class="bold mtext">${author.firstname + ' ' + author.lastname}</span>
@@ -26,7 +26,7 @@ function parsePost(post) {
     <div class="post" postid=${post.post_id}>
         <div class="postheader">
             <a class="pfp" href=/profile?id=${author.user_id}>
-                
+                ${pfp(author.user_id)}
             </a>
             <div class="postname">
                 <span class="bold">${author.firstname + ' ' + author.lastname}</span>
@@ -55,7 +55,7 @@ function parsePost(post) {
                 ${post.comments.map(parseComment).join('')}
             <div class="comment commentsubmit">
                 <a class="pfp" href="profile">
-                
+                    ${pfp(data.user.user_id)}
                 </a>
                 <form onsubmit="comment(event)">
                     <input type="text" name="text" placeholder="Write a comment..." id="newcomment" class="newcomment">
@@ -159,7 +159,7 @@ function render() {
     <div id="create">
         <div class="create">
             <a class="pfp" href="profile">
-                    
+                ${pfp(data.user.user_id)}
             </a>
             <button class="pfp">
                 <p class="gtext" onclick="document.getElementById('popup').classList.remove('hidden')">
@@ -183,7 +183,7 @@ function render() {
             <div class="fullline"></div>
             <div class="postheader">
                 <a class="pfp" style="cursor: auto">
-                    
+                    ${pfp(data.user.user_id)}
                 </a>
                 <div class="postname">
                     <span class="bold">${data.user.firstname + ' ' + data.user.lastname}</span>
@@ -243,8 +243,8 @@ async function load() {
 }
 
 async function init() {
-    header(true, false)
     data.user = (await loadself()).json
+    header(true, false, data.user.user_id)
     data.users[data.user.user_id] = data.user
     const posts = await load()
     data.posts.push(... posts)
diff --git a/public/js/main.js b/public/js/main.js
index 12f53ec..87dd8e0 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -32,6 +32,10 @@ function remove(id) {
     }
 }
 
+function pfp(id) {
+    return `<img src="/img/${id % 25}.png">`
+}
+
 const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
 
diff --git a/public/js/people.js b/public/js/people.js
index 15fde59..b861818 100644
--- a/public/js/people.js
+++ b/public/js/people.js
@@ -2,7 +2,7 @@ function parseUser(user) {
     const html = `
         <a class="person" href="/profile?id=${user.user_id}">
             <div class="profile">
-
+                ${pfp(user.user_id)}
             </div>
             <div class="info">
                 <span class="bold ltext">${user.firstname + ' ' + user.lastname}</span>
@@ -48,6 +48,8 @@ async function loadMore() {
 }
 
 async function load() {
+    const self = (await loadself()).json
+    header(false, true, self.user_id)
     const users = (await loaduserspage(page)).json
     if (users.length === 0) {
         page = -1
@@ -64,5 +66,4 @@ async function init() {
     render()
 }
 
-header(false, true)
 init()
\ No newline at end of file
diff --git a/public/js/profile.js b/public/js/profile.js
index 1e14c21..a043fde 100644
--- a/public/js/profile.js
+++ b/public/js/profile.js
@@ -26,7 +26,7 @@ function render() {
         </div>
         <div id="info">
             <div class="face">
-                
+                ${pfp(data.user.user_id)}
             </div>
             <div class="infodata">
                 <span class="bold ltext">${data.user.firstname + ' ' + data.user.lastname}</span>
@@ -83,7 +83,6 @@ var posts = true
 var isself = false
 
 async function load() {
-    header(false, false)
 
     var params = {};
     for (const [key, value] of new URLSearchParams(location.search)) {
@@ -93,6 +92,8 @@ async function load() {
     data.self = (await loadself()).json;
     data.users[data.self.user_id] = data.self
     let id;
+
+    header(false, false, data.self.user_id)
     
     if (params.id !== undefined && !isNaN(params.id)) {