BookStack Code Mirror - bookstack/blob - resources/js/components/expand-toggle.js

   1 import {slideUp, slideDown} from "../services/animations";
   2
   3 class ExpandToggle {
   4
   5     constructor(elem) {
   6         this.elem = elem;
   7
   8         // Component state
   9         this.isOpen = elem.getAttribute('expand-toggle-is-open') === 'yes';
  10         this.updateEndpoint = elem.getAttribute('expand-toggle-update-endpoint');
  11         this.selector = elem.getAttribute('expand-toggle');
  12
  13         // Listener setup
  14         elem.addEventListener('click', this.click.bind(this));
  15     }
  16
  17     open(elemToToggle) {
  18         slideDown(elemToToggle, 200);
  19     }
  20
  21     close(elemToToggle) {
  22         slideUp(elemToToggle, 200);
  23     }
  24
  25     click(event) {
  26         event.preventDefault();
  27
  28         const matchingElems = document.querySelectorAll(this.selector);
  29         for (let match of matchingElems) {
  30             this.isOpen ?  this.close(match) : this.open(match);
  31         }
  32
  33         this.isOpen = !this.isOpen;
  34         this.updateSystemAjax(this.isOpen);
  35     }
  36
  37     updateSystemAjax(isOpen) {
  38         window.$http.patch(this.updateEndpoint, {
  39             expand: isOpen ? 'true' : 'false'
  40         });
  41     }
  42
  43 }
  44
  45 export default ExpandToggle;