Further tweaks to viewport shuffling and dynamic image loading

@BenLubar

public/less/global.less

@@ -14,7 +14,7 @@
 
 	&[data-state="unloaded"], &[data-state="loading"] {
 		display: inherit;
-		height: 1rem;
+		height: 0;
 		opacity: 0;
 	}
 

public/src/client/topic/posts.js

@@ -10,7 +10,9 @@ define('forum/topic/posts', [
 	'components'
 ], function(pagination, infinitescroll, postTools, navigator, components) {
 
-	var Posts = {};
+	var Posts = {
+		_imageLoaderTimeout: undefined
+	};
 
 	Posts.onNewPost = function(data) {
 		if (!data || !data.posts || !data.posts.length) {
@@ -240,13 +242,16 @@ define('forum/topic/posts', [
 		images.each(function() {
 			$(this).attr('data-src', $(this).attr('src'));
 			$(this).attr('data-state', 'unloaded');
-			$(this).attr('src', 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7');
+			$(this).attr('src', 'about:blank');
 		});
-
-		$(window).scrollTop(scrollTop + $(document).height() - height);
 	};
 
 	Posts.loadImages = function(threshold) {
+		if (Posts._imageLoaderTimeout) {
+			clearTimeout(Posts._imageLoaderTimeout);
+		}
+
+		Posts._imageLoaderTimeout = setTimeout(function() {
 			/*
 				If threshold is defined, images loaded above this threshold will modify
 				the user's scroll position so they are not scrolled away from content
@@ -304,6 +309,7 @@ define('forum/topic/posts', [
 				}
 				image.removeAttr('data-src');
 			});
+		}, 250);
 	};
 
 	Posts.wrapImagesInLinks = function(posts) {
@@ -318,13 +324,10 @@ define('forum/topic/posts', [
 	Posts.showBottomPostBar = function() {
 		var mainPost = components.get('post', 'index', 0);
 		var posts = $('[component="post"]');
-		var height = $(document).height();
 		if (!!mainPost.length && posts.length > 1 && $('.post-bar').length < 2) {
 			$('.post-bar').clone().appendTo(mainPost);
-			$(window).scrollTop($(window).scrollTop() + $(document).height() - height);
 		} else if (mainPost.length && posts.length < 2) {
 			mainPost.find('.post-bar').remove();
-			$(window).scrollTop($(window).scrollTop() - $(document).height() - height);
 		}
 	};
 

public/src/modules/navigator.js

@@ -121,21 +121,25 @@ define('navigator', ['forum/pagination', 'components'], function(pagination, com
 			}
 		});
 
+		var atTop = scrollTop === 0 && parseInt(els.first().attr('data-index'), 10) === 0,
+			nearBottom = scrollTop + windowHeight > documentHeight - 100 && parseInt(els.last().attr('data-index'), 10) === count - 1;
 
-		// check if we are at the top
-		if (scrollTop === 0 && parseInt(els.first().attr('data-index'), 10) === 0) {
+		if (atTop) {
 			index = 1;
-		// check if we are near the bottom
-		} else if (scrollTop + windowHeight > documentHeight - 100 && parseInt(els.last().attr('data-index'), 10) === count - 1) {
+		} else if (nearBottom) {
 			index = count;
 		}
 
 		// If a threshold is undefined, try to determine one based on new index
 		if (threshold === undefined) {
+			if (atTop) {
+				threshold = 0;
+			} else {
 				var anchorEl = components.get('post/anchor', index - 1);
 				var anchorRect = anchorEl.get(0).getBoundingClientRect();
 				threshold = anchorRect.top;
 			}
+		}
 
 		if (typeof navigator.callback === 'function') {
 			navigator.callback(index, count, threshold);