Improve user search auto-completion

UI/Templates/PreferencesUI/UIxPreferences.wox

@@ -448,8 +448,8 @@
                 <md-contact-chips
                     ng-model="app.preferences.settings.Calendar.PreventInvitationsWhitelist"
                     md-contacts="app.userFilter($query)"
-                    md-contact-name="shortFormat"
-                    md-contact-image="image"
+                    md-contact-name="cn"
+                    md-contact-image="$$image"
                     md-contact-email="c_email"
                     md-require-match="md-require-match"
                     filter-selected="false"

UI/Templates/UIxAclEditor.wox

@@ -35,7 +35,7 @@
             </div>
             <span id="AccessRightList" ng-show="user.uid == selectedUser.uid">
               <md-checkbox ng-model="user.isSubscribed"
-                           arial-label="Subscribe User"
+                           label:arial-label="Subscribe User"
                            ng-disabled="user.wasSubscribed"
                            ng-true-value="1"
                            ng-false-value="0"
@@ -53,23 +53,26 @@
           </div>
           <md-divider><!-- divider --></md-divider>
         </md-list-item>
-        <md-list-item>
-          <md-autocomplete
-              class="md-flex"
-              md-selected-item="userToAdd"
-              md-search-text="searchText"
-              md-selected-item-change="addUser(user)"
-              md-items="user in userFilter(searchText)"
-              md-item-text="user.shortFormat"
-              md-min-length="0"
-              placeholder="Add">
-            <span md-highlight-text="searchText" md-highlight-flags="^i">{{user.shortFormat}}</span>
-          </md-autocomplete>
-        </md-list-item>
       </md-list>
     </md-dialog-content>
 
     <div class="md-actions">
+      <md-autocomplete
+          class="md-flex"
+          md-selected-item="userToAdd"
+          md-search-text="searchText"
+          md-selected-item-change="addUser(user)"
+          md-items="user in userFilter(searchText)"
+          md-min-length="0"
+          label:placeholder="Add">
+        <span class="md-contact-suggestion" layout="row" layout-align="space-between center">
+          <span class="md-contact-name"
+                md-highlight-text="searchText"
+                md-highlight-flags="^i">{{user.cn}}</span> <span class="md-contact-email"
+                md-highlight-text="searchText"
+                md-highlight-flags="^i">{{user.c_email}}</span>
+        </span>
+      </md-autocomplete>
       <md-button ng-click="closeModal()"><var:string label:value="Close"/></md-button>
       <md-button class="md-primitive" ng-click="saveModal()"><var:string label:value="Save"/></md-button>
     </div>

UI/WebServerResources/js/Common/User.service.js

@@ -63,10 +63,10 @@
    */
   User.prototype.init = function(data) {
     angular.extend(this, data);
-    if (!this.shortFormat)
-      this.shortFormat = this.$shortFormat();
-    if (!this.image)
-      this.image = User.$gravatar(this.c_email);
+    if (!this.$$shortFormat)
+      this.$$shortFormat = this.$shortFormat();
+    if (!this.$$image)
+      this.$$image = this.image || User.$gravatar(this.c_email);
   };
 
   /**

UI/WebServerResources/js/Contacts/AddressBooksController.js

@@ -104,16 +104,20 @@
           usersWithACL: $scope.currentFolder.$acl.$users(),
           User: User,
           stateAddressbook: $scope.currentFolder,
-          q: $q
+          $q: $q
         }
       });
-      function AddressBookACLController($scope, $mdDialog, usersWithACL, User, stateAddressbook, q) {
+      /**
+       * @ngInject
+       */
+      AddressBookACLController.$inject = ['$scope', '$mdDialog', 'usersWithACL', 'User', 'stateAddressbook', '$q'];
+      function AddressBookACLController($scope, $mdDialog, usersWithACL, User, stateAddressbook, $q) {
         $scope.users = usersWithACL; // ACL users
         $scope.stateAddressbook = stateAddressbook;
         $scope.userToAdd = '';
         $scope.searchText = '';
         $scope.userFilter = function($query) {
-          var deferred = q.defer();
+          var deferred = $q.defer();
           User.$filter($query).then(function(results) {
             deferred.resolve(results)
           });
@@ -148,13 +152,15 @@
             Dialog.alert(l('Warning'), l('An error occured please try again.'))
           });
         };
-        $scope.addUser = function(data) {            
-          stateAddressbook.$acl.$addUser(data).then(function() {
-            $scope.userToAdd = '';
-            $scope.searchText = '';
-          }, function(error) {
-            Dialog.alert(l('Warning'), error);
-          });
+        $scope.addUser = function(data) {
+          if (data) {
+            stateAddressbook.$acl.$addUser(data).then(function() {
+              $scope.userToAdd = '';
+              $scope.searchText = '';
+            }, function(error) {
+              Dialog.alert(l('Warning'), error);
+            });
+          }
         };
         $scope.selectUser = function(user) {
           // Check if it is a different user

UI/WebServerResources/js/Preferences/Preferences.service.js

@@ -133,7 +133,7 @@
     if (preferences.settings.Calendar && preferences.settings.Calendar.PreventInvitationsWhitelist) {
       var h = {};
       _.each(preferences.settings.Calendar.PreventInvitationsWhitelist, function(user) {
-        h[user.uid] = user.shortFormat;
+        h[user.uid] = user.$$shortFormat;
 
         preferences.settings.Calendar.PreventInvitationsWhitelist = h;
       });