]> BookStack Code Mirror - bookstack/blobdiff - resources/js/code/index.mjs
Update UserPreferencesTest.php
[bookstack] / resources / js / code / index.mjs
index 450592c25eaa15d0dc9e9f455ce50e72ad080842..e51472dc4ce740f0bad2304db6d4e1fd0d5604d8 100644 (file)
@@ -6,24 +6,36 @@ import {createView} from './views';
 import {SimpleEditorInterface} from './simple-editor-interface';
 
 /**
- * Highlight pre elements on a page
+ * Add a button to a CodeMirror instance which copies the contents to the clipboard upon click.
+ * @param {EditorView} editorView
  */
-export function highlight() {
-    const codeBlocks = document.querySelectorAll('.page-content pre, .comment-box .content pre');
-    for (const codeBlock of codeBlocks) {
-        highlightElem(codeBlock);
-    }
-}
+function addCopyIcon(editorView) {
+    const copyIcon = '<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>';
+    const checkIcon = '<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>';
+    const copyButton = document.createElement('button');
+    copyButton.setAttribute('type', 'button');
+    copyButton.classList.add('cm-copy-button');
+    copyButton.innerHTML = copyIcon;
+    editorView.dom.appendChild(copyButton);
 
-/**
- * Highlight all code blocks within the given parent element
- * @param {HTMLElement} parent
- */
-export function highlightWithin(parent) {
-    const codeBlocks = parent.querySelectorAll('pre');
-    for (const codeBlock of codeBlocks) {
-        highlightElem(codeBlock);
-    }
+    const notifyTime = 620;
+    const transitionTime = 60;
+    copyButton.addEventListener('click', () => {
+        copyTextToClipboard(editorView.state.doc.toString());
+        copyButton.classList.add('success');
+
+        setTimeout(() => {
+            copyButton.innerHTML = checkIcon;
+        }, transitionTime / 2);
+
+        setTimeout(() => {
+            copyButton.classList.remove('success');
+        }, notifyTime);
+
+        setTimeout(() => {
+            copyButton.innerHTML = copyIcon;
+        }, notifyTime + (transitionTime / 2));
+    });
 }
 
 /**
@@ -32,7 +44,7 @@ export function highlightWithin(parent) {
  */
 function highlightElem(elem) {
     const innerCodeElem = elem.querySelector('code[class^=language-]');
-    elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi, '\n');
+    elem.innerHTML = elem.innerHTML.replace(/<br\s*\/?>/gi, '\n');
     const content = elem.textContent.trimEnd();
 
     let langName = '';
@@ -57,36 +69,24 @@ function highlightElem(elem) {
 }
 
 /**
- * Add a button to a CodeMirror instance which copies the contents to the clipboard upon click.
- * @param {EditorView} editorView
+ * Highlight all code blocks within the given parent element
+ * @param {HTMLElement} parent
  */
-function addCopyIcon(editorView) {
-    const copyIcon = '<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>';
-    const checkIcon = '<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>';
-    const copyButton = document.createElement('button');
-    copyButton.setAttribute('type', 'button');
-    copyButton.classList.add('cm-copy-button');
-    copyButton.innerHTML = copyIcon;
-    editorView.dom.appendChild(copyButton);
-
-    const notifyTime = 620;
-    const transitionTime = 60;
-    copyButton.addEventListener('click', event => {
-        copyTextToClipboard(editorView.state.doc.toString());
-        copyButton.classList.add('success');
-
-        setTimeout(() => {
-            copyButton.innerHTML = checkIcon;
-        }, transitionTime / 2);
-
-        setTimeout(() => {
-            copyButton.classList.remove('success');
-        }, notifyTime);
+export function highlightWithin(parent) {
+    const codeBlocks = parent.querySelectorAll('pre');
+    for (const codeBlock of codeBlocks) {
+        highlightElem(codeBlock);
+    }
+}
 
-        setTimeout(() => {
-            copyButton.innerHTML = copyIcon;
-        }, notifyTime + (transitionTime / 2));
-    });
+/**
+ * Highlight pre elements on a page
+ */
+export function highlight() {
+    const codeBlocks = document.querySelectorAll('.page-content pre, .comment-box .content pre');
+    for (const codeBlock of codeBlocks) {
+        highlightElem(codeBlock);
+    }
 }
 
 /**