import 'codemirror/mode/markdown/markdown';
import 'codemirror/mode/mllike/mllike';
import 'codemirror/mode/nginx/nginx';
+import 'codemirror/mode/octave/octave';
import 'codemirror/mode/perl/perl';
import 'codemirror/mode/pascal/pascal';
import 'codemirror/mode/php/php';
import 'codemirror/mode/rust/rust';
import 'codemirror/mode/shell/shell';
import 'codemirror/mode/sql/sql';
+import 'codemirror/mode/stex/stex';
import 'codemirror/mode/toml/toml';
import 'codemirror/mode/vb/vb';
import 'codemirror/mode/vbscript/vbscript';
// 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 = {
+ bash: 'shell',
css: 'css',
c: 'text/x-csrc',
java: 'text/x-java',
diff: 'diff',
for: 'fortran',
fortran: 'fortran',
+ 'f#': 'text/x-fsharp',
+ fsharp: 'text/x-fsharp',
go: 'go',
haskell: 'haskell',
hs: 'haskell',
html: 'htmlmixed',
ini: 'properties',
- javascript: 'javascript',
- json: {name: 'javascript', json: true},
- js: 'javascript',
- jl: 'julia',
- julia: 'julia',
+ javascript: 'text/javascript',
+ json: 'application/json',
+ js: 'text/javascript',
+ jl: 'text/x-julia',
+ julia: 'text/x-julia',
+ latex: 'text/x-stex',
lua: 'lua',
+ matlab: 'text/x-octave',
md: 'markdown',
mdown: 'markdown',
markdown: 'markdown',
ml: 'mllike',
nginx: 'nginx',
+ octave: 'text/x-octave',
perl: 'perl',
pl: 'perl',
powershell: 'powershell',
properties: 'properties',
- ocaml: 'mllike',
+ ocaml: 'text/x-ocaml',
pascal: 'text/x-pascal',
pas: 'text/x-pascal',
php: (content) => {
rs: 'rust',
shell: 'shell',
sh: 'shell',
- bash: 'shell',
+ stext: 'text/x-stex',
toml: 'toml',
+ ts: 'text/typescript',
+ typescript: 'text/typescript',
sql: 'text/x-sql',
vbs: 'vbscript',
vbscript: 'vbscript',
/**
* Create a CodeMirror instance for showing inside the WYSIWYG editor.
* Manages a textarea element to hold code content.
- * @param {HTMLElement} elem
+ * @param {HTMLElement} cmContainer
+ * @param {String} content
+ * @param {String} language
* @returns {{wrap: Element, editor: *}}
*/
-export function wysiwygView(elem) {
- const doc = elem.ownerDocument;
- const codeElem = elem.querySelector('code');
-
- let lang = getLanguageFromCssClasses(elem.className || '');
- if (!lang && codeElem) {
- lang = getLanguageFromCssClasses(codeElem.className || '');
- }
-
- elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
- const content = elem.textContent;
- const newWrap = doc.createElement('div');
- const newTextArea = doc.createElement('textarea');
-
- newWrap.className = 'CodeMirrorContainer';
- newWrap.setAttribute('data-lang', lang);
- newWrap.setAttribute('dir', 'ltr');
- newTextArea.style.display = 'none';
- elem.parentNode.replaceChild(newWrap, elem);
-
- newWrap.appendChild(newTextArea);
- newWrap.contentEditable = 'false';
- newTextArea.textContent = content;
-
- let cm = CodeMirror(function(elt) {
- newWrap.appendChild(elt);
- }, {
+export function wysiwygView(cmContainer, content, language) {
+ return CodeMirror(cmContainer, {
value: content,
- mode: getMode(lang, content),
+ mode: getMode(language, content),
lineNumbers: true,
lineWrapping: false,
theme: getTheme(),
readOnly: true
});
-
- return {wrap: newWrap, editor: cm};
}
-/**
- * Get the code language from the given css classes.
- * @param {String} classes
- * @return {String}
- */
-function getLanguageFromCssClasses(classes) {
- const langClasses = classes.split(' ').filter(cssClass => cssClass.startsWith('language-'));
- return (langClasses[0] || '').replace('language-', '');
-}
/**
* Create a CodeMirror instance to show in the WYSIWYG pop-up editor
});
}
+/**
+ * Create an inline editor to replace the given textarea.
+ * @param {HTMLTextAreaElement} textArea
+ * @param {String} mode
+ * @returns {CodeMirror3}
+ */
+export function inlineEditor(textArea, mode) {
+ return CodeMirror.fromTextArea(textArea, {
+ mode: getMode(mode, textArea.value),
+ lineNumbers: true,
+ lineWrapping: false,
+ theme: getTheme(),
+ });
+}
+
/**
* Set the mode of a codemirror instance.
* @param cmInstance