Improved reply keyboard on mobile

app/js/controllers.js

@@ -2112,7 +2112,10 @@ angular.module('myApp.controllers', ['myApp.i18n'])
       else if (replyToMarkup) {
         replyClear();
       }
-      $scope.$broadcast('ui_keyboard_update');
+      $scope.$broadcast('ui_keyboard_update', {
+        enabled: replyKeyboard && !replyKeyboard.pFlags.hidden &&
+          replyKeyboard._ == 'replyKeyboardMarkup'
+      });
     }
 
     function replyKeyboardToggle ($event) {

app/js/directives.js

@@ -440,11 +440,11 @@ angular.module('myApp.directives', ['myApp.filters'])
         $scope.$emit('reply_button_press', button);
       }
 
-      $scope.$on('ui_keyboard_update', function () {
+      $scope.$on('ui_keyboard_update', function (e, data) {
         onContentLoaded(function () {
           scroller.updateHeight();
           scroller.scrollTo(0);
-          $scope.$emit('ui_panel_update');
+          $scope.$emit('ui_panel_update', {blur: data.enabled});
         })
       });
       onContentLoaded(function () {
@@ -1212,10 +1212,14 @@ angular.module('myApp.directives', ['myApp.filters'])
         });
       });
 
-      $scope.$on('ui_panel_update', function () {
+      $scope.$on('ui_panel_update', function (e, data) {
         onContentLoaded(function () {
           updateSizes();
-          $scope.$broadcast('ui_message_send');
+          if (data && data.blur) {
+            $scope.$broadcast('ui_message_blur');
+          } else {
+            $scope.$broadcast('ui_message_send');
+          }
 
           $timeout(function () {
             $(scrollableWrap).trigger('scroll');
@@ -1539,6 +1543,9 @@ angular.module('myApp.directives', ['myApp.filters'])
           focusField();
         }
       });
+      $scope.$on('ui_message_blur', function () {
+        composer.blur();
+      });
 
       function focusField () {
         onContentLoaded(function () {

app/js/directives_mobile.js

@@ -250,10 +250,14 @@ angular.module('myApp.directives')
         });
       });
 
-      $scope.$on('ui_panel_update', function () {
+      $scope.$on('ui_panel_update', function (e, data) {
         onContentLoaded(function () {
           updateSizes();
-          $scope.$broadcast('ui_message_send');
+          if (data && data.blur) {
+            $scope.$broadcast('ui_message_blur');
+          } else {
+            $scope.$broadcast('ui_message_send');
+          }
 
           $timeout(function () {
             $(scrollableWrap).trigger('scroll');

app/js/lib/utils.js

@@ -200,14 +200,14 @@ function getRichElementValue(node, lines, line, selNode, selOffset) {
       line.push(node.alt);
     }
   }
-  if (selNode === node) {
-    line.push('\001');
-  }
   var curChild = node.firstChild;
   while (curChild) {
     getRichElementValue(curChild, lines, line, selNode, selOffset);
     curChild = curChild.nextSibling;
   }
+  if (selNode === node) {
+    line.push('\001');
+  }
   if (isBlock && line.length) {
     lines.push(line.join(''));
     line.splice(0, line.length);

app/js/message_composer.js

@@ -1066,6 +1066,14 @@ MessageComposer.prototype.focus = function () {
   }
 }
 
+MessageComposer.prototype.blur = function () {
+  if (this.richTextareaEl) {
+    this.richTextareaEl[0].blur();
+  } else {
+    this.textareaEl[0].blur();
+  }
+}
+
 MessageComposer.prototype.renderSuggestions = function (html) {
   this.autoCompleteEl.html(html.join(''));
   this.autoCompleteWrapEl.show();
@@ -1148,7 +1156,6 @@ MessageComposer.prototype.updatePosition = function () {
   var offset = (this.richTextareaEl || this.textareaEl).offset();
   var height = this.scroller.updateHeight();
   var width = $((this.richTextareaEl || this.textareaEl)[0].parentNode).outerWidth();
-  console.log(width);
   this.autoCompleteWrapEl.css({
     top: offset.top - height,
     left: Config.Mobile ? 0 : offset.left,

app/less/desktop.less

@@ -1304,7 +1304,16 @@ a.im_panel_peer_photo .peer_initials {
     &_emoji_insert_btn {
       top: 0;
       right: 0px;
-      margin-top: -3px;
+      margin-top: -1px;
+    }
+
+    &_command_btn {
+      top: 2px;
+      right: 35px;
+    }
+    &_keyboard_btn {
+      top: 2px;
+      right: 35px;
     }
 
     &_emoji_panel {