MDL-66076 forumreport_summary: Groups filter made accessible
[moodle.git] / mod / forum / report / summary / amd / src / filters.js
1 // This file is part of Moodle - http://moodle.org/
2 //
3 // Moodle is free software: you can redistribute it and/or modify
4 // it under the terms of the GNU General Public License as published by
5 // the Free Software Foundation, either version 3 of the License, or
6 // (at your option) any later version.
7 //
8 // Moodle is distributed in the hope that it will be useful,
9 // but WITHOUT ANY WARRANTY; without even the implied warranty of
10 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
11 // GNU General Public License for more details.
12 //
13 // You should have received a copy of the GNU General Public License
14 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
16 /**
17  * Module responsible for handling forum summary report filters.
18  *
19  * @module     forumreport_summary/filters
20  * @package    forumreport_summary
21  * @copyright  2019 Michael Hawkins <michaelh@moodle.com>
22  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
23  */
25 import $ from 'jquery';
26 import Popper from 'core/popper';
28 export const init = (root) => {
29     root = $(root);
31     // Hide loading spinner and show report once page is ready.
32     // This ensures filters can be applied when sorting by columns.
33     $(document).ready(function() {
34         $('.loading-icon').hide();
35         $('#summaryreport').removeClass('hidden');
36     });
38     // Generic filter handlers.
40     // Called to clear filters.
41     var clearAll = (event) => {
42         // Clear checkboxes.
43         let selected = event.target.parentNode.parentNode.parentElement.querySelectorAll('input[type="checkbox"]:checked');
45         selected.forEach(function(checkbox) {
46             checkbox.checked = false;
47         });
48     };
50     // Event handler for clearing filter by clicking option.
51     $(root).on("click", ".filter-clear", function(event) {
52         event.preventDefault();
53         clearAll(event);
54     });
56     // Called to override click event to trigger a proper generate request with filtering.
57     var generateWithFilters = (event) => {
58         var newLink = $('#filtersform').attr('action');
60         if (event) {
61             event.preventDefault();
63             let filterParams = event.target.search.substr(1);
64             newLink += '&' + filterParams;
65         }
67         $('#filtersform').attr('action', newLink);
68         $('#filtersform').submit();
69     };
71     // Override 'reset table preferences' so it generates with filters.
72     $('.resettable').on("click", "a", function(event) {
73         generateWithFilters(event);
74     });
76     // Override table heading sort links so they generate with filters.
77     $('thead').on("click", "a", function(event) {
78         generateWithFilters(event);
79     });
81     // Override pagination page links so they generate with filters.
82     $('.pagination').on("click", "a", function(event) {
83         generateWithFilters(event);
84     });
86     // Select all checkboxes within a filter section.
87     var selectAll = (checkboxdiv) => {
88         let targetdiv = document.getElementById(checkboxdiv);
89         let deselected = targetdiv.querySelectorAll('input[type="checkbox"]:not(:checked)');
91         deselected.forEach(function(checkbox) {
92             checkbox.checked = true;
93         });
94     };
96     // Submit report via filter
97     var submitWithFilter = (containerelement) => {
98         // Close the container (eg popover).
99         $(containerelement).addClass('hidden');
101         // Submit the filter values and re-generate report.
102         generateWithFilters(false);
103     };
105     // Groups filter specific handlers.
107     // Event handler for clicking select all groups.
108     $('#filter-groups-popover .select-all').on('click', function(event) {
109         event.preventDefault();
110         selectAll('filter-groups-popover');
111     });
113     // Event handler for showing groups filter popover.
114     $('#filter-groups-button').on('click', function() {
115         // Create popover.
116         var referenceElement = document.querySelector('#filter-groups-button'),
117             popperContent = document.querySelector('#filter-groups-popover');
119         new Popper(referenceElement, popperContent, {placement: 'bottom'});
121         // Show popover and switch focus.
122         var groupsbutton = document.getElementById('filter-groups-button'),
123             groupspopover = document.getElementById('filter-groups-popover');
124         groupspopover.classList.remove('hidden');
125         groupsbutton.setAttribute('aria-expanded', true);
126         groupsbutton.classList.add('btn-outline-primary');
127         groupsbutton.classList.remove('btn-primary');
128         groupspopover.querySelector('input').focus();
129     });
131     // Event handler to click save groups filter.
132     $(root).on("click", "#filter-groups-popover .filter-save", function(event) {
133         event.preventDefault();
134         submitWithFilter('#filter-groups-popover');
135     });
137     // Event handler to support pressing enter/space on groups filter popover actions.
138     $('#filter-groups-popover').on("keydown", ".filter-actions", function(event) {
139     if ((event.charCode === 13 || event.keyCode === 13 || event.charCode === 32 || event.keyCode === 32)
140                 && event.target.classList.length > 0) {
141             event.preventDefault();
143             switch(event.target.classList[0]) {
144                 case 'select-all':
145                     selectAll('filter-groups-popover');
146                     break;
147                 case 'filter-clear':
148                     clearAll(event);
149                     break;
150                 case 'filter-save':
151                     submitWithFilter('#filter-groups-popover');
152                     break;
153             }
154         }
155     });
156 };