Updated styles to use logical properties/values

[bookstack] / resources / js / services / code.js

diff --git a/resources/js/services/code.js b/resources/js/services/code.js
index 93c3e431f4f5baf7482c898539599f4f8ad2e3e8..14801de9c9aaec93cf89d8955c36d947ff2a68bb 100644 (file)
--- a/resources/js/services/code.js
+++ b/resources/js/services/code.js
@@ -5,15 +5,18 @@ import Clipboard from "clipboard/dist/clipboard.min";
 import 'codemirror/mode/css/css';
 import 'codemirror/mode/clike/clike';
 import 'codemirror/mode/diff/diff';
 import 'codemirror/mode/css/css';
 import 'codemirror/mode/clike/clike';
 import 'codemirror/mode/diff/diff';

+import 'codemirror/mode/fortran/fortran';

 import 'codemirror/mode/go/go';
 import 'codemirror/mode/go/go';

+import 'codemirror/mode/haskell/haskell';

 import 'codemirror/mode/htmlmixed/htmlmixed';
 import 'codemirror/mode/javascript/javascript';
 import 'codemirror/mode/julia/julia';
 import 'codemirror/mode/lua/lua';
 import 'codemirror/mode/htmlmixed/htmlmixed';
 import 'codemirror/mode/javascript/javascript';
 import 'codemirror/mode/julia/julia';
 import 'codemirror/mode/lua/lua';

-import 'codemirror/mode/haskell/haskell';

 import 'codemirror/mode/markdown/markdown';
 import 'codemirror/mode/mllike/mllike';
 import 'codemirror/mode/nginx/nginx';
 import 'codemirror/mode/markdown/markdown';
 import 'codemirror/mode/mllike/mllike';
 import 'codemirror/mode/nginx/nginx';

+import 'codemirror/mode/perl/perl';
+import 'codemirror/mode/pascal/pascal';

 import 'codemirror/mode/php/php';
 import 'codemirror/mode/powershell/powershell';
 import 'codemirror/mode/properties/properties';
 import 'codemirror/mode/php/php';
 import 'codemirror/mode/powershell/powershell';
 import 'codemirror/mode/properties/properties';


@@ -42,6 +45,8 @@ const modeMap = {
     'c#': 'text/x-csharp',
     csharp: 'text/x-csharp',
     diff: 'diff',
     'c#': 'text/x-csharp',
     csharp: 'text/x-csharp',
     diff: 'diff',

+    for: 'fortran',
+    fortran: 'fortran',

     go: 'go',
     haskell: 'haskell',
     hs: 'haskell',
     go: 'go',
     haskell: 'haskell',
     hs: 'haskell',


@@ -58,9 +63,13 @@ const modeMap = {
     markdown: 'markdown',
     ml: 'mllike',
     nginx: 'nginx',
     markdown: 'markdown',
     ml: 'mllike',
     nginx: 'nginx',

+    perl: 'perl',
+    pl: 'perl',

     powershell: 'powershell',
     properties: 'properties',
     ocaml: 'mllike',
     powershell: 'powershell',
     properties: 'properties',
     ocaml: 'mllike',

+    pascal: 'text/x-pascal',
+    pas: 'text/x-pascal',

     php: (content) => {
         return content.includes('<?php') ? 'php' : 'text/x-php';
     },
     php: (content) => {
         return content.includes('<?php') ? 'php' : 'text/x-php';
     },


@@ -84,9 +93,20 @@ const modeMap = {
  * Highlight pre elements on a page
  */
 function highlight() {
  * Highlight pre elements on a page
  */
 function highlight() {

-    let codeBlocks = document.querySelectorAll('.page-content pre, .comment-box .content pre');
-    for (let i = 0; i < codeBlocks.length; i++) {
-        highlightElem(codeBlocks[i]);
+    const codeBlocks = document.querySelectorAll('.page-content pre, .comment-box .content pre');
+    for (const codeBlock of codeBlocks) {
+        highlightElem(codeBlock);
+    }
+}
+
+/**
+ * Highlight all code blocks within the given parent element
+ * @param {HTMLElement} parent
+ */
+function highlightWithin(parent) {
+    const codeBlocks = parent.querySelectorAll('pre');
+    for (const codeBlock of codeBlocks) {
+        highlightElem(codeBlock);

     }
 }
 
     }
 }
 


@@ -97,7 +117,7 @@ function highlight() {
 function highlightElem(elem) {
     const innerCodeElem = elem.querySelector('code[class^=language-]');
     elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
 function highlightElem(elem) {
     const innerCodeElem = elem.querySelector('code[class^=language-]');
     elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');

-    const content = elem.textContent;
+    const content = elem.textContent.trimEnd();

 
     let mode = '';
     if (innerCodeElem !== null) {
 
     let mode = '';
     if (innerCodeElem !== null) {


@@ -171,7 +191,7 @@ function getMode(suggestion, content) {
  * @returns {*|string}
  */
 function getTheme() {
  * @returns {*|string}
  */
 function getTheme() {

-    return window.codeTheme || 'base16-light';
+    return window.codeTheme || 'default';

 }
 
 /**
 }
 
 /**


@@ -305,6 +325,7 @@ function getMetaKey() {
 
 export default {
     highlight: highlight,
 
 export default {
     highlight: highlight,

+    highlightWithin: highlightWithin,

     wysiwygView: wysiwygView,
     popupEditor: popupEditor,
     setMode: setMode,
     wysiwygView: wysiwygView,
     popupEditor: popupEditor,
     setMode: setMode,