From f44f093fc2fd6ab75f7a156ea29ced523a2c2bcf Mon Sep 17 00:00:00 2001 From: teddit Date: Sun, 21 Mar 2021 22:59:10 +0100 Subject: [PATCH] add poll support --- inc/commons.js | 28 +++++++++++-------- inc/processJsonPost.js | 2 ++ static/css/styles.css | 44 +++++++++++++++++++++++++++++ views/includes/head.pug | 62 ----------------------------------------- views/post.pug | 23 +++++++++++++++ 5 files changed, 85 insertions(+), 74 deletions(-) diff --git a/inc/commons.js b/inc/commons.js index 569411d..9a3e526 100644 --- a/inc/commons.js +++ b/inc/commons.js @@ -63,7 +63,7 @@ module.exports = function(request, fs) { return Math.abs(num) > 999 ? Math.sign(num)*((Math.abs(num)/1000).toFixed(1)) + 'k' : Math.sign(num)*Math.abs(num) } - this.timeDifference = (time) => { + this.timeDifference = (time, hide_suffix) => { time = parseInt(time) * 1000 let ms_per_minute = 60 * 1000 let ms_per_hour = ms_per_minute * 60 @@ -71,6 +71,10 @@ module.exports = function(request, fs) { let ms_per_month = ms_per_day * 30 let ms_per_year = ms_per_day * 365 let current = + new Date() + let suffix = 'ago' + + if(hide_suffix) + suffix = '' let elapsed = Math.abs(time - current) let r = '' @@ -78,7 +82,7 @@ module.exports = function(request, fs) { if(elapsed < ms_per_minute) { e = Math.round(elapsed/1000) - r = `${e} seconds ago` + r = `${e} seconds ${suffix}` if(e === 1) r = 'just now' return r @@ -86,41 +90,41 @@ module.exports = function(request, fs) { else if(elapsed < ms_per_hour) { e = Math.round(elapsed/ms_per_minute) - r = `${e} minutes ago` + r = `${e} minutes ${suffix}` if(r === 1) - r = 'a minute ago' + r = `a minute ${suffix}` return r } else if(elapsed < ms_per_day ) { e = Math.round(elapsed/ms_per_hour) - r = `${e} hours ago` + r = `${e} hours ${suffix}` if(e === 1) - r = 'an hour ago' + r = `an hour ${suffix}` return r } else if(elapsed < ms_per_month) { e = Math.round(elapsed/ms_per_day) - r = `${e} days ago` + r = `${e} days ${suffix}` if(e === 1) - r = '1 day ago' + r = `1 day ${suffix}` return r } else if(elapsed < ms_per_year) { e = Math.round(elapsed/ms_per_month) - r = `${e} months ago` + r = `${e} months ${suffix}` if(e === 1) - r = '1 month ago' + r = `1 month ${suffix}` return r } else { e = Math.round(elapsed/ms_per_year) - r = `${e} years ago` + r = `${e} years ${suffix}` if(e === 1) - r = '1 year ago' + r = `1 year ${suffix}` return r } } diff --git a/inc/processJsonPost.js b/inc/processJsonPost.js index bfb172a..d337fa0 100644 --- a/inc/processJsonPost.js +++ b/inc/processJsonPost.js @@ -36,6 +36,7 @@ module.exports = function(fetch) { images: null, crosspost: false, selftext: unescape(post.selftext_html), + poll_data: post.poll_data, link_flair: (user_preferences.flairs != 'false' ? await formatLinkFlair(post) : ''), user_flair: (user_preferences.flairs != 'false' ? await formatUserFlair(post) : '') } @@ -95,6 +96,7 @@ module.exports = function(fetch) { ups: post.crosspost.ups, selftext: unescape(post.selftext_html), selftext_crosspost: unescape(post.crosspost.selftext_html), + poll_data: post.poll_data, is_crosspost: true, user_flair: (user_preferences.flairs != 'false' ? await formatUserFlair(post) : '') } diff --git a/static/css/styles.css b/static/css/styles.css index 9716b1f..8a88eb8 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -869,6 +869,50 @@ footer a { #post .source-url { overflow-wrap: anywhere; } +#post .usertext-body .poll { + padding: 20px; + border: 1px solid #404040; + margin: 10px 0px 20px 0px; + float: left; + width: calc(100% - 20%); + position: relative; + background: #8a8a8a; +} +#post .usertext-body .poll .option { + float: left; + width: 100%; + position: relative; + margin: 0px 0px 15px 0px; +} +#post .usertext-body .poll .option .vote_count { + float: left; + width: 20%; + position: relative; + z-index: 22; + padding: 10px; +} +#post .usertext-body .poll .option .text { + position: relative; + width: 80%; + z-index: 22; + display: initial; + padding: 10px 0px 0px 0px; + line-height: initial; + display: block; +} +#post .usertext-body .poll .option .background { + position: absolute; + background: #7171718c; + height: 100%; + float: left; + width: 100%; + position: absolute; + z-index: 1; +} +#post .usertext-body .poll .votes { + font-size: 1rem; + padding: 10px 0px 10px 0px; +} /* USER */ #user .entries { float: left; diff --git a/views/includes/head.pug b/views/includes/head.pug index 5939076..2bf6ee8 100644 --- a/views/includes/head.pug +++ b/views/includes/head.pug @@ -15,68 +15,6 @@ meta(name="viewport", content="width=device-width, initial-scale=1.0") return Math.abs(num) > 999 ? Math.sign(num)*((Math.abs(num)/1000).toFixed(1)) + 'k' : Math.sign(num)*Math.abs(num) } - function timeDifference(time) { - time = parseInt(time) * 1000 - let ms_per_minute = 60 * 1000 - let ms_per_hour = ms_per_minute * 60 - let ms_per_day = ms_per_hour * 24 - let ms_per_month = ms_per_day * 30 - let ms_per_year = ms_per_day * 365 - let current = + new Date() - - let elapsed = Math.abs(time - current) - let r = '' - let e - - if (elapsed < ms_per_minute) { - e = Math.round(elapsed/1000) - r = `${e} seconds ago` - if(e === 1) - r = 'just now' - return r - } - - else if (elapsed < ms_per_hour) { - e = Math.round(elapsed/ms_per_minute) - r = `${e} minutes ago` - if(r === 1) - r = 'a minute ago' - return r - } - - else if (elapsed < ms_per_day ) { - e = Math.round(elapsed/ms_per_hour) - r = `${e} hours ago` - if(e === 1) - r = 'an hour ago' - return r - } - - else if (elapsed < ms_per_month) { - e = Math.round(elapsed/ms_per_day) - r = `${e} days ago` - if(e === 1) - r = '1 day ago' - return r - } - - else if (elapsed < ms_per_year) { - e = Math.round(elapsed/ms_per_month) - r = `${e} months ago` - if(e === 1) - r = '1 month ago' - return r - } - - else { - e = Math.round(elapsed/ms_per_year) - r = `${e} years ago` - if(e === 1) - r = '1 year ago' - return r - } - } - function toDateString(time) { let d = new Date(); d.setTime(time*1000); diff --git a/views/post.pug b/views/post.pug index b647e20..fb86d46 100644 --- a/views/post.pug +++ b/views/post.pug @@ -174,6 +174,29 @@ html a(href="" + post.media.source + "") [media] if post.selftext div.usertext-body !{post.selftext} + if post.poll_data + .poll + .votes #{post.poll_data.total_vote_count} votes + if !post.poll_data.options[0].vote_count + em Cannot fetch poll data (either the poll is only for logged in users, or the result is shown after voting is complete). + br + em Showing only voting options: + br + each option in post.poll_data.options + .option + if(option.vote_count) + - let perc = option.vote_count / post.poll_data.total_vote_count * 100 + .background(style="width:" + perc + "%") + .vote_count #{option.vote_count} (#{perc.toFixed(0)} %) + .text #{option.text} + else + .vote_count + .text #{option.text} + .meta + if post.poll_data.voting_end_timestamp < new Date().getTime() + em voting ended #{timeDifference(post.poll_data.voting_end_timestamp/1000)} + else + em voting will end #{timeDifference(post.poll_data.voting_end_timestamp/1000, true)} if post.contest_mode .infobar.blue p this thread is in contest mode - contest mode randomizes comment sorting and hides scores.