Render link flairs

dist/css/styles.css

@@ -172,11 +172,6 @@ body.dark #search form input[type="text"] {
   background: #0f0f0f;
   color: white;
 }
-body.dark #links .link .entry .title span.postflair,
-body.dark #post .info .title span.postflair {
-    color: #eaeaea;
-    background-color: #404040;
-}
 a {
 	color: var(--linkcolor);
 	text-decoration: none;
@@ -402,16 +397,6 @@ input[type="submit"]:hover,
 	cursor: pointer;
 	text-decoration: none;
 }
-#links .link .entry .title span.postflair,
-#post .info .title span.postflair {
-    display: inline-block;
-    border-radius: 4px;
-    color: #404040;
-    background-color: #e8e8e8;
-    font-size: x-small;
-    margin-left: 10px;
-    padding: 0 2px;
-}
 /* SUBREDDIT LINKS */
 #links {
 	float: left;
@@ -995,8 +980,9 @@ input[type="submit"]:hover,
 	margin-right: 10px;
 }
 /* FLAIR */
-.flair {
+.flair,
-    /* Todo: Merge this with post flairs (.postflair) */
+#links .link .entry .title span.flair,
+#post .info .title span.flair {
     display: inline-block;
     border-radius: 4px;
     color: #404040;
@@ -1005,6 +991,10 @@ input[type="submit"]:hover,
     margin-left: 10px;
     padding: 0 2px;
 }
+body.dark .flair {
+    color: #eaeaea !important;
+    background-color: #404040 !important;
+}
 #post .comments .flair,
 #user .comment .meta .flair {
 	margin-left: 0 !important;

inc/commons.js

@@ -198,6 +198,29 @@ module.exports = function(request, fs) {
     }
   }
 
+  this.formatLinkFlair = (post) => {
+    const wrap = (inner) => `<span class="flair">${inner}</span>`
+
+    if (post.link_flair_text === null)
+      return ''
+
+    if (post.link_flair_type === 'text')
+      return wrap(post.link_flair_text)
+
+    if (post.link_flair_type === 'richtext') {
+      let flair = ''
+      for (let fragment of post.link_flair_richtext) {
+        if (fragment.e === 'text')
+          flair += fragment.t
+        else if (fragment.e === 'emoji')
+          flair += `<span class="emoji" style="background-image: url(${fragment.u})"></span>`
+        }
+      return wrap(flair)
+    }
+
+    return ''
+  }
+
   this.formatUserFlair = (post) => {
     // Generate the entire HTML here for consistency in both pug and HTML
     const wrap = (inner) => `<span class="flair">${inner}</span>`

inc/processJsonPost.js

@@ -33,6 +33,7 @@ module.exports = function(fetch) {
           images: null,
           crosspost: false,
           selftext: unescape(post.selftext_html),
+          link_flair: formatLinkFlair(post),
           user_flair: formatUserFlair(post)
         }
 

inc/processJsonSubreddit.js

@@ -74,6 +74,7 @@ module.exports = function() {
               stickied: data.stickied,
               is_self_link: is_self_link,
               subreddit_front: subreddit_front,
+              link_flair: formatLinkFlair(data),
               user_flair: formatUserFlair(data)
             }
             ret.links.push(obj)

views/post.pug

@@ -23,8 +23,7 @@ html
           .title
             a(href="" + post.url + "")
               h2 #{cleanTitle(post.title)}
-            if post.link_flair_text
+            != post.link_flair
-              span(class="postflair") #{post.link_flair_text}
             span(class="domain") (#{post.domain})
           p.submitted
             span(title="" + toUTCString(post.created) + "") submitted #{timeDifference(post.created)} by

views/subreddit.pug

@@ -84,14 +84,12 @@ html
                   if link.is_self_link
                     a(href="" + link.permalink + "")
                       h2(class="" + (link.stickied ? 'green' : '') + "") #{cleanTitle(link.title)}
-                    if link.link_flair_text
+                    != link.link_flair
-                      span(class="postflair") #{link.link_flair_text}
                     span (#{link.domain})
                   else
                     a(href="" + link.url + "")
                       h2(class="" + (link.stickied ? 'green' : '') + "") #{cleanTitle(link.title)}
-                    if link.link_flair_text
+                    != link.link_flair
-                      span(class="postflair") #{link.link_flair_text}
                     span (#{link.domain})
                 .meta
                   p.submitted submitted