You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
99 lines
2.6 KiB
99 lines
2.6 KiB
3 years ago
|
import attachTribute from '../tribute.js';
|
||
|
|
||
3 years ago
|
/**
|
||
|
* create an EasyMDE editor for comment
|
||
|
* @param textarea jQuery or HTMLElement
|
||
|
* @returns {null|EasyMDE}
|
||
|
*/
|
||
|
export function createCommentEasyMDE(textarea) {
|
||
|
if (textarea instanceof jQuery) {
|
||
|
textarea = textarea[0];
|
||
|
}
|
||
|
if (!textarea) {
|
||
3 years ago
|
return null;
|
||
|
}
|
||
|
|
||
3 years ago
|
const easyMDE = new window.EasyMDE({
|
||
3 years ago
|
autoDownloadFontAwesome: false,
|
||
3 years ago
|
element: textarea,
|
||
3 years ago
|
forceSync: true,
|
||
|
renderingConfig: {
|
||
|
singleLineBreaks: false
|
||
|
},
|
||
|
indentWithTabs: false,
|
||
|
tabSize: 4,
|
||
|
spellChecker: false,
|
||
|
toolbar: ['bold', 'italic', 'strikethrough', '|',
|
||
|
'heading-1', 'heading-2', 'heading-3', 'heading-bigger', 'heading-smaller', '|',
|
||
|
'code', 'quote', '|', {
|
||
|
name: 'checkbox-empty',
|
||
|
action(e) {
|
||
|
const cm = e.codemirror;
|
||
|
cm.replaceSelection(`\n- [ ] ${cm.getSelection()}`);
|
||
|
cm.focus();
|
||
|
},
|
||
|
className: 'fa fa-square-o',
|
||
|
title: 'Add Checkbox (empty)',
|
||
|
},
|
||
|
{
|
||
|
name: 'checkbox-checked',
|
||
|
action(e) {
|
||
|
const cm = e.codemirror;
|
||
|
cm.replaceSelection(`\n- [x] ${cm.getSelection()}`);
|
||
|
cm.focus();
|
||
|
},
|
||
|
className: 'fa fa-check-square-o',
|
||
|
title: 'Add Checkbox (checked)',
|
||
|
}, '|',
|
||
|
'unordered-list', 'ordered-list', '|',
|
||
|
'link', 'image', 'table', 'horizontal-rule', '|',
|
||
|
'clean-block', '|',
|
||
|
{
|
||
|
name: 'revert-to-textarea',
|
||
|
action(e) {
|
||
|
e.toTextArea();
|
||
|
},
|
||
|
className: 'fa fa-file',
|
||
|
title: 'Revert to simple textarea',
|
||
|
},
|
||
|
]
|
||
|
});
|
||
3 years ago
|
const inputField = easyMDE.codemirror.getInputField();
|
||
|
inputField.classList.add('js-quick-submit');
|
||
|
easyMDE.codemirror.setOption('extraKeys', {
|
||
3 years ago
|
Enter: () => {
|
||
|
const tributeContainer = document.querySelector('.tribute-container');
|
||
|
if (!tributeContainer || tributeContainer.style.display === 'none') {
|
||
|
return CodeMirror.Pass;
|
||
|
}
|
||
|
},
|
||
|
Backspace: (cm) => {
|
||
|
if (cm.getInputField().trigger) {
|
||
|
cm.getInputField().trigger('input');
|
||
|
}
|
||
|
cm.execCommand('delCharBefore');
|
||
|
}
|
||
|
});
|
||
3 years ago
|
attachTribute(inputField, {mentions: true, emoji: true});
|
||
|
|
||
|
// TODO: that's the only way we can do now to attach the EasyMDE object to a HTMLElement
|
||
|
inputField._data_easyMDE = easyMDE;
|
||
|
textarea._data_easyMDE = easyMDE;
|
||
|
return easyMDE;
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* get the attached EasyMDE editor created by createCommentEasyMDE
|
||
|
* @param el jQuery or HTMLElement
|
||
|
* @returns {null|EasyMDE}
|
||
|
*/
|
||
|
export function getAttachedEasyMDE(el) {
|
||
|
if (el instanceof jQuery) {
|
||
|
el = el[0];
|
||
|
}
|
||
|
if (!el) {
|
||
|
return null;
|
||
|
}
|
||
|
return el._data_easyMDE;
|
||
3 years ago
|
}
|