Render user flairs

This commit is contained in:
StevenNMeza 2020-12-21 12:27:31 +01:00
parent d7436f10be
commit 5057018fb6
9 changed files with 120 additions and 73 deletions

29
dist/css/styles.css vendored
View File

@ -994,6 +994,35 @@ input[type="submit"]:hover,
#user .entries .entry a.context {
margin-right: 10px;
}
/* FLAIR */
.flair {
/* Todo: Merge this with post flairs (.postflair) */
display: inline-block;
border-radius: 4px;
color: #404040;
background-color: #e8e8e8;
font-size: x-small;
margin-left: 10px;
padding: 0 2px;
}
#post .comments .flair,
#user .comment .meta .flair {
margin-left: 0 !important;
}
#links .link .entry .meta p.submitted .flair,
#user .comment .meta .flair,
#user .entries p.submitted .flair {
margin-right: 4px;
}
.flair .emoji {
background-position: center;
background-repeat: no-repeat;
background-size: contain;
display: inline-block;
height: 16px;
width: 16px;
vertical-align: middle;
}
/* SIDEBAR */
#sidebar {
float: left;

View File

@ -197,4 +197,30 @@ module.exports = function(request, fs) {
return ''
}
}
this.formatUserFlair = (post) => {
// Generate the entire HTML here for consistency in both pug and HTML
const wrap = (inner) => `<span class="flair">${inner}</span>`
if (post.author_flair_text === null)
return ''
if (post.author_flair_type === 'text')
return wrap(post.author_flair_text)
if (post.author_flair_type === 'richtext') {
let flair = ''
for (let fragment of post.author_flair_richtext) {
// `e` seems to mean `type`
if (fragment.e === 'text')
flair += fragment.t // `t` is the text
else if (fragment.e === 'emoji')
flair += `<span class="emoji" style="background-image: url(${fragment.u})"></span>` // `u` is the emoji URL
}
return wrap(flair)
}
return ''
}
}

View File

@ -48,6 +48,7 @@ module.exports = function() {
</summary>
<div class="meta">
<p class="author">${commentAuthor(comments, classlist, submitter && submitter_link, moderator && moderator_badge)}</p>
<p>${comments.user_flair}</p>
<p class="ups">${ups}</p>
<p class="created" title="${toUTCString(comments.created)}">
<a href="${comments.permalink}">${timeDifference(comments.created)}${edited_span}</a>
@ -134,6 +135,7 @@ module.exports = function() {
</summary>
<div class="meta">
<p class="author">${commentAuthor(comment, classlist, submitter && submitter_link, moderator && moderator_badge)}</p>
<p>${comment.user_flair}</p>
<p class="ups">${ups}</p>
<p class="created" title="${toUTCString(comment.created)}">
<a href="${comment.permalink}">${timeDifference(comment.created)}${edited_span}</a>

View File

@ -32,7 +32,8 @@ module.exports = function(fetch) {
media: null,
images: null,
crosspost: false,
selftext: unescape(post.selftext_html)
selftext: unescape(post.selftext_html),
user_flair: formatUserFlair(post)
}
let validEmbedDomains = ['gfycat.com', 'youtube.com']
@ -84,7 +85,8 @@ module.exports = function(fetch) {
ups: post.crosspost.ups,
selftext: unescape(post.selftext_html),
selftext_crosspost: unescape(post.crosspost.selftext_html),
is_crosspost: true
is_crosspost: true,
user_flair: formatUserFlair(post)
}
}
@ -143,7 +145,8 @@ module.exports = function(fetch) {
score_hidden: comment.score_hidden,
edited: comment.edited,
replies: [],
depth: 0
depth: 0,
user_flair: formatUserFlair(comment)
}
} else {
obj = {
@ -220,7 +223,8 @@ module.exports = function(fetch) {
score_hidden: reply.score_hidden,
edited: reply.edited,
replies: [],
depth: depth
depth: depth,
user_flair: formatUserFlair(reply)
}
} else {
obj = {
@ -255,7 +259,8 @@ module.exports = function(fetch) {
distinguished: comment.distinguished,
distinguished: comment.edited,
replies: [],
depth: depth + 1
depth: depth + 1,
user_flair: formatUserFlair(comment)
}
} else {
objct = {

View File

@ -73,7 +73,8 @@ module.exports = function() {
url: data.url,
stickied: data.stickied,
is_self_link: is_self_link,
subreddit_front: subreddit_front
subreddit_front: subreddit_front,
user_flair: formatUserFlair(data)
}
ret.links.push(obj)
}

View File

@ -62,7 +62,8 @@ module.exports = function() {
edited: post.edited,
selftext_html: unescape(post.selftext_html),
num_comments: post.num_comments,
permalink: post.permalink
permalink: post.permalink,
user_flair: formatUserFlair(post)
}
}
if(type === 't1') {
@ -79,7 +80,8 @@ module.exports = function() {
num_comments: post.num_comments,
permalink: post.permalink,
link_author: post.link_author,
link_title: post.link_title
link_title: post.link_title,
user_flair: formatUserFlair(post)
}
}
posts.push(obj)

View File

@ -33,6 +33,7 @@ html
else
a(href="/u/" + post.author + "")
| #{post.author}
!= post.user_flair
if post.crosspost.is_crosspost === true
.crosspost
.title
@ -52,6 +53,7 @@ html
else
a(href="/u/" + post.crosspost.author + "")
| #{post.crosspost.author}
!= post.user_flair
p.to to
a(href="/r/" + post.crosspost.subreddit + "")
| #{post.crosspost.subreddit}

View File

@ -101,6 +101,7 @@ html
else
a(href="/u/" + link.author + "")
| #{link.author}
!= link.user_flair
p.to to
a(href="/r/" + link.subreddit + "")
| #{link.subreddit}

View File

@ -80,9 +80,11 @@ html
.title
a(href="" + post.permalink + "") #{cleanTitle(post.title)}
.meta
p.submitted(title="" + toUTCString(post.created) + "") submitted #{timeDifference(post.created)} by
p.submitted(title="" + toUTCString(post.created) + "") submitted #{timeDifference(post.created)}
| by
a(href="/u/" + data.username + "") #{data.username}
| to
!= post.user_flair
a(href="/r/" + post.subreddit + "", class="subreddit") #{post.subreddit}
a.comments(href="" + post.permalink + "") #{post.num_comments} comments
if post.type === 't1'
@ -108,6 +110,8 @@ html
.meta
p.author
a(href="/u/" + data.username + "") #{data.username}
p
!= post.user_flair
p.ups #{post.ups} points
p.created(title="" + toUTCString(post.created) + "") #{timeDifference(post.created)}
.body
@ -127,28 +131,3 @@ html
br
p(title="" + toUTCString(data.created) + "") account created: #{toDateString(data.created)}
p verified: #{(data.verified) ? "yes" : "no" }