MDL-55463 output: Make single select a templatable

Part of MDL-55071

lib/outputcomponents.php

@@ -727,7 +727,7 @@ class single_button implements renderable {
  * @package core
  * @category output
  */
-class single_select implements renderable {
+class single_select implements renderable, templatable {
 
     /**
      * @var moodle_url Target url - includes hidden fields
@@ -869,6 +869,77 @@ class single_select implements renderable {
         $this->labelattributes = $attributes;
 
     }
+
+    /**
+     * Export data.
+     *
+     * @param renderer_base $output Renderer.
+     * @return stdClass
+     */
+    public function export_for_template(renderer_base $output) {
+        $attributes = $this->attributes;
+
+        $data = new stdClass();
+        $data->name = $this->name;
+        $data->method = $this->method;
+        $data->action = $this->method === 'get' ? $this->url->out_omit_querystring(true) : $this->url->out_omit_querystring();
+        $data->classes = 'autosubmit ' . $this->class;
+        $data->label = $this->label;
+        $data->disabled = $this->disabled;
+        $data->title = $this->tooltip;
+        $data->id = !empty($attributes['id']) ? $attributes['id'] : html_writer::random_id('single_select');
+        unset($attributes['id']);
+
+        // Form parameters.
+        $params = $this->url->params();
+        if ($this->method === 'post') {
+            $params['sesskey'] = sesskey();
+        }
+        $data->params = array_map(function($key) use ($params) {
+            return ['name' => $key, 'value' => $params[$key]];
+        }, array_keys($params));
+
+        // Select options.
+        $hasnothing = false;
+        if (is_string($this->nothing) && $this->nothing !== '') {
+            $nothing = ['' => $this->nothing];
+            $hasnothing = true;
+        } else if (is_array($this->nothing)) {
+            $key = key($this->nothing);
+            if ($key === 'choose' || $key === 'choosedots') {
+                $nothing = [$key => get_string('choosedots')];
+            } else {
+                $nothing = $this->nothing;
+            }
+            $hasnothing = true;
+        }
+        if ($hasnothing) {
+            $options = $nothing + $this->options;
+        } else {
+            $options = $this->options;
+        }
+        $data->hasnothing = $hasnothing;
+        $data->nothingkey = $hasnothing ? key($nothing) : false;
+
+        foreach ($options as $value => $name) {
+            $data->options[] = [
+                'value' => $value,
+                'name' => $options[$value],
+                'selected' => $this->selected == $value
+            ];
+        }
+
+        // Label attributes.
+        $data->labelattributes = [];
+        foreach ($this->labelattributes as $key => $value) {
+            $data->labelattributes = ['name' => $key, 'value' => $value];
+        }
+
+        // Help icon.
+        $data->helpicon = !empty($this->helpicon) ? $this->helpicon->export_for_template($output) : false;
+
+        return $data;
+    }
 }
 
 /**

theme/noname/classes/output/core_renderer.php

@@ -28,6 +28,7 @@ use moodle_url;
 use preferences_groups;
 use action_menu;
 use help_icon;
+use single_select;
 
 defined('MOODLE_INTERNAL') || die;
 
@@ -272,4 +273,15 @@ class core_renderer extends \core_renderer {
         $context = $helpicon->export_for_template($this);
         return $this->render_from_template('core/help_icon', $context);
     }
+
+    /**
+     * Renders a single select.
+     *
+     * @param single_select $select The object.
+     * @return string HTML
+     */
+    protected function render_single_select(single_select $select) {
+        return $this->render_from_template('core/single_select', $select->export_for_template($this));
+    }
+
 }

theme/noname/scss/moodle/buttons.scss

@@ -63,7 +63,6 @@ input[type="text"] + input[type="submit"] {
     @extend .btn-lineup;
 }
 
-button,
 input.form-submit,
 input[type="button"],
 input[type="submit"],

theme/noname/templates/core/help_icon.mustache

@@ -1,4 +1,4 @@
-<button class="btn btn-link p-a-0"
+<button class="btn btn-link p-a-0" type="button"
     data-container="body" data-toggle="popover"
     data-placement="{{#ltr}}right{{/ltr}}{{^ltr}}left{{/ltr}}" data-content="{{text}} {{completedoclink}}"
     data-html="true" tabindex="0" data-trigger="click">

theme/noname/templates/core/single_select.mustache

@@ -0,0 +1,35 @@
+<div class="{{classes}}">
+    <form method="{{method}}" action="{{action}}" class="form-inline">
+        {{#params}}
+            <input type="hidden" name="{{name}}" value="{{value}}">
+        {{/params}}
+        <div class="form-group">
+            {{#label}}
+                <label for="{{id}}" {{#labelattributes}}{{name}}="{{value}}" {{/labelattributes}}>
+                    {{label}}
+                </label>
+            {{/label}}
+            {{#helpicon}}
+                {{>core/help_icon}}
+            {{/helpicon}}
+            <select {{#attributes}}{{name}}="{{value}}" {{/attributes}} id="{{id}}" class="custom-select {{classes}}" name="{{name}}">
+                {{#options}}
+                    <option value="{{value}}" {{#selected}}selected{{/selected}}>{{name}}</option>
+                {{/options}}
+            </select>
+        </div>
+        <noscript>
+            <button type="submit" class="btn btn-secondary">{{#str}}go, core{{/str}}</button>
+        </noscript>
+    </form>
+</div>
+{{#js}}
+require(['core/yui'], function(Y) {
+    Y.use('moodle-core-formautosubmit', function() {
+        M.core.init_formautosubmit({
+            selectid: '{{id}}',
+            nothing: {{#hasnothing}}'{{nothingkey}}'{{/hasnothing}}{{^hasnothing}}false{{/hasnothing}}
+        });
+    });
+});
+{{/js}}