Suggesting contacts in dialogs

app/css/app.css

@@ -2518,3 +2518,10 @@ ce671b orange
 .user_color_7:hover {color: #2996ad;}
 .user_color_8,
 .user_color_8:hover {color: #ce671b;}
+
+
+.im_dialogs_contacts_wrap h5 {
+  color: #999;
+  font-size: 13px;
+  margin-left: 8px;
+}

app/js/controllers.js

@@ -219,11 +219,14 @@ angular.module('myApp.controllers', [])
     // console.log('init controller');
 
     $scope.dialogs = [];
+    $scope.contacts = [];
     $scope.search = {};
 
     var offset = 0,
         maxID = 0,
-        hasMore = false;
+        hasMore = false,
+        peersInDialogs = {},
+        contactsShown;
 
     MtpApiManager.invokeApi('account.updateStatus', {offline: false});
     $scope.$on('dialogs_need_more', function () {
@@ -275,10 +278,16 @@ angular.module('myApp.controllers', [])
       offset = 0;
       maxID = 0;
       hasMore = false;
+      peersInDialogs = {};
+      contactsShown = false;
 
       AppMessagesManager.getDialogs($scope.search.query, maxID).then(function (dialogsResult) {
         $scope.dialogs = [];
 
+        if (!$scope.search.query) {
+          $scope.contacts = [];
+        }
+
         if (dialogsResult.dialogs.length) {
           offset += dialogsResult.dialogs.length;
 
@@ -286,6 +295,7 @@ angular.module('myApp.controllers', [])
           hasMore = dialogsResult.count === null || offset < dialogsResult.count;
 
           angular.forEach(dialogsResult.dialogs, function (dialog) {
+            peersInDialogs[dialog.peerID] = true;
             $scope.dialogs.push(AppMessagesManager.wrapForDialog(dialog.top_message, dialog.unread_count));
           });
         }
@@ -306,7 +316,27 @@ angular.module('myApp.controllers', [])
     }
 
     function showMoreDialogs () {
-      if (!hasMore || !offset) {
+      if (!hasMore && contactsShown || !offset) {
+        return;
+      }
+
+      if (!hasMore) {
+        contactsShown = true;
+
+        AppUsersManager.getContacts($scope.search.query).then(function (contactsList) {
+          $scope.contacts = [];
+          angular.forEach(contactsList, function(userID) {
+            if (peersInDialogs[userID] === undefined) {
+              $scope.contacts.push({
+                userID: userID,
+                user: AppUsersManager.getUser(userID),
+                userPhoto: AppUsersManager.getUserPhoto(userID, 'User'),
+                peerString: AppUsersManager.getUserString(userID)
+              });
+            }
+          });
+        });
+        $scope.$broadcast('ui_dialogs_append');
         return;
       }
 
@@ -316,6 +346,7 @@ angular.module('myApp.controllers', [])
         hasMore = dialogsResult.count === null || offset < dialogsResult.count;
 
         angular.forEach(dialogsResult.dialogs, function (dialog) {
+          peersInDialogs[dialog.peerID] = true;
           $scope.dialogs.push(AppMessagesManager.wrapForDialog(dialog.top_message, dialog.unread_count));
         });
 

app/js/directives.js

@@ -60,6 +60,10 @@ angular.module('myApp.directives', ['myApp.filters'])
         onContentLoaded(function () {
           updateScroller();
           moreNotified = false;
+
+          $timeout(function () {
+            $(scrollableWrap).trigger('scroll');
+          });
         });
       });
 
@@ -67,6 +71,10 @@ angular.module('myApp.directives', ['myApp.filters'])
         onContentLoaded(function () {
           updateScroller();
           moreNotified = false;
+
+          $timeout(function () {
+            $(scrollableWrap).trigger('scroll');
+          });
         });
       });
 
@@ -176,7 +184,7 @@ angular.module('myApp.directives', ['myApp.filters'])
 
       var transform = false,
           trs = ['transform', 'webkitTransform', 'MozTransform', 'msTransform', 'OTransform'],
-          i = 0;
+          i;
       for (i = 0; i < trs.length; i++) {
         if (trs[i] in historyMessagesEl.style) {
           transform = trs[i];

app/partials/im.html

@@ -15,6 +15,30 @@
             <ul class="nav nav-pills nav-stacked">
               <li class="im_dialog_wrap" my-dialog dialog-message="dialogMessage" ng-repeat="dialogMessage in dialogs track by dialogMessage.peerID" ng-class="{active: curDialog.peerID == dialogMessage.peerID}"></li>
             </ul>
+            <div class="im_dialogs_contacts_wrap" ng-show="contacts.length > 0">
+              <h5>Contacts</h5>
+              <ul class="nav nav-pills nav-stacked">
+                <li class="im_dialog_wrap" ng-repeat="contact in contacts | orderBy:'user.sortName' track by contact.userID" ng-class="{active: curDialog.peerID == contact.userID}">
+                  <a class="im_dialog" ng-click="dialogSelect(contact.peerString)">
+                    <div class="im_dialog_photo pull-left">
+                      <img
+                        class="im_dialog_photo"
+                        my-load-thumb
+                        thumb="contact.userPhoto"
+                      />
+                    </div>
+                    <div class="im_dialog_message_wrap">
+                      <div class="im_dialog_peer">
+                        <span class="im_dialog_user" ng-bind-html="contact.user.rFullName"></span>
+                      </div>
+                      <div class="im_dialog_message">
+                        <span class="im_dialog_message_text">{{contact.user | userStatus}}</span>
+                      </div>
+                    </div>
+                  </a>
+                </li>
+              </ul>
+            </div>
           </div>
         </div>
       </div>