revised address book, fixes #5639

added/changed functionality:

 * search for course sections
 * browse and select groups/sections/enrollment types (e.g. all
   teachers) within a course
 * browse and select enrollment types within a section
 * changed toggle vs. drilldown input handling (e.g. clicking on an
   expandable element now always expands it, unless you click on the
   checkbox)
 * "Select All" checkbox within groups and enrollment types

Change-Id: I13baa9e8b98abc5b5ec6dfb4cfbd1021160f65cc
Reviewed-on: https://gerrit.instructure.com/5955
Tested-by: Hudson <hudson@instructure.com>
Tested-by: Jon Jensen <jon@instructure.com>
Reviewed-by: Zach Wily <zach@instructure.com>
Reviewed-by: Zach Pendleton <zachp@instructure.com>

Author: jenseng

app/coffeescripts/messages.coffee

@@ -206,7 +206,7 @@ class TokenSelector
       true
 
   new_list: ->
-    $list = $('<div><ul class="heading"></ul><ul></ul></div>')
+    $list = $('<div class="list"><ul class="heading"></ul><ul></ul></div>')
     $list.find('ul')
       .mousemove (e) =>
         return if @ui_locked
@@ -231,11 +231,17 @@ class TokenSelector
               @expand_selection()
           else if @selection_toggleable() and $(e.target).closest('a.toggle').length
             @toggle_selection()
-          else if not @selection.hasClass('expanded')
-            @toggle_selection(on)
-            @clear()
-            @close()
+          else
+            if @selection_expanded()
+              @collapse()
+            else if @selection_expandable()
+              @expand_selection()
+            else
+              @toggle_selection(on)
+              @clear()
+              @close()
         @input.focus()
+    $list.body = $list.find('ul').last()
     $list
 
   capture_keydown: (e) ->
@@ -251,12 +257,19 @@ class TokenSelector
             @input.remove_last_token()
           return true
       when 'Tab', 'U+0009', 9
-        @toggle_selection(on) if @selection and not @selection.hasClass('expanded')
+        if @selection and (@selection_toggleable() or not @selection_expandable())
+          @toggle_selection(on)
         @clear()
         @close()
         return true if @selection
       when 'Enter', 13
-        if @selection and not @selection.hasClass('expanded')
+        if @selection_expanded()
+          @collapse()
+          return true
+        else if @selection_expandable() and not @selection_toggleable()
+          @expand_selection()
+          return true
+        else if @selection
           @toggle_selection(on)
           @clear()
         @close()
@@ -317,7 +330,7 @@ class TokenSelector
         @last_applied_query = this_query
         @last_search = post_data.search
         @clear_loading()
-        @render_list(@query_cache[this_query], options)
+        @render_list(@query_cache[this_query], options, post_data)
         return
 
       @set_loading()
@@ -328,7 +341,7 @@ class TokenSelector
           if JSON.stringify(@prepare_post(options.data ? {})) is this_query # i.e. only if it hasn't subsequently changed (and thus triggered another call)
             @last_applied_query = this_query
             @last_search = post_data.search
-            @render_list(data, options) if @menu.is(":visible")
+            @render_list(data, options, post_data) if @menu.is(":visible")
           else
             @ui_locked=false
         ,
@@ -369,8 +382,8 @@ class TokenSelector
   selection_expandable: ->
     @selection?.hasClass('expandable') ? false
 
-  selection_toggleable: ->
-    @selection?.hasClass('toggleable') ? false
+  selection_toggleable: ($node=@selection) ->
+    ($node?.hasClass('toggleable') ? false) and not @selection_expanded()
 
   expand_selection: ->
     return false unless @selection_expandable() and not @selection_expanded()
@@ -390,19 +403,57 @@ class TokenSelector
       @list = $list
       @select $selection
       @ui_locked = false
-      # TODO: if any in this list are now selected, we should requery so
-      # as to remove them
 
