diff --git a/dist/css/styles.css b/dist/css/styles.css index 043de90..8816657 100644 --- a/dist/css/styles.css +++ b/dist/css/styles.css @@ -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; diff --git a/inc/commons.js b/inc/commons.js index c04c178..5647e92 100644 --- a/inc/commons.js +++ b/inc/commons.js @@ -1,4 +1,4 @@ -module.exports = function(request, fs) { +module.exports = function(request, fs) { const config = require('../config') this.downloadFile = (url) => { return new Promise(resolve => { @@ -51,7 +51,7 @@ module.exports = function(request, fs) { if(video_exts.includes(file_ext) || !image_exts.includes(file_ext)) url = url.replace(u.host, `${config.domain}/vids`) + '.mp4' } - + } catch(e) { } return url } @@ -59,7 +59,7 @@ module.exports = function(request, fs) { this.kFormatter = (num) => { return Math.abs(num) > 999 ? Math.sign(num)*((Math.abs(num)/1000).toFixed(1)) + 'k' : Math.sign(num)*Math.abs(num) } - + this.timeDifference = (time) => { time = parseInt(time) * 1000 let ms_per_minute = 60 * 1000 @@ -121,7 +121,7 @@ module.exports = function(request, fs) { return r } } - + this.toUTCString = (time) => { let d = new Date(); d.setTime(time*1000); @@ -165,7 +165,7 @@ module.exports = function(request, fs) { }) }) } - + this.isGif = (url) => { try { url = new URL(url) @@ -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) => `${inner}` + + 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 += `` // `u` is the emoji URL + } + return wrap(flair) + } + + return '' + } + } diff --git a/inc/compilePostComments.js b/inc/compilePostComments.js index 3abf2cd..dcab27d 100644 --- a/inc/compilePostComments.js +++ b/inc/compilePostComments.js @@ -18,7 +18,7 @@ module.exports = function() { let moderator = false let submitter = false let edited_span = '' - + if(post_author === comments.author) { classlist.push('submitter') submitter_link = `[S]` @@ -48,6 +48,7 @@ module.exports = function() {

${commentAuthor(comments, classlist, submitter && submitter_link, moderator && moderator_badge)}

+

${comments.user_flair}

${ups}

${timeDifference(comments.created)}${edited_span} @@ -104,7 +105,7 @@ module.exports = function() { let submitter = false let ups = '' let edited_span = '' - + if(post_author === comment.author) { classlist.push('submitter') submitter_link = `[S]` @@ -134,6 +135,7 @@ module.exports = function() {

${commentAuthor(comment, classlist, submitter && submitter_link, moderator && moderator_badge)}

+

${comment.user_flair}

${ups}

${timeDifference(comment.created)}${edited_span} @@ -185,7 +187,7 @@ module.exports = function() { comments_html += `

` } next_comment_parent_id = null - + resolve(comments_html) })() }) diff --git a/inc/processJsonPost.js b/inc/processJsonPost.js index a40485d..0d51b8c 100644 --- a/inc/processJsonPost.js +++ b/inc/processJsonPost.js @@ -7,7 +7,7 @@ module.exports = function(fetch) { if(!parsed) { json = JSON.parse(json) } - + let post = json[0].data.children[0].data let post_id = post.name let comments = json[1].data.children @@ -32,14 +32,15 @@ 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'] let has_gif = false let gif_to_mp4 = null let reddit_video = null - + if(post.preview) { if(post.preview.reddit_video_preview) { if(post.preview.reddit_video_preview.is_gif) { @@ -66,7 +67,7 @@ module.exports = function(fetch) { } obj = await processPostMedia(obj, post, post.media, has_gif, reddit_video, gif_to_mp4) - + if(post.crosspost_parent_list) { post.crosspost = post.crosspost_parent_list[0] } @@ -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) } } @@ -93,7 +95,7 @@ module.exports = function(fetch) { source: await downloadAndSave(post.preview.images[0].source.url) } } - + if(obj.media) { if(obj.media.source === 'external') { if(post.preview) { @@ -103,7 +105,7 @@ module.exports = function(fetch) { } } } - + if(post.gallery_data) { obj.gallery = true obj.gallery_items = [] @@ -120,13 +122,13 @@ module.exports = function(fetch) { } } } - + let comms = [] for(var i = 0; i < comments.length; i++) { let comment = comments[i].data let kind = comments[i].kind let obj = {} - + if(kind !== 'more') { obj = { author: comment.author, @@ -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 = { @@ -155,7 +158,7 @@ module.exports = function(fetch) { children: [] } } - + if(comment.replies && kind !== 'more') { if(comment.replies.data) { if(comment.replies.data.children.length > 0) { @@ -163,18 +166,18 @@ module.exports = function(fetch) { } } } - + if(comment.children) { for(var j = 0; j < comment.children.length; j++) { obj.children.push(comment.children[j]) } } - + comms.push(obj) } - + obj.comments = comms - + resolve(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 = { @@ -233,13 +237,13 @@ module.exports = function(fetch) { depth: depth } } - + if(reply.replies && kind !== 'more') { if(reply.replies.data.children.length) { for(var j = 0; j < reply.replies.data.children.length; j++) { let comment = reply.replies.data.children[j].data let objct = {} - + if(comment.author && comment.body_html) { objct = { author: comment.author, @@ -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 = { @@ -273,7 +278,7 @@ module.exports = function(fetch) { } } } - + if(comment.replies) { if(comment.replies.data) { if(comment.replies.data.children.length > 0) { @@ -286,13 +291,13 @@ module.exports = function(fetch) { } } } - + if(reply.children) { for(var j = 0; j < reply.children.length; j++) { obj.children.push(reply.children[j]) } } - + return_replies.push(obj) } return return_replies diff --git a/inc/processJsonSubreddit.js b/inc/processJsonSubreddit.js index 27535b2..8362b2d 100644 --- a/inc/processJsonSubreddit.js +++ b/inc/processJsonSubreddit.js @@ -11,7 +11,7 @@ module.exports = function() { } else { let before = json.data.before let after = json.data.after - + let ret = { info: { before: before, @@ -19,9 +19,9 @@ module.exports = function() { }, links: [] } - + let children_len = json.data.children.length - + for(var i = 0; i < children_len; i++) { let data = json.data.children[i].data let images = null @@ -39,7 +39,7 @@ module.exports = function() { is_self_link = true } } - + if(data.preview && data.thumbnail !== 'self') { if(!data.url.startsWith('/r/') && isGif(data.url)) { images = { @@ -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) } diff --git a/inc/processJsonUser.js b/inc/processJsonUser.js index f081138..4114fb8 100644 --- a/inc/processJsonUser.js +++ b/inc/processJsonUser.js @@ -21,7 +21,7 @@ module.exports = function() { if(!after && !before) { user_front = true } - + if(json.overview.data.children) { if(json.overview.data.children[posts_limit - 1]) { after = json.overview.data.children[posts_limit - 1].data.name @@ -30,16 +30,16 @@ module.exports = function() { before = json.overview.data.children[0].data.name } } - + for(var i = 0; i < posts_limit; i++) { let post = json.overview.data.children[i].data let thumbnail = 'self' let type = json.overview.data.children[i].kind let obj - + let post_id = post.permalink.split('/').slice(-2)[0] + '/' let url = post.permalink.replace(post_id, '') - + if(type === 't3') { let duration = null if(post.media) { @@ -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) @@ -98,7 +100,7 @@ module.exports = function() { after: after, posts: posts } - + resolve(obj) })() }) diff --git a/views/post.pug b/views/post.pug index 3eea48b..03b7b75 100644 --- a/views/post.pug +++ b/views/post.pug @@ -12,7 +12,7 @@ html #post header div - p subreddit: + p subreddit: a(href="/r/" + subreddit + "") p /r/#{subreddit} .info @@ -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} @@ -128,8 +130,8 @@ html source(src="" + post.media.source + "", type="video/mp4") | Your browser does not support the video element. a(href="" + post.media.source + "") [media] - if post.selftext - div.usertext-body !{post.selftext} + if post.selftext + div.usertext-body !{post.selftext} if viewing_comment .infobar p you are viewing a single comment's thread. diff --git a/views/subreddit.pug b/views/subreddit.pug index 31fa078..d4f7863 100644 --- a/views/subreddit.pug +++ b/views/subreddit.pug @@ -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} diff --git a/views/user.pug b/views/user.pug index 8344c37..d1766b3 100644 --- a/views/user.pug +++ b/views/user.pug @@ -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' @@ -98,7 +100,7 @@ html a(href="/u/" + post.link_author + "") #{post.link_author} .subreddit p in - a(href="/r/" + post.subreddit + "") #{post.subreddit} + a(href="/r/" + post.subreddit + "") #{post.subreddit} .comment details(open="") summary @@ -108,10 +110,12 @@ 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 - div !{post.body_html} + div !{post.body_html} a.context(href="" + post.permalink + "?context=10") context a.comments.t1(href="" + post.url + "") full comments (#{post.num_comments}) if data.before || data.after @@ -127,28 +131,3 @@ html br p(title="" + toUTCString(data.created) + "") account created: #{toDateString(data.created)} p verified: #{(data.verified) ? "yes" : "no" } - - - - - - - - - - - - - - - - - - - - - - - - -