Skip to content

Commit 5f40044

Browse files
committed
fix merge
1 parent 6e895b5 commit 5f40044

File tree

3 files changed

+168
-171
lines changed

3 files changed

+168
-171
lines changed

web_src/js/features/comp/EasyMDE.js

+5-13
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,14 @@ function loadScript(url) {
1212
script.addEventListener('error', (e) => {
1313
reject(e.error);
1414
});
15-
document.body.appendChild(script);
1615
script.src = url;
16+
document.body.appendChild(script);
1717
});
1818
}
1919

20+
/**
21+
* @returns {EasyMDE}
22+
*/
2023
export async function importEasyMDE() {
2124
// for CodeMirror: the plugins should be loaded dynamically
2225
// https://github.com/codemirror/CodeMirror/issues/5484
@@ -109,7 +112,7 @@ export async function createCommentEasyMDE(textarea) {
109112
Enter: () => {
110113
const tributeContainer = document.querySelector('.tribute-container');
111114
if (!tributeContainer || tributeContainer.style.display === 'none') {
112-
return CodeMirror.Pass;
115+
return window.CodeMirror.Pass;
113116
}
114117
},
115118
Backspace: (cm) => {
@@ -156,17 +159,6 @@ export function getAttachedEasyMDE(el) {
156159
return el._data_easyMDE;
157160
}
158161

159-
function setAttachedEasyMDE(el, easyMDE) {
160-
if (el instanceof jQuery) {
161-
el = el[0];
162-
}
163-
if (!el) {
164-
return;
165-
}
166-
// TODO: that's the only way we can do now to attach the EasyMDE object to a HTMLElement
167-
el._data_easyMDE = easyMDE;
168-
}
169-
170162
/**
171163
* validate if the given EasyMDE textarea is is non-empty.
172164
* @param {jQuery} $textarea

web_src/js/features/repo-diff.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {initCompReactionSelector} from './comp/ReactionSelector.js';
22
import {initRepoIssueContentHistory} from './repo-issue-content.js';
3-
import {validateTextareaNonEmpty} from './comp/CommentEasyMDE.js';
3+
import {validateTextareaNonEmpty} from './comp/EasyMDE.js';
44
const {csrfToken} = window.config;
55

66
export function initRepoDiffReviewButton() {

web_src/js/features/repo-wiki.js

+162-157
Original file line numberDiff line numberDiff line change
@@ -1,186 +1,191 @@
11
import {initMarkupContent} from '../markup/content.js';
2-
import {attachEasyMDEToElements, validateTextareaNonEmpty} from './comp/CommentEasyMDE.js';
2+
import {attachEasyMDEToElements, importEasyMDE, validateTextareaNonEmpty} from './comp/EasyMDE.js';
33
import {initCompMarkupContentPreviewTab} from './comp/MarkupContentPreview.js';
44

55
const {csrfToken} = window.config;
66

7-
export function initRepoWikiForm() {
7+
async function initRepoWikiFormEditor() {
88
const $editArea = $('.repository.wiki textarea#edit_area');
9+
if (!$editArea.length) return;
10+
911
let sideBySideChanges = 0;
1012
let sideBySideTimeout = null;
1113
let hasEasyMDE = true;
1214

13-
if ($editArea.length > 0) {
14-
const $form = $('.repository.wiki.new .ui.form');
15-
const easyMDE = new window.EasyMDE({
16-
autoDownloadFontAwesome: false,
17-
element: $editArea[0],
18-
forceSync: true,
19-
previewRender(plainText, preview) { // Async method
20-
// FIXME: still send render request when return back to edit mode
21-
const render = function () {
22-
sideBySideChanges = 0;
15+
const $form = $('.repository.wiki.new .ui.form');
16+
const EasyMDE = await importEasyMDE();
17+
const easyMDE = new EasyMDE({
18+
autoDownloadFontAwesome: false,
19+
element: $editArea[0],
20+
forceSync: true,
21+
previewRender(plainText, preview) { // Async method
22+
// FIXME: still send render request when return back to edit mode
23+
const render = function () {
24+
sideBySideChanges = 0;
25+
if (sideBySideTimeout !== null) {
26+
clearTimeout(sideBySideTimeout);
27+
sideBySideTimeout = null;
28+
}
29+
$.post($editArea.data('url'), {
30+
_csrf: csrfToken,
31+
mode: 'gfm',
32+
context: $editArea.data('context'),
33+
text: plainText,
34+
wiki: true
35+
}, (data) => {
36+
preview.innerHTML = `<div class="markup ui segment">${data}</div>`;
37+
initMarkupContent();
38+
});
39+
};
40+
41+
setTimeout(() => {
42+
if (!easyMDE.isSideBySideActive()) {
43+
render();
44+
} else {
45+
// delay preview by keystroke counting
46+
sideBySideChanges++;
47+
if (sideBySideChanges > 10) {
48+
render();
49+
}
50+
// or delay preview by timeout
2351
if (sideBySideTimeout !== null) {
2452
clearTimeout(sideBySideTimeout);
2553
sideBySideTimeout = null;
2654
}
27-
$.post($editArea.data('url'), {
28-
_csrf: csrfToken,
29-
mode: 'gfm',
30-
context: $editArea.data('context'),
31-
text: plainText,
32-
wiki: true
33-
}, (data) => {
34-
preview.innerHTML = `<div class="markup ui segment">${data}</div>`;
35-
initMarkupContent();
36-
});
37-
};
38-
39-
setTimeout(() => {
40-
if (!easyMDE.isSideBySideActive()) {
41-
render();
42-
} else {
43-
// delay preview by keystroke counting
44-
sideBySideChanges++;
45-
if (sideBySideChanges > 10) {
46-
render();
47-
}
48-
// or delay preview by timeout
49-
if (sideBySideTimeout !== null) {
50-
clearTimeout(sideBySideTimeout);
51-
sideBySideTimeout = null;
52-
}
53-
sideBySideTimeout = setTimeout(render, 600);
54-
}
55-
}, 0);
56-
if (!easyMDE.isSideBySideActive()) {
57-
return 'Loading...';
55+
sideBySideTimeout = setTimeout(render, 600);
5856
}
59-
return preview.innerHTML;
60-
},
61-
renderingConfig: {
62-
singleLineBreaks: false
57+
}, 0);
58+
if (!easyMDE.isSideBySideActive()) {
59+
return 'Loading...';
60+
}
61+
return preview.innerHTML;
62+
},
63+
renderingConfig: {
64+
singleLineBreaks: false
65+
},
66+
indentWithTabs: false,
67+
tabSize: 4,
68+
spellChecker: false,
69+
toolbar: ['bold', 'italic', 'strikethrough', '|',
70+
'heading-1', 'heading-2', 'heading-3', 'heading-bigger', 'heading-smaller', '|',
71+
{
72+
name: 'code-inline',
73+
action(e) {
74+
const cm = e.codemirror;
75+
const selection = cm.getSelection();
76+
cm.replaceSelection(`\`${selection}\``);
77+
if (!selection) {
78+
const cursorPos = cm.getCursor();
79+
cm.setCursor(cursorPos.line, cursorPos.ch - 1);
80+
}
81+
cm.focus();
82+
},
83+
className: 'fa fa-angle-right',
84+
title: 'Add Inline Code',
85+
}, 'code', 'quote', '|', {
86+
name: 'checkbox-empty',
87+
action(e) {
88+
const cm = e.codemirror;
89+
cm.replaceSelection(`\n- [ ] ${cm.getSelection()}`);
90+
cm.focus();
91+
},
92+
className: 'fa fa-square-o',
93+
title: 'Add Checkbox (empty)',
6394
},
64-
indentWithTabs: false,
65-
tabSize: 4,
66-
spellChecker: false,
67-
toolbar: ['bold', 'italic', 'strikethrough', '|',
68-
'heading-1', 'heading-2', 'heading-3', 'heading-bigger', 'heading-smaller', '|',
69-
{
70-
name: 'code-inline',
71-
action(e) {
72-
const cm = e.codemirror;
73-
const selection = cm.getSelection();
74-
cm.replaceSelection(`\`${selection}\``);
75-
if (!selection) {
76-
const cursorPos = cm.getCursor();
77-
cm.setCursor(cursorPos.line, cursorPos.ch - 1);
78-
}
79-
cm.focus();
80-
},
81-
className: 'fa fa-angle-right',
82-
title: 'Add Inline Code',
83-
}, 'code', 'quote', '|', {
84-
name: 'checkbox-empty',
85-
action(e) {
86-
const cm = e.codemirror;
87-
cm.replaceSelection(`\n- [ ] ${cm.getSelection()}`);
88-
cm.focus();
89-
},
90-
className: 'fa fa-square-o',
91-
title: 'Add Checkbox (empty)',
95+
{
96+
name: 'checkbox-checked',
97+
action(e) {
98+
const cm = e.codemirror;
99+
cm.replaceSelection(`\n- [x] ${cm.getSelection()}`);
100+
cm.focus();
92101
},
93-
{
94-
name: 'checkbox-checked',
95-
action(e) {
96-
const cm = e.codemirror;
97-
cm.replaceSelection(`\n- [x] ${cm.getSelection()}`);
98-
cm.focus();
99-
},
100-
className: 'fa fa-check-square-o',
101-
title: 'Add Checkbox (checked)',
102-
}, '|',
103-
'unordered-list', 'ordered-list', '|',
104-
'link', 'image', 'table', 'horizontal-rule', '|',
105-
'clean-block', 'preview', 'fullscreen', 'side-by-side', '|',
106-
{
107-
name: 'revert-to-textarea',
108-
action(e) {
109-
e.toTextArea();
110-
hasEasyMDE = false;
111-
const $root = $form.find('.field.content');
112-
const loading = $root.data('loading');
113-
$root.append(`<div class="ui bottom tab markup" data-tab="preview">${loading}</div>`);
114-
initCompMarkupContentPreviewTab($form);
115-
},
116-
className: 'fa fa-file',
117-
title: 'Revert to simple textarea',
102+
className: 'fa fa-check-square-o',
103+
title: 'Add Checkbox (checked)',
104+
}, '|',
105+
'unordered-list', 'ordered-list', '|',
106+
'link', 'image', 'table', 'horizontal-rule', '|',
107+
'clean-block', 'preview', 'fullscreen', 'side-by-side', '|',
108+
{
109+
name: 'revert-to-textarea',
110+
action(e) {
111+
e.toTextArea();
112+
hasEasyMDE = false;
113+
const $root = $form.find('.field.content');
114+
const loading = $root.data('loading');
115+
$root.append(`<div class="ui bottom tab markup" data-tab="preview">${loading}</div>`);
116+
initCompMarkupContentPreviewTab($form);
118117
},
119-
]
120-
});
118+
className: 'fa fa-file',
119+
title: 'Revert to simple textarea',
120+
},
121+
]
122+
});
123+
124+
attachEasyMDEToElements(easyMDE);
121125

122-
attachEasyMDEToElements(easyMDE);
126+
const $mdeInputField = $(easyMDE.codemirror.getInputField());
127+
$mdeInputField.addClass('js-quick-submit');
123128

124-
const $mdeInputField = $(easyMDE.codemirror.getInputField());
125-
$mdeInputField.addClass('js-quick-submit');
129+
$form.on('submit', () => {
130+
if (!validateTextareaNonEmpty($editArea)) {
131+
return false;
132+
}
133+
});
126134

127-
$form.on('submit', () => {
128-
if (!validateTextareaNonEmpty($editArea)) {
135+
setTimeout(() => {
136+
const $bEdit = $('.repository.wiki.new .previewtabs a[data-tab="write"]');
137+
const $bPrev = $('.repository.wiki.new .previewtabs a[data-tab="preview"]');
138+
const $toolbar = $('.editor-toolbar');
139+
const $bPreview = $('.editor-toolbar button.preview');
140+
const $bSideBySide = $('.editor-toolbar a.fa-columns');
141+
$bEdit.on('click', (e) => {
142+
if (!hasEasyMDE) {
129143
return false;
130144
}
131-
});
145+
e.stopImmediatePropagation();
146+
if ($toolbar.hasClass('disabled-for-preview')) {
147+
$bPreview.trigger('click');
148+
}
132149

133-
setTimeout(() => {
134-
const $bEdit = $('.repository.wiki.new .previewtabs a[data-tab="write"]');
135-
const $bPrev = $('.repository.wiki.new .previewtabs a[data-tab="preview"]');
136-
const $toolbar = $('.editor-toolbar');
137-
const $bPreview = $('.editor-toolbar button.preview');
138-
const $bSideBySide = $('.editor-toolbar a.fa-columns');
139-
$bEdit.on('click', (e) => {
140-
if (!hasEasyMDE) {
141-
return false;
142-
}
143-
e.stopImmediatePropagation();
150+
return false;
151+
});
152+
$bPrev.on('click', (e) => {
153+
if (!hasEasyMDE) {
154+
return false;
155+
}
156+
e.stopImmediatePropagation();
157+
if (!$toolbar.hasClass('disabled-for-preview')) {
158+
$bPreview.trigger('click');
159+
}
160+
return false;
161+
});
162+
$bPreview.on('click', () => {
163+
setTimeout(() => {
144164
if ($toolbar.hasClass('disabled-for-preview')) {
145-
$bPreview.trigger('click');
165+
if ($bEdit.hasClass('active')) {
166+
$bEdit.removeClass('active');
167+
}
168+
if (!$bPrev.hasClass('active')) {
169+
$bPrev.addClass('active');
170+
}
171+
} else {
172+
if (!$bEdit.hasClass('active')) {
173+
$bEdit.addClass('active');
174+
}
175+
if ($bPrev.hasClass('active')) {
176+
$bPrev.removeClass('active');
177+
}
146178
}
179+
}, 0);
147180

148-
return false;
149-
});
150-
$bPrev.on('click', (e) => {
151-
if (!hasEasyMDE) {
152-
return false;
153-
}
154-
e.stopImmediatePropagation();
155-
if (!$toolbar.hasClass('disabled-for-preview')) {
156-
$bPreview.trigger('click');
157-
}
158-
return false;
159-
});
160-
$bPreview.on('click', () => {
161-
setTimeout(() => {
162-
if ($toolbar.hasClass('disabled-for-preview')) {
163-
if ($bEdit.hasClass('active')) {
164-
$bEdit.removeClass('active');
165-
}
166-
if (!$bPrev.hasClass('active')) {
167-
$bPrev.addClass('active');
168-
}
169-
} else {
170-
if (!$bEdit.hasClass('active')) {
171-
$bEdit.addClass('active');
172-
}
173-
if ($bPrev.hasClass('active')) {
174-
$bPrev.removeClass('active');
175-
}
176-
}
177-
}, 0);
181+
return false;
182+
});
183+
$bSideBySide.on('click', () => {
184+
sideBySideChanges = 10;
185+
});
186+
}, 0);
187+
}
178188

179-
return false;
180-
});
181-
$bSideBySide.on('click', () => {
182-
sideBySideChanges = 10;
183-
});
184-
}, 0);
185-
}
189+
export function initRepoWikiForm() {
190+
initRepoWikiFormEditor();
186191
}

0 commit comments

Comments
 (0)