MDL-65928 core: Create a checkbox_toggleall renderable

This commit is contained in:
Jun Pataleta 2019-03-01 14:43:25 +08:00
parent 0a3d306358
commit 6259a9d065
3 changed files with 175 additions and 0 deletions

View File

@ -0,0 +1,103 @@
<?php
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
/**
* The renderable for core/checkbox-toggleall.
*
* @package core
* @copyright 2019 Jun Pataleta
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
namespace core\output;
defined('MOODLE_INTERNAL') || die();
use renderable;
use renderer_base;
use stdClass;
use templatable;
/**
* The checkbox-toggleall renderable class.
*
* @package core
* @copyright 2019 Jun Pataleta
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
class checkbox_toggleall implements renderable, templatable {
/** @var string The name of the group of checkboxes to be toggled. */
protected $togglegroup;
/** @var bool $ismaster Whether we're rendering for a master checkbox or a slave checkbox. */
protected $ismaster;
/** @var array $options The options for the checkbox. */
protected $options;
/**
* Constructor.
*
* @param string $togglegroup The name of the group of checkboxes to be toggled.
* @param bool $ismaster Whether we're rendering for a master checkbox or a slave checkbox.
* @param array $options The options for the checkbox. Valid options are:
* <ul>
* <li><b>id </b> string - The element ID.</li>
* <li><b>name </b> string - The element name.</li>
* <li><b>classes </b> string - CSS classes that you want to add for your checkbox.</li>
* <li><b>value </b> string|int - The element's value.</li>
* <li><b>checked </b> boolean - Whether to render this initially as checked.</li>
* <li><b>label </b> string - The label for the checkbox element.</li>
* <li><b>labelclasses</b> string - CSS classes that you want to add for your label.</li>
* <li><b>selectall </b> string - Master only. The language string that will be used to indicate that clicking on
* the master will select all of the slave checkboxes. Defaults to "Select all".</li>
* <li><b>deselectall </b> string - Master only. The language string that will be used to indicate that clicking on
* the master will select all of the slave checkboxes. Defaults to "Deselect all".</li>
* </ul>
*/
public function __construct(string $togglegroup, bool $ismaster, $options = []) {
$this->togglegroup = $togglegroup;
$this->ismaster = $ismaster;
$this->options = $options;
}
/**
* Export for template.
*
* @param renderer_base $output The renderer.
* @return stdClass
*/
public function export_for_template(renderer_base $output) {
$data = (object)[
'togglegroup' => $this->togglegroup,
'master' => $this->ismaster,
'id' => $this->options['id'] ?? null,
'name' => $this->options['name'] ?? null,
'value' => $this->options['value'] ?? null,
'classes' => $this->options['classes'] ?? null,
'label' => $this->options['label'] ?? null,
'labelclasses' => $this->options['labelclasses'] ?? null,
'checked' => $this->options['checked'] ?? false,
];
if ($this->ismaster) {
$data->selectall = $this->options['selectall'] ?? get_string('selectall');
$data->deselectall = $this->options['deselectall'] ?? get_string('deselectall');
}
return $data;
}
}

View File

@ -4711,6 +4711,16 @@ EOD;
$data = $bar->export_for_template($this);
return $this->render_from_template('core/progress_bar', $data);
}
/**
* Renders element for a toggle-all checkbox.
*
* @param \core\output\checkbox_toggleall $element
* @return string
*/
public function render_checkbox_toggleall(\core\output\checkbox_toggleall $element) {
return $this->render_from_template('core/checkbox-toggleall', $element->export_for_template($this));
}
}
/**

View File

@ -0,0 +1,62 @@
{{!
This file is part of Moodle - http://moodle.org/
Moodle is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Moodle is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Moodle. If not, see <http://www.gnu.org/licenses/>.
}}
{{!
@template core/checkbox-toggleall
Template for master/slave checkboxes. The master checkbox toggles the checked states of the slave checkboxes.
Example context (json):
{
"id": "select-all",
"name": "select-all",
"master": true,
"togglegroup": "toggle-group",
"label": "Select everything!"
}
}}
{{#master}}
<input id="{{id}}" name="{{name}}" type="checkbox" {{#classes}}class="{{.}}"{{/classes}} value="{{value}}"
data-action="toggle"
data-toggle="master"
data-togglegroup="{{togglegroup}}"
data-toggle-selectall="{{selectall}}"
data-toggle-deselectall="{{deselectall}}"
{{#checked}}checked="checked"{{/checked}}
/>
{{#label}}
<label for="{{id}}" class="{{labelclasses}}">{{.}}</label>
{{/label}}
{{/master}}
{{^master}}
<input id="{{id}}" name="{{name}}" type="checkbox" {{#classes}}class="{{.}}"{{/classes}} value="{{value}}"
data-action="toggle"
data-toggle="slave"
data-togglegroup="{{togglegroup}}"
{{#checked}}checked="checked"{{/checked}}
/>
{{#label}}
<label for="{{id}}" class="{{labelclasses}}">{{{.}}}</label>
{{/label}}
{{/master}}
{{#js}}
{{#master}}
require(['core/checkbox-toggleall'], function(ToggleAll) {
ToggleAll.init();
});
{{/master}}
{{/js}}