Refactoring assigned to lightboxes

app/coffee/modules/issues/detail.coffee

@@ -370,7 +370,9 @@ AssignedToDirective = ($rootscope, $confirm) ->
 
         $el.on "click", ".user-assigned", (event) ->
             event.preventDefault()
-            $rootscope.$broadcast("assigned-to:add", $model.$modelValue)
+            $scope.$apply(
+                $rootscope.$broadcast("assigned-to:add", $model.$modelValue)
+            )
 
         $el.on "click", ".icon-delete", (event) ->
             event.preventDefault()

app/coffee/modules/issues/lightboxes.coffee

@@ -75,31 +75,61 @@ module.directive("tgLbAddWatcher", AddWatcherDirective)
 
 EditAssignedToDirective = () ->
     link = ($scope, $el, $attrs) ->
-        $scope.usersSearch = {}
         editingElement = null
 
+        updateScopeFilteringUsers = (searchingText) ->
+            usersById = _.clone($scope.usersById, false)
+            #Exclude selected user
+            if $scope.selectedUser?
+                delete usersById[$scope.selectedUser.id]
+
+            #Filter text
+            usersById = _.filter(usersById,  (user) -> _.contains(user.full_name_display, searchingText))
+
+            #Return max of 5 elements
+            users = _.map(usersById, (user) -> user)
+            $scope.AssignedToUsersSearch = searchingText
+            $scope.filteringUsers = users.length > 5
+            $scope.filteredUsers = _.first(users, 5)
+
         $scope.$on "assigned-to:add", (ctx, element) ->
             editingElement = element
+            assignedToId = editingElement?.assigned_to
+            $scope.selectedUser = null
+            $scope.selectedUser = $scope.usersById[assignedToId] if assignedToId?
+            updateScopeFilteringUsers("")
             $el.removeClass("hidden")
             $el.find("input").focus()
-            $scope.usersSearch = {}
 
-        $scope.$on "$destroy", ->
-            $el.off()
-
-        $el.on "click", ".close", (event) ->
-            event.preventDefault()
-            $el.addClass("hidden")
+        $scope.$watch "AssignedToUsersSearch", (searchingText) ->
+            updateScopeFilteringUsers(searchingText)
 
         $el.on "click", ".watcher-single", (event) ->
             event.preventDefault()
             target = angular.element(event.currentTarget)
             if editingElement?
-                editingElement.assigned_to = target.scope().user.id
+                user = target.scope().user
+                editingElement.assigned_to = user.id
 
             $el.addClass("hidden")
             $scope.$broadcast("assigned-to:added", editingElement)
 
+        $el.on "click", ".remove-assigned-to", (event) ->
+            event.preventDefault()
+            event.stopPropagation()
+            if editingElement?
+                editingElement.assigned_to = null
+
+            $el.addClass("hidden")
+            $scope.$broadcast("assigned-to:added", editingElement)
+
+        $el.on "click", ".close", (event) ->
+            event.preventDefault()
+            $el.addClass("hidden")
+
+        $scope.$on "$destroy", ->
+            $el.off()
+
     return {link:link}
 
 module.directive("tgLbEditAssignedTo", EditAssignedToDirective)

app/partials/views/modules/lightbox-assigned-to.jade

@@ -3,14 +3,21 @@ a.close(href="", title="close")
 form
     h2.title Select assigned to
     fieldset
-        input(type="text", data-maxlength="500", placeholder="Search for users", ng-model="usersSearch.$")
+        input(type="text", data-maxlength="500", placeholder="Search for users", ng-model="AssignedToUsersSearch")
 
     div.watchers
-        div.watcher-single(ng-repeat="user in users|filter:usersSearch:strict|limitTo:5 track by user.id")
+        div.watcher-single.active(ng-show="selectedUser")
+            div.watcher-avatar
+                a.avatar(href="", title="Assigned to")
+                    img(src="{{ selectedUser.photo }}", alt="{{ selectedUser.full_name_display }}")
+            a.watcher-name(href="", title="{{ selectedUser.full_name_display }}", ng-bind="selectedUser.full_name_display")
+            a.remove-assigned-to(href="", title="Remove assigned") Remove
+
+        div.watcher-single(ng-repeat="user in filteredUsers")
             div.watcher-avatar
                 a.avatar(href="", title="Assigned to")
                     img(tg-bo-src="user.photo", tg-bo-alt="user.photo")
             a.watcher-name(href="", tg-bo-title="user.full_name_display", tg-bo-html="user.full_name_display")
 
-        div.more-watchers
+        div.more-watchers(ng-show="filteringUsers")
             span ...too many users, keep filtering