yume/paricafe
1
0
Fork 0
mirror of https://github.com/paricafe/misskey.git synced 2024-11-24 07:06:44 -06:00
Code Issues Projects Releases Packages Wiki Activity

add undo & clear button in postform

Browse source
This commit is contained in:
fly_mc 2024-11-01 21:08:25 +08:00
parent 725b483376
commit 7938feee3f
2 changed files with 45 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
locales/en-US.yml
View file

@ -1284,6 +1284,8 @@ noteOfThisUser: "Notes by this user"
clipNoteLimitExceeded: "No more notes can be added to this clip."
timeTravel: "Time Travel"
timeTravelDescription: "Show posts before this date."
undoPostForm: "Undo"
clearPostForm: "Clear"
pariPlusInfo: "Pari Plus! customized Misskey~!"
pariPlusSystemSettings: "Pari Plus! system settings"
pariPlusNoteSettings: "Pari Plus! note settings"

43
packages/frontend/src/components/MkPostForm.vue
View file

@ -90,6 +90,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div :class="$style.footerRight">
<button v-tooltip="i18n.ts.previewNoteText" class="_button" :class="[$style.footerButton, { [$style.previewButtonActive]: showPreview }]" @click="showPreview = !showPreview"><i class="ti ti-eye"></i></button>
<button v-if="showTextManageButton" v-tooltip="currentHistoryIndex >= 0 ? i18n.ts.undoPostForm : i18n.ts.clearPostForm" class="_button" :class="$style.footerButton" @click="handleTextManageClick"><i :class="textManageButtonIcon"></i></button>
<button v-if="defaultStore.state.enableMFMCheatsheet" v-tooltip="'MFM Cheatsheet'" class="_button" :class="$style.footerButton" @click="MFMWindow"><i class="ti ti-note"></i></button>
<!--<button v-tooltip="i18n.ts.more" class="_button" :class="$style.footerButton" @click="showingOptions = !showingOptions"><i class="ti ti-dots"></i></button>-->
</div>
@ -260,6 +261,44 @@ const canPost = computed((): boolean => {
const withHashtags = computed(defaultStore.makeGetterSetter('postFormWithHashtags'));
const hashtags = computed(defaultStore.makeGetterSetter('postFormHashtags'));
const textHistory = ref<string[]>([]);
const currentHistoryIndex = ref(-1);
const showTextManageButton = computed(() => text.value !== '' || currentHistoryIndex.value >= 0);
const textManageButtonIcon = computed(() => {
if (currentHistoryIndex.value >= 0) return 'ti ti-arrow-back-up';
return text.value !== '' ? 'ti ti-trash' : '';
});
function clearText() {
if (text.value !== '') {
saveToHistory();
text.value = '';
nextTick(() => textareaEl.value && autosize.update(textareaEl.value));
}
}
function saveToHistory() {
textHistory.value = textHistory.value.slice(0, currentHistoryIndex.value + 1);
textHistory.value.push(text.value);
currentHistoryIndex.value = textHistory.value.length - 1;
}
function undoTextChange() {
if (currentHistoryIndex.value >= 0) {
text.value = textHistory.value[currentHistoryIndex.value];
currentHistoryIndex.value--;
nextTick(() => textareaEl.value && autosize.update(textareaEl.value));
}
}
function handleTextManageClick() {
if (currentHistoryIndex.value >= 0) {
undoTextChange();
} else {
clearText();
}
}
watch(text, () => {
checkMissingMention();
}, { immediate: true });
@ -576,6 +615,10 @@ function clear() {
function onKeydown(ev: KeyboardEvent) {
if (ev.key === 'Enter' && (ev.ctrlKey || ev.metaKey) && canPost.value) post();
if (!ev.ctrlKey && !ev.metaKey && !ev.altKey && !justEndedComposition.value && !ev.isComposing) {
saveToHistory();
}
// justEndedComposition.value is for Safari, which keyDown occurs after compositionend.
// ev.isComposing is for another browsers.
if (ev.key === 'Escape' && !justEndedComposition.value && !ev.isComposing) emit('esc');