Restored server side activity calculations. Last reply info added.

forms.tmpl

@@ -60,8 +60,7 @@
     #let timeStr = formatTimestamp(latestReplyDate.parseInt())
     <div class="activity">
       <div>
-        <span class="isoDate">$timeStr</span>
-        $timeStr
+        <a href="$replyProfileUrl">$latestReplyAuthor</a> replied $timeStr
       </div>
     </div>
   </div>

forum.nim

@@ -151,9 +151,38 @@ proc genButtons(c: var TForumData, btns: seq[TStyledButton]): string =
       result.add(("""<a class="$3active button" href="$1$4">$2</a>""") % [
         btns[i].link, btns[i].text, class, anchor])
 
+proc toInterval(diff: int64): TimeInterval =
+  var remaining = diff
+  let years = remaining div 31536000
+  remaining -= years * 31536000
+  let months = remaining div 2592000
+  remaining -= months * 2592000
+  let days = remaining div 86400
+  remaining -= days * 86400
+  let hours = remaining div 3600
+  remaining -= hours * 3600
+  let minutes = remaining div 60
+  remaining -= minutes * 60
+  result = initInterval(0, remaining.int, minutes.int, hours.int, days.int,
+                        months.int, years.int)
+
 proc formatTimestamp(t: int): string =
-  let t2 = TTime(t)
-  return t2.getGMTime().format("yyyy-MM-dd'T'HH':'mm':'ss'Z'")
+  let t2 = Time(t)
+  let now = getTime()
+  let diff = (now - t2).toInterval()
+  if diff.years > 0:
+    return getGMTime(t2).format("MMMM d',' yyyy")
+  elif diff.months > 0:
+    return $diff.months & (if diff.months > 1: " months ago" else: " month ago")
+  elif diff.days > 0:
+    return $diff.days & (if diff.days > 1: " days ago" else: " day ago")
+  elif diff.hours > 0:
+    return $diff.hours & (if diff.hours > 1: " hours ago" else: " hour ago")
+  elif diff.minutes > 0:
+    return $diff.minutes &
+        (if diff.minutes > 1: " minutes ago" else: " minute ago")
+  else:
+    return "just now"
 
 proc getGravatarUrl(email: string, size = 80): string =
   let emailMD5 = email.toLower.toMD5

public/css/style.css

@@ -166,9 +166,9 @@ pre .end { background:url("/images/tabEnd.png") no-repeat left bottom; }
     
     #talk-heads { overflow:auto; margin:0 8px 0 8px; }
     #talk-heads > div { float:left; font-size:120%; font-weight:bold; }
-    #talk-heads > .topic { width:55%; }
+    #talk-heads > .topic { width:45%; }
     #talk-heads > .detail { width:15%; }
-    #talk-heads > .activity { width:15%; }
+    #talk-heads > .activity { width:25%; }
     #talk-heads > .users { width:15%; }
     #talk-heads > div > div { margin:0 10px 10px 10px; padding:0 10px 10px 10px; border-bottom:1px dashed rgba(0,0,0,0.4); }
     #talk-heads > .topic > div { margin-left:0; }
@@ -203,7 +203,7 @@ pre .end { background:url("/images/tabEnd.png") no-repeat left bottom; }
       font-size: 10pt;
     }
     #talk-thread  > div > div > div,
-    #talk-threads > div > div > div { margin: 5px 20px; }
+    #talk-threads > div > div > div { margin: 5px 10px; }
     #talk-thread > div > .topic
     {
       margin-top: 15pt;
@@ -217,20 +217,35 @@ pre .end { background:url("/images/tabEnd.png") no-repeat left bottom; }
       border-bottom: 1px dashed;
       color: #3D3D3D;
     }
-    #talk-threads > div > .topic { width:55%; }
+    #talk-threads > div > .topic { width:45%; }
     #talk-threads > div > .users { width:15%; overflow:hidden; }
     #talk-threads > div > .users > div > img
     {
       margin-bottom: -4pt;
       cursor: help;
     }
-    #talk-threads > div > .detail { width:15%; overflow:hidden; }
+    #talk-threads > div > .detail { width:16%; overflow:hidden; }
     #talk-thread  > div > .author,
     #talk-threads > div > .activity {
-      width:15%;
       overflow:hidden;
       background:rgba(0,0,0,0.8);
       color: white;
+      
+    }
+    #talk-thread > div > .author {
+      width: 15%;
+    }
+    #talk-threads > div > .activity {
+      width:24%;
+      font-size: 8pt;
+    }
+    #talk-threads > div > .activity a
+    {
+      color: #1CB3EC;
+    }
+    #talk-threads > div > .activity a:hover
+    {
+      color: #ffffff;
     }
     #talk-thread > div > .author {
       height: 100%;
@@ -251,7 +266,7 @@ pre .end { background:url("/images/tabEnd.png") no-repeat left bottom; }
       white-space: nowrap;
     }
     #talk-threads > div > .detail > div { float:left; margin:0; }
-    #talk-threads > div > .detail > div > div { margin-left:20px; padding: 5px 5px 5px 22px; }
+    #talk-threads > div > .detail > div > div { margin-left:15px; padding: 5px 5px 5px 22px; }
     #talk-threads > div > .detail > div { width:50%; }
     #talk-threads > div > .detail > div:first-child > div { background:url("/images/forum-views.png") no-repeat left; cursor: help; }
     #talk-threads > div > .detail > div:last-child > div { background:url("/images/forum-posts.png") no-repeat left; cursor: help; }

public/js/forum.js

@@ -2,75 +2,4 @@
 
 window.onload = function() {
   positionGlowArrow();
-  processMainDates();
-  window.setTimeout(performProcessingMainDates, 1000);
 };
-
-function performProcessingMainDates()
-{
-  if (processMainDates())
-  {
-    window.setTimeout(performProcessingMainDates, 1000);
-  }
-  else
-  {
-    window.setTimeout(performProcessingMainDates, 60000);
-  }
-}
-
-function timeSince(date) {
-    var result = ["", false];
-    var seconds = Math.floor((new Date() - date) / 1000);
-
-    var interval = Math.floor(seconds / 31536000);
-
-    if (interval >= 1) {
-        result[0] = interval + (interval == 1 ? " year ago" : " years ago");
-        return result;
-    }
-    interval = Math.floor(seconds / 2592000);
-    if (interval >= 1) {
-        result[0] = interval + (interval == 1 ? " month ago" : " months ago");
-        return result;
-    }
-    interval = Math.floor(seconds / 86400);
-    if (interval >= 1) {
-        result[0] = interval + (interval == 1 ? " day ago" : " days ago");
-        return result;
-    }
-    interval = Math.floor(seconds / 3600);
-    if (interval >= 1) {
-        result[0] = interval + (interval == 1 ? " hour ago" : " hours ago");
-        return result;
-    }
-    interval = Math.floor(seconds / 60);
-    if (interval >= 1) {
-        result[0] = interval + (interval == 1 ? " minute ago" : " minutes ago");
-        return result;
-    }
-    if (seconds >= 1) {
-      result[0] = Math.floor(seconds) +
-          (seconds == 1 ? " second ago" : " seconds ago");
-      result[1] = true;
-      return result;
-    }
-    return ["less than a second ago", true];
-}
-
-function processMainDates() {
-  var result = false;
-  var threads = document.getElementById("talk-threads").children;
-  for (var i = 0; i < threads.length; i++)
-  {
-    var activity = threads[i].getElementsByClassName("activity")[0];
-    var activityDiv = activity.children[0];
-    var isoDate = activityDiv.children[0].innerHTML;
-    var parsed = Date.parse(isoDate);
-    var timeS = timeSince(parsed);
-    
-    activityDiv.innerHTML = activityDiv.children[0].outerHTML +
-        timeS[0];
-    if (timeS[1]) { result = timeS[1] }
-  }
-  return result;
-}