-  toggle_selection: (state) ->
-    return false unless state? or @selection_toggleable()
-    id = @selection.data('id')
-    state = !@input.has_token(value: id) unless state?
+  toggle_selection: (state, $node=@selection, toggle_only=false) ->
+    return false unless state? or @selection_toggleable($node)
+    id = $node.data('id')
+    state = !$node.hasClass('on') unless state?
     if state
-      @selection.addClass('on') if @selection_toggleable()
-      @input.add_token value: id, text: @selection.find('b').text(), no_clear: true, data: @selection.data('user_data')
+      $node.addClass('on') if @selection_toggleable($node) and not toggle_only
+      @input.add_token
+        value: id
+        text: $node.data('text') ? $node.text()
+        no_clear: true
+        data: $node.data('user_data')
     else
-      @selection.removeClass('on')
+      $node.removeClass('on') unless toggle_only
       @input.remove_token value: id
+    @update_select_all($node) unless toggle_only
+
+  update_select_all: ($node, offset=0) ->
+    select_all_toggled = $node.data('user_data').select_all
+    $list = if offset then @stack[@stack.length - offset][1] else @list
+    $select_all = $list.select_all
+    return unless $select_all
+    $nodes = $list.body.find('li.toggleable').not($select_all)
+    if select_all_toggled
+      if $select_all.hasClass('on')
+        $nodes.addClass('on').each (i, node) =>
+          @toggle_selection off, $(node), true
+      else
+        $nodes.removeClass('on').each (i, node) =>
+          @toggle_selection off, $(node), true
+    else
+      $on_nodes = $nodes.filter('.on')
+      if $on_nodes.length < $nodes.length and $select_all.hasClass('on')
+        $select_all.removeClass('on')
+        @toggle_selection off, $select_all, true
+        $on_nodes.each (i, node) =>
+          @toggle_selection on, $(node), true
+      else if $on_nodes.length == $nodes.length and not $select_all.hasClass('on')
+        $select_all.addClass('on')
+        @toggle_selection on, $select_all, true
+        $on_nodes.each (i, node) =>
+          @toggle_selection off, $(node), true
+    if offset < @stack.length
+      offset++
+      $parent_node = @stack[@stack.length - offset][0]
+      if @selection_toggleable($parent_node)
+        if $select_all.hasClass('on')
+          $parent_node.addClass('on')
+        else
+          $parent_node.removeClass('on')
+        @update_select_all($parent_node, offset)
 
   select: ($node, preserve_mode = false) ->
     return if $node?[0] is @selection?[0]
@@ -459,25 +510,33 @@ class TokenSelector
   clear_loading: ->
     @list.find('li').first().loadingImage('remove')
 
-  render_list: (data, options={}) ->
+  render_list: (data, options={}, post_data={}) ->
     @open()
 
     if options.expand
       $list = @new_list()
     else
       $list = @list
+    $list.select_all = null
 
     @selection = null
     $uls = $list.find('ul')
     $uls.html('')
     $heading = $uls.first()
     $body = $uls.last()
     if data.length
+      parent = if @stack.length then @stack[@stack.length - 1][0] else null
+      unless data.prepared
+        @options.preparer?(post_data, data, parent)
+        data.prepared = true
+
       for row, i in data
         $li = $('<li />').addClass('selectable')
-        @populate_row($li, row, {level: @stack.length, first: (i is 0), last: (i is data.length - 1)})
+        @populate_row($li, row, level: @stack.length, first: (i is 0), last: (i is data.length - 1), parent: parent)
+        $list.select_all = $li if row.select_all
         $li.addClass('on') if $li.hasClass('toggleable') and @input.has_token($li.data('id'))
         $body.append($li)
+      $list.body.find('li.toggleable').addClass('on') if $list.select_all?.hasClass?('on') or @stack.length and @stack[@stack.length - 1][0].hasClass?('on')
     else
       $message = $('<li class="message first last"></li>')
       $message.text(@options.messages?.no_results ? '')
