BookStack Code Mirror - website/blob - themes/bookstack/static/js/script.js

   1
   2 // Mobile menu
   3
   4 const menuButton = document.getElementById('menu-button');
   5 const menuDropDown = document.querySelector('#header .main-nav');
   6
   7 menuButton.addEventListener('click', function(event) {
   8   menuDropDown.classList.toggle('showing');
   9   event.stopPropagation();
  10 });
  11
  12 document.body.addEventListener('click', function(event) {
  13   menuDropDown.classList.remove('showing');
  14   event.stopPropagation();
  15 });
  16
  17
  18 // Handle video click to play
  19 const videos = document.querySelectorAll('video');
  20 for (let i = 0; i < videos.length; i++) {
  21     videos[i].addEventListener('click', videoClick)
  22 }
  23
  24 function videoClick() {
  25     if (typeof InstallTrigger !== 'undefined') return;
  26     this.paused ? this.play() : this.pause();
  27 }
  28
  29
  30 // Codemirror Setup
  31
  32 const modeMap = {
  33   'language-html': 'htmlmixed',
  34   'language-bash': 'shell',
  35   'language-js': 'javascript',
  36   'language-shell': 'bash',
  37   'language-nginx': 'nginx',
  38   'language-apache': 'apache',
  39   'language-php': 'php',
  40   'language-sql': 'text/x-mysql',
  41 };
  42
  43 const codeBlocks = document.querySelectorAll('pre');
  44 for (let i = 0; i < codeBlocks.length; i++) {
  45   const block = codeBlocks[i];
  46   const codeElem = block.querySelector('code');
  47   if (codeElem === null) continue;
  48
  49   const langClass = codeElem.className;
  50   const mode = (typeof modeMap[langClass] !== 'undefined') ? modeMap[langClass] : 'htmlmixed';
  51   const content = codeElem.textContent.trim();
  52   CodeMirror(function(cmElem) {
  53     block.parentNode.replaceChild(cmElem, block);
  54   }, {
  55     theme: 'base16-light',
  56     lineNumbers: true,
  57     mode: mode,
  58     readOnly: true,
  59     value: content
  60   });
  61 }
  62
  63 // Header double click URL reference
  64 document.body.addEventListener('dblclick', event => {
  65   const isHeader = event.target.matches('h1, h2, h3, h4, h5, h6');
  66   if (isHeader && event.target.id) {
  67     window.location.hash = event.target.id;
  68   }
  69 });