MDL-59368 groups: Add an explicit cancel button

Autocomplete already uses Escape keyboard handler - so we can't use it to cancel an edit-inplace thing.
Make an obvious cancel button instead.

group/classes/output/user_groups_editable.php

@@ -159,6 +159,6 @@ public static function update($itemid, $newvalue) {
 
         $course = get_course($courseid);
         $user = core_user::get_user($userid);
-        return new self($course, $context, $user, $coursegroups, $groupids);
+        return new self($course, $context, $user, $coursegroups, array_values($groupids));
     }
 }

lib/amd/src/inplace_editable.js

@@ -209,7 +209,8 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/str'
                     .attr('for', inputelement.attr('id')),
                 options = args.options,
                 attributes = args.attributes,
-                saveelement = $('<a href="#"></a>');
+                saveelement = $('<a href="#"></a>'),
+                cancelelement = $('<a href="#"></a>');
 
             for (i in options) {
                 inputelement
@@ -228,11 +229,19 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/str'
                 saveelement.append(html); 
                 return;
             }).fail(notification.exception);
+
+            str.get_string('cancel', 'core').then(function(s) {
+                return templates.renderPix('e/cancel', 'core', s);
+            }).then(function(html) {
+                cancelelement.append(html); 
+                return;
+            }).fail(notification.exception);
 
             el.html('')
                 .append(lbl)
                 .append(inputelement)
-                .append(saveelement);
+                .append(saveelement)
+                .append(cancelelement);
 
             inputelement.focus();
             inputelement.select();
@@ -254,6 +263,11 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/str'
                 var val = JSON.stringify(inputelement.val());
                 turnEditingOff(el);
                 updateValue(el, val);
+                e.preventDefault();
+            });
+            cancelelement.on('click', function(e) {
+                turnEditingOff(el);
+                e.preventDefault();
             });
         };
 

lib/classes/output/icon_system_fontawesome.php

@@ -84,6 +84,7 @@ public function get_core_icon_map() {
             'core:e/backward' => 'fa-undo',
             'core:e/bold' => 'fa-bold',
             'core:e/bullet_list' => 'fa-list-ul',
+            'core:e/cancel' => 'fa-times',
             'core:e/cell_props' => 'fa-info',
             'core:e/cite' => 'fa-quote-right',
             'core:e/cleanup_messy_code' => 'fa-eraser',