From: Dan Brown <redacted>
Date: Fri, 27 Dec 2019 17:03:10 +0000 (+0000)
Subject: Merge branch 'master' of git://github.com/albergoniSivaf/BookStack into albergoniSiva... 
X-Git-Tag: v0.28.0~1^2~16^2~1
X-Git-Url: http://source.bookstackapp.com/bookstack/commitdiff_plain/891dbfe0853775c27039587bedf3bded9964d2f1?ds=inline;hp=-c

Merge branch 'master' of git://github.com/albergoniSivaf/BookStack into albergoniSivaf-master
---

891dbfe0853775c27039587bedf3bded9964d2f1
diff --combined resources/js/services/code.js
index 93c3e431f,fe8da7773..8e517dde4
--- a/resources/js/services/code.js
+++ b/resources/js/services/code.js
@@@ -16,7 -16,6 +16,7 @@@ import 'codemirror/mode/mllike/mllike'
  import 'codemirror/mode/nginx/nginx';
  import 'codemirror/mode/php/php';
  import 'codemirror/mode/powershell/powershell';
 +import 'codemirror/mode/properties/properties';
  import 'codemirror/mode/python/python';
  import 'codemirror/mode/ruby/ruby';
  import 'codemirror/mode/rust/rust';
@@@ -25,13 -24,11 +25,14 @@@ import 'codemirror/mode/sql/sql'
  import 'codemirror/mode/toml/toml';
  import 'codemirror/mode/xml/xml';
  import 'codemirror/mode/yaml/yaml';
