mirror of https://github.com/go-gitea/gitea.git
Support markdown editor for issue template (#24400)
Fixes #24398 Task: - [x] Reusing "textarea" like GitHub seems more friendly to users. - [x] ^V image pasting and file uploading handling. <details><summary>screenshots</summary>   Display only one markdown editor:  Support file upload and ^V image pasting  </details> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: silverwind <me@silverwind.io>pull/24590/head^2
yp05327
GitHub
parent
9ad5b59cd9
commit
c4303efc23
@ -1,6 +1,25 @@
|
||||
<div class="field">
|
||||
{{$useMarkdownEditor := not .item.Attributes.render}}
|
||||
<div class="field {{if $useMarkdownEditor}}combo-editor-dropzone{{end}}">
|
||||
{{template "repo/issue/fields/header" .}}
|
||||
{{/* FIXME: preview markdown result */}}
|
||||
{{/* FIXME: required validation for markdown editor */}}
|
||||
<textarea name="form-field-{{.item.ID}}" placeholder="{{.item.Attributes.placeholder}}" {{if and .item.Validations.required .item.Attributes.render}}required{{end}}>{{.item.Attributes.value}}</textarea>
|
||||
|
||||
{{/* the real form element to provide the value */}}
|
||||
<textarea class="form-field-real" name="form-field-{{.item.ID}}" placeholder="{{.item.Attributes.placeholder}}" {{if and .item.Validations.required}}required{{end}}>{{.item.Attributes.value}}</textarea>
|
||||
|
||||
{{if $useMarkdownEditor}}
|
||||
{{template "shared/combomarkdowneditor" (dict
|
||||
"locale" .root.locale
|
||||
"ContainerClasses" "gt-hidden"
|
||||
"MarkdownPreviewUrl" (print .root.RepoLink "/markup")
|
||||
"MarkdownPreviewContext" .root.RepoLink
|
||||
"TextareaContent" .item.Attributes.value
|
||||
"TextareaPlaceholder" .item.Attributes.placeholder
|
||||
"DropzoneParentContainer" ".combo-editor-dropzone"
|
||||
)}}
|
||||
|
||||
{{if .root.IsAttachmentEnabled}}
|
||||
<div class="gt-mt-4 form-field-dropzone gt-hidden">
|
||||
{{template "repo/upload" .root}}
|
||||
</div>
|
||||
{{end}}
|
||||
{{end}}
|
||||
</div>
|
||||
|
||||
@ -0,0 +1,59 @@
|
||||
import {matchEmoji, matchMention} from '../../utils/match.js';
|
||||
import {emojiString} from '../emoji.js';
|
||||
|
||||
export function initTextExpander(expander) {
|
||||
expander?.addEventListener('text-expander-change', ({detail: {key, provide, text}}) => {
|
||||
if (key === ':') {
|
||||
const matches = matchEmoji(text);
|
||||
if (!matches.length) return provide({matched: false});
|
||||
|
||||
const ul = document.createElement('ul');
|
||||
ul.classList.add('suggestions');
|
||||
for (const name of matches) {
|
||||
const emoji = emojiString(name);
|
||||
const li = document.createElement('li');
|
||||
li.setAttribute('role', 'option');
|
||||
li.setAttribute('data-value', emoji);
|
||||
li.textContent = `${emoji} ${name}`;
|
||||
ul.append(li);
|
||||
}
|
||||
|
||||
provide({matched: true, fragment: ul});
|
||||
} else if (key === '@') {
|
||||
const matches = matchMention(text);
|
||||
if (!matches.length) return provide({matched: false});
|
||||
|
||||
const ul = document.createElement('ul');
|
||||
ul.classList.add('suggestions');
|
||||
for (const {value, name, fullname, avatar} of matches) {
|
||||
const li = document.createElement('li');
|
||||
li.setAttribute('role', 'option');
|
||||
li.setAttribute('data-value', `${key}${value}`);
|
||||
|
||||
const img = document.createElement('img');
|
||||
img.src = avatar;
|
||||
li.append(img);
|
||||
|
||||
const nameSpan = document.createElement('span');
|
||||
nameSpan.textContent = name;
|
||||
li.append(nameSpan);
|
||||
|
||||
if (fullname && fullname.toLowerCase() !== name) {
|
||||
const fullnameSpan = document.createElement('span');
|
||||
fullnameSpan.classList.add('fullname');
|
||||
fullnameSpan.textContent = fullname;
|
||||
li.append(fullnameSpan);
|
||||
}
|
||||
|
||||
ul.append(li);
|
||||
}
|
||||
|
||||
provide({matched: true, fragment: ul});
|
||||
}
|
||||
});
|
||||
expander?.addEventListener('text-expander-value', ({detail}) => {
|
||||
if (detail?.item) {
|
||||
detail.value = detail.item.getAttribute('data-value');
|
||||
}
|
||||
});
|
||||
}
|
||||
Loading…
Reference in New Issue