MDL-56979 group: Make group index page Boost-y
authorJun Pataleta <jun@moodle.com>
Wed, 17 May 2017 08:45:51 +0000 (16:45 +0800)
committerJun Pataleta <jun@moodle.com>
Fri, 16 Jun 2017 05:58:15 +0000 (13:58 +0800)
group/classes/output/index_page.php [new file with mode: 0644]
group/classes/output/renderer.php [new file with mode: 0644]
group/index.php
group/templates/index.mustache [new file with mode: 0644]

diff --git a/group/classes/output/index_page.php b/group/classes/output/index_page.php
new file mode 100644 (file)
index 0000000..8430aae
--- /dev/null
@@ -0,0 +1,111 @@
+<?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/>.
+
+/**
+ * Group index page.
+ *
+ * @package    core_group
+ * @copyright  2017 Jun Pataleta
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+namespace core_group\output;
+defined('MOODLE_INTERNAL') || die();
+
+use renderable;
+use renderer_base;
+use stdClass;
+use templatable;
+
+/**
+ * Group index page class.
+ *
+ * @package    core_group
+ * @copyright  2017 Jun Pataleta
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class index_page implements renderable, templatable {
+
+    /** @var int $courseid The course ID. */
+    public $courseid;
+
+    /** @var array The array of groups to be rendered. */
+    public $groups;
+
+    /** @var string The name of the currently selected group. */
+    public $selectedgroupname;
+
+    /** @var array The array of group members to be rendered, if a group is selected. */
+    public $selectedgroupmembers;
+
+    /** @var bool Whether to disable the add members/edit group buttons. */
+    public $disableaddedit;
+
+    /** @var bool Whether to disable the delete group button. */
+    public $disabledelete;
+
+    /** @var array Groups that can't be deleted by the user. */
+    public $undeletablegroups;
+
+    /**
+     * index_page constructor.
+     *
+     * @param int $courseid The course ID.
+     * @param array $groups The array of groups to be rendered.
+     * @param string $selectedgroupname The name of the currently selected group.
+     * @param array $selectedgroupmembers The array of group members to be rendered, if a group is selected.
+     * @param bool $disableaddedit Whether to disable the add members/edit group buttons.
+     * @param bool $disabledelete Whether to disable the delete group button.
+     * @param array $undeletablegroups Groups that can't be deleted by the user.
+     */
+    public function __construct($courseid, $groups, $selectedgroupname, $selectedgroupmembers, $disableaddedit, $disabledelete,
+                                $undeletablegroups) {
+        $this->courseid = $courseid;
+        $this->groups = $groups;
+        $this->selectedgroupname = $selectedgroupname;
+        $this->selectedgroupmembers = $selectedgroupmembers;
+        $this->disableaddedit = $disableaddedit;
+        $this->disabledelete = $disabledelete;
+        $this->undeletablegroups = $undeletablegroups;
+    }
+
+    /**
+     * Export the data.
+     *
+     * @param renderer_base $output
+     * @return stdClass
+     */
+    public function export_for_template(renderer_base $output) {
+        global $CFG;
+
+        $data = new stdClass();
+
+        // Variables that will be passed to the JS helper.
+        $data->courseid = $this->courseid;
+        $data->wwwroot = $CFG->wwwroot;
+        // To be passed to the JS init script in the template. Encode as a JSON string.
+        $data->undeletablegroups = json_encode($this->undeletablegroups);
+
+        // Some buttons are enabled if single group selected.
+        $data->addmembersdisabled = $this->disableaddedit;
+        $data->editgroupsettingsdisabled = $this->disableaddedit;
+        $data->deletegroupdisabled = $this->disabledelete;
+        $data->groups = $this->groups;
+        $data->members = $this->selectedgroupmembers;
+        $data->selectedgroup = $this->selectedgroupname;
+
+        return $data;
+    }
+}
diff --git a/group/classes/output/renderer.php b/group/classes/output/renderer.php
new file mode 100644 (file)
index 0000000..14443cf
--- /dev/null
@@ -0,0 +1,50 @@
+<?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/>.
+
+/**
+ * Renderers.
+ *
+ * @package    core_group
+ * @copyright  2017 Jun Pataleta
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+namespace core_group\output;
+
+defined('MOODLE_INTERNAL') || die();
+
+use plugin_renderer_base;
+
+/**
+ * Renderer class.
+ *
+ * @package    core_group
+ * @copyright  2017 Jun Pataleta
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class renderer extends plugin_renderer_base {
+
+    /**
+     * Defer to template.
+     *
+     * @param index_page $page
+     * @return string
+     */
+    public function render_index_page(index_page $page) {
+        $data = $page->export_for_template($this);
+        return parent::render_from_template('core_group/index', $data);
+    }
+}
index 6571f54..8150e19 100644 (file)
@@ -61,6 +61,7 @@ $context = context_course::instance($course->id);
 require_capability('moodle/course:managegroups', $context);
 
 $PAGE->requires->js('/group/clientlib.js');
