refs#10866 投稿ダイアログでEscキーが押されたときIME入力中ならダイアログは閉じない (#14787)
This commit is contained in:
		
							parent
							
								
									5c79d8db20
								
							
						
					
					
						commit
						2f9c04b23b
					
				|  | @ -10,6 +10,7 @@ | ||||||
| - Fix: 通知の範囲指定の設定項目が必要ない通知設定でも範囲指定の設定がでている問題を修正 | - Fix: 通知の範囲指定の設定項目が必要ない通知設定でも範囲指定の設定がでている問題を修正 | ||||||
| - Fix: Turnstileが失敗・期限切れした際にも成功扱いとなってしまう問題を修正   | - Fix: Turnstileが失敗・期限切れした際にも成功扱いとなってしまう問題を修正   | ||||||
|   (Cherry-picked from https://github.com/MisskeyIO/misskey/pull/768) |   (Cherry-picked from https://github.com/MisskeyIO/misskey/pull/768) | ||||||
|  | - Enhance: 投稿フォームでEscキーを押したときIME入力中ならフォームを閉じないように( #10866 )   | ||||||
| 
 | 
 | ||||||
| ### Server | ### Server | ||||||
| - | - | ||||||
|  |  | ||||||
|  | @ -65,10 +65,10 @@ SPDX-License-Identifier: AGPL-3.0-only | ||||||
| 		</div> | 		</div> | ||||||
| 	</div> | 	</div> | ||||||
| 	<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo> | 	<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo> | ||||||
| 	<input v-show="useCw" ref="cwInputEl" v-model="cw" :class="$style.cw" :placeholder="i18n.ts.annotation" @keydown="onKeydown"> | 	<input v-show="useCw" ref="cwInputEl" v-model="cw" :class="$style.cw" :placeholder="i18n.ts.annotation" @keydown="onKeydown" @keyup="onKeyup" @compositionend="onCompositionEnd"> | ||||||
| 	<div :class="[$style.textOuter, { [$style.withCw]: useCw }]"> | 	<div :class="[$style.textOuter, { [$style.withCw]: useCw }]"> | ||||||
| 		<div v-if="channel" :class="$style.colorBar" :style="{ background: channel.color }"></div> | 		<div v-if="channel" :class="$style.colorBar" :style="{ background: channel.color }"></div> | ||||||
| 		<textarea ref="textareaEl" v-model="text" :class="[$style.text]" :disabled="posting || posted" :readonly="textAreaReadOnly" :placeholder="placeholder" data-cy-post-form-text @keydown="onKeydown" @paste="onPaste" @compositionupdate="onCompositionUpdate" @compositionend="onCompositionEnd"/> | 		<textarea ref="textareaEl" v-model="text" :class="[$style.text]" :disabled="posting || posted" :readonly="textAreaReadOnly" :placeholder="placeholder" data-cy-post-form-text @keydown="onKeydown" @keyup="onKeyup" @paste="onPaste" @compositionupdate="onCompositionUpdate" @compositionend="onCompositionEnd"/> | ||||||
| 		<div v-if="maxTextLength - textLength < 100" :class="['_acrylic', $style.textCount, { [$style.textOver]: textLength > maxTextLength }]">{{ maxTextLength - textLength }}</div> | 		<div v-if="maxTextLength - textLength < 100" :class="['_acrylic', $style.textCount, { [$style.textOver]: textLength > maxTextLength }]">{{ maxTextLength - textLength }}</div> | ||||||
| 	</div> | 	</div> | ||||||
| 	<input v-show="withHashtags" ref="hashtagsInputEl" v-model="hashtags" :class="$style.hashtags" :placeholder="i18n.ts.hashtags" list="hashtags"> | 	<input v-show="withHashtags" ref="hashtagsInputEl" v-model="hashtags" :class="$style.hashtags" :placeholder="i18n.ts.hashtags" list="hashtags"> | ||||||
|  | @ -201,6 +201,7 @@ const recentHashtags = ref(JSON.parse(miLocalStorage.getItem('hashtags') ?? '[]' | ||||||
| const imeText = ref(''); | const imeText = ref(''); | ||||||
| const showingOptions = ref(false); | const showingOptions = ref(false); | ||||||
| const textAreaReadOnly = ref(false); | const textAreaReadOnly = ref(false); | ||||||
|  | const justEndedComposition = ref(false); | ||||||
| 
 | 
 | ||||||
| const draftKey = computed((): string => { | const draftKey = computed((): string => { | ||||||
| 	let key = props.channel ? `channel:${props.channel.id}` : ''; | 	let key = props.channel ? `channel:${props.channel.id}` : ''; | ||||||
|  | @ -573,7 +574,13 @@ function clear() { | ||||||
| function onKeydown(ev: KeyboardEvent) { | function onKeydown(ev: KeyboardEvent) { | ||||||
| 	if (ev.key === 'Enter' && (ev.ctrlKey || ev.metaKey) && canPost.value) post(); | 	if (ev.key === 'Enter' && (ev.ctrlKey || ev.metaKey) && canPost.value) post(); | ||||||
| 
 | 
 | ||||||
| 	if (ev.key === 'Escape') emit('esc'); | 	// 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'); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | function onKeyup(ev: KeyboardEvent) { | ||||||
|  | 	justEndedComposition.value = false; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| function onCompositionUpdate(ev: CompositionEvent) { | function onCompositionUpdate(ev: CompositionEvent) { | ||||||
|  | @ -582,6 +589,7 @@ function onCompositionUpdate(ev: CompositionEvent) { | ||||||
| 
 | 
 | ||||||
| function onCompositionEnd(ev: CompositionEvent) { | function onCompositionEnd(ev: CompositionEvent) { | ||||||
| 	imeText.value = ''; | 	imeText.value = ''; | ||||||
|  | 	justEndedComposition.value = true; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| async function onPaste(ev: ClipboardEvent) { | async function onPaste(ev: ClipboardEvent) { | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue