closes #4503, /cc @BenLubar

package.json

@@ -56,8 +56,8 @@
     "nodebb-plugin-spam-be-gone": "0.4.6",
     "nodebb-rewards-essentials": "0.0.8",
     "nodebb-theme-lavender": "3.0.9",
-    "nodebb-theme-persona": "4.0.117",
-    "nodebb-theme-vanilla": "5.0.62",
+    "nodebb-theme-persona": "4.0.118",
+    "nodebb-theme-vanilla": "5.0.63",
     "nodebb-widget-essentials": "2.0.9",
     "nodemailer": "2.0.0",
     "nodemailer-sendmail-transport": "1.0.0",

public/language/en_GB/user.json

@@ -104,6 +104,9 @@
 	"enable_topic_searching": "Enable In-Topic Searching",
 	"topic_search_help": "If enabled, in-topic searching will override the browser's default page search behaviour and allow you to search through the entire topic, instead of what is only shown on screen",
 
+	"delay_image_loading": "Delay Image Loading",
+	"image_load_delay_help": "If enabled, images in topics will not load until they are scrolled into view",
+
 	"scroll_to_my_post": "After posting a reply, show the new post",
 
 	"follow_topics_you_reply_to": "Follow topics that you reply to",

public/src/client/topic/posts.js

@@ -263,7 +263,7 @@ define('forum/topic/posts', [
 
 			var images = components.get('post/content').find('img[data-state="unloaded"]'),
 				visible = images.filter(function() {
-					return utils.isElementInViewport(this);
+					return config.delayImageLoading ? utils.isElementInViewport(this) : true;
 				}),
 				scrollTop = $(window).scrollTop(),
 				adjusting = false,

src/controllers/api.js

@@ -79,6 +79,7 @@ apiController.getConfig = function(req, res, next) {
 				config.topicPostSort = settings.topicPostSort || config.topicPostSort;
 				config.categoryTopicSort = settings.categoryTopicSort || config.categoryTopicSort;
 				config.topicSearchEnabled = settings.topicSearchEnabled || false;
+				config.delayImageLoading = settings.delayImageLoading !== undefined ? settings.delayImageLoading : true;
 				config.bootswatchSkin = settings.bootswatchSkin || config.bootswatchSkin;
 				next(null, config);
 			});

src/user/settings.js

@@ -75,6 +75,7 @@ module.exports = function(User) {
 			settings.sendPostNotifications = parseInt(getSetting(settings, 'sendPostNotifications', 0), 10) === 1;
 			settings.restrictChat = parseInt(getSetting(settings, 'restrictChat', 0), 10) === 1;
 			settings.topicSearchEnabled = parseInt(getSetting(settings, 'topicSearchEnabled', 0), 10) === 1;
+			settings.delayImageLoading = parseInt(getSetting(settings, 'delayImageLoading', 1), 10) === 1;
 			settings.bootswatchSkin = settings.bootswatchSkin || 'default';
 			settings.scrollToMyPost = parseInt(getSetting(settings, 'scrollToMyPost', 1), 10) === 1;
 
@@ -120,6 +121,7 @@ module.exports = function(User) {
 			sendPostNotifications: data.sendPostNotifications,
 			restrictChat: data.restrictChat,
 			topicSearchEnabled: data.topicSearchEnabled,
+			delayImageLoading: data.delayImageLoading,
 			groupTitle: data.groupTitle,
 			homePageRoute: data.homePageCustom || data.homePageRoute,
 			scrollToMyPost: data.scrollToMyPost