@@ -502,13 +561,12 @@ class TokenSelector
       @ui_locked = false
 
   prepare_post: (data) ->
-    post_data = $.extend(data, {search: @input.val()})
+    post_data = $.extend(data, {search: @input.val()}, @options.base_data ? {})
     post_data.exclude = @input.base_exclude.concat(if @stack.length then [] else @input.token_values())
     post_data.context = @stack[@stack.length - 1][0].data('id') if @list_expanded()
     post_data.per_page ?= @options.limiter?(level: @stack.length)
     post_data
 
-
 # depends on the scrollable ancestor being the first positioned
 # ancestor. if it's not, it won't work
 $.fn.scrollIntoView = (options = {}) ->
@@ -1509,24 +1567,62 @@ I18n.scoped 'conversations', (I18n) ->
           $context_name = if data.context_name then $('<span />', class: 'context_name').text("(#{context_name})") else ''
           $b = $('<b />')
           $b.text(data.name)
-          $span = $('<span />')
+          $name = $('<span />', class: 'name')
+          $name.append($b, $context_name)
+          $span = $('<span />', class: 'details')
           if data.common_courses?
             $span.text(MessageInbox.context_list(courses: data.common_courses, groups: data.common_groups))
           else if data.type and data.user_count?
             $span.text(I18n.t('people_count', 'person', {count: data.user_count}))
-          $node.append($b, $context_name, $span)
+          else if data.item_count?
+            if data.id.match(/_groups$/)
+              $span.text(I18n.t('groups_count', 'group', {count: data.item_count}))
+            else if data.id.match(/_sections$/)
+              $span.text(I18n.t('sections_count', 'section', {count: data.item_count}))
+          $node.append($name, $span)
           $node.attr('title', data.name)
+          text = data.name
+          if options.parent
+            if data.select_all and data.no_expand # "Select All", e.g. course_123_all -> "Spanish 101: Everyone"
+              text = options.parent.data('text')
+            else if (data.id + '').match(/_\d+_/) # e.g. course_123_teachers -> "Spanish 101: Teachers"
+              text = I18n.beforeLabel(options.parent.data('text')) + " " + text
+          $node.data('text', text)
           $node.data('id', data.id)
           $node.data('user_data', data)
           $node.addClass(if data.type then data.type else 'user')
           if options.level > 0
             $node.prepend('<a class="toggle"><i></i></a>')
-            $node.addClass('toggleable')
-          if data.type == 'context'
+            $node.addClass('toggleable') unless data.item_count # can't toggle synthetic contexts, e.g. "Student Groups"
+          if data.type == 'context' and not data.no_expand
             $node.prepend('<a class="expand"><i></i></a>')
             $node.addClass('expandable')
         limiter: (options) ->
           if options.level > 0 then -1 else 5
+        preparer: (post_data, data, parent) ->
+          context = post_data.context
+          if not post_data.search and context and data.length > 1
+            if context.match(/^(course|section)_\d+$/)
+              # i.e. we are listing synthetic contexts under a course or section
+              data.unshift
+                id: "#{context}_all"
+                name: I18n.t('enrollments_everyone', "Everyone")
+                user_count: parent.data('user_data').user_count
+                type: 'context'
+                avatar_url: parent.data('user_data').avatar_url
+                select_all: true
+            else if context.match(/^((course|section)_\d+_.*|group_\d+)$/) and not context.match(/^course_\d+_(groups|sections)$/)
+              # i.e. we are listing all users in a group or synthetic context
+              data.unshift
+                id: context
+                name: I18n.t('select_all', "Select All")
+                user_count: parent.data('user_data').user_count
+                type: 'context'
+                avatar_url: parent.data('user_data').avatar_url
+                select_all: true
+                no_expand: true # just a magic select-all checkbox, you can't drill into it
+        base_data:
+          synthetic_contexts: 1
         browser:
           data:
             per_page: -1