allow editting mentions text for users with usernames (#1347)

when now holding the Alt key while selecting a user from the mentions
autocomplete suggestions the text inserted into the composer will be
forced to be in the

	@1234567 (firstname)

format (i.e. referring to the user by id and local firstname) instead of

	@username

even if the selected user has a username set.
This allows to manually edit the display text ("firstname") of the
mention.

app/js/message_composer.js

@@ -785,7 +785,12 @@ MessageComposer.prototype.setUpAutoComplete = function () {
       }
       EmojiHelper.pushPopularEmoji(code)
     }
-    if (mention = target.attr('data-mention')) {
+    if (e.altKey || !target.attr('data-username')) {
+      mention = target.attr('data-user-id')
+    } else {
+      mention = target.attr('data-username')
+    }
+    if (mention) {
       self.onMentionSelected(mention, target.attr('data-name'))
     }
     if (command = target.attr('data-command')) {
@@ -911,7 +916,12 @@ MessageComposer.prototype.onKeyEvent = function (e) {
           EmojiHelper.pushPopularEmoji(code)
           return cancelEvent(e)
         }
-        if (mention = currentSel.attr('data-mention')) {
+        if (e.altKey || !currentSel.attr('data-username')) {
+          mention = currentSel.attr('data-user-id')
+        } else {
+          mention = currentSel.attr('data-username')
+        }
+        if (mention) {
           this.onMentionSelected(mention, currentSel.attr('data-name'))
           return cancelEvent(e)
         }

app/partials/desktop/composer_dropdown.html

@@ -2,7 +2,7 @@
 
   <ul ng-switch-when="mentions" class="composer_dropdown">
     <li ng-repeat="user in mentionUsers">
-      <a class="composer_mention_option" data-mention="{{user.username.length > 0 ? user.username : ('#' + user.id)}}" data-name="{{user.first_name}}">
+      <a class="composer_mention_option" data-user-id="{{'#' + user.id}}" data-username="{{user.username}}" data-name="{{user.first_name}}">
         <span class="composer_user_photo" my-peer-photolink="user.id" img-class="composer_user_photo"></span>
         <span class="composer_user_name" ng-bind-html="user.rFullName"></span>
         <span class="composer_user_mention" ng-if="user.username.length > 0" ng-bind="'@' + user.username"></span>