diff --git a/js/public/app.js b/js/public/app.js
index 6901e49..e8d8f32 100644
--- a/js/public/app.js
+++ b/js/public/app.js
@@ -85,7 +85,8 @@ app.filter('firstCharacter', function() {
 
 app.controller('OcSmsController', ['$scope', '$interval', '$timeout', '$compile',
 	function ($scope, $interval, $timeout, $compile) {
-		$scope.isLoading = true;
+		$scope.isConvLoading = true;
+		$scope.isContactsLoading = true;
 		$scope.buttons = [
 			{text: "Send"}
 		];
@@ -145,7 +146,7 @@ app.controller('OcSmsController', ['$scope', '$interval', '$timeout', '$compile'
 			// If contact is not null, we will fetch a conversation for a new contact
 			if (contact != null) {
 				$scope.selectedContact = contact;
-				$scope.isLoading = true;
+				$scope.isConvLoading = true;
 			}
 
 			$scope.messages = [];
@@ -173,7 +174,7 @@ app.controller('OcSmsController', ['$scope', '$interval', '$timeout', '$compile'
 						}
 
 						$scope.totalMessageCount = jsondata['msgCount'] !== undefined ? jsondata['msgCount'] : 0;
-						$scope.isLoading = false;
+						$scope.isConvLoading = false;
 					});
 
 					$('#app-content').scrollTop(1E10);
@@ -393,6 +394,10 @@ app.controller('OcSmsController', ['$scope', '$interval', '$timeout', '$compile'
 				}
 			});
 
+			$scope.$apply(function() {
+				$scope.isContactsLoading = false;
+			});
+
 			g_lastMsgDate = jsondata["lastRead"];
 		};
 
diff --git a/templates/main.php b/templates/main.php
index f5d5285..05773a0 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -8,7 +8,9 @@ use \OCA\OcSms\Lib\CountryCodes;
 
 <div class="ng-scope" id="app" ng-app="OcSms" ng-controller="OcSmsController">
 	<div id="app-mailbox-peers">
-		<ul class="contact-list">
+		<div id="app-contacts-loader" class="loader" ng-show="isContactsLoading">
+		</div>
+		<ul class="contact-list" ng-show="!isContactsLoading">
 			<li ng-repeat="contact in contacts | orderBy:setting_contactOrder:setting_contactOrderReverse" peer-label="{{ contact.label }}" ng-click="loadConversation(contact);" href="#">
 				<img class="ocsms-plavatar" ng-src="{{ contact.avatar }}" ng-show="contact.avatar !== undefined" />
 				<div class="ocsms-plavatar" ng-show="contact.avatar === undefined" ng-style="{'background-color': (contact.label | peerColor)}">{{ contact.label | firstCharacter }}</div>
@@ -56,9 +58,9 @@ use \OCA\OcSms\Lib\CountryCodes;
 	</div>
 
 	<div id="app-content">
-		<div id="app-content-loader" class="loader" ng-show="isLoading">
+		<div id="app-content-loader" class="loader" ng-show="isConvLoading">
 		</div>
-		<div id="app-content-header" ng-show="!isLoading && selectedContact.label !== undefined && selectedContact.label !== ''"
+		<div id="app-content-header" ng-show="!isConvLoading && selectedContact.label !== undefined && selectedContact.label !== ''"
 			 ng-style="{'background-color': (selectedContact.label | peerColor)}">
 			<div id="ocsms-contact-avatar">
 				<img class="ocsms-plavatar-big" ng-src="{{ selectedContact.avatar }}"
@@ -74,7 +76,7 @@ use \OCA\OcSms\Lib\CountryCodes;
 			</div>
 			
 		</div>
-		<div id="app-content-wrapper" ng-show="!isLoading">
+		<div id="app-content-wrapper" ng-show="!isConvLoading">
 			<div ng-show="messages.length == 0" id="ocsms-empty-conversation">Please choose a conversation on the left menu</div>
 			<div ng-repeat="message in messages | orderBy:'date'">
 				<div class="msg-{{ message.type }}">