Merged with master

app/css/app.css

@@ -869,6 +869,10 @@ a.tg_radio_on:hover i.icon-radio {
   padding: 6px 20px 6px 30px;
   margin: 0 0 6px;
 }
+.im_dialogs_modal_col_wrap .im_dialogs_search_field {
+  background-color: #FFF;
+  border-color: #d9dbde;
+}
 .is_1x .im_dialogs_search_field {
   background-image: url(../img/icons/IconsetW_1x.png);
 }
@@ -877,6 +881,7 @@ a.tg_radio_on:hover i.icon-radio {
   background-color: #FFF;
 }
 
+
 .im_dialogs_search_clear {
   position: absolute;
   right: 9px;
@@ -2692,9 +2697,9 @@ a:hover .icon-twitter {
 .contacts_modal_search_field {
   font-size: 12px;
   line-height: normal;
-  background: #F2F2F2 url(../img/icons/IconsetW.png) -6px -205px no-repeat;
+  background: url(../img/icons/IconsetW.png) -6px -205px no-repeat;
   background-size: 42px 891px;
-  border: 1px solid #F2F2F2;
+  border: 1px solid #d9dbde;
   border-radius: 3px;
   padding: 6px 15px 6px 30px;
   margin: 0;
@@ -2702,10 +2707,6 @@ a:hover .icon-twitter {
 .is_1x .contacts_modal_search_field {
   background-image: url(../img/icons/IconsetW_1x.png);
 }
-.contacts_modal_search_field:focus,
-.contacts_modal_search_field:active {
-  background-color: #FFF;
-}
 
 .contacts_modal_search_clear {
   position: absolute;
@@ -2748,7 +2749,7 @@ a:hover .icon-twitter {
 
 
 .contacts_modal_members_list .contacts_modal_contact_wrap {
-  /*margin-top: 0;*/
+  margin-top: 0;
 }
 .contacts_modal_members_list a.contacts_modal_contact {
   clear: both;
@@ -2899,8 +2900,8 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status,
 .is_1x .icon-delete {
   background-image: url(../img/icons/IconsetW_1x.png);
 }
-.im_message_selected,
-.im_message_focus {
+.im_message_selected .im_message_outer_wrap,
+.im_message_focus .im_message_outer_wrap {
   background: #f2f6fa;
 }
 

app/js/controllers.js

@@ -560,7 +560,7 @@ angular.module('myApp.controllers', [])
       if (searchMessages) {
         searchTimeoutPromise = force ? $q.when() : $timeout(angular.noop, 500);
         promise = searchTimeoutPromise.then(function () {
-          return AppMessagesManager.getSearch({_: 'inputPeerEmpty'}, $scope.search.query, {_: 'inputMessagesFilterEmpty'}, maxID)
+          return AppMessagesManager.getSearch({_: 'inputPeerEmpty'}, $scope.search.query, {_: 'inputMessagesFilterEmpty'}, maxID);
         });
       } else {
         promise = AppMessagesManager.getDialogs($scope.search.query, maxID);
@@ -579,7 +579,7 @@ angular.module('myApp.controllers', [])
             dialogs.push({
               peerID: peerID,
               top_message: messageID,
-              unread_count: 0
+              unread_count: -1
             });
           });
 
@@ -638,7 +638,8 @@ angular.module('myApp.controllers', [])
 
           angular.forEach(dialogsResult.dialogs, function (dialog) {
             peersInDialogs[dialog.peerID] = true;
-            $scope.dialogs.push(AppMessagesManager.wrapForDialog(dialog.top_message, dialog.unread_count));
+            var wrappedDialog = AppMessagesManager.wrapForDialog(dialog.top_message, dialog.unread_count);
+            $scope.dialogs.push(wrappedDialog);
           });
           delete $scope.isEmpty.dialogs;
         }
@@ -758,7 +759,11 @@ angular.module('myApp.controllers', [])
         },
         jump = 0,
         moreJump = 0,
-        lessJump = 0;
+        moreActive = false,
+        morePending = false,
+        lessJump = 0,
+        lessActive = false,
+        lessPending = false;
 
     function applyDialogSelect (newDialog, oldDialog) {
       var newPeer = newDialog.peer || $scope.curDialog.peer || '';
@@ -861,16 +866,18 @@ angular.module('myApp.controllers', [])
           found = false,
           history = historiesQueueFind();
 
-      for (i = 0; i < history.messages.length; i++) {
-        if ($scope.curDialog.messageID == history.messages[i].id) {
-          found = true;
-          break;
+      if (history) {
+        for (i = 0; i < history.messages.length; i++) {
+          if ($scope.curDialog.messageID == history.messages[i].id) {
+            found = true;
+            break;
+          }
         }
       }
 
       if (found) {
         $scope.historyUnread = {};
-        $scope.historyFocus = $scope.curDialog.messageID;
+        $scope.$broadcast('messages_focus', $scope.curDialog.messageID);
         $scope.$broadcast('ui_history_change_scroll');
       } else {
         loadHistory();
@@ -881,12 +888,19 @@ angular.module('myApp.controllers', [])
       if (!hasLess) {
         return;
       }
+      if (moreActive) {
+        lessPending = true;
+        return;
+      }
+      lessPending = false;
+      lessActive = true;
 
       var curJump = jump,
           curLessJump = ++lessJump,
           limit = 0,
           backLimit = 20;
       AppMessagesManager.getHistory($scope.curDialog.inputPeer, minID, limit, backLimit).then(function (historyResult) {
+        lessActive = false;
         if (curJump != jump || curLessJump != lessJump) return;
 
         var i, id;
@@ -901,13 +915,19 @@ angular.module('myApp.controllers', [])
           minID = historyResult.history.length >= backLimit
                     ? historyResult.history[0]
                     : 0;
-          AppMessagesManager.regroupWrappedHistory(peerHistory.messages, -backLimit);
+          if (AppMessagesManager.regroupWrappedHistory(peerHistory.messages, -backLimit)) {
+            $scope.$broadcast('messages_regroup');
+          }
           delete $scope.state.empty;
           $scope.$broadcast('ui_history_append');
         } else {
           minID = 0;
         }
         $scope.skippedHistory = hasLess = minID > 0;
+
+        if (morePending) {
+          showMoreHistory();
+        }
       });
     }
 
@@ -915,6 +935,12 @@ angular.module('myApp.controllers', [])
       if (!hasMore) {
         return;
       }
+      if (lessActive) {
+        morePending = true;
+        return;
+      }
+      morePending = false;
+      moreActive = true;
 
       var curJump = jump,
           curMoreJump = moreJump,
@@ -925,6 +951,7 @@ angular.module('myApp.controllers', [])
         : AppMessagesManager.getHistory($scope.curDialog.inputPeer, maxID, limit);
 
       getMessagesPromise.then(function (historyResult) {
+        moreActive = false;
         if (curJump != jump || curMoreJump != moreJump) return;
 
         angular.forEach(historyResult.history, function (id) {
@@ -935,10 +962,16 @@ angular.module('myApp.controllers', [])
                   historyResult.history.length && peerHistory.messages.length < historyResult.count;
 
         if (historyResult.history.length) {
-          maxID = historyResult.history[historyResult.history.length - 1];
-          AppMessagesManager.regroupWrappedHistory(peerHistory.messages, historyResult.history.length + 1);
           delete $scope.state.empty;
+          maxID = historyResult.history[historyResult.history.length - 1];
           $scope.$broadcast('ui_history_prepend');
+          if (AppMessagesManager.regroupWrappedHistory(peerHistory.messages, historyResult.history.length + 1)) {
+            $scope.$broadcast('messages_regroup');
+          }
+        }
+
+        if (lessPending) {
+          showLessHistory();
         }
       });
     };
@@ -957,8 +990,8 @@ angular.module('myApp.controllers', [])
 
       if ($scope.curDialog.messageID) {
         maxID = parseInt($scope.curDialog.messageID);
-        limit = 5;
-        backLimit = 5;
+        limit = 10;
+        backLimit = 10;
       }
       else if (forceRecent) {
         limit = 10;
@@ -966,15 +999,23 @@ angular.module('myApp.controllers', [])
       else if (Config.Mobile) {
         limit = 20;
       }
-      else if (peerHistory.messages.length > 0) {
-        limit = Math.min(20, peerHistory.messages.length);
+
+      moreActive = false;
+      morePending = false;
+      lessActive = false;
+      lessPending = false;
+
+      var prerenderedLen = peerHistory.messages.length;
+      if (prerenderedLen && (maxID || backLimit)) {
+        prerenderedLen = 0;
+        peerHistory.messages = [];
       }
 
       var curJump = ++jump,
           inputMediaFilter = $scope.historyFilter.mediaType && {_: inputMediaFilters[$scope.historyFilter.mediaType]},
           getMessagesPromise = inputMediaFilter
         ? AppMessagesManager.getSearch($scope.curDialog.inputPeer, '', inputMediaFilter, maxID)
-        : AppMessagesManager.getHistory($scope.curDialog.inputPeer, maxID, limit, backLimit);
+        : AppMessagesManager.getHistory($scope.curDialog.inputPeer, maxID, limit, backLimit, prerenderedLen);
 
 
       $scope.state.mayBeHasMore = true;
@@ -1005,16 +1046,21 @@ angular.module('myApp.controllers', [])
         });
         peerHistory.messages.reverse();
 
-        AppMessagesManager.regroupWrappedHistory(peerHistory.messages);
+        if (AppMessagesManager.regroupWrappedHistory(peerHistory.messages)) {
+          $scope.$broadcast('messages_regroup');
+        }
 
         if (historyResult.unreadOffset) {
           $scope.historyUnreadAfter = historyResult.history[historyResult.unreadOffset - 1];
-        } else {
+          $scope.$broadcast('messages_unread_after');
+        }
+        else if ($scope.historyUnreadAfter) {
           delete $scope.historyUnreadAfter;
+          $scope.$broadcast('messages_unread_after');
         }
-
-        $scope.historyFocus = $scope.curDialog.messageID || 0;
-
+        onContentLoaded(function () {
+          $scope.$broadcast('messages_focus', $scope.curDialog.messageID || 0);
+        })
         $scope.$broadcast('ui_history_change');
 
         AppMessagesManager.readHistory($scope.curDialog.inputPeer);
@@ -1085,6 +1131,7 @@ angular.module('myApp.controllers', [])
           $scope.$broadcast('ui_panel_update');
         }
       }
+      $scope.$broadcast('messages_select');
     }
 
     function selectedCancel (noBroadcast) {
@@ -1095,6 +1142,7 @@ angular.module('myApp.controllers', [])
       if (!noBroadcast) {
         $scope.$broadcast('ui_panel_update');
       }
+      $scope.$broadcast('messages_select');
     }
 
     function selectedFlush () {
@@ -1187,13 +1235,16 @@ angular.module('myApp.controllers', [])
       // console.log('append', addedMessage);
       // console.trace();
       history.messages.push(AppMessagesManager.wrapForHistory(addedMessage.messageID));
-      AppMessagesManager.regroupWrappedHistory(history.messages, -3);
+      if (AppMessagesManager.regroupWrappedHistory(history.messages, -3)) {
+        $scope.$broadcast('messages_regroup');
+      }
 
       if (curPeer) {
         $scope.historyState.typing.splice(0, $scope.historyState.typing.length);
         $scope.$broadcast('ui_history_append_new', {my: addedMessage.my});
-        if (addedMessage.my) {
+        if (addedMessage.my && $scope.historyUnreadAfter) {
           delete $scope.historyUnreadAfter;
+          $scope.$broadcast('messages_unread_after');
         }
 
         // console.log('append check', $rootScope.idle.isIDLE, addedMessage.peerID, $scope.curDialog.peerID);
@@ -1219,7 +1270,9 @@ angular.module('myApp.controllers', [])
         }
       };
       history.messages = newMessages;
-      AppMessagesManager.regroupWrappedHistory(history.messages);
+      if (AppMessagesManager.regroupWrappedHistory(history.messages)) {
+        $scope.$broadcast('messages_regroup');
+      }
       if (historyUpdate.peerID == $scope.curDialog.peerID) {
         $scope.state.empty = !newMessages.length;
       }
@@ -1245,6 +1298,7 @@ angular.module('myApp.controllers', [])
       switch (update._) {
         case 'updateUserTyping':
         case 'updateChatUserTyping':
+          AppUsersManager.forceUserOnline(update.user_id);
           if (AppUsersManager.hasUser(update.user_id) &&
               $scope.curDialog.peerID == (update._ == 'updateUserTyping'
                 ? update.user_id
@@ -1516,7 +1570,6 @@ angular.module('myApp.controllers', [])
     };
 
     $scope.$on('history_delete', function (e, historyUpdate) {
-      console.log(dT(), 'delete', historyUpdate);
       if (historyUpdate.peerID == peerID) {
         if (historyUpdate.msgs[$scope.messageID]) {
           if ($scope.nav.hasNext) {
@@ -1751,7 +1804,6 @@ angular.module('myApp.controllers', [])
       }).result.then(function (foundUserID) {
         if ($scope.userID == foundUserID) {
           $scope.user = AppUsersManager.getUser($scope.userID);
-          console.log($scope.user);
         }
       });
     };
@@ -1759,7 +1811,6 @@ angular.module('myApp.controllers', [])
     $scope.deleteContact = function () {
       AppUsersManager.deleteContacts([$scope.userID]).then(function () {
         $scope.user = AppUsersManager.getUser($scope.userID);
-        console.log($scope.user);
       });
     };
 
@@ -1880,8 +1931,6 @@ angular.module('myApp.controllers', [])
     $scope.kickFromGroup = function (userID) {
       var user = AppUsersManager.getUser(userID);
 
-      console.log({_: 'inputUserForeign', user_id: userID, access_hash: user.access_hash || '0'}, user);
-
       MtpApiManager.invokeApi('messages.deleteChatUser', {
         chat_id: $scope.chatID,
         user_id: {_: 'inputUserForeign', user_id: userID, access_hash: user.access_hash || '0'}

app/js/directives.js

@@ -26,10 +26,133 @@ angular.module('myApp.directives', ['myApp.filters'])
     };
   })
 
-  .directive('myMessage', function() {
+  .directive('myMessage', function($filter) {
+
+    var dateFilter = $filter('myDate'),
+        dateSplitHtml = '<div class="im_message_date_split im_service_message_wrap"><div class="im_service_message"></div></div>',
+        unreadSplitHtml = '<div class="im_message_unread_split">Unread messages</div>',
+        selectedClass = 'im_message_selected',
+        focusClass = 'im_message_focus',
+        unreadClass =  'im_message_unread',
+        errorClass = 'im_message_error',
+        pendingClass = 'im_message_pending';
+
     return {
-      templateUrl: templateUrl('message')
+      templateUrl: templateUrl('message'),
     };
+
+    function link($scope, element, attrs) {
+      var selected = false,
+          grouped = false,
+          focused = false,
+          error = false,
+          pending = false,
+          needDate = false,
+          unreadAfter = false,
+          applySelected = function () {
+            if (selected != ($scope.selectedMsgs[$scope.historyMessage.id] || false)) {
+              selected = !selected;
+              element.toggleClass(selectedClass, selected);
+            }
+          },
+          needDateSplit,
+          applyGrouped = function () {
+            if (grouped != $scope.historyMessage.grouped) {
+              if (grouped) {
+                element.removeClass(grouped);
+              }
+              grouped = $scope.historyMessage.grouped;
+              if (grouped) {
+                element.addClass(grouped);
+              }
+            }
+            if (needDate != ($scope.historyMessage.needDate || false)) {
+              needDate = !needDate;
+              if (needDate) {
+                if (needDateSplit) {
+                  needDateSplit.show();
+                } else {
+                  needDateSplit = $(dateSplitHtml);
+                  $(needDateSplit[0].firstChild).text(dateFilter($scope.historyMessage.date));
+                  if (unreadAfterSplit) {
+                    needDateSplit.insertBefore(unreadAfterSplit)
+                  } else {
+                    needDateSplit.prependTo(element);
+                  }
+                }
+              } else {
+                needDateSplit.hide();
+              }
+            }
+          },
+          unreadAfterSplit;
+
+      applySelected();
+      applyGrouped();
+
+      $scope.$on('messages_select', applySelected);
+      $scope.$on('messages_regroup', applyGrouped);
+
+      $scope.$on('messages_focus', function (e, focusedMsgID) {
+        if ((focusedMsgID == $scope.historyMessage.id) != focused) {
+          focused = !focused;
+          element.toggleClass(focusClass, focused);
+        }
+      });
+
+      if ($scope.historyMessage.unread) {
+        var deregisterUnreadAfter;
+        if (!$scope.historyMessage.out) {
+          var applyUnreadAfter = function () {
+            if (unreadAfter != ($scope.historyUnreadAfter == $scope.historyMessage.id)) {
+              unreadAfter = !unreadAfter;
+              if (unreadAfter) {
+                if (unreadAfterSplit) {
+                  unreadAfterSplit.show();
+                } else {
+                  unreadAfterSplit = $(unreadSplitHtml).prependTo(element);
+                }
+              } else {
+                unreadAfterSplit.hide();
+                if (deregisterUnreadAfter) {
+                  deregisterUnreadAfter();
+                }
+              }
+            }
+          };
+          applyUnreadAfter();
+          deregisterUnreadAfter = $scope.$on('messages_unread_after', applyUnreadAfter);
+        }
+        element.addClass(unreadClass);
+        var deregisterUnread = $scope.$on('messages_read', function () {
+          if (!$scope.historyMessage.unread) {
+            element.removeClass(unreadClass);
+            deregisterUnread();
+            if (deregisterUnreadAfter && !unreadAfter) {
+              deregisterUnreadAfter();
+            }
+          }
+        });
+      }
+      if ($scope.historyMessage.error || $scope.historyMessage.pending) {
+        var applyPending = function () {
+              if (pending != ($scope.historyMessage.pending || false)) {
+                pending = !pending;
+                element.toggleClass(pendingClass, pending);
+              }
+              if (error != ($scope.historyMessage.error || false)) {
+                error = !error;
+                element.toggleClass(errorClass, error);
+              }
+              if (!error && !pending) {
+                deregisterPending();
+              }
+            },
+            deregisterPending = $scope.$on('messages_pending', applyPending);
+
+        applyPending();
+      }
+    }
   })
 
   .directive('myServiceMessage', function() {
@@ -132,9 +255,9 @@ angular.module('myApp.directives', ['myApp.filters'])
         }
 
         if (e.keyCode == 36 &&  !e.shiftKey && !e.ctrlKey && e.altKey) { // Alt + Home
-          var currentSelected = $(scrollableWrap).find('.im_dialog_wrap a')[0];
-          if (currentSelected) {
-            currentSelected.click();
+          var currentSelected = $(scrollableWrap).find('.im_dialog_wrap a');
+          if (currentSelected.length) {
+            currentSelected.trigger('mousedown');
             scrollableWrap.scrollTop = 0;
             $(dialogsWrap).nanoScroller({flash: true});
           }
@@ -154,7 +277,7 @@ angular.module('myApp.directives', ['myApp.filters'])
         if (searchFocused && e.keyCode == 13) { // Enter
           var currentSelected = $(scrollableWrap).find('.im_dialog_selected')[0] || $(scrollableWrap).find('.im_dialog_wrap a')[0];
           if (currentSelected) {
-            currentSelected.click();
+            $(currentSelected).trigger('mousedown');
           }
           return cancelEvent(e);
         }
@@ -191,7 +314,7 @@ angular.module('myApp.directives', ['myApp.filters'])
 
           if (skip) {
             if (nextDialogWrap) {
-              $(nextDialogWrap).find('a')[0].click();
+              $(nextDialogWrap).find('a').trigger('mousedown');
             }
           } else {
             if (currentSelectedWrap && nextDialogWrap) {
@@ -505,28 +628,40 @@ angular.module('myApp.directives', ['myApp.filters'])
       function changeScroll () {
         var unreadSplit, focusMessage;
 
+        // console.trace('change scroll');
         if (focusMessage = $('.im_message_focus:visible', scrollableWrap)[0]) {
-          scrollableWrap.scrollTop = Math.max(0, focusMessage.offsetTop - Math.floor(scrollableWrap.clientHeight / 2) + 26);
+          var ch = scrollableWrap.clientHeight,
+              st = scrollableWrap.scrollTop,
+              ot = focusMessage.offsetTop,
+              h = focusMessage.clientHeight;
+          if (!st || st + ch < ot || st > ot + h) {
+            scrollableWrap.scrollTop = Math.max(0, ot - Math.floor(ch / 2) + 26);
+          }
           atBottom = false;
         } else if (unreadSplit = $('.im_message_unread_split:visible', scrollableWrap)[0]) {
+          // console.log('change scroll unread', unreadSplit.offsetTop);
           scrollableWrap.scrollTop = Math.max(0, unreadSplit.offsetTop - 52);
           atBottom = false;
         } else {
+          // console.log('change scroll bottom');
           scrollableWrap.scrollTop = scrollableWrap.scrollHeight;
           atBottom = true;
         }
         updateScroller();
         $timeout(function () {
           $(scrollableWrap).trigger('scroll');
+          scrollTopInitial = scrollableWrap.scrollTop;
         });
       };
 
       $scope.$on('ui_history_change', function () {
+        var pr = parseInt($(scrollableWrap).css('paddingRight'))
         $(scrollableWrap).addClass('im_history_to_bottom');
-        $(scrollable).css({bottom: 0});
+        scrollableWrap.scrollHeight; // Some strange Chrome bug workaround
+        $(scrollable).css({bottom: 0, marginLeft: -Math.ceil(pr / 2)});
         onContentLoaded(function () {
           $(scrollableWrap).removeClass('im_history_to_bottom');
-          $(scrollable).css({bottom: ''});
+          $(scrollable).css({bottom: '', marginLeft: ''});
           updateSizes(true);
           moreNotified = false;
           lessNotified = false;
@@ -559,7 +694,11 @@ angular.module('myApp.directives', ['myApp.filters'])
         var upd = function () {
             $(scrollableWrap).removeClass('im_history_to_bottom');
             $(scrollable).css({bottom: '', marginLeft: ''});
-            scrollableWrap.scrollTop = st + scrollableWrap.scrollHeight - sh;
+            if (scrollTopInitial >= 0) {
+              changeScroll();
+            } else {
+              scrollableWrap.scrollTop = st + scrollableWrap.scrollHeight - sh;
+            }
 
             updateBottomizer();
             moreNotified = false;
@@ -584,6 +723,10 @@ angular.module('myApp.directives', ['myApp.filters'])
           updateBottomizer();
           lessNotified = false;
 
+          if (scrollTopInitial >= 0) {
+            changeScroll();
+          }
+
           $timeout(function () {
             if (scrollableWrap.scrollHeight != sh) {
               $(scrollableWrap).trigger('scroll');
@@ -621,20 +764,25 @@ angular.module('myApp.directives', ['myApp.filters'])
         // updateSizes();
       });
 
-      var atBottom = true;
+      var atBottom = true,
+          scrollTopInitial = -1;
       $(scrollableWrap).on('scroll', function (e) {
         if (!element.is(':visible') ||
             $(scrollableWrap).hasClass('im_history_to_bottom') ||
             curAnimation) {
           return;
         }
-        atBottom = scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight;
+        var st = scrollableWrap.scrollTop;
+        atBottom = st >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight;
+        if (scrollTopInitial >= 0 && scrollTopInitial != st) {
+          scrollTopInitial = -1;
+        }
 
-        if (!moreNotified && scrollableWrap.scrollTop <= 300) {
+        if (!moreNotified && st <= 300) {
           moreNotified = true;
           $scope.$emit('history_need_more');
         }
-        else if (!lessNotified && scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) {
+        else if (!lessNotified && st >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) {
           lessNotified = true;
           $scope.$emit('history_need_less');
         }

app/js/services.js

@@ -163,13 +163,21 @@ angular.module('myApp.services', [])
     var timestampNow = tsNow(true) + serverTimeOffset;
     angular.forEach(users, function (user) {
       if (user.status && user.status._ == 'userStatusOnline' &&
-          user.status.expires > timestampNow) {
+          user.status.expires < timestampNow) {
         user.status = {_: 'userStatusOffline', was_online: user.status.expires};
         $rootScope.$broadcast('user_update', user.id);
       }
     });
   }
 
+  function forceUserOnline (id) {
+    var user = getUser(id);
+    if (user && (!user.status || user.status._ != 'userStatusOnline')) {
+      user.status = {_: 'userStatusOnline', expires: tsNow(true) + serverTimeOffset + 60};
+      $rootScope.$broadcast('user_update', id);
+    }
+  }
+
   function wrapForFull (id) {
     var user = getUser(id);
 
@@ -308,6 +316,7 @@ angular.module('myApp.services', [])
       case 'updateUserPhoto':
         var userID = update.user_id;
         if (users[userID]) {
+          forceUserOnline(userID);
           safeReplaceObject(users[userID].photo, update.photo);
 
           if (cachedPhotoLocations[userID] !== undefined) {
@@ -333,6 +342,7 @@ angular.module('myApp.services', [])
     saveApiUser: saveApiUser,
     getUser: getUser,
     getUserInput: getUserInput,
+    forceUserOnline: forceUserOnline,
     getUserPhoto: getUserPhoto,
     getUserString: getUserString,
     getUserSearchText: getUserSearchText,
@@ -744,6 +754,8 @@ angular.module('myApp.services', [])
     }
   });
 
+  var dateOrTimeFilter = $filter('dateOrTime');
+
   midnightOffseted.setHours(0);
   midnightOffseted.setMinutes(0);
   midnightOffseted.setSeconds(0);
@@ -885,7 +897,7 @@ angular.module('myApp.services', [])
     });
   };
 
-  function getHistory (inputPeer, maxID, limit, backLimit) {
+  function getHistory (inputPeer, maxID, limit, backLimit, prerendered) {
     var peerID = AppPeersManager.getPeerID(inputPeer),
         historyStorage = historiesStorage[peerID],
         offset = 0,
@@ -894,6 +906,8 @@ angular.module('myApp.services', [])
         unreadSkip = false,
         resultPending = [];
 
+    prerendered = prerendered ? Math.min(50, prerendered) : 0;
+
     if (historyStorage === undefined) {
       historyStorage = historiesStorage[peerID] = {count: null, history: [], pending: []};
     }
@@ -910,7 +924,7 @@ angular.module('myApp.services', [])
           unreadOffset = 6;
           offset = unreadCount - unreadOffset;
         } else {
-          limit = Math.max(10, unreadCount + 2);
+          limit = Math.max(10, prerendered, unreadCount + 2);
           unreadOffset = unreadCount;
         }
       }
@@ -934,9 +948,8 @@ angular.module('myApp.services', [])
         offset = Math.max(0, offset - backLimit);
         limit += backLimit;
       } else {
-        limit = limit || (offset ? 20 : 5);
+        limit = limit || (offset ? 20 : (prerendered || 5));
       }
-
       return $q.when({
         count: historyStorage.count,
         history: resultPending.concat(historyStorage.history.slice(offset, offset + limit)),
@@ -946,12 +959,11 @@ angular.module('myApp.services', [])
     }
 
     if (!backLimit && !limit) {
-      limit = 20;
+      limit = prerendered || 20;
     }
     if (offsetNotFound) {
       offset = 0;
     }
-
     if (backLimit || unreadSkip || maxID && historyStorage.history.indexOf(maxID) == -1) {
       if (backLimit) {
         offset = -backLimit;
@@ -1187,6 +1199,7 @@ angular.module('myApp.services', [])
         // console.log('done read history', peerID);
         foundDialog[0].unread_count = 0;
         $rootScope.$broadcast('dialog_unread', {peerID: peerID, count: 0});
+        $rootScope.$broadcast('messages_read');
       }
     })['finally'](function () {
       delete historyStorage.readPromise;
@@ -1296,6 +1309,7 @@ angular.module('myApp.services', [])
             delete historyMessage.error;
           }
         }
+        $rootScope.$broadcast('messages_pending');
       }
 
       message.send = function () {
@@ -1420,6 +1434,7 @@ angular.module('myApp.services', [])
             delete historyMessage.error;
           }
         }
+        $rootScope.$broadcast('messages_pending');
       }
 
       message.send = function () {
@@ -1561,6 +1576,7 @@ angular.module('myApp.services', [])
             delete historyMessage.error;
           }
         }
+        $rootScope.$broadcast('messages_pending');
       }
 
       message.send = function () {
@@ -1699,6 +1715,8 @@ angular.module('myApp.services', [])
         delete historyMessage.error;
         delete historyMessage.random_id;
         delete historyMessage.send;
+
+        $rootScope.$broadcast('messages_pending');
       }
 
       delete messagesForHistory[tempID];
@@ -1722,7 +1740,9 @@ angular.module('myApp.services', [])
   }
 
   function wrapForDialog (msgID, unreadCount) {
-    if (messagesForDialogs[msgID] !== undefined) {
+    var useCache = unreadCount != -1;
+
+    if (useCache && messagesForDialogs[msgID] !== undefined) {
       return messagesForDialogs[msgID];
     }
 
@@ -1751,10 +1771,13 @@ angular.module('myApp.services', [])
       message.richMessage = RichTextProcessor.wrapRichText(message.message.substr(0, 64), {noLinks: true, noLinebreaks: true});
     }
 
-    message.dateText = $filter('dateOrTime')(message.date);
+    message.dateText = dateOrTimeFilter(message.date);
 
+    if (useCache) {
+      messagesForDialogs[msgID] = message;
+    }
 
-    return messagesForDialogs[msgID] = message;
+    return message;
   }
 
   function wrapForHistory (msgID) {
@@ -1816,12 +1839,13 @@ angular.module('myApp.services', [])
 
   function regroupWrappedHistory (history, limit) {
     if (!history || !history.length) {
-      return;
+      return false;
     }
     var start = 0,
         len = history.length,
         end = len,
-        i, curDay, prevDay, curMessage, prevMessage;
+        i, curDay, prevDay, curMessage, prevMessage, curGrouped, prevGrouped,
+        wasUpdated = false;
 
     if (limit > 0) {
       end = Math.min(limit, len);
@@ -1833,10 +1857,19 @@ angular.module('myApp.services', [])
       curMessage = history[i];
       curDay = Math.floor((curMessage.date + midnightOffset) / 86400);
 
+      prevGrouped = prevMessage && prevMessage.grouped;
+      curGrouped = curMessage.grouped;
+
       if (curDay === prevDay) {
-        delete curMessage.needDate;
+        if (curMessage.needDate) {
+          delete curMessage.needDate;
+          wasUpdated = true;
+        }
       } else if (!i || prevMessage) {
-        curMessage.needDate = true;
+        if (!curMessage.needDate) {
+          curMessage.needDate = true;
+          wasUpdated = true;
+        }
       }
 
       if (prevMessage &&
@@ -1867,9 +1900,17 @@ angular.module('myApp.services', [])
           prevMessage.grouped += ' im_grouped_fwd_end';
         }
       }
+      if (!wasUpdated && prevGrouped != (prevMessage && prevMessage.grouped)) {
+        wasUpdated = true;
+      }
       prevMessage = curMessage;
       prevDay = curDay;
     }
+    if (!wasUpdated && curGrouped != (prevMessage && prevMessage.grouped)) {
+      wasUpdated = true;
+    }
+
+    return wasUpdated;
   }
 
   function getDialogByPeerID (peerID) {
@@ -1992,6 +2033,10 @@ angular.module('myApp.services', [])
             peerID = getMessagePeer(message),
             historyStorage = historiesStorage[peerID];
 
+        if (!message.out) {
+          AppUsersManager.forceUserOnline(message.from_id);
+        }
+
         if (historyStorage !== undefined) {
           var topMsgID = historiesStorage[peerID].history[0];
           if (historiesStorage[peerID].history.indexOf(message.id) != -1) {
@@ -2066,7 +2111,8 @@ angular.module('myApp.services', [])
 
       case 'updateReadMessages':
         var dialogsUpdated = {},
-            messageID, message, i, peerID, foundDialog, dialog;
+            messageID, message, i, peerID, foundDialog, dialog,
+            foundAffected = false;
         for (i = 0; i < update.messages.length; i++) {
           messageID = update.messages[i];
           message = messagesStorage[messageID];
@@ -2075,6 +2121,9 @@ angular.module('myApp.services', [])
             message.unread = false;
             if (messagesForHistory[messageID]) {
               messagesForHistory[messageID].unread = false;
+              if (!foundAffected) {
+                foundAffected = true;
+              }
             }
             if (messagesForDialogs[messageID]) {
               messagesForDialogs[messageID].unread = false;
@@ -2088,12 +2137,18 @@ angular.module('myApp.services', [])
 
               NotificationsManager.cancel('msg' + messageID);
             }
+            else if (peerID > 0) {
+              AppUsersManager.forceUserOnline(peerID);
+            }
           }
         }
 
         angular.forEach(dialogsUpdated, function(count, peerID) {
           $rootScope.$broadcast('dialog_unread', {peerID: peerID, count: count});
         });
+        if (foundAffected) {
+          $rootScope.$broadcast('messages_read');
+        }
         break;
 
       case 'updateDeleteMessages':
@@ -2511,7 +2566,6 @@ angular.module('myApp.services', [])
         full.width = fullWidth;
       }
     }
-    // console.log(222, video.w, video.h, full.width, full.height);
 
     video.full = full;
     video.fullThumb = angular.copy(video.thumb);
@@ -3543,7 +3597,7 @@ angular.module('myApp.services', [])
   }
 
   function notify (data) {
-    console.log('notify', $rootScope.idle.isIDLE, notificationsUiSupport);
+    // console.log('notify', $rootScope.idle.isIDLE, notificationsUiSupport);
 
     // FFOS Notification blob src bug workaround
     if (Config.Navigator.ffos) {

app/partials/desktop/dialog.html

@@ -1,4 +1,4 @@
-<a class="im_dialog" ng-click="dialogSelect(dialogMessage.peerString, search.messages &amp;&amp; dialogMessage.id)">
+<a class="im_dialog" ng-mousedown="dialogSelect(dialogMessage.peerString, search.messages &amp;&amp; dialogMessage.id)">
 
   <div class="im_dialog_meta pull-right text-right">
     <div class="im_dialog_date" ng-bind="dialogMessage.dateText"></div>

app/partials/desktop/edit_contact_modal.html

@@ -9,7 +9,7 @@
       <h4>Edit contact</h4>
 
       <div class="form-group">
-        <span class="form-control uneditable-input disabled" disabled ng-bind="importContact.phone | phoneNumber"></span>
+        <span class="form-control uneditable-input input-sm disabled" disabled ng-bind="importContact.phone | phoneNumber"></span>
       </div>
       <div class="form-group">
         <input class="form-control input-sm" my-focused type="text" placeholder="First name" ng-model="importContact.first_name"/>

app/partials/desktop/im.html

@@ -56,7 +56,7 @@
               <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)">
+                  <a class="im_dialog" ng-mousedown="dialogSelect(contact.peerString)">
                     <div class="im_dialog_photo pull-left">
                       <img
                         class="im_dialog_photo"
@@ -163,7 +163,7 @@
                     </div>
 
                     <div class="im_history_messages" ng-class="{im_history_messages_group: historyPeer.id < 0}">
-                      <div ng-show="peerHistory.peerID == historyPeer.id" ng-repeat="peerHistory in peerHistories">
+                      <div class="im_history_messages_peer" ng-show="peerHistory.peerID == historyPeer.id" ng-repeat="peerHistory in peerHistories">
                         <div class="im_history_message_wrap" my-message ng-repeat="historyMessage in peerHistory.messages"></div>
                       </div>
                     </div>

app/partials/desktop/message.html

@@ -1,12 +1,4 @@
-<div class="im_message_unread_split" ng-if="::historyUnreadAfter == historyMessage.id || false" ng-show="historyUnreadAfter == historyMessage.id">
-  Unread messages
-</div>
-
-<div class="im_message_date_split im_service_message_wrap" ng-if="::historyMessage.needDate || false" ng-show="historyMessage.needDate">
-  <div class="im_service_message" ng-bind="historyMessage.date | myDate"></div>
-</div>
-
-<div class="im_message_outer_wrap" ng-class="[selectedMsgs[historyMessage.id] ? 'im_message_selected' : '', historyMessage.grouped, historyFocus == historyMessage.id ? 'im_message_focus' : '', historyMessage.unread ? 'im_message_unread' : '', historyMessage.error ? 'im_message_error' : '', historyMessage.pending ? 'im_message_pending' : '']" ng-click="toggleMessage(historyMessage.id, $event)">
+<div class="im_message_outer_wrap" ng-click="toggleMessage(historyMessage.id, $event)">
 
 
   <div class="im_message_wrap clearfix">
@@ -45,7 +37,7 @@
         <span class="im_message_date" ng-bind="::historyMessage.date | time"></span>
       </div>
 
-      <div class="im_message_body" ng-class="{im_message_body_media: historyMessage._ == 'message' &amp;&amp; historyMessage.media &amp;&amp; historyMessage.media._ != 'messageMediaEmpty'}">
+      <div class="im_message_body" ng-class="::{im_message_body_media: historyMessage._ == 'message' &amp;&amp; historyMessage.media &amp;&amp; historyMessage.media._ != 'messageMediaEmpty'}">
 
         <a class="im_message_author" my-user-link="historyMessage.from_id" short="!historyMessage.to_id.chat_id" color="historyMessage.to_id.chat_id > 0"></a>
 

app/partials/desktop/peer_select.html

@@ -9,7 +9,7 @@
     <div class="im_dialogs_modal_col_wrap" ng-controller="AppImDialogsController" my-dialogs>
       <div class="im_dialogs_panel">
         <div class="im_dialogs_search">
-          <input my-focused class="form-control im_dialogs_search_field" type="search" placeholder="Search" ng-model="search.query"/>
+          <input my-focused class="form-control im_dialogs_search_field no_outline" type="search" placeholder="Search" ng-model="search.query"/>
           <a class="im_dialogs_search_clear" ng-click="search.query = ''" ng-show="search.query.length"></a>
         </div>
       </div>