From aa2f4559b76a34ae61e3e61d4ad0f169e4bb2f1e Mon Sep 17 00:00:00 2001
From: rr- <rr-@sakuya.pl>
Date: Wed, 1 Jun 2016 22:37:12 +0200
Subject: [PATCH] client/settings: add option to upscale small posts

---
 client/html/settings.tpl                   |  3 +++
 client/js/controls/post_content_control.js | 18 +++++++++++++-----
 client/js/settings.js                      |  1 +
 client/js/views/settings_view.js           |  2 ++
 4 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/client/html/settings.tpl b/client/html/settings.tpl
index ba44dc1a..67c95a30 100644
--- a/client/html/settings.tpl
+++ b/client/html/settings.tpl
@@ -4,6 +4,9 @@
         <p>These settings are saved to the browser's local storage and are not coupled to the user account, so they don't apply to other devices or browsers alike.</p>
         <div class='input'>
             <ul>
+                <li>
+                    <%= ctx.makeCheckbox({text: 'Upscale small posts', id: 'upscale-small-posts', name: 'upscale-small-posts', checked: ctx.browsingSettings.upscaleSmallPosts}) %>
+                </li>
                 <li>
                     <%= ctx.makeCheckbox({text: 'Endless scroll', id: 'endless-scroll', name: 'endless-scroll', checked: ctx.browsingSettings.endlessScroll}) %>
                     <p class='hint'>Rather than using a paged navigation, smoothly scroll through the content.</p>
diff --git a/client/js/controls/post_content_control.js b/client/js/controls/post_content_control.js
index 9775ec43..ad4f018e 100644
--- a/client/js/controls/post_content_control.js
+++ b/client/js/controls/post_content_control.js
@@ -1,5 +1,6 @@
 'use strict';
 
+const settings = require('../settings.js');
 const views = require('../util/views.js');
 const optimizedResize = require('../util/optimized_resize.js');
 
@@ -22,23 +23,30 @@ class PostContentControl {
     fitWidth() {
         this._currentFitFunction = this.fitWidth;
         const mul = this._post.canvasHeight / this._post.canvasWidth;
-        this._resize(this._viewportWidth, this._viewportWidth * mul);
+        let width = this._viewportWidth;
+        if (!settings.getSettings().upscaleSmallPosts) {
+            width = Math.min(this._post.canvasWidth, width);
+        }
+        this._resize(width, width * mul);
     }
 
     fitHeight() {
         this._currentFitFunction = this.fitHeight;
         const mul = this._post.canvasWidth / this._post.canvasHeight;
-        this._resize(this._viewportHeight * mul, this._viewportHeight);
+        let height = this._viewportHeight;
+        if (!settings.getSettings().upscaleSmallPosts) {
+            height = Math.min(this._post.canvasHeight, height);
+        }
+        this._resize(height * mul, height);
     }
 
     fitBoth() {
         this._currentFitFunction = this.fitBoth;
         let mul = this._post.canvasHeight / this._post.canvasWidth;
         if (this._viewportWidth * mul < this._viewportHeight) {
-            this._resize(this._viewportWidth, this._viewportWidth * mul);
+            this.fitWidth();
         } else {
-            mul = this._post.canvasWidth / this._post.canvasHeight;
-            this._resize(this._viewportHeight * mul, this._viewportHeight);
+            this.fitHeight();
         }
     }
 
diff --git a/client/js/settings.js b/client/js/settings.js
index 17c80f03..2324b774 100644
--- a/client/js/settings.js
+++ b/client/js/settings.js
@@ -10,6 +10,7 @@ function saveSettings(browsingSettings) {
 
 function getSettings(settings) {
     const defaultSettings = {
+        upscaleSmallPosts: false,
         endlessScroll: false,
         keyboardShortcuts: true,
     };
diff --git a/client/js/views/settings_view.js b/client/js/views/settings_view.js
index c5487b1d..bdda3dd4 100644
--- a/client/js/views/settings_view.js
+++ b/client/js/views/settings_view.js
@@ -18,6 +18,8 @@ class SettingsView {
             e.preventDefault();
             views.clearMessages(source);
             ctx.saveSettings({
+                upscaleSmallPosts:
+                    form.querySelector('#upscale-small-posts').checked,
                 endlessScroll:
                     form.querySelector('#endless-scroll').checked,
                 keyboardShortcuts: