BookStack Code Mirror - bookstack/blob - resources/js/components/permissions-table.js

   1
   2 class PermissionsTable {
   3
   4     constructor(elem) {
   5         this.container = elem;
   6
   7         // Handle toggle all event
   8         const toggleAll = elem.querySelector('[permissions-table-toggle-all]');
   9         toggleAll.addEventListener('click', this.toggleAllClick.bind(this));
  10
  11         // Handle toggle row event
  12         const toggleRowElems = elem.querySelectorAll('[permissions-table-toggle-all-in-row]');
  13         for (let toggleRowElem of toggleRowElems) {
  14             toggleRowElem.addEventListener('click', this.toggleRowClick.bind(this));
  15         }
  16
  17         // Handle toggle column event
  18         const toggleColumnElems = elem.querySelectorAll('[permissions-table-toggle-all-in-column]');
  19         for (let toggleColElem of toggleColumnElems) {
  20             toggleColElem.addEventListener('click', this.toggleColumnClick.bind(this));
  21         }
  22     }
  23
  24     toggleAllClick(event) {
  25         event.preventDefault();
  26         this.toggleAllInElement(this.container);
  27     }
  28
  29     toggleRowClick(event) {
  30         event.preventDefault();
  31         this.toggleAllInElement(event.target.closest('tr'));
  32     }
  33
  34     toggleColumnClick(event) {
  35         event.preventDefault();
  36
  37         const tableCell = event.target.closest('th,td');
  38         const colIndex = Array.from(tableCell.parentElement.children).indexOf(tableCell);
  39         const tableRows = tableCell.closest('table').querySelectorAll('tr');
  40         const inputsToToggle = [];
  41
  42         for (let row of tableRows) {
  43             const targetCell = row.children[colIndex];
  44             if (targetCell) {
  45                 inputsToToggle.push(...targetCell.querySelectorAll('input[type=checkbox]'));
  46             }
  47         }
  48         this.toggleAllInputs(inputsToToggle);
  49     }
  50
  51     toggleAllInElement(domElem) {
  52         const inputsToToggle = domElem.querySelectorAll('input[type=checkbox]');
  53         this.toggleAllInputs(inputsToToggle);
  54     }
  55
  56     toggleAllInputs(inputsToToggle) {
  57         const currentState = inputsToToggle.length > 0 ? inputsToToggle[0].checked : false;
  58         for (let checkbox of inputsToToggle) {
  59             checkbox.checked = !currentState;
  60             checkbox.dispatchEvent(new Event('change'));
  61         }
  62     }
  63
  64 }
  65
  66 export default PermissionsTable;