diff options
Diffstat (limited to 'packages/frontend/src/components/MkPostForm.vue')
| -rw-r--r-- | packages/frontend/src/components/MkPostForm.vue | 60 |
1 files changed, 49 insertions, 11 deletions
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue index 78df70ca5c..d778bc046c 100644 --- a/packages/frontend/src/components/MkPostForm.vue +++ b/packages/frontend/src/components/MkPostForm.vue @@ -261,7 +261,7 @@ const canPost = computed((): boolean => { 1 <= files.value.length || poll.value != null || props.renote != null || - (props.reply != null && quoteId.value != null) + quoteId.value != null ) && (textLength.value <= maxTextLength.value) && (!poll.value || poll.value.choices.length >= 2); @@ -369,6 +369,8 @@ function watchForDraft() { watch(files, () => saveDraft(), { deep: true }); watch(visibility, () => saveDraft()); watch(localOnly, () => saveDraft()); + watch(quoteId, () => saveDraft()); + watch(reactionAcceptance, () => saveDraft()); } function MFMWindow() { @@ -469,7 +471,7 @@ function setVisibility() { return; } - os.popup(defineAsyncComponent(() => import('@/components/MkVisibilityPicker.vue')), { + const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkVisibilityPicker.vue')), { currentVisibility: visibility.value, isSilenced: $i.isSilenced, localOnly: localOnly.value, @@ -482,7 +484,8 @@ function setVisibility() { defaultStore.set('visibility', visibility.value); } }, - }, 'closed'); + closed: () => dispose(), + }); } async function toggleLocalOnly() { @@ -575,6 +578,7 @@ function clear() { function onKeydown(ev: KeyboardEvent) { if (ev.key === 'Enter' && (ev.ctrlKey || ev.metaKey) && canPost.value) post(); + if (ev.key === 'Escape') emit('esc'); } @@ -630,8 +634,8 @@ async function onPaste(ev: ClipboardEvent) { return; } - const fileName = formatTimeString(new Date(), defaultStore.state.pastedFileName).replace(/{{number}}/g, "0"); - const file = new File([paste], `${fileName}.txt`, { type: "text/plain" }); + const fileName = formatTimeString(new Date(), defaultStore.state.pastedFileName).replace(/{{number}}/g, '0'); + const file = new File([paste], `${fileName}.txt`, { type: 'text/plain' }); upload(file, `${fileName}.txt`); }); } @@ -707,6 +711,8 @@ function saveDraft() { files: files.value, poll: poll.value, visibleUserIds: visibility.value === 'specified' ? visibleUsers.value.map(x => x.id) : undefined, + quoteId: quoteId.value, + reactionAcceptance: reactionAcceptance.value, }, }; @@ -737,7 +743,9 @@ async function post(ev?: MouseEvent) { const rect = el.getBoundingClientRect(); const x = rect.left + (el.offsetWidth / 2); const y = rect.top + (el.offsetHeight / 2); - os.popup(MkRippleEffect, { x, y }, {}, 'end'); + const { dispose } = os.popup(MkRippleEffect, { x, y }, { + end: () => dispose(), + }); } } @@ -930,10 +938,23 @@ async function insertEmoji(ev: MouseEvent) { textAreaReadOnly.value = true; const target = ev.currentTarget ?? ev.target; if (target == null) return; + + // emojiPickerはダイアログが閉じずにtextareaとやりとりするので、 + // focustrapをかけているとinsertTextAtCursorが効かない + // そのため、投稿フォームのテキストに直接注入する + // See: https://github.com/misskey-dev/misskey/pull/14282 + // https://github.com/misskey-dev/misskey/issues/14274 + + let pos = textareaEl.value?.selectionStart ?? 0; + let posEnd = textareaEl.value?.selectionEnd ?? text.value.length; emojiPicker.show( target as HTMLElement, emoji => { - insertTextAtCursor(textareaEl.value, emoji); + const textBefore = text.value.substring(0, pos); + const textAfter = text.value.substring(posEnd); + text.value = textBefore + emoji + textAfter; + pos += emoji.length; + posEnd += emoji.length; }, () => { textAreaReadOnly.value = false; @@ -1026,6 +1047,8 @@ onMounted(() => { users.forEach(u => pushVisibleUser(u)); }); } + quoteId.value = draft.data.quoteId; + reactionAcceptance.value = draft.data.reactionAcceptance; } } @@ -1033,9 +1056,11 @@ onMounted(() => { if (props.initialNote) { const init = props.initialNote; text.value = init.text ? init.text : ''; - files.value = init.files ?? []; - cw.value = init.cw ?? null; useCw.value = init.cw != null; + cw.value = init.cw ?? null; + visibility.value = init.visibility; + localOnly.value = init.localOnly ?? false; + files.value = init.files ?? []; if (init.poll) { poll.value = { choices: init.poll.choices.map(x => x.text), @@ -1044,9 +1069,13 @@ onMounted(() => { expiredAfter: null, }; } - visibility.value = init.visibility; - localOnly.value = init.localOnly ?? false; + if (init.visibleUserIds) { + misskeyApi('users/show', { userIds: init.visibleUserIds }).then(users => { + users.forEach(u => pushVisibleUser(u)); + }); + } quoteId.value = init.renote ? init.renote.id : null; + reactionAcceptance.value = init.reactionAcceptance; } nextTick(() => watchForDraft()); @@ -1119,6 +1148,15 @@ defineExpose({ margin: 12px 12px 12px 6px; vertical-align: bottom; + &:focus-visible { + outline: none; + + .submitInner { + outline: 2px solid var(--fgOnAccent); + outline-offset: -4px; + } + } + &:disabled { opacity: 0.7; } |