foster/forgejo
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2024-11-25 08:59:31 -05:00
Code Issues Wiki Activity

Add SimpleMDE and Fix Image Paste for Issue/Comment Editor (#9197)

Browse source 
* update #9132 and #8834 - add SimpleMDE for issue and fix image paste for comment editor

* attache tribute to simplemde

* update #9197 force simplemde file input event when backspace press
This commit is contained in:
Benno 2019-12-16 23:56:35 +08:00 committed by Lunny Xiao
parent 61db834904
commit 121977c36f
2 changed files with 59 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
routers/repo/issue.go
View file

@ -673,6 +673,7 @@ func ViewIssue(ctx *context.Context) {
ctx.Data["RequireHighlightJS"] = true
ctx.Data["RequireDropzone"] = true
ctx.Data["RequireTribute"] = true
ctx.Data["RequireSimpleMDE"] = true
renderAttachmentSettings(ctx)
if err = issue.LoadAttributes(); err != nil {

59
web_src/js/index.js
View file

@ -14,6 +14,7 @@ let csrf;
let suburl;
let previewFileModes;
let simpleMDEditor;
const commentMDEditors = {};
let codeMirrorEditor;
// Disable Dropzone auto-discover because it's manually initialized
@ -304,11 +305,27 @@ function initImagePaste(target) {
});
}
function initSimpleMDEImagePaste(simplemde, files) {
simplemde.codemirror.on('paste', (_, event) => {
retrieveImageFromClipboardAsBlob(event, (img) => {
const name = img.name.substr(0, img.name.lastIndexOf('.'));
uploadFile(img, (res) => {
const data = JSON.parse(res);
const pos = simplemde.codemirror.getCursor();
simplemde.codemirror.replaceRange(`![${name}](${suburl}/attachments/${data.uuid})`, pos);
const input = $(`<input id="${data.uuid}" name="files" type="hidden">`).val(data.uuid);
files.append(input);
});
});
});
}
function initCommentForm() {
if ($('.comment.form').length === 0) {
return;
}
setCommentSimpleMDE($('.comment.form textarea'));
initBranchSelector();
initCommentPreviewTab($('.comment.form'));
initImagePaste($('.comment.form textarea'));
@ -836,6 +853,7 @@ function initRepository() {
const $renderContent = $segment.find('.render-content');
const $rawContent = $segment.find('.raw-content');
let $textarea;
let $simplemde;
// Setup new form
if ($editContentZone.html().length === 0) {
@ -920,8 +938,10 @@ function initRepository() {
$tabMenu.find('.preview.item').attr('data-tab', $editContentZone.data('preview'));
$editContentForm.find('.write.segment').attr('data-tab', $editContentZone.data('write'));
$editContentForm.find('.preview.segment').attr('data-tab', $editContentZone.data('preview'));
$simplemde = setCommentSimpleMDE($textarea);
commentMDEditors[$editContentZone.data('write')] = $simplemde;
initCommentPreviewTab($editContentForm);
initSimpleMDEImagePaste($simplemde, $files);
$editContentZone.find('.cancel.button').click(() => {
$renderContent.show();
@ -968,6 +988,7 @@ function initRepository() {
});
} else {
$textarea = $segment.find('textarea');
$simplemde = commentMDEditors[$editContentZone.data('write')];
}
// Show write/preview tab and copy raw content as needed
@ -975,8 +996,10 @@ function initRepository() {
$renderContent.hide();
if ($textarea.val().length === 0) {
$textarea.val($rawContent.text());
$simplemde.value($rawContent.text());
}
$textarea.focus();
$simplemde.codemirror.focus();
event.preventDefault();
});
@ -1442,6 +1465,40 @@ function setSimpleMDE($editArea) {
return true;
}
function setCommentSimpleMDE($editArea) {
const simplemde = new SimpleMDE({
autoDownloadFontAwesome: false,
element: $editArea[0],
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', '|',
'unordered-list', 'ordered-list', '|',
'link', 'image', 'table', 'horizontal-rule', '|',
'clean-block']
});
simplemde.codemirror.setOption('extraKeys', {
Enter: () => {
if (!(issuesTribute.isActive || emojiTribute.isActive)) {
return CodeMirror.Pass;
}
},
Backspace: (cm) => {
cm.getInputField().trigger('input');
cm.execCommand('delCharBefore');
}
});
issuesTribute.attach(simplemde.codemirror.getInputField());
emojiTribute.attach(simplemde.codemirror.getInputField());
return simplemde;
}
function setCodeMirror($editArea) {
if (simpleMDEditor) {
simpleMDEditor.toTextArea();