MDL-69454 core_search: consistent capability search
authorBas Brands <bas@moodle.com>
Mon, 31 Aug 2020 13:40:48 +0000 (15:40 +0200)
committerEloy Lafuente (stronk7) <stronk7@moodle.org>
Wed, 23 Sep 2020 15:36:15 +0000 (17:36 +0200)
admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search-debug.js
admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search-min.js
admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search.js
admin/tool/capability/yui/src/search/js/search.js

index 1c05534..ed3d79c 100644 (file)
Binary files a/admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search-debug.js and b/admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search-debug.js differ
index 6520ca2..30e97fc 100644 (file)
Binary files a/admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search-min.js and b/admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search-min.js differ
index 1c05534..ed3d79c 100644 (file)
Binary files a/admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search.js and b/admin/tool/capability/yui/build/moodle-tool_capability-search/moodle-tool_capability-search.js differ
index 1e4b96c..71bd152 100644 (file)
@@ -51,6 +51,13 @@ SEARCH.prototype = {
      * @protected
      */
     button: null,
+    /**
+     * The cancel button for the form.
+     * @property button
+     * @type Node
+     * @protected
+     */
+    cancel: null,
     /**
      * The last search node if there is one.
      * If there is a last search node then the last search term will be persisted between requests.
@@ -74,17 +81,28 @@ SEARCH.prototype = {
         this.button = this.form.all('input[type=submit]');
         this.lastsearch = this.form.one('input[name=search]');
 
-        var div = Y.Node.create('<div id="capabilitysearchui" data-fieldtype="text"></div>'),
-            label = Y.Node.create('<label for="capabilitysearch">' + this.get('strsearch') + '</label>');
-        this.input = Y.Node.create('<input type="text" id="capabilitysearch" />');
+        var div = Y.Node.create('<div id="capabilitysearchui" class="input-group simplesearchform mb-2"' +
+            'data-fieldtype="text"></div>'),
+            label = Y.Node.create('<label for="capabilitysearch"><span class="sr-only"' +
+                this.get('strsearch') + '</span></label>');
+        this.cancel = Y.Node.create('<a class="btn btn-clear d-none icon-no-margin">' +
+                '<i class="icon fa fa-times fa-fw " aria-hidden="true"></i>' +
+                '</a>');
+        this.input = Y.Node.create('<input type="text" class="form-control withclear" placeholder="' +
+            this.get('strsearch') + '"id="capabilitysearch" />');
 
-        div.append(label).append(this.input);
+        div.append(label).append(this.input).append(this.cancel);
 
         this.select.insert(div, 'before');
 
         this.input.on('keyup', this.typed, this);
         this.select.on('change', this.validate, this);
 
+        this.cancel.on('click', function() {
+            this.input.set('value', '');
+            this.typed();
+        }, this);
+
         if (this.lastsearch) {
             this.input.set('value', this.lastsearch.get('value'));
             this.typed();
@@ -131,6 +149,11 @@ SEARCH.prototype = {
                 last.set('selected', true);
             }
         }
+        if (search !== '') {
+            this.cancel.removeClass("d-none");
+        } else {
+            this.cancel.addClass("d-none");
+        }
         this.validate();
     }
 };