+ import 'codemirror/mode/pascal/pascal'
  
  // Addons
  import 'codemirror/addon/scroll/scrollpastend';
  
 +// Mapping of possible languages or formats from user input to their codemirror modes.
 +// Value can be a mode string or a function that will receive the code content & return the mode string.
 +// The function option is used in the event the exact mode could be dynamic depending on the code.
  const modeMap = {
      css: 'css',
      c: 'text/x-csrc',
@@@ -46,7 -43,6 +47,7 @@@
      haskell: 'haskell',
      hs: 'haskell',
      html: 'htmlmixed',
 +    ini: 'properties',
      javascript: 'javascript',
      json: {name: 'javascript', json: true},
      js: 'javascript',
@@@ -59,11 -55,8 +60,11 @@@
      ml: 'mllike',
      nginx: 'nginx',
      powershell: 'powershell',
 +    properties: 'properties',
      ocaml: 'mllike',
 -    php: 'php',
 +    php: (content) => {
 +        return content.includes('<?php') ? 'php' : 'text/x-php';
 +    },
      py: 'python',
      python: 'python',
      ruby: 'ruby',
@@@ -78,6 -71,7 +79,7 @@@
      xml: 'xml',
      yaml: 'yaml',
      yml: 'yaml',
+     pascal: 'text/x-pascal',
  };
  
  /**
@@@ -95,23 -89,21 +97,23 @@@ function highlight() 
   * @param {HTMLElement} elem
   */
  function highlightElem(elem) {
 -    let innerCodeElem = elem.querySelector('code[class^=language-]');
 +    const innerCodeElem = elem.querySelector('code[class^=language-]');
 +    elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
 +    const content = elem.textContent;
 +
      let mode = '';
      if (innerCodeElem !== null) {
 -        let langName = innerCodeElem.className.replace('language-', '');
 -        mode = getMode(langName);
 +        const langName = innerCodeElem.className.replace('language-', '');
 +        mode = getMode(langName, content);
      }
 -    elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
 -    let content = elem.textContent.trim();
  
 -    let cm = CodeMirror(function(elt) {
 +    const cm = CodeMirror(function(elt) {
          elem.parentNode.replaceChild(elt, elem);
      }, {
          value: content,
          mode:  mode,
          lineNumbers: true,
 +        lineWrapping: false,
          theme: getTheme(),
          readOnly: true
      });
@@@ -146,24 -138,12 +148,24 @@@ function addCopyIcon(cmInstance) 
  
  /**
   * Search for a codemirror code based off a user suggestion
 - * @param suggestion
 + * @param {String} suggestion
 + * @param {String} content
   * @returns {string}
   */
 -function getMode(suggestion) {
 +function getMode(suggestion, content) {
      suggestion = suggestion.trim().replace(/^\./g, '').toLowerCase();
 -    return (typeof modeMap[suggestion] !== 'undefined') ? modeMap[suggestion] : '';
 +
 +    const modeMapType = typeof modeMap[suggestion];
 +
 +    if (modeMapType === 'undefined') {
 +        return '';
 +    }
 +
 +    if (modeMapType === 'function') {
 +        return modeMap[suggestion](content);
 +    }
 +
 +    return modeMap[suggestion];
  }
  
  /**
@@@ -181,8 -161,8 +183,8 @@@ function getTheme() 
   * @returns {{wrap: Element, editor: *}}
   */
  function wysiwygView(elem) {
 -    let doc = elem.ownerDocument;
 -    let codeElem = elem.querySelector('code');
 +    const doc = elem.ownerDocument;
 +    const codeElem = elem.querySelector('code');
  
      let lang = (elem.className || '').replace('language-', '');
      if (lang === '' && codeElem) {
@@@ -190,9 -170,9 +192,9 @@@
      }
  
      elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
 -    let content = elem.textContent;
 -    let newWrap = doc.createElement('div');
 -    let newTextArea = doc.createElement('textarea');
 +    const content = elem.textContent;
 +    const newWrap = doc.createElement('div');
 +    const newTextArea = doc.createElement('textarea');
  
      newWrap.className = 'CodeMirrorContainer';
      newWrap.setAttribute('data-lang', lang);
@@@ -208,9 -188,8 +210,9 @@@
          newWrap.appendChild(elt);
      }, {
          value: content,
 -        mode:  getMode(lang),
 +        mode:  getMode(lang, content),
          lineNumbers: true,
 +        lineWrapping: false,
          theme: getTheme(),
          readOnly: true
      });
@@@ -227,17 -206,17 +229,17 @@@
   * @returns {*}
   */
  function popupEditor(elem, modeSuggestion) {
 -    let content = elem.textContent;
 +    const content = elem.textContent;
  
      return CodeMirror(function(elt) {
          elem.parentNode.insertBefore(elt, elem);
          elem.style.display = 'none';
      }, {
          value: content,
 -        mode:  getMode(modeSuggestion),
 +        mode:  getMode(modeSuggestion, content),
          lineNumbers: true,
 -        theme: getTheme(),
 -        lineWrapping: true
 +        lineWrapping: false,
 +        theme: getTheme()
      });
  }
  
@@@ -246,8 -225,8 +248,8 @@@
   * @param cmInstance
   * @param modeSuggestion
   */
 -function setMode(cmInstance, modeSuggestion) {
 -      cmInstance.setOption('mode', getMode(modeSuggestion));
 +function setMode(cmInstance, modeSuggestion, content) {
 +      cmInstance.setOption('mode', getMode(modeSuggestion, content));
  }
  
  /**
@@@ -258,40 -237,29 +260,40 @@@
  function setContent(cmInstance, codeContent) {
      cmInstance.setValue(codeContent);
      setTimeout(() => {
 -        cmInstance.refresh();
 +        updateLayout(cmInstance);
      }, 10);
  }
  
  /**
 - * Get a CodeMirror instace to use for the markdown editor.
 + * Update the layout (codemirror refresh) of a cm instance.
 + * @param cmInstance
 + */
 +function updateLayout(cmInstance) {
 +    cmInstance.refresh();
 +}
 +
 +/**
 + * Get a CodeMirror instance to use for the markdown editor.
   * @param {HTMLElement} elem
   * @returns {*}
   */
  function markdownEditor(elem) {
 -    let content = elem.textContent;
 -
 -    return CodeMirror(function (elt) {
 -        elem.parentNode.insertBefore(elt, elem);
 -        elem.style.display = 'none';
 -    }, {
 +    const content = elem.textContent;
 +    const config = {
          value: content,
          mode: "markdown",
          lineNumbers: true,
 -        theme: getTheme(),
          lineWrapping: true,
 +        theme: getTheme(),
          scrollPastEnd: true,
 -    });
 +    };
 +
 +    window.$events.emitPublic(elem, 'editor-markdown-cm::pre-init', {config});
 +
 +    return CodeMirror(function (elt) {
 +        elem.parentNode.insertBefore(elt, elem);
 +        elem.style.display = 'none';
 +    }, config);
  }
  
  /**
@@@ -309,7 -277,6 +311,7 @@@ export default 
      popupEditor: popupEditor,
      setMode: setMode,
      setContent: setContent,
 +    updateLayout: updateLayout,
      markdownEditor: markdownEditor,
      getMetaKey: getMetaKey,
  };
diff --combined resources/views/components/code-editor.blade.php
index f8377b120,869651a5c..eac5ce165
--- a/resources/views/components/code-editor.blade.php
+++ b/resources/views/components/code-editor.blade.php
@@@ -18,7 -18,6 +18,7 @@@
                              <a @click="updateLanguage('C#')">C#</a>
                              <a @click="updateLanguage('Go')">Go</a>
                              <a @click="updateLanguage('HTML')">HTML</a>
 +                            <a @click="updateLanguage('INI')">INI</a>
                              <a @click="updateLanguage('Java')">Java</a>
                              <a @click="updateLanguage('JavaScript')">JavaScript</a>
                              <a @click="updateLanguage('JSON')">JSON</a>
@@@ -33,6 -32,7 +33,7 @@@
                              <a @click="updateLanguage('SQL')">SQL</a>
                              <a @click="updateLanguage('XML')">XML</a>
                              <a @click="updateLanguage('YAML')">YAML</a>
+                             <a @click="updateLanguage('PASCAL')">Pascal</a>
                          </small>
                      </div>
                      <input @keypress.enter="save()" id="code-editor-language" type="text" @input="updateEditorMode(language)" v-model="language">