Improved message users perf

app/css/app.css

@@ -1321,6 +1321,11 @@ a.im_dialog_selected .im_dialog_date {
   margin: 0 auto;
   padding: 0 77px 0 77px;
 }
+.im_history_typing a.im_history_typing_author {
+  color: #999;
+  font-weight: bold;
+}
+
 
 .im_message_unread_split {
   background: #f4f4f4;

app/css/app_mobile.css

@@ -153,7 +153,7 @@ html {
 
 .tg_page_head .navbar-inverse .navbar-quick-nav > li > a {
   padding-left: 15px;
-  padding: 6px 10px 2px 25px;
+  padding: 6px 10px 2px 28px;
   color: #b9cfe3;
   font-size: 13px;
   height: 46px;
@@ -166,7 +166,7 @@ html {
 }
 .navbar-quick-nav .icon-back {
   position: absolute;
-  margin-left: -15px;
+  margin-left: -18px;
   margin-top: 10px;
 }
 .navbar-quick-nav h4 {

app/js/controllers.js

@@ -233,6 +233,7 @@ angular.module('myApp.controllers', [])
     $scope.search = {};
     $scope.historyFilter = {mediaType: false};
     $scope.historyPeer = {};
+    $scope.historyState = {selectActions: false, typing: []};
 
     $scope.openSettings = function () {
       $modal.open({
@@ -637,9 +638,8 @@ angular.module('myApp.controllers', [])
     $scope.skippedHistory = false;
     $scope.selectedMsgs = {};
     $scope.selectedCount = 0;
-    $scope.selectActions = false;
+    $scope.historyState.selectActions = false;
     $scope.missedCount = 0;
-    $scope.typing = {};
     $scope.state = {};
 
     $scope.toggleMessage = toggleMessage;
@@ -721,7 +721,7 @@ angular.module('myApp.controllers', [])
       });
 
       if (preload) {
-        $scope.typing = {};
+        $scope.historyState.typing.splice();
         $scope.$broadcast('ui_peer_change');
         $scope.$broadcast('ui_history_change');
         safeReplaceObject($scope.state, {loaded: true});
@@ -900,7 +900,7 @@ angular.module('myApp.controllers', [])
         $scope.$broadcast('ui_selection_clear');
       }
 
-      if (!$scope.selectActions && !$(target).hasClass('icon-select-tick') && !$(target).hasClass('im_content_message_select_area')) {
+      if (!$scope.historyState.selectActions && !$(target).hasClass('icon-select-tick') && !$(target).hasClass('im_content_message_select_area')) {
         return false;
       }
 
@@ -909,7 +909,7 @@ angular.module('myApp.controllers', [])
         delete $scope.selectedMsgs[messageID];
         $scope.selectedCount--;
         if (!$scope.selectedCount) {
-          $scope.selectActions = false;
+          $scope.historyState.selectActions = false;
           $scope.$broadcast('ui_panel_update');
         }
       } else {
@@ -940,8 +940,8 @@ angular.module('myApp.controllers', [])
 
         $scope.selectedMsgs[messageID] = true;
         $scope.selectedCount++;
-        if (!$scope.selectActions) {
+        if (!$scope.historyState.selectActions) {
-          $scope.selectActions = true;
+          $scope.historyState.selectActions = true;
           $scope.$broadcast('ui_panel_update');
         }
       }
@@ -950,7 +950,7 @@ angular.module('myApp.controllers', [])
     function selectedCancel (noBroadcast) {
       $scope.selectedMsgs = {};
       $scope.selectedCount = 0;
-      $scope.selectActions = false;
+      $scope.historyState.selectActions = false;
       lastSelectID = false;
       if (!noBroadcast) {
         $scope.$broadcast('ui_panel_update');
@@ -997,10 +997,10 @@ angular.module('myApp.controllers', [])
     }
 
     function toggleEdit () {
-      if ($scope.selectActions) {
+      if ($scope.historyState.selectActions) {
         selectedCancel();
       } else {
-        $scope.selectActions = true;
+        $scope.historyState.selectActions = true;
         $scope.$broadcast('ui_panel_update');
       }
     }
@@ -1023,11 +1023,9 @@ angular.module('myApp.controllers', [])
       }
     }
 
-
-    var typingTimeouts = {};
-
     $scope.$on('history_update', angular.noop);
 
+    var typingTimeouts = {};
     $scope.$on('history_append', function (e, addedMessage) {
       if (addedMessage.peerID == $scope.curDialog.peerID) {
         if ($scope.historyFilter.mediaType || $scope.skippedHistory) {
@@ -1042,7 +1040,7 @@ angular.module('myApp.controllers', [])
         // console.trace();
         $scope.history.push(AppMessagesManager.wrapForHistory(addedMessage.messageID));
         AppMessagesManager.regroupWrappedHistory($scope.history, -3);
-        $scope.typing = {};
+        $scope.historyState.typing.splice();
         $scope.$broadcast('ui_history_append_new', {my: addedMessage.my});
         if (addedMessage.my) {
           delete $scope.historyUnreadAfter;
@@ -1084,28 +1082,24 @@ angular.module('myApp.controllers', [])
     });
 
     $scope.$on('apiUpdate', function (e, update) {
-      // console.log('on apiUpdate inline', update);
       switch (update._) {
         case 'updateUserTyping':
-          if (update.user_id == $scope.curDialog.peerID && AppUsersManager.hasUser(update.user_id)) {
-            $scope.typing = {user: AppUsersManager.getUser(update.user_id)};
-
-            $timeout.cancel(typingTimeouts[update.user_id]);
-
-            typingTimeouts[update.user_id] = $timeout(function () {
-              $scope.typing = {};
-            }, 6000);
-          }
-          break;
-
         case 'updateChatUserTyping':
-          if (-update.chat_id == $scope.curDialog.peerID && AppUsersManager.hasUser(update.user_id)) {
+          if (AppUsersManager.hasUser(update.user_id) &&
-            $scope.typing = {user: AppUsersManager.getUser(update.user_id)};
+              $scope.curDialog.peerID == (update._ == 'updateUserTyping'
-
+                ? update.user_id
+                : -update.chat_id
+              )) {
+            if ($scope.historyState.typing.indexOf(update.user_id) == -1) {
+              $scope.historyState.typing.push(update.user_id);
+            }
             $timeout.cancel(typingTimeouts[update.user_id]);
 
             typingTimeouts[update.user_id] = $timeout(function () {
-              $scope.typing = {};
+              var pos = $scope.historyState.typing.indexOf(update.user_id);
+              if (pos !== -1) {
+                $scope.historyState.typing.splice(pos, 1);
+              }
             }, 6000);
           }
           break;

app/js/directives.js

@@ -1554,7 +1554,7 @@ angular.module('myApp.directives', ['myApp.filters'])
   })
 
 
-  .directive('myUserLink', function ($window, $timeout, $rootScope, AppUsersManager) {
+  .directive('myUserLink', function ($timeout, $rootScope, AppUsersManager) {
 
     return {
       link: link
@@ -1576,8 +1576,24 @@ angular.module('myApp.directives', ['myApp.filters'])
     }
   })
 
+  .directive('myUserStatus', function ($filter, AppUsersManager) {
 
-  .directive('myUserPhotolink', function ($window, $timeout, $rootScope, AppUsersManager) {
+    var statusFilter = $filter('userStatus');
+
+    return {
+      link: link
+    };
+
+    function link($scope, element, attrs) {
+      var userID = $scope.$eval(attrs.myUserStatus),
+          user = AppUsersManager.getUser(userID);
+
+      element.html(statusFilter(user));
+    }
+  })
+
+
+  .directive('myUserPhotolink', function ($rootScope, AppUsersManager) {
 
     return {
       link: link,

app/js/services.js

@@ -467,7 +467,6 @@ angular.module('myApp.services', [])
       MtpApiManager.getUserID().then(function (myID) {
         angular.forEach(chatFull.participants.participants, function(participant){
           participant.user = AppUsersManager.getUser(participant.user_id);
-          participant.userPhoto = AppUsersManager.getUserPhoto(participant.user_id, 'User');
           participant.inviter = AppUsersManager.getUser(participant.inviter_id);
           participant.canKick = myID != participant.user_id && (myID == chatFull.participants.admin_id || myID == participant.inviter_id);
         });
@@ -1741,14 +1740,6 @@ angular.module('myApp.services', [])
       message.media.progress = messagesStorage[msgID].media.progress;
     }
 
-    message.fromUser = AppUsersManager.getUser(message.from_id);
-    message.fromPhoto = AppUsersManager.getUserPhoto(message.from_id, 'User');
-
-    if (message._ == 'messageForwarded') {
-      message.fwdUser = AppUsersManager.getUser(message.fwd_from_id);
-      message.fwdPhoto = AppUsersManager.getUserPhoto(message.fwd_from_id, 'User');
-    }
-
     if (message.media) {
       switch (message.media._) {
         case 'messageMediaPhoto':
@@ -1774,11 +1765,6 @@ angular.module('myApp.services', [])
           );
           break;
       }
-
-      if (message.media.user_id) {
-        message.media.user = AppUsersManager.getUser(message.media.user_id);
-        message.media.userPhoto = AppUsersManager.getUserPhoto(message.media.user_id, 'User');
-      }
     }
     else if (message.action) {
       switch (message.action._) {
@@ -1791,11 +1777,6 @@ angular.module('myApp.services', [])
           message.action.rTitle = RichTextProcessor.wrapRichText(message.action.title, {noLinks: true, noLinebreaks: true}) || 'DELETED';
           break;
       }
-
-      if (message.action.user_id) {
-        message.action.user = AppUsersManager.getUser(message.action.user_id);
-        message.action.userPhoto = AppUsersManager.getUserPhoto(message.action.user_id, 'User');
-      }
     }
 
     if (message.message && message.message.length) {

app/partials/chat_modal.html

@@ -86,9 +86,9 @@
             <a class="chat_modal_participant_photo pull-left" my-user-photolink="participant.user_id" img-class="chat_modal_participant_photo" status="true"></a>
 
             <div class="chat_modal_participant_name">
-              <a my-user-link="participant.user.id"></a>
+              <a my-user-link="participant.user_id"></a>
             </div>
-            <div class="chat_modal_participant_status" ng-bind="participant.user | userStatus"></div>
+            <div class="chat_modal_participant_status" my-user-status="participant.user_id"></div>
           </div>
 
         </div>

app/partials/im.html

@@ -156,7 +156,7 @@
             <div class="im_history_scrollable_wrap nano-content">
 
               <div class="im_history_scrollable">
-                  <div class="im_history" ng-class="{im_history_selectable: selectActions}">
+                  <div class="im_history" ng-class="{im_history_selectable: historyState.selectActions}">
                     <div ng-if="!history.length"  class="im_history_empty" ng-switch="state.mayBeHasMore" my-vertical-position="0.25" padding="true">
                       <span ng-switch-when="true">Loading history<span my-loading-dots></span></span>
                       <span ng-switch-default>No messages here yet...</span>
@@ -168,8 +168,17 @@
                   </div>
 
                   <div class="im_history_typing_wrap">
-                    <div class="im_history_typing" ng-show="typing.user &amp;&amp; !historyFilter.mediaType">
+
-                      <strong class="im_history_typing_author" ng-bind-html="typing.user.rFullName"></strong> is typing<span my-loading-dots></span>
+                    <div class="im_history_typing" ng-show="historyState.typing.length > 0 &amp;&amp; !historyFilter.mediaType" ng-switch="historyState.typing.length">
+                      <span ng-switch-when="1">
+                        <a class="im_history_typing_author" my-user-link="historyState.typing[0]"></a> is typing<span my-loading-dots></span>
+                      </span>
+                      <span ng-switch-when="2">
+                        <a class="im_history_typing_author" my-user-link="historyState.typing[0]"></a> and <a class="im_history_typing_author" my-user-link="historyState.typing[1]"></a> are typing<span my-loading-dots></span>
+                      </span>
+                      <span ng-switch-default>
+                        <a class="im_history_typing_author" my-user-link="historyState.typing[0]"></a>, <a class="im_history_typing_author" my-user-link="historyState.typing[1]"></a> and {{historyState.typing.length - 2}} more are typing<span my-loading-dots></span>
+                      </span>
                     </div>
                   </div>
 
@@ -181,7 +190,7 @@
 
           <div class="im_bottom_panel_wrap">
 
-            <div class="im_edit_panel_wrap clearfix" ng-show="selectActions">
+            <div class="im_edit_panel_wrap clearfix" ng-show="historyState.selectActions">
               <div class="im_edit_panel_border"></div>
               <a class="im_edit_flush_link" ng-click="selectedFlush()" ng-switch="historyPeer.id > 0">
                 <span ng-switch-when="true">Delete Chat</span>
@@ -197,7 +206,7 @@
               </div>
             </div>
 
-            <div class="im_send_panel_wrap" ng-hide="selectActions">
+            <div class="im_send_panel_wrap" ng-hide="historyState.selectActions">
 
               <div class="im_send_form_wrap1">
 

app/partials/message_attach_contact.html

@@ -1,7 +1,7 @@
 <div>
-  <a class="im_message_contact_photo pull-left" my-user-photolink="historyMessage.media.user.id" img-class="im_message_contact_photo"></a>
+  <a class="im_message_contact_photo pull-left" my-user-photolink="historyMessage.media.user_id" img-class="im_message_contact_photo"></a>
-  <div class="im_message_contact_name" ng-switch="historyMessage.media.user.id > 0">
+  <div class="im_message_contact_name" ng-switch="historyMessage.media.user_id > 0">
-    <a ng-switch-when="true" my-user-link="historyMessage.media.user.id"></a>
+    <a ng-switch-when="true" my-user-link="historyMessage.media.user_id"></a>
     <span ng-switch-default ng-bind-html="::historyMessage.media.rFullName"></span>
   </div>
   <div class="im_message_contact_phone" ng-bind="::historyMessage.media.phone_number | phoneNumber"></div>