make a preference for image sizes in posts, fix #119

app.js

@@ -123,6 +123,14 @@ const preferencesMiddleware = (req, res, next) => {
     res.cookie('highlight_controversial', highlightControversialOverride, { maxAge: 31536000, httpOnly: true })
   }
   
+  let postMediaMaxHeight = req.query.post_media_max_height
+  if(postMediaMaxHeight) {
+    if(config.post_media_max_heights.hasOwnProperty(postMediaMaxHeight) || !isNaN(postMediaMaxHeight)) {
+      req.cookies.post_media_max_height = postMediaMaxHeight
+      res.cookie('post_media_max_height', postMediaMaxHeight, { maxAge: 31536000, httpOnly: true })
+    }
+  }
+  
   next()
 }
 

config.js.template

@@ -25,8 +25,19 @@ const config = {
   nsfw_enabled: process.env.NSFW_ENABLED !== 'true' || true, // Enable NSFW (over 18) content. If false, a warning is shown to the user before opening any NSFW post. When the NFSW content is disabled, NSFW posts are hidden from subreddits and from user page feeds. Note: Users can set this to true or false from their preferences.
   post_comments_sort: process.env.POST_COMMENTS_SORT || 'confidence', // "confidence" is the default sorting in Reddit. Must be one of: confidence, top, new, controversial, old, random, qa, live.
   reddit_app_id: process.env.REDDIT_APP_ID || 'ABfYqdDc9qPh1w', // If "use_reddit_oauth" config key is set to true, you have to obtain your Reddit app ID. For testing purposes it's okay to use this project's default app ID. Create your Reddit app here: https://old.reddit.com/prefs/apps/. Make sure to create an "installed app" type of app.
+  post_media_max_heights: {
+    /**
+    * Sets the max-height value for images and videos in posts.
+    * Default is 'medium'.
+    */
+    'extra-small': 300,
+    'small': 415,
+    'medium': 600,
+    'large': 850,
+    'extra-large': 1200
+  },
   setexs: {
-    /**,
+    /**
     * Redis cache expiration values (in seconds).
     * When the cache expires, new content is fetched from Reddit's API (when
     * the given URL is revisited).

routes.js

@@ -1129,6 +1129,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
               sortby: sortby,
               user_preferences: req.cookies,
               instance_nsfw_enabled: config.nsfw_enabled,
+              post_media_max_heights: config.post_media_max_heights,
               redis_key: comments_key
             })
           } else {
@@ -1164,6 +1165,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
                           more_comments_page: 1,
                           user_preferences: req.cookies,
                           instance_nsfw_enabled: config.nsfw_enabled,
+                          post_media_max_heights: config.post_media_max_heights,
                           redis_key: comments_key
                         })
                       })()
@@ -1204,6 +1206,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
                       sortby: sortby,
                       user_preferences: req.cookies,
                       instance_nsfw_enabled: config.nsfw_enabled,
+                      post_media_max_heights: config.post_media_max_heights,
                       redis_key: comments_key
                     })
                   })()
@@ -1431,6 +1434,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
     let flairs = req.body.flairs
     let nsfw_enabled = req.body.nsfw_enabled
     let highlight_controversial = req.body.highlight_controversial
+    let post_media_max_height = req.body.post_media_max_height
 
     res.cookie('theme', theme, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true })
     
@@ -1452,6 +1456,9 @@ module.exports = (app, redis, fetch, RedditAPI) => {
       highlight_controversial = 'false'
     res.cookie('highlight_controversial', highlight_controversial, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true })
 
+    if(config.post_media_max_heights.hasOwnProperty(post_media_max_height) || !isNaN(post_media_max_height))
+      res.cookie('post_media_max_height', post_media_max_height, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true })
+
     return res.redirect('/preferences')
   })
   

views/post.pug

@@ -24,6 +24,19 @@ html
               p subreddit:
               a(href="/r/" + subreddit + "")
                 p /r/#{subreddit}
+          if user_preferences.post_media_max_height
+            if(post_media_max_heights.hasOwnProperty(user_preferences.post_media_max_height))
+              style.
+                #post .image img, #post .video video {
+                    max-height: #{post_media_max_heights[user_preferences.post_media_max_height]}px;
+                    max-width: 100%;
+                }
+            else if(!isNaN(user_preferences.post_media_max_height))
+              style.
+                #post .image img, #post .video video {
+                    max-height: #{user_preferences.post_media_max_height}px;
+                    max-width: 100%;
+                }
           .info
             .score
               div.arrow

views/preferences.pug

@@ -51,6 +51,20 @@ html
                 input(type="checkbox", name="nsfw_enabled", id="nsfw_enabled")
               else
                 input(type="checkbox", name="nsfw_enabled", id="nsfw_enabled", checked="checked")
+          .setting
+            label(for="post_media_max_height") Media size in posts: 
+              select(id="post_media_max_height", name="post_media_max_height")
+                -
+                  let max_heights_html = ''
+                  let user_key = user_preferences.post_media_max_height
+                  if(!user_key || user_key == '')
+                    user_key = 'medium'
+                  
+                  for(let key in instance_config.post_media_max_heights) {
+                    if(instance_config.post_media_max_heights.hasOwnProperty(key))
+                      max_heights_html += `<option value="${key}" ${(user_key == key ? "selected" : "")}>${key}</option>`
+                  }
+                != max_heights_html
           legend Subscribed subreddits
           .setting
             details