BookStack Code Mirror - bookstack/blob - resources/js/components/overlay.js

   1 import {fadeIn, fadeOut} from "../services/animations";
   2
   3 class Overlay {
   4
   5     constructor(elem) {
   6         this.container = elem;
   7         elem.addEventListener('click', event => {
   8              if (event.target === elem) return this.hide();
   9         });
  10
  11         window.addEventListener('keyup', event => {
  12             if (event.key === 'Escape') {
  13                 this.hide();
  14             }
  15         });
  16
  17         let closeButtons = elem.querySelectorAll('.popup-header-close');
  18         for (let i=0; i < closeButtons.length; i++) {
  19             closeButtons[i].addEventListener('click', this.hide.bind(this));
  20         }
  21     }
  22
  23     hide(onComplete = null) { this.toggle(false, onComplete); }
  24     show(onComplete = null) { this.toggle(true, onComplete); }
  25
  26     toggle(show = true, onComplete) {
  27         if (show) {
  28             fadeIn(this.container, 240, onComplete);
  29         } else {
  30             fadeOut(this.container, 240, onComplete);
  31         }
  32     }
  33
  34     focusOnBody() {
  35         const body = this.container.querySelector('.popup-body');
  36         if (body) {
  37             body.focus();
  38         }
  39     }
  40
  41 }
  42
  43 export default Overlay;