Implement time gap indicators

Get rid of short human times (1m, 1h, 1d) for now

js/forum/src/components/post-stream.js

@@ -154,6 +154,8 @@ class PostStream extends mixin(Component, evented) {
       context.fadedIn = true;
     }
 
+    var lastTime;
+
     return m('div.discussion-posts.posts', {config: this.onload.bind(this)},
       this.posts.map((post, i) => {
         var content;
@@ -166,6 +168,15 @@ class PostStream extends mixin(Component, evented) {
           attributes.config = fadeIn;
           attributes['data-time'] = post.time().toISOString();
           attributes['data-number'] = post.number();
+
+          var dt = post.time() - lastTime;
+          if (dt > 1000 * 60 * 60 * 24 * 4) {
+            content = [
+              m('div.time-gap', m('span', moment.duration(dt).humanize(), ' later')),
+              content
+            ];
+          }
+          lastTime = post.time();
         } else {
           content = PostLoading.component();
         }

js/lib/utils/human-time.js

@@ -1,21 +1,3 @@
-moment.locale('en', {
-  relativeTime : {
-    future: "in %s",
-    past: "%s ago",
-    s:  "seconds",
-    m:  "1m",
-    mm: "%dm",
-    h:  "1h",
-    hh: "%dh",
-    d:  "1d",
-    dd: "%dd",
-    M:  "a month",
-    MM: "%d months",
-    y:  "a year",
-    yy: "%d years"
-  }
-});
-
 export default function humanTime(time) {
   var m = moment(time);
 

less/forum/discussion.less

@@ -369,6 +369,24 @@
     opacity: 1;
   }
 }
+.time-gap {
+  text-transform: uppercase;
+  font-weight: bold;
+  color: @fl-body-muted-color;
+  margin-top: 60px;
+  margin-bottom: 60px;
+  padding-left: 90px;
+  border-top: 1px solid @fl-body-secondary-color;
+  font-size: 12px;
+
+  & span {
+    float: left;
+    background: #fff;
+    margin-top: -9px;
+    margin-left: -10px;
+    padding: 0 10px;
+  }
+}
 
 .post-preview {
   color: @fl-body-muted-color;