1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-06-13 00:41:59 +03:00

Started tinymce code editor components

This commit is contained in:
Dan Brown
2017-06-17 15:07:55 +01:00
parent 2060cdb931
commit c8be214ee0
2 changed files with 157 additions and 23 deletions

View File

@ -52,31 +52,91 @@ const modeMap = {
module.exports.highlight = function() {
let codeBlocks = document.querySelectorAll('.page-content pre');
for (let i = 0; i < codeBlocks.length; i++) {
let innerCodeElem = codeBlocks[i].querySelector('code[class^=language-]');
let mode = '';
if (innerCodeElem !== null) {
let langName = innerCodeElem.className.replace('language-', '');
if (typeof modeMap[langName] !== 'undefined') mode = modeMap[langName];
}
codeBlocks[i].innerHTML = codeBlocks[i].innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
let content = codeBlocks[i].textContent;
console.log('MODE', mode);
CodeMirror(function(elt) {
codeBlocks[i].parentNode.replaceChild(elt, codeBlocks[i]);
}, {
value: content,
mode: mode,
lineNumbers: true,
theme: 'base16-light',
readOnly: true
});
highlightElem(codeBlocks[i]);
}
};
function highlightElem(elem) {
let innerCodeElem = elem.querySelector('code[class^=language-]');
let mode = '';
if (innerCodeElem !== null) {
let langName = innerCodeElem.className.replace('language-', '');
if (typeof modeMap[langName] !== 'undefined') mode = modeMap[langName];
}
elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
let content = elem.textContent;
CodeMirror(function(elt) {
elem.parentNode.replaceChild(elt, elem);
}, {
value: content,
mode: mode,
lineNumbers: true,
theme: 'base16-light',
readOnly: true
});
}
module.exports.highlightElem = highlightElem;
module.exports.wysiwygView = function(elem) {
let doc = elem.ownerDocument;
elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
let content = elem.textContent;
let newWrap = doc.createElement('div');
let newTextArea = doc.createElement('textarea');
newWrap.className = 'CodeMirrorContainer';
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);
}, {
value: content,
mode: '',
lineNumbers: true,
theme: 'base16-light',
readOnly: true
});
setTimeout(() => {
cm.refresh();
}, 300);
return newWrap;
};
// module.exports.wysiwygEditor = function(elem) {
// let doc = elem.ownerDocument;
// let newWrap = doc.createElement('div');
// newWrap.className = 'CodeMirrorContainer';
// let newTextArea = doc.createElement('textarea');
// newTextArea.style.display = 'none';
// elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
// let content = elem.textContent;
// elem.parentNode.replaceChild(newWrap, elem);
// newWrap.appendChild(newTextArea);
// let cm = CodeMirror(function(elt) {
// newWrap.appendChild(elt);
// }, {
// value: content,
// mode: '',
// lineNumbers: true,
// theme: 'base16-light',
// readOnly: true
// });
// cm.on('change', event => {
// newTextArea.innerText = cm.getValue();
// });
// setTimeout(() => {
// cm.refresh();
// }, 300);
// };
module.exports.markdownEditor = function(elem) {
let content = elem.textContent;