From cd1e26418dfc9ee839c7fa392388a0a5ae22a2b7 Mon Sep 17 00:00:00 2001
From: Julian Lam <julian.lam@gmail.com>
Date: Fri, 22 Nov 2013 21:30:34 -0500
Subject: [PATCH] making the loading indicator less obtrusive (and smaller, to
 boot)

---
 public/src/app.js          | 15 +++++++++------
 public/templates/topic.tpl |  8 +++-----
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/public/src/app.js b/public/src/app.js
index 43a00581f8..b7f714f0f0 100644
--- a/public/src/app.js
+++ b/public/src/app.js
@@ -423,14 +423,16 @@ var socket,
 	app.infiniteLoaderActive = false;
 
 	app.loadMorePosts = function (tid, callback) {
+		var	indicatorEl = $('.loading-indicator');
+
 		if (app.infiniteLoaderActive) {
 			return;
 		}
 
 		app.infiniteLoaderActive = true;
 
-		if ($('#loading-indicator').attr('done') === '0') {
-			$('#loading-indicator').removeClass('hide');
+		if (indicatorEl.attr('done') === '0') {
+			indicatorEl.fadeIn();
 		}
 
 		socket.emit('api:topic.loadMore', {
@@ -439,14 +441,15 @@ var socket,
 		}, function (data) {
 			app.infiniteLoaderActive = false;
 			if (data.posts.length) {
-				$('#loading-indicator').attr('done', '0');
+				indicatorEl.attr('done', '0');
 				app.createNewPosts(data, true);
 			} else {
-				$('#loading-indicator').attr('done', '1');
+				indicatorEl.attr('done', '1');
 			}
-			$('#loading-indicator').addClass('hide');
-			if (callback)
+			indicatorEl.fadeOut();
+			if (callback) {
 				callback(data.posts);
+			}
 		});
 	}
 
diff --git a/public/templates/topic.tpl b/public/templates/topic.tpl
index 343c4a4013..8f8ff6a8c5 100644
--- a/public/templates/topic.tpl
+++ b/public/templates/topic.tpl
@@ -193,13 +193,11 @@
 		<!-- END posts -->
 	</ul>
 
-	<div id="loading-indicator" style="text-align:center;" class="hide" done="0">
-		<i class="icon-spinner icon-spin icon-large"></i>
-	</div>
-
-
 	<div class="well col-md-11 col-xs-12 pull-right hide">
 		<div class="topic-main-buttons pull-right inline-block hide">
+			<div class="loading-indicator" done="0">
+				Loading More Posts <i class="icon-refresh icon-spin"></i>
+			</div>
 			<button class="btn btn-primary post_reply" type="button">[[topic:reply]]</button>
 			<div class="btn-group thread-tools hide">
 				<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">[[topic:thread_tools.title]] <span class="caret"></span></button>