+$PAGE->requires->js('/group/module.js');
 
 // Check for multiple/no group errors
 if (!$singlegroup) {
@@ -152,41 +153,23 @@ echo $OUTPUT->header();
 $currenttab = 'groups';
 require('tabs.php');
 
-$disabled = 'disabled="disabled"';
-
-// Some buttons are enabled if single group selected.
-$showaddmembersform_disabled = $singlegroup ? '' : $disabled;
-$showeditgroupsettingsform_disabled = $singlegroup ? '' : $disabled;
-$deletegroup_disabled = count($groupids) > 0 ? '' : $disabled;
-
 echo $OUTPUT->heading(format_string($course->shortname, true, array('context' => $context)) .' '.$strgroups, 3);
-echo '<form id="groupeditform" action="index.php" method="post">'."\n";
-echo '<div>'."\n";
-echo '<input type="hidden" name="id" value="' . $courseid . '" />'."\n";
-
-echo html_writer::start_tag('div', array('class' => 'groupmanagementtable boxaligncenter'));
-echo html_writer::start_tag('div', array('class' => 'groups'));
-
-echo '<p><label for="groups"><span id="groupslabel">'.get_string('groups').':</span><span id="thegrouping">&nbsp;</span></label></p>'."\n";
-
-$onchange = 'M.core_group.membersCombo.refreshMembers();';
-
-echo '<select name="groups[]" multiple="multiple" id="groups" size="15" class="select" onchange="'.$onchange.'">'."\n";
 
 $groups = groups_get_all_groups($courseid);
-$selectedname = '&nbsp;';
+$selectedname = null;
 $preventgroupremoval = array();
 
+// Get list of groups to render.
+$groupoptions = array();
 if ($groups) {
-    // Print out the HTML
     foreach ($groups as $group) {
-        $select = '';
-        $usercount = $DB->count_records('groups_members', array('groupid'=>$group->id));
-        $groupname = format_string($group->name).' ('.$usercount.')';
-        if (in_array($group->id,$groupids)) {
-            $select = ' selected="selected"';
+        $selected = false;
+        $usercount = $DB->count_records('groups_members', array('groupid' => $group->id));
+        $groupname = format_string($group->name) . ' (' . $usercount . ')';
+        if (in_array($group->id, $groupids)) {
+            $selected = true;
             if ($singlegroup) {
-                // Only keep selected name if there is one group selected
+                // Only keep selected name if there is one group selected.
                 $selectedname = $groupname;
             }
         }
@@ -194,76 +177,41 @@ if ($groups) {
             $preventgroupremoval[$group->id] = true;
         }
 
-        echo "<option value=\"{$group->id}\"$select title=\"$groupname\">$groupname</option>\n";
+        $groupoptions[] = (object) [
+            'value' => $group->id,
+            'selected' => $selected,
+            'text' => $groupname
+        ];
     }
-} else {
-    // Print an empty option to avoid the XHTML error of having an empty select element
-    echo '<option>&nbsp;</option>';
 }
 
-echo '</select>'."\n";
-echo '<p><input class="btn btn-secondary" type="submit" name="act_updatemembers" id="updatemembers" value="'
-        . get_string('showmembersforgroup', 'group') . '" /></p>'."\n";
-echo '<p><input class="btn btn-secondary" type="submit" '. $showeditgroupsettingsform_disabled .
-        ' name="act_showgroupsettingsform" id="showeditgroupsettingsform" value="'
-        . get_string('editgroupsettings', 'group') . '" /></p>'."\n";
-echo '<p><input class="btn btn-secondary" type="submit" '. $deletegroup_disabled .
-        ' name="act_deletegroup" id="deletegroup" value="'
-        . get_string('deleteselectedgroup', 'group') . '" /></p>'."\n";
-
-echo '<p><input class="btn btn-secondary" type="submit" name="act_showcreateorphangroupform" id="showcreateorphangroupform" value="'
-        . get_string('creategroup', 'group') . '" /></p>'."\n";
-
-echo '<p><input class="btn btn-secondary" type="submit" name="act_showautocreategroupsform" id="showautocreategroupsform" value="'
-        . get_string('autocreategroups', 'group') . '" /></p>'."\n";
-
-echo '<p><input class="btn btn-secondary" type="submit" name="act_showimportgroups" id="showimportgroups" value="'
-        . get_string('importgroups', 'core_group') . '" /></p>'."\n";
-
-echo html_writer::end_tag('div');
-echo html_writer::start_tag('div', array('class' => 'members'));
-
-echo '<p><label for="members"><span id="memberslabel">'.
-    get_string('membersofselectedgroup', 'group').
-    ' </span><span id="thegroup">'.$selectedname.'</span></label></p>'."\n";
-//NOTE: the SELECT was, multiple="multiple" name="user[]" - not used and breaks onclick.
-echo '<select name="user" id="members" size="15" class="select"'."\n";
-echo ' onclick="window.status=this.options[this.selectedIndex].title;" onmouseout="window.status=\'\';">'."\n";
-
-$member_names = array();
-
-$atleastonemember = false;
+// Get list of group members to render if there is a single selected group.
+$members = array();
 if ($singlegroup) {
-    if ($groupmemberroles = groups_get_members_by_role($groupids[0], $courseid, 'u.id, ' . get_all_user_name_fields(true, 'u'))) {
-        foreach($groupmemberroles as $roleid=>$roledata) {
-            echo '<optgroup label="'.s($roledata->name).'">';
-            foreach($roledata->users as $member) {
-                echo '<option value="'.$member->id.'">'.fullname($member, true).'</option>';
-                $atleastonemember = true;
+    $usernamefields = get_all_user_name_fields(true, 'u');
+    if ($groupmemberroles = groups_get_members_by_role(reset($groupids), $courseid, 'u.id, ' . $usernamefields)) {
+        foreach ($groupmemberroles as $roleid => $roledata) {
+            $users = array();
+            foreach ($roledata->users as $member) {
+                $users[] = (object)[
+                    'value' => $member->id,
+                    'text' => fullname($member, true)
+                ];
             }
-            echo '</optgroup>';
+            $members[] = (object)[
+                'role' => s($roledata->name),
+                'rolemembers' => $users
+            ];
         }
     }
 }
 
-if (!$atleastonemember) {
-    // Print an empty option to avoid the XHTML error of having an empty select element
-    echo '<option>&nbsp;</option>';
-}
-
-echo '</select>'."\n";
-
-echo '<p><input class="btn btn-secondary" type="submit" ' . $showaddmembersform_disabled . ' name="act_showaddmembersform" '
-        . 'id="showaddmembersform" value="' . get_string('adduserstogroup', 'group'). '" /></p>'."\n";
-echo html_writer::end_tag('div');
-echo html_writer::end_tag('div');
-
-//<input type="hidden" name="rand" value="om" />
-echo '</div>'."\n";
-echo '</form>'."\n";
-
-$PAGE->requires->js_init_call('M.core_group.init_index', array($CFG->wwwroot, $courseid));
-$PAGE->requires->js_init_call('M.core_group.groupslist', array($preventgroupremoval));
+$disableaddedit = !$singlegroup;
+$disabledelete = !empty($groupids);
+$renderable = new \core_group\output\index_page($courseid, $groupoptions, $selectedname, $members, $disableaddedit, $disabledelete,
+        $preventgroupremoval);
+$output = $PAGE->get_renderer('core_group');
+echo $output->render($renderable);
 
 echo $OUTPUT->footer();
 
diff --git a/group/templates/index.mustache b/group/templates/index.mustache
new file mode 100644 (file)
index 0000000..fb8be7f
--- /dev/null
@@ -0,0 +1,145 @@
+{{!
+    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_group/index
+
+    Template for the Groups page.
+
+    Classes required for JS:
+    * none
+
+    Data attributes required for JS:
+    * none
+
+    Context variables required for this template:
+    * courseid int The course ID.
+    * selectedgroup string The initially selected group.
+    * editgroupsettingsdisabled bool Whether to disable the "Edit group settings" button on load.
+    * deletegroupdisabled bool Whether to disable the "Delete selected group" button on load.
+    * addmembersdisabled bool Whether to disable the "Add/remove users" button on load.
+    * groups array The list of groups.
+    * members array The list of members, grouped based on roles.
+    * undeletablegroups string A JSON string containing an array of group IDs that a user cannot delete.
+
+    Example context (json):
+    {
+        "courseid": "1",
+        "selectedgroup": "Group 1 (3)",
+        "editgroupsettingsdisabled": false,
+        "deletegroupdisabled": false,
+        "addmembersdisabled": false,
+        "groups": [
+            {
+                "value": "1",
+                "text": "Group 1 (3)",
+                "selected": true
+            },
+            {
+                "value": "2",
+                "text": "Group 2 (2)"
+            }
+        ],
+        "members": [
+            {
+                "role": "Student",
+                "rolemembers": [
+                    {
+                        "value": "1",
+                        "text": "John Doe"
+                    },
+                    {
+                        "value": "2",
+                        "text": "Jane Doe"
+                    },
+                    {
+                        "value": "3",
+                        "text": "John Smith"
+                    }
+                ]
+            }
+        ],
+        "undeletablegroups": "[1: true, 3: true]"
+    }
+}}
+<form id="groupeditform" action="index.php" method="post">
+    <div class="container-fluid groupmanagementtable">
+        <div class="row row-fluid rtl-compatible">
+            <input type="hidden" name="id" value="{{courseid}}">
+            <div class="col-md-6 span6 m-b-1 groups">
+                <div class="form-group">
+                    <label for="groups">
+                        <span id="groupslabel">{{#str}}groups{{/str}}</span>
+                        <span id="thegrouping">&nbsp;</span>
+                    </label>
+                    <select name="groups[]" multiple="multiple" id="groups" size="15" class="form-control input-block-level">
+                        {{#groups}}
+                            <option value="{{value}}" {{#selected}}selected="selected"{{/selected}} title="{{{text}}}">{{{text}}}</option>
+                        {{/groups}}
+                    </select>
+                </div>
+                <div class="form-group">
+                    <input type="submit" name="act_updatemembers" id="updatemembers" value="{{#str}}showmembersforgroup, group{{/str}}" class="btn btn-default" />
+                </div>
+                <div class="form-group">
+                    <input type="submit" name="act_showgroupsettingsform" id="showeditgroupsettingsform" value="{{#str}}editgroupsettings, group{{/str}}" {{#editgroupsettingsdisabled}}disabled="disabled"{{/editgroupsettingsdisabled}} class="btn btn-default" />
+                </div>
+                <div class="form-group">
+                    <input type="submit" name="act_deletegroup" id="deletegroup" value="{{#str}}deleteselectedgroup, group{{/str}}" {{#deletegroupdisabled}}disabled="disabled"{{/deletegroupdisabled}} class="btn btn-default" />
+                </div>
+                <div class="form-group">
+                    <input type="submit" name="act_showcreateorphangroupform" id="showcreateorphangroupform" value="{{#str}}creategroup, group{{/str}}" class="btn btn-default" />
+                </div>
+                <div class="form-group">
+                    <input type="submit" name="act_showautocreategroupsform" id="showautocreategroupsform" value="{{#str}}autocreategroups, group{{/str}}" class="btn btn-default" />
+                </div>
+                <div class="form-group">
+                    <input type="submit" name="act_showimportgroups" id="showimportgroups" value="{{#str}}importgroups, group{{/str}}" class="btn btn-default" />
+                </div>
+            </div>
+            <div class="col-md-6 span6 m-b-1 members">
+                <div class="form-group">
+                    <label for="members">
+                        <span id="memberslabel">{{#str}}membersofselectedgroup, group{{/str}}</span>
+                        <span id="thegroup">{{{selectedgroup}}}</span>
+                    </label>
+                    <select size="15" multiple="multiple" class="form-control input-block-level" id="members" name="user">
+                        {{#members}}
+                            <optgroup label="{{role}}">
+                                {{#rolemembers}}
+                                    <option value="{{value}}">{{{text}}}‎</option>
+                                {{/rolemembers}}
+                            </optgroup>
+                        {{/members}}
+                    </select>
+                </div>
+                <div class="form-group">
+                    <input type="submit" value="{{#str}}adduserstogroup, group{{/str}}" class="btn btn-default" {{#addmembersdisabled}}disabled="disabled"{{/addmembersdisabled}} name="act_showaddmembersform" id="showaddmembersform"/>
+                </div>
+            </div>
+        </div>
+    </div>
+</form>
+{{#js}}
+    require(['jquery', 'core/yui'], function($) {
+        $("#groups").change(function() {
+            M.core_group.membersCombo.refreshMembers();
+        });
+        M.core_group.init_index(Y, "{{wwwroot}}", {{courseid}});
+        var undeletableGroups = JSON.parse('{{{undeletablegroups}}}');
+        M.core_group.groupslist(Y, undeletableGroups);
+    });
+{{/js}}