diff --git a/app.js b/app.js index 7c844e5..71c727b 100644 --- a/app.js +++ b/app.js @@ -30,7 +30,8 @@ global.setexs = { subreddit: 600, posts: 600, user: 600, - searches: 600 + searches: 600, + sidebar: 60 * 60 * 24 * 7 // 7 days } global.client_id_b64 = Buffer.from(`${reddit_app_id}:`).toString('base64') global.reddit_access_token = null diff --git a/dist/css/styles.css b/dist/css/styles.css index ff4e3fd..b22ad8c 100644 --- a/dist/css/styles.css +++ b/dist/css/styles.css @@ -1066,17 +1066,29 @@ input[type="submit"]:hover, #user .entries .entry a.context { margin-right: 10px; } +/* SIDEBAR */ +#sidebar { + float: left; + width: 25%; +} +#sidebar .content { + float: left; + font-size: smaller; + padding-right: 15px; +} +#sidebar .content .description { + margin-top: 38px; +} /* SEARCH */ #search { - margin-left: 30px; margin-bottom: 50px; margin-top: 30px; float: left; width: calc(100% - 30px); } #search.sr { - width: 20%; - margin-top: 00px; + width: calc(100% - 60px); + margin-top: 0px; } #search form { max-width: 600px; @@ -1321,6 +1333,13 @@ code { transition: none; } @media only screen and (max-width: 600px) { + #sidebar { + width: 100%; + } + #sidebar .content { + padding-left: 20px; + padding-right: 20px; + } #search.sr { width: 100%; } diff --git a/inc/processSubredditSidebar.js b/inc/processSubredditSidebar.js new file mode 100644 index 0000000..875758e --- /dev/null +++ b/inc/processSubredditSidebar.js @@ -0,0 +1,64 @@ +module.exports = function() { + this.processSubredditSidebar = (subreddit, redis, fetch, RedditAPI) => { + return new Promise(resolve => { + (async () => { + let key = `${subreddit}:sidebar` + redis.get(key, (error, json) => { + if(error) { + console.error(`Error getting the ${subreddit}:sidebar key from redis.`, error) + resolve(null) + } + if(json) { + json = JSON.parse(json) + let obj = { + title: json.data.title, + public_description_html: json.data.public_description_html, + active_user_count: json.data.active_user_count, + subscribers: json.data.subscribers, + created_utc: json.data.created_utc, + over18: json.data.over18, + description_html: json.data.description_html + } + resolve(obj) + } else { + fetch(`https://oauth.reddit.com/r/${subreddit}/about`, redditApiGETHeaders()) + .then(result => { + if(result.status === 200) { + result.json() + .then(json => { + redis.setex(key, setexs.sidebar, JSON.stringify(json), (error) => { + if(error) { + console.error('Error setting the sidebar key to redis.', error) + return res.render('index', { json: null, user_preferences: req.cookies }) + } else { + console.log('Fetched the sidebar from reddit API.'); + (async () => { + let obj = { + title: json.data.title, + public_description_html: json.data.public_description_html, + active_user_count: json.data.active_user_count, + subscribers: json.data.subscribers, + created_utc: json.data.created_utc, + over18: json.data.over18, + description_html: json.data.description_html + } + resolve(obj) + })() + } + }) + }) + } else { + console.error(`Something went wrong while fetching data from reddit API. ${result.status} – ${result.statusText}`) + console.error(reddit_api_error_text) + resolve(null) + } + }).catch(error => { + console.error('Error fetching the sidebar.', error) + resolve(null) + }) + } + }) + })() + }) + } +} diff --git a/routes.js b/routes.js index 202bb5d..d18d726 100644 --- a/routes.js +++ b/routes.js @@ -6,6 +6,7 @@ module.exports = (app, redis, fetch, RedditAPI) => { let processPost = require('./inc/processJsonPost.js')(); let processUser = require('./inc/processJsonUser.js')(); let processSearches = require('./inc/processSearchResults.js')(); + let processSidebar = require('./inc/processSubredditSidebar.js')(); app.get('/', (req, res, next) => { let past = req.query.t @@ -356,10 +357,12 @@ module.exports = (app, redis, fetch, RedditAPI) => { console.log(`Got /r/${subreddit} key from redis.`); (async () => { let processed_json = await processJsonSubreddit(json, 'redis') + let sidebar_data = await processSubredditSidebar(subreddit, redis, fetch, RedditAPI) if(!processed_json.error) { return res.render('subreddit', { json: processed_json, subreddit: subreddit, + sidebar_data: sidebar_data, subreddit_front: (!before && !after) ? true : false, sortby: sortby, past: past, @@ -388,9 +391,11 @@ module.exports = (app, redis, fetch, RedditAPI) => { console.log(`Fetched the JSON from reddit.com/r/${subreddit}.`); (async () => { let processed_json = await processJsonSubreddit(json, 'from_online') + let sidebar_data = await processSubredditSidebar(subreddit, redis, fetch, RedditAPI) return res.render('subreddit', { json: processed_json, subreddit: subreddit, + sidebar_data: sidebar_data, subreddit_front: (!before && !after) ? true : false, sortby: sortby, past: past, diff --git a/views/subreddit.pug b/views/subreddit.pug index 54fd4d2..4b160af 100644 --- a/views/subreddit.pug +++ b/views/subreddit.pug @@ -99,20 +99,31 @@ html p.comments a(href="" + link.permalink + "", class="comments") | comments #{link.num_comments} - #search.sr - p search - form(action="/r/" + subreddit + "/search", method="GET") - input(type="text", name="q", id="q", placeholder="search") - div - label(for="restrict_sr") limit my search to r/#{subreddit} - input(type="checkbox", name="restrict_sr", id="restrict_sr", checked="checked") - div - label(for="nsfw") include NSFW results - input(type="checkbox", name="nsfw", id="nsfw", checked="checked") - input(type="submit", value="search") - if json.info.before || json.info.after - .view-more-inks - if json.info.before && !subreddit_front - a(href="/r/" + subreddit + "/" + sortby + "?t="+ (past ? past : '') +"&before=" + json.info.before + "") ‹ prev - if json.info.after - a(href="/r/" + subreddit + "/" + sortby + "?t=" + (past ? past : '') + "&after=" + json.info.after + "") next › + if json.info.before || json.info.after + .view-more-inks + if json.info.before && !subreddit_front + a(href="/r/" + subreddit + "/" + sortby + "?t="+ (past ? past : '') +"&before=" + json.info.before + "") ‹ prev + if json.info.after + a(href="/r/" + subreddit + "/" + sortby + "?t=" + (past ? past : '') + "&after=" + json.info.after + "") next › + #sidebar + #search.sr + p search + form(action="/r/" + subreddit + "/search", method="GET") + input(type="text", name="q", id="q", placeholder="search") + div + label(for="restrict_sr") limit my search to r/#{subreddit} + input(type="checkbox", name="restrict_sr", id="restrict_sr", checked="checked") + div + label(for="nsfw") include NSFW results + input(type="checkbox", name="nsfw", id="nsfw", checked="checked") + input(type="submit", value="search") + .content + p subscribers: #{sidebar_data.subscribers.toLocaleString()} + p users here right now: #{sidebar_data.active_user_count.toLocaleString()} + br + .heading + p.title #{sidebar_data.title} + .short-description + != unescape(sidebar_data.public_description_html) + .description + != unescape(sidebar_data.description_html)