add user page markup

apps/threads.lua

@@ -68,11 +68,23 @@ app:get("thread", "/:slug", function(self)
     return {status = 404}
   end
   self.thread = thread
+
+  if self.params.after then
+    local after_id = tonumber(self.params.after)
+    local post_position = Posts:count(db.clause({
+      thread_id = thread.id,
+      {"id <= ?", after_id},
+    }))
+    self.page = math.floor((post_position - 1) / POSTS_PER_PAGE) + 1
+  else
+    self.page = tonumber(self.params.page) or 1
+  end
+
   local post_count = Posts:count(db.clause({
     thread_id = thread.id
   }))
   self.pages = math.ceil(post_count / POSTS_PER_PAGE)
-  self.page = tonumber(self.params.page) or 1
+  -- self.page = math.max(1, math.min(self.page, self.pages))
   local posts = db.query([[
     SELECT
       posts.id, posts.created_at, post_history.content, post_history.edited_at, users.username, users.status, avatars.file_path AS avatar_path
@@ -93,9 +105,9 @@ app:get("thread", "/:slug", function(self)
   self.topic = Topics:find(thread.topic_id)
   self.me = util.get_logged_in_user_or_transient(self)
   self.posts = posts
-  
+
   self.page_title = thread.title
-  
+
   return {render = "threads.thread"}
 end)
 

apps/users.lua

@@ -71,8 +71,7 @@ app:get("user", "/:username", function(self)
     self.session.flash = {}
   end
 
-  -- local me = validate_session(self.session.session_key) or TransientUser
+  local me = util.get_logged_in_user_or_transient(self)
-  local me = util.get_logged_in_user(self) or util.TransientUser
   self.user = user
   self.me = me
 
@@ -84,7 +83,24 @@ app:get("user", "/:username", function(self)
     end
   end
 
-  self.page_title = user.username
+  self.latest_posts = db.query([[
+    SELECT
+      posts.id, posts.created_at, post_history.content, post_history.edited_at, threads.title AS thread_title, topics.name as topic_name, threads.slug as thread_slug
+    FROM
+      posts
+    JOIN
+      post_history ON posts.current_revision_id = post_history.id
+    JOIN
+      threads ON posts.thread_id = threads.id
+    JOIN
+      topics ON threads.topic_id = topics.id
+    WHERE
+      posts.user_id = ?
+    ORDER BY posts.created_at DESC
+    LIMIT 10
+  ]], user.id)
+
+  self.page_title = user.username .. "'s profile"
 
   return {render = "user.user"}
 end)

sass/style.scss

@@ -45,10 +45,14 @@ $button_color: color.adjust($accent_color, $hue: 90);
 
 body {
   font-family: sans-serif;
-  margin: 20px 20px 0px 20px;
+  margin: 20px;
   background-color: $main_bg;
 }
 
+.big {
+  font-size: 1.8rem;
+}
+
 #topnav {
   @include navbar($accent_color);
   justify-content: space-between;
@@ -59,12 +63,17 @@ body {
   @include navbar($dark_bg);
 }
 
-#threadnav {
+.darkbg {
   padding-bottom: 10px;
   padding-left: 10px;
   background-color: $dark_bg;
 }
 
+.user-actions {
+  display: flex;
+  column-gap: 15px;
+}
+
 .site-title {
   display: inline;
   padding-right: 30px;
@@ -123,6 +132,40 @@ body {
   padding: 5px 20px;
 }
 
+.user-posts {
+  display: grid;
+  grid-template-columns: 200px 1fr;
+  grid-template-rows: 1fr;
+  gap: 0;
+  grid-auto-flow: row;
+  grid-template-areas:
+    "user-page-usercard user-posts-container";
+  border: 2px outset $dark2;
+}
+
+.user-page-usercard {
+  grid-area: user-page-usercard;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 20px 10px;
+  border: 4px outset $light;
+  background-color: $dark_bg;
+  border-right: solid 2px;
+}
+
+.user-posts-container {
+  grid-area: user-posts-container;
+  display: grid;
+  grid-template-columns: 1fr;
+  grid-template-rows: 0.2fr 2.5fr;
+  gap: 0px 0px;
+  grid-auto-flow: row;
+  grid-template-areas:
+    "post-info"
+    "post-content";
+}
+
 .avatar {
   width: 90%;
   height: 90%;

static/style.css

@@ -12,10 +12,14 @@
 
 body {
   font-family: sans-serif;
-  margin: 20px 20px 0px 20px;
+  margin: 20px;
   background-color: rgb(173.5214173228, 183.6737007874, 161.0262992126);
 }
 
+.big {
+  font-size: 1.8rem;
+}
+
 #topnav {
   padding: 10px;
   display: flex;
@@ -32,12 +36,17 @@ body {
   background-color: rgb(143.7039271654, 144.3879625984, 142.8620374016);
 }
 
-#threadnav {
+.darkbg {
   padding-bottom: 10px;
   padding-left: 10px;
   background-color: rgb(143.7039271654, 144.3879625984, 142.8620374016);
 }
 
+.user-actions {
+  display: flex;
+  column-gap: 15px;
+}
+
 .site-title {
   display: inline;
   padding-right: 30px;
@@ -93,6 +102,37 @@ body {
   padding: 5px 20px;
 }
 
+.user-posts {
+  display: grid;
+  grid-template-columns: 200px 1fr;
+  grid-template-rows: 1fr;
+  gap: 0;
+  grid-auto-flow: row;
+  grid-template-areas: "user-page-usercard user-posts-container";
+  border: 2px outset rgb(135.1928346457, 145.0974015748, 123.0025984252);
+}
+
+.user-page-usercard {
+  grid-area: user-page-usercard;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 20px 10px;
+  border: 4px outset rgb(217.26, 220.38, 213.42);
+  background-color: rgb(143.7039271654, 144.3879625984, 142.8620374016);
+  border-right: solid 2px;
+}
+
+.user-posts-container {
+  grid-area: user-posts-container;
+  display: grid;
+  grid-template-columns: 1fr;
+  grid-template-rows: 0.2fr 2.5fr;
+  gap: 0px 0px;
+  grid-auto-flow: row;
+  grid-template-areas: "post-info" "post-content";
+}
+
 .avatar {
   width: 90%;
   height: 90%;

views/common/topnav.etlua

@@ -7,7 +7,7 @@
     <% if me:is_logged_in() then -%>
       Welcome, <a href="<%= url_for("user", {username = me.username}) %>"><%= me.username %></a>
     <% else -%>
-      Welcome, guest. Please <a href="<%= url_for("user_login") %>">log in</a>
+      Welcome, guest. Please <a href="<%= url_for("user_signup") %>">sign up</a> or <a href="<%= url_for("user_login") %>">log in</a>
     <% end -%>
   </span>
 </nav>

views/threads/thread.etlua

@@ -1,6 +1,6 @@
 <% render("views.common.topnav") -%>
 <main>
-  <nav id="threadnav">
+  <nav class="darkbg">
     <h1 class="thread-title"><%= thread.title %></h1>
     <span>Posted in <a href="<%= url_for("topic", {slug = topic.slug}) %>"><%= topic.name %></a></span>
   </nav>

views/user/user.etlua

@@ -1,41 +1,74 @@
 <% if just_logged_in then %>
   <h1>Logged in successfully.</h1>
 <% end %>
-<img src="<%= avatar_url(user) %>">
+<% render("views.common.topnav") -%>
-<h1><%= user.username %></h1>
+<div class="darkbg">
-<h2><%= PermissionLevelString[user.permission] %></h2>
+  <h1 class="thread-title">Latest posts by <i><%= user.username %></i></h1>
-<% if user:is_guest() and user_is_me then %>
+  <div>
-  <h2>You are a guest. An Moderator needs to approve your account before you will be able to post.</h2>
+  User permission: <i><%= PermissionLevelString[user.permission] %></i>
+  </div>
+  <% if user_is_me then -%>
+  <div class="user-actions">
+    <a class="linkbutton" href="<%= url_for("user_settings", {username = user.username}) %>">Settings</a>
+    <form method="post" action="<%= url_for("user_logout", {user_id = me.id}) %>">
+      <input class="warn" type="submit" value="Log out">
+    </form>
+  </div>
+  <% end %>
+</div>
+<% --[[ duplicating code, maybe i'll refactor the post subview later to work anywhere <clown emoji>]] %>
+<% for i, post in ipairs(latest_posts) do %>
+  <div class="user-posts">
+    <div class="user-page-usercard">
+      <img class="avatar" src="<%= avatar_url(user) %>">
+      <b class="big"><%= user.username %></b>
+      <em class="user-status"><%= user.status %></em>
+    </div>
+    <div class="user-posts-container">
+      <div class="post-info">
+        <div><a href="<%= url_for("thread", {slug = post.thread_slug}, {after = post.id}) .. "#post-" .. post.id %>" title="Permalink"><i>
+        <% if tonumber(post.edited_at) > tonumber(post.created_at) then -%>
+            Edited in <%= post.thread_title %> at <%= os.date("%c", post.edited_at) %>
+          <% else -%>
+            Posted in <%= post.thread_title %> at <%= os.date("%c", post.created_at) %>
+          <% end -%>
+      </i></a></div>
+      </div>
+      <div class="post-content">
+        <%- post.content %>
+      </div>
+    </div>
+  </div>
 <% end %>
-<% if user_is_me then %>
+
-  <a class="linkbutton" href="<%= url_for("user_settings", {username = user.username}) %>">Settings</a>
+<% if user:is_guest() and user_is_me then %>
-  <form method="post" action="<%= url_for("user_logout", {user_id = me.id}) %>">
+  <h2>You are a guest. A Moderator needs to approve your account before you will be able to post.</h2>
-    <input class="warn" type="submit" value="Log out">
-  </form>
 <% end %>
 
 <% if me:is_mod() and not user:is_system() then %>
-  <h1>Moderator controls</h2>
+  <div class="darkbg">
-  <% if user:is_guest() then %>
+    <h1>Moderator controls</h2>
-    <p>This user is a guest. They signed up on <%= os.date("%c", user.created_at) %>.</p>
+    <% if user:is_guest() then %>
-    <form class="modform" method="post" action="<%= url_for("confirm_user", {user_id = user.id}) %>">
+      <p>This user is a guest. They signed up on <%= os.date("%c", user.created_at) %>.</p>
-      <input type="submit" value="Confirm user">
+      <form class="modform" method="post" action="<%= url_for("confirm_user", {user_id = user.id}) %>">
-    </form>
+        <input type="submit" value="Confirm user">
-  <% else %> <% --[[ user is not guest ]] %>
-    <p>This user signed up on <%= os.date("%c", user.created_at) %> and was confirmed on <%= os.date("%c", user.confirmed_on) %>.</p>
-    <% if user.permission < me.permission then %>
-    <form class="modform" method="post" action="<%= url_for("guest_user", {user_id = user.id}) %>">
-      <input class="warn" type="submit" value="Demote user to guest (soft ban)">
-    </form>
-    <% end %>
-    <% if me:is_admin() and not user:is_mod() then %>
-      <form class="modform" method="post" action="<%= url_for("mod_user", {user_id = user.id}) %>">
-        <input class="warn" type="submit" value="Promote user to moderator">
       </form>
-    <% elseif user:is_mod() and user.permission < me.permission then %>
+    <% else %> <% --[[ user is not guest ]] %>
-      <form class="modform" method="post" action="<%= url_for("demod_user", {user_id = user.id}) %>">
+      <p>This user signed up on <%= os.date("%c", user.created_at) %> and was confirmed on <%= os.date("%c", user.confirmed_on) %>.</p>
-        <input class="critical" type="submit" value="Demote user to regular user">
+      <% if user.permission < me.permission then %>
+      <form class="modform" method="post" action="<%= url_for("guest_user", {user_id = user.id}) %>">
+        <input class="warn" type="submit" value="Demote user to guest (soft ban)">
       </form>
+      <% end %>
+      <% if me:is_admin() and not user:is_mod() then %>
+        <form class="modform" method="post" action="<%= url_for("mod_user", {user_id = user.id}) %>">
+          <input class="warn" type="submit" value="Promote user to moderator">
+        </form>
+      <% elseif user:is_mod() and user.permission < me.permission then %>
+        <form class="modform" method="post" action="<%= url_for("demod_user", {user_id = user.id}) %>">
+          <input class="critical" type="submit" value="Demote user to regular user">
+        </form>
+      <% end %>
     <% end %>
-  <% end %>
+  </div>
 <% end %>