add subreddit sidebars

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

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%;
+	width: calc(100% - 60px);
-	margin-top: 00px;
+	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%;
 	}

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)
+            })
+          }
+        })
+      })()
+    })
+  }
+}

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,

views/subreddit.pug

@@ -99,20 +99,31 @@ html
                   p.comments
                     a(href="" + link.permalink + "", class="comments")
                       | comments #{link.num_comments}
-      #search.sr
+        if json.info.before || json.info.after
-        p search
+          .view-more-inks
-        form(action="/r/" + subreddit + "/search", method="GET")
+            if json.info.before && !subreddit_front
-          input(type="text", name="q", id="q", placeholder="search")
+              a(href="/r/" + subreddit + "/" + sortby + "?t="+ (past ? past : '') +"&before=" + json.info.before + "") ‹ prev
-          div
+            if json.info.after
-            label(for="restrict_sr") limit my search to r/#{subreddit}
+              a(href="/r/" + subreddit + "/" + sortby + "?t=" + (past ? past : '') + "&after=" + json.info.after + "") next ›
-              input(type="checkbox", name="restrict_sr", id="restrict_sr", checked="checked")
+      #sidebar
-          div
+        #search.sr
-            label(for="nsfw") include NSFW results
+          p search
-              input(type="checkbox", name="nsfw", id="nsfw", checked="checked")
+          form(action="/r/" + subreddit + "/search", method="GET")
-          input(type="submit", value="search")
+            input(type="text", name="q", id="q", placeholder="search")
-      if json.info.before || json.info.after
+            div
-        .view-more-inks
+              label(for="restrict_sr") limit my search to r/#{subreddit}
-          if json.info.before && !subreddit_front
+                input(type="checkbox", name="restrict_sr", id="restrict_sr", checked="checked")
-            a(href="/r/" + subreddit + "/" + sortby + "?t="+ (past ? past : '') +"&before=" + json.info.before + "") ‹ prev
+            div
-          if json.info.after
+              label(for="nsfw") include NSFW results
-            a(href="/r/" + subreddit + "/" + sortby + "?t=" + (past ? past : '') + "&after=" + json.info.after + "") next ›
+                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)