Merge pull request #442 from threema-ch/mention-display-fixer

Fixes for mentions

src/directives/compose_area.ts

@@ -763,9 +763,6 @@ export default [
                 composeDiv.on('keyup mouseup', updateCaretPosition);
                 composeDiv.on('selectionchange', updateCaretPosition);
 
-                // When switching chat, send stopTyping message
-                scope.$on('$destroy', stopTyping);
-
                 // Handle paste event
                 composeDiv.on('paste', onPaste);
 
@@ -783,15 +780,27 @@ export default [
 
                 updateView();
 
-                $rootScope.$on('onQuoted', (event: ng.IAngularEvent, args: any) => {
+                // Listen to broadcasts
+                const unsubscribeListeners = [];
+                unsubscribeListeners.push($rootScope.$on('onQuoted', (event: ng.IAngularEvent, args: any) => {
                     composeDiv[0].focus();
-                });
-                $rootScope.$on('onMentionSelected', (event: ng.IAngularEvent, args: any) => {
+                }));
+
+                unsubscribeListeners.push($rootScope.$on('onMentionSelected', (event: ng.IAngularEvent, args: any) => {
                     if (args.query && args.mention) {
                         // Insert resulting HTML
                         insertMention(args.mention, caretPosition ? caretPosition.to - args.query.length : null,
                             caretPosition ?  caretPosition.to : null);
                     }
+                }));
+
+                // When switching chat, send stopTyping message
+                scope.$on('$destroy', () => {
+                    unsubscribeListeners.forEach((u) => {
+                        // Unsubscribe
+                        u();
+                    });
+                    stopTyping();
                 });
             },
             // tslint:disable:max-line-length

src/filters.ts

@@ -152,7 +152,7 @@ angular.module('3ema.filters', [])
                             cssClass = 'me';
                         } else {
                             const contact = webClientService.contacts.get(possibleMention.substr(2, 8));
-                            if (contact !== null) {
+                            if (contact !== null && contact !== undefined) {
                                 // Add identity to class for a simpler parsing
                                 cssClass = 'id ' + identity;
                                 mentionName = contact.displayName;

src/sass/components/_mention.scss

@@ -5,17 +5,17 @@
     border-radius:5px;
     line-height: 10pt !important;
 
-    &.me {
+    &.me,&.all {
         background-color: #8b8b8b;
         color: white;
     }
 
-    &.id,&.all {
-
+    &.id {
         box-shadow: 0 1px 1px rgba(0,0,0,0.1);
         color: black;
         background-color: #E0E0E0;
     }
+
     &:before {
         content: '@';
         font-size: 10pt;