5cc0801de9
The first step of the plan * #23290 Thanks to @silverwind for the first try in #15394 . Close #10729 and a lot of related issues. The EasyMDE is not removed, now it works as a fallback, users can switch between these two editors. Editor list: * Issue / PR comment * Issue / PR comment edit * Issue / PR comment quote reply * PR diff view, inline comment * PR diff view, inline comment edit * PR diff view, inline comment quote reply * Release editor * Wiki editor Some editors have attached dropzone Screenshots: <details> ![image](https://user-images.githubusercontent.com/2114189/229363558-7e44dcd4-fb6d-48a0-92f8-bd12f57bb0a0.png) ![image](https://user-images.githubusercontent.com/2114189/229363566-781489c8-5306-4347-9714-d71af5d5b0b1.png) ![image](https://user-images.githubusercontent.com/2114189/229363771-1717bf5c-0f2a-4fc2-ba84-4f5b2a343a11.png) ![image](https://user-images.githubusercontent.com/2114189/229363793-ad362d0f-a045-47bd-8f9d-05a9a842bb39.png) </details> --------- Co-authored-by: silverwind <me@silverwind.io>
71 lines
2.4 KiB
JavaScript
71 lines
2.4 KiB
JavaScript
import $ from 'jquery';
|
|
import {initMarkupContent} from '../markup/content.js';
|
|
import {validateTextareaNonEmpty, initComboMarkdownEditor} from './comp/ComboMarkdownEditor.js';
|
|
|
|
const {csrfToken} = window.config;
|
|
|
|
async function initRepoWikiFormEditor() {
|
|
const $editArea = $('.repository.wiki .combo-markdown-editor textarea');
|
|
if (!$editArea.length) return;
|
|
|
|
const $form = $('.repository.wiki.new .ui.form');
|
|
const $editorContainer = $form.find('.combo-markdown-editor');
|
|
let editor;
|
|
|
|
let renderRequesting = false;
|
|
let lastContent;
|
|
const renderEasyMDEPreview = function () {
|
|
if (renderRequesting) return;
|
|
|
|
const $previewFull = $editorContainer.find('.EasyMDEContainer .editor-preview-active');
|
|
const $previewSide = $editorContainer.find('.EasyMDEContainer .editor-preview-active-side');
|
|
const $previewTarget = $previewSide.length ? $previewSide : $previewFull;
|
|
const newContent = $editArea.val();
|
|
if (editor && $previewTarget.length && lastContent !== newContent) {
|
|
renderRequesting = true;
|
|
$.post(editor.previewUrl, {
|
|
_csrf: csrfToken,
|
|
mode: editor.previewMode,
|
|
context: editor.previewContext,
|
|
text: newContent,
|
|
wiki: editor.previewWiki,
|
|
}).done((data) => {
|
|
lastContent = newContent;
|
|
$previewTarget.html(`<div class="markup ui segment">${data}</div>`);
|
|
initMarkupContent();
|
|
}).always(() => {
|
|
renderRequesting = false;
|
|
setTimeout(renderEasyMDEPreview, 1000);
|
|
});
|
|
} else {
|
|
setTimeout(renderEasyMDEPreview, 1000);
|
|
}
|
|
};
|
|
renderEasyMDEPreview();
|
|
|
|
editor = await initComboMarkdownEditor($editorContainer, {
|
|
previewMode: 'gfm',
|
|
previewWiki: true,
|
|
easyMDEOptions: {
|
|
previewRender: (_content, previewTarget) => previewTarget.innerHTML, // disable builtin preview render
|
|
toolbar: ['bold', 'italic', 'strikethrough', '|',
|
|
'heading-1', 'heading-2', 'heading-3', 'heading-bigger', 'heading-smaller', '|',
|
|
'gitea-code-inline', 'code', 'quote', '|', 'gitea-checkbox-empty', 'gitea-checkbox-checked', '|',
|
|
'unordered-list', 'ordered-list', '|',
|
|
'link', 'image', 'table', 'horizontal-rule', '|',
|
|
'clean-block', 'preview', 'fullscreen', 'side-by-side', '|', 'gitea-switch-to-textarea'
|
|
],
|
|
},
|
|
});
|
|
|
|
$form.on('submit', () => {
|
|
if (!validateTextareaNonEmpty($editArea)) {
|
|
return false;
|
|
}
|
|
});
|
|
}
|
|
|
|
export function initRepoWikiForm() {
|
|
initRepoWikiFormEditor();
|
|